authorgravatar for maria@kuuro.netmaria <maria@kuuro.net> 2026-09-04 14:51:31-04:00
committergravatar for noreply@github.comGitHub <noreply@github.com> 2026-09-04 14:51:31-04:00
log0de956ed2f92b8a6ead56e1566801db232d365dc
tree782457b70b87ac29d486f461bf21b3c04a2f15d0
parenta76b898b3aa4fd4081104b06a3b2c942bd4fecb7
signature Signed by PGP key B5690EEEBB952194

fix(web): refine server update notice (#9744)

4 files changed, 11 insertions(+), 5 deletions(-)

apps/web/src/components/ChatView.tsx+4-1
...@@ -2405,7 +2405,10 @@ export default function ChatView(props: ChatViewProps) {...@@ -2405,7 +2405,10 @@ export default function ChatView(props: ChatViewProps) {
2405 <Tooltip>2405 <Tooltip>
2406 <TooltipTrigger2406 <TooltipTrigger
2407 render={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 Server update available2412 Server update available
2410 </button>2413 </button>
2411 }2414 }
apps/web/src/components/chat/ComposerBanner.tsx+4-1
...@@ -178,7 +178,7 @@ function Row({...@@ -178,7 +178,7 @@ function Row({
178 layout = "inline",178 layout = "inline",
179 ...props179 ...props
180}: useRender.ComponentProps<"div"> & {180}: useRender.ComponentProps<"div"> & {
181 layout?: "inline" | "wrap-actions";181 layout?: "inline" | "wrap-actions" | "wrap-actions-narrow";
182}) {182}) {
183 const rowProps = {183 const rowProps = {
184 className: cn(184 className: cn(
...@@ -187,6 +187,8 @@ function Row({...@@ -187,6 +187,8 @@ function Row({
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",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 layout === "wrap-actions" &&188 layout === "wrap-actions" &&
189 "@max-[400px]:*:data-[slot=composer-banner-content]:min-h-(--composer-banner-icon-column)",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 className,192 className,
191 ),193 ),
192 "data-composer-banner-row": "true",194 "data-composer-banner-row": "true",
...@@ -247,6 +249,7 @@ function Actions({ className, ...props }: ComponentProps<"span">) {...@@ -247,6 +249,7 @@ function Actions({ className, ...props }: ComponentProps<"span">) {
247 className={cn(249 className={cn(
248 "col-start-3 row-start-1 flex flex-wrap items-center justify-end gap-1",250 "col-start-3 row-start-1 flex flex-wrap items-center justify-end gap-1",
249 "@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",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 className,253 className,
251 )}254 )}
252 {...props}255 {...props}
apps/web/src/components/chat/ComposerBannerStack.tsx+1-1
...@@ -269,7 +269,7 @@ function ComposerBannerStackAlert({...@@ -269,7 +269,7 @@ function ComposerBannerStackAlert({
269 variant={item.variant}269 variant={item.variant}
270 density="comfortable"270 density="comfortable"
271 >271 >
272 <ComposerBanner.Row layout="wrap-actions">272 <ComposerBanner.Row layout="wrap-actions-narrow">
273 <ComposerBanner.Icon className="h-(--composer-banner-icon-column) self-start">273 <ComposerBanner.Icon className="h-(--composer-banner-icon-column) self-start">
274 {item.icon}274 {item.icon}
275 </ComposerBanner.Icon>275 </ComposerBanner.Icon>
apps/web/src/components/chat/ComposerServerUpdateStatus.tsx+2-2
...@@ -1,5 +1,5 @@...@@ -1,5 +1,5 @@
1import type { ServerUpdateState } from "@t3tools/client-runtime/state/server";1import type { ServerUpdateState } from "@t3tools/client-runtime/state/server";
2import { CircleAlertIcon, InfoIcon, LoaderCircleIcon } from "lucide-react";2import { CircleAlertIcon, DownloadIcon, LoaderCircleIcon } from "lucide-react";
3import { useId, useState } from "react";3import { useId, useState } from "react";
44
5import { serverUpdateStageLabel } from "../ServerUpdateAction";5import { serverUpdateStageLabel } from "../ServerUpdateAction";
...@@ -17,7 +17,7 @@ export function ComposerServerUpdateIcon({...@@ -17,7 +17,7 @@ export function ComposerServerUpdateIcon({
17 if (status === "failed") {17 if (status === "failed") {
18 return <CircleAlertIcon aria-hidden className="text-error" />;18 return <CircleAlertIcon aria-hidden className="text-error" />;
19 }19 }
20 return <InfoIcon aria-hidden />;20 return <DownloadIcon aria-hidden />;
21}21}
2222
23/** One text line, clipped at the end so the error detail never squeezes its title. */23/** One text line, clipped at the end so the error detail never squeezes its title. */