| author |  Bilal Bakr <62337003+Bil0000@users.noreply.github.com> 2026-08-04 22:41:07+03:00 |
| committer |  GitHub <noreply@github.com> 2026-08-04 15:41:07-04:00 |
| log | 90e3778660690e4f00bdd4e237fc541725dc1427 |
| tree | de91d11a42df91a847473ca8fdc52105883ffc7e |
| parent | 94331c58ecda6b32ee101e8f5ce2dfe5b5195afd |
| signature | Signed by PGP key B5690EEEBB952194 |
fix(web): stop the chat timeline reading through the provider status banner (#5353)
2 files changed, 13 insertions(+), 3 deletions(-)
apps
web
src
components
apps/web/src/components/chat/ProviderStatusBanner.test.tsx+9
| ... | ... | @@ -44,6 +44,15 @@ describe("ProviderStatusBanner", () => { |
| 44 | 44 | expect(markup).toContain("absolute top-2 right-2"); |
| 45 | 45 | }); |
| 46 | 46 | |
| 47 | it("renders on a glass surface so the timeline never reads through the banner", () => { | |
| 48 | const markup = renderToStaticMarkup( | |
| 49 | <ProviderStatusBanner status={warningProvider()} onDismiss={() => {}} />, | |
| 50 | ); | |
| 51 | ||
| 52 | expect(markup).toContain("alert-glass"); | |
| 53 | expect(markup).toContain('data-variant="warning"'); | |
| 54 | }); | |
| 55 | ||
| 47 | 56 | it("labels error dismiss controls with the correct severity", () => { |
| 48 | 57 | const markup = renderToStaticMarkup( |
| 49 | 58 | <ProviderStatusBanner |
apps/web/src/components/chat/ProviderStatusBanner.tsx+4-3
| ... | ... | @@ -46,11 +46,12 @@ export const ProviderStatusBanner = memo(function ProviderStatusBanner({ |
| 46 | 46 | <div className="pointer-events-auto mx-auto w-fit max-w-[calc(100%-2rem)] pt-3"> |
| 47 | 47 | <div |
| 48 | 48 | className={cn( |
| 49 | "relative inline-flex items-center gap-3 rounded-xl border py-3 ps-3.5 pe-10 text-card-foreground text-sm", | |
| 49 | "alert-glass relative inline-flex items-center gap-3 rounded-xl border py-3 ps-3.5 pe-10 text-card-foreground text-sm", | |
| 50 | 50 | status.status === "warning" |
| 51 | ? "border-warning/32 bg-warning/4 [&_svg]:text-warning" | |
| 52 | : "border-destructive/32 bg-destructive/4 text-destructive-foreground [&_svg]:text-destructive", | |
| 51 | ? "border-warning/32 [&_svg]:text-warning" | |
| 52 | : "border-destructive/32 text-destructive-foreground [&_svg]:text-destructive", | |
| 53 | 53 | )} |
| 54 | data-variant={status.status === "warning" ? "warning" : "error"} | |
| 54 | 55 | role="alert" |
| 55 | 56 | > |
| 56 | 57 | <InfoIcon className="size-4 shrink-0" aria-hidden /> |