| author |  maria <maria@kuuro.net> 2026-09-04 14:51:31-04:00 |
| committer |  GitHub <noreply@github.com> 2026-09-04 14:51:31-04:00 |
| log | 0de956ed2f92b8a6ead56e1566801db232d365dc |
| tree | 782457b70b87ac29d486f461bf21b3c04a2f15d0 |
| parent | a76b898b3aa4fd4081104b06a3b2c942bd4fecb7 |
| signature | Signed by PGP key B5690EEEBB952194 |
fix(web): refine server update notice (#9744)
4 files changed, 11 insertions(+), 5 deletions(-)
apps
apps/web/src/components/ChatView.tsx+4-1
| ... | ... | @@ -2405,7 +2405,10 @@ export default function ChatView(props: ChatViewProps) { |
| 2405 | 2405 | <Tooltip> |
| 2406 | 2406 | <TooltipTrigger |
| 2407 | 2407 | render={ |
| 2408 | <button type="button" className="cursor-help rounded-sm text-left"> | |
| 2408 | <button | |
| 2409 | type="button" | |
| 2410 | className="block max-w-full cursor-help truncate rounded-sm text-left" | |
| 2411 | > | |
| 2409 | 2412 | Server update available |
| 2410 | 2413 | </button> |
| 2411 | 2414 | } |
apps/web/src/components/chat/ComposerBanner.tsx+4-1
| ... | ... | @@ -178,7 +178,7 @@ function Row({ |
| 178 | 178 | layout = "inline", |
| 179 | 179 | ...props |
| 180 | 180 | }: useRender.ComponentProps<"div"> & { |
| 181 | layout?: "inline" | "wrap-actions"; | |
| 181 | layout?: "inline" | "wrap-actions" | "wrap-actions-narrow"; | |
| 182 | 182 | }) { |
| 183 | 183 | const rowProps = { |
| 184 | 184 | className: cn( |
| ... | ... | @@ -187,6 +187,8 @@ function Row({ |
| 187 | 187 | "[&:is(button)]:cursor-pointer [&:is(button)]:rounded-[0.5rem] [&:is(button)]:focus-visible:outline-2 [&:is(button)]:focus-visible:-outline-offset-2 [&:is(button)]:focus-visible:outline-ring", |
| 188 | 188 | layout === "wrap-actions" && |
| 189 | 189 | "@max-[400px]:*:data-[slot=composer-banner-content]:min-h-(--composer-banner-icon-column)", |
| 190 | layout === "wrap-actions-narrow" && | |
| 191 | "@max-[320px]:*:data-[slot=composer-banner-content]:min-h-(--composer-banner-icon-column)", | |
| 190 | 192 | className, |
| 191 | 193 | ), |
| 192 | 194 | "data-composer-banner-row": "true", |
| ... | ... | @@ -247,6 +249,7 @@ function Actions({ className, ...props }: ComponentProps<"span">) { |
| 247 | 249 | className={cn( |
| 248 | 250 | "col-start-3 row-start-1 flex flex-wrap items-center justify-end gap-1", |
| 249 | 251 | "@max-[400px]:group-data-[composer-banner-layout=wrap-actions]/banner-row:has-[>:nth-child(2)]:col-start-2 @max-[400px]:group-data-[composer-banner-layout=wrap-actions]/banner-row:has-[>:nth-child(2)]:col-end-4 @max-[400px]:group-data-[composer-banner-layout=wrap-actions]/banner-row:has-[>:nth-child(2)]:row-start-2 @max-[400px]:group-data-[composer-banner-layout=wrap-actions]/banner-row:has-[>:nth-child(2)]:-ms-2 @max-[400px]:group-data-[composer-banner-layout=wrap-actions]/banner-row:has-[>:nth-child(2)]:justify-start", |
| 252 | "@max-[320px]:group-data-[composer-banner-layout=wrap-actions-narrow]/banner-row:has-[>:nth-child(2)]:col-start-2 @max-[320px]:group-data-[composer-banner-layout=wrap-actions-narrow]/banner-row:has-[>:nth-child(2)]:col-end-4 @max-[320px]:group-data-[composer-banner-layout=wrap-actions-narrow]/banner-row:has-[>:nth-child(2)]:row-start-2 @max-[320px]:group-data-[composer-banner-layout=wrap-actions-narrow]/banner-row:has-[>:nth-child(2)]:-ms-2 @max-[320px]:group-data-[composer-banner-layout=wrap-actions-narrow]/banner-row:has-[>:nth-child(2)]:justify-start", | |
| 250 | 253 | className, |
| 251 | 254 | )} |
| 252 | 255 | {...props} |
apps/web/src/components/chat/ComposerBannerStack.tsx+1-1
| ... | ... | @@ -269,7 +269,7 @@ function ComposerBannerStackAlert({ |
| 269 | 269 | variant={item.variant} |
| 270 | 270 | density="comfortable" |
| 271 | 271 | > |
| 272 | <ComposerBanner.Row layout="wrap-actions"> | |
| 272 | <ComposerBanner.Row layout="wrap-actions-narrow"> | |
| 273 | 273 | <ComposerBanner.Icon className="h-(--composer-banner-icon-column) self-start"> |
| 274 | 274 | {item.icon} |
| 275 | 275 | </ComposerBanner.Icon> |
apps/web/src/components/chat/ComposerServerUpdateStatus.tsx+2-2
| ... | ... | @@ -1,5 +1,5 @@ |
| 1 | 1 | import type { ServerUpdateState } from "@t3tools/client-runtime/state/server"; |
| 2 | import { CircleAlertIcon, InfoIcon, LoaderCircleIcon } from "lucide-react"; | |
| 2 | import { CircleAlertIcon, DownloadIcon, LoaderCircleIcon } from "lucide-react"; | |
| 3 | 3 | import { useId, useState } from "react"; |
| 4 | 4 | |
| 5 | 5 | import { serverUpdateStageLabel } from "../ServerUpdateAction"; |
| ... | ... | @@ -17,7 +17,7 @@ export function ComposerServerUpdateIcon({ |
| 17 | 17 | if (status === "failed") { |
| 18 | 18 | return <CircleAlertIcon aria-hidden className="text-error" />; |
| 19 | 19 | } |
| 20 | return <InfoIcon aria-hidden />; | |
| 20 | return <DownloadIcon aria-hidden />; | |
| 21 | 21 | } |
| 22 | 22 | |
| 23 | 23 | /** One text line, clipped at the end so the error detail never squeezes its title. */ |