Răsfoiți Sursa

fix(app): mobile horizontal scrolling due to session stat btn (#10487)

Devin Griffin 3 săptămâni în urmă
părinte
comite
a900c89245

+ 6 - 4
packages/ui/src/components/session-turn.css

@@ -88,9 +88,6 @@
     }
   }
 
-  [data-slot="session-turn-response-trigger"] {
-    width: fit-content;
-  }
 
   [data-slot="session-turn-message-header"] {
     display: flex;
@@ -483,7 +480,7 @@
   }
 
   [data-slot="session-turn-collapsible-trigger-content"] {
-    width: fit-content;
+    max-width: 100%;
     display: flex;
     align-items: center;
     gap: 8px;
@@ -514,6 +511,11 @@
     color: var(--text-weak);
   }
 
+  [data-slot="session-turn-status-text"] {
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
   [data-slot="session-turn-details-text"] {
     font-size: 13px;
     /* text-12-medium */

+ 9 - 3
packages/ui/src/components/session-turn.tsx

@@ -593,10 +593,16 @@ export function SessionTurn(
                                 <span data-slot="session-turn-retry-attempt">(#{retry()?.attempt})</span>
                               </Match>
                               <Match when={working()}>
-                                {store.status ?? i18n.t("ui.sessionTurn.status.consideringNextSteps")}
+                                <span data-slot="session-turn-status-text">
+                                  {store.status ?? i18n.t("ui.sessionTurn.status.consideringNextSteps")}
+                                </span>
+                              </Match>
+                              <Match when={props.stepsExpanded}>
+                                <span data-slot="session-turn-status-text">{i18n.t("ui.sessionTurn.steps.hide")}</span>
+                              </Match>
+                              <Match when={!props.stepsExpanded}>
+                                <span data-slot="session-turn-status-text">{i18n.t("ui.sessionTurn.steps.show")}</span>
                               </Match>
-                              <Match when={props.stepsExpanded}>{i18n.t("ui.sessionTurn.steps.hide")}</Match>
-                              <Match when={!props.stepsExpanded}>{i18n.t("ui.sessionTurn.steps.show")}</Match>
                             </Switch>
                             <span aria-hidden="true">·</span>
                             <span aria-live="off">{store.duration}</span>