Skip to content

feat(react): first-class notification severity#73

Open
soufian3hm wants to merge 1 commit into
dodopayments:mainfrom
soufian3hm:feat/notification-severity
Open

feat(react): first-class notification severity#73
soufian3hm wants to merge 1 commit into
dodopayments:mainfrom
soufian3hm:feat/notification-severity

Conversation

@soufian3hm

@soufian3hm soufian3hm commented Jul 14, 2026

Copy link
Copy Markdown
Contributor

Closes #36.

Frontend slice of first-class notification severity.

What

  • @chimely/client: WellKnownPayload gains an optional severity: 'high' | 'medium' | 'low' -- additive, in keeping with its "only ever gains optional fields" contract.
  • @chimely/react: the default item renders a left accent bar tinted by three new appearance variables -- colorSeverityHigh (#dc2626), colorSeverityMedium (#d97706), colorSeverityLow (#2563eb). The accent is decorative (aria-hidden); the value already rides the item text.
  • Payloads pass through Chimely verbatim, so any value outside the union renders no accent.
  • Tabs can already filter on severity via their filter predicate, per the issue.

Deferred (as the issue frames it)

  • Bell tinting by highest unread severity and severity-filterable server counts need the server-side counts work first (Server-side filtered counts for tabs #39), so they are out of this slice.
  • No server change -- payloads pass through verbatim.

Verification

biome, pnpm --filter "./packages/*" build, typecheck, and vitest are all green: @chimely/client 54 tests and @chimely/react 108 tests, including 3 new ones (known-severity accent, no accent without severity, and an out-of-set value rendering nothing). A minor changeset covers both packages.

Frontend slice of the severity feature. WellKnownPayload gains an
optional severity ('high' | 'medium' | 'low'); the default item
renders a left accent tinted by new colorSeverityHigh/Medium/Low
appearance variables. Values outside the set render no accent.

Refs dodopayments#36
@greptile-apps

greptile-apps Bot commented Jul 14, 2026

Copy link
Copy Markdown

Greptile Summary

This PR adds first-class notification severity to the frontend packages. The main changes are:

  • Adds optional severity to the client well-known payload type.
  • Adds React appearance variables for severity accent colors.
  • Renders a decorative accent bar for known values in the default item.
  • Adds tests for known, missing, and out-of-set values.
  • Adds a changeset for both frontend packages.

Confidence Score: 5/5

This looks safe to merge.

  • No blocking issues found in the changed code.
  • The renderer keeps payload values intact for filters and custom renderers.
  • The new style variables line up with the existing appearance forwarding path.

Important Files Changed

Filename Overview
packages/client/src/types.ts Adds an optional well-known payload field while preserving the existing custom payload extension shape.
packages/react/src/appearance.ts Adds optional appearance variables that match the CSS custom-property names used by the new accent styles.
packages/react/src/components/DefaultItem.tsx Adds a local guard for known values and renders the decorative accent without mutating the original payload.
packages/react/src/styles.ts Adds positioning and color styles for the accent bar with safe CSS fallbacks.
packages/react/src/inbox.test.tsx Adds coverage for known, absent, and unsupported payload values.
.changeset/notification-severity.md Adds a minor release note for the client and React packages.

Reviews (1): Last reviewed commit: "feat(react): first-class notification se..." | Re-trigger Greptile

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

First-class notification severity

2 participants