Commit 9dbdcece5f488c66f6b9ac516b610f45bbbb676a | the-knife

author	Wout Stiens <71498452+StiensWout@users.noreply.github.com> 2026-09-01 18:44:42+02:00
committer	GitHub <noreply@github.com> 2026-09-01 12:44:42-04:00
log	9dbdcece5f488c66f6b9ac516b610f45bbbb676a
tree	8c956f3dcfdb2a7e30fef7a8841c5c932e2314c6
parent	b883fc066ea5c9bebbe1c3e9b4bc2471aab3685f
signature	Signed by PGP key B5690EEEBB952194

fix(web): align un-settle banner action (#9033)

1 files changed, 16 insertions(+), 15 deletions(-)

apps
- web
  - src
    components
    chat
    ComposerBannerStack.tsx

apps/web/src/components/chat/ComposerBannerStack.tsx+16-15

 @@ -269,8 +269,21 @@ function ComposerBannerStackAlert({
       className={item.className}
     >
       <ComposerBanner.Row layout="wrap-actions">
-        <ComposerBanner.Icon>{item.icon}</ComposerBanner.Icon>
+        <ComposerBanner.Icon className={item.description ? "min-h-4 self-start" : undefined}>
-        <ComposerBanner.Content className="font-medium">{item.title}</ComposerBanner.Content>
+          {item.icon}
+        </ComposerBanner.Icon>
+        <ComposerBanner.Content
+          className={item.description ? "flex-col items-start gap-0" : "font-medium"}
+        >
+          {item.description ? (
+            <>
+              <span className="font-medium">{item.title}</span>
+              <span className="text-muted-foreground">{item.description}</span>
+            </>
+          ) : (
+            item.title
+          )}
+        </ComposerBanner.Content>
         {item.actions || item.onDismiss ? (
           <ComposerBanner.Actions>
             {item.actions}
 @@ -284,19 +297,7 @@ function ComposerBannerStackAlert({
           </ComposerBanner.Actions>
         ) : null}
       </ComposerBanner.Row>
-      {item.description || item.children ? (
+      {item.children ? <ComposerBanner.Children>{item.children}</ComposerBanner.Children> : null}
-        <ComposerBanner.Children>
-          {item.description ? (
-            <ComposerBanner.Row>
-              <ComposerBanner.Icon />
-              <ComposerBanner.Content className="text-muted-foreground">
-                {item.description}
-              </ComposerBanner.Content>
-            </ComposerBanner.Row>
-          ) : null}
-          {item.children}
-        </ComposerBanner.Children>
-      ) : null}
     </ComposerBanner.Root>
   );
 }