From 6c1aabd5e0da49b75c69a54fba26e617a2dfbf15 Mon Sep 17 00:00:00 2001
From: LukeParkerDev <10430890+Hona@users.noreply.github.com>
Date: Thu, 6 Aug 2026 08:21:11 +1000
Subject: [PATCH] fix(app): align workspace move menu styling

---
 .../app/src/components/session-workspace-menu.tsx    |  9 +++++----
 packages/app/src/i18n/en.ts                          |  1 +
 .../src/pages/session/timeline/message-timeline.tsx  | 12 +++++++-----
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/packages/app/src/components/session-workspace-menu.tsx b/packages/app/src/components/session-workspace-menu.tsx
index eac8687833a..6c35e06941e 100644
--- a/packages/app/src/components/session-workspace-menu.tsx
+++ b/packages/app/src/components/session-workspace-menu.tsx
@@ -28,6 +28,7 @@ export function SessionWorkspaceMenu(props: {
   placement?: ComponentProps<typeof MenuV2>["placement"]
   gutter?: number
   class?: string
+  contentClass?: string
   children: JSX.Element
   onOpenChange?: (open: boolean) => void
 }) {
@@ -118,19 +119,19 @@ export function SessionWorkspaceMenu(props: {
         {props.children}
       </MenuV2.Trigger>
       <MenuV2.Portal>
-        <MenuV2.Content class="w-[200px]">
+        <MenuV2.Content class={`w-[200px] ${props.contentClass ?? ""}`}>
           <MenuV2.Group>
-            <MenuV2.GroupLabel>{language.t("workspace.move.title")}</MenuV2.GroupLabel>
+            <MenuV2.GroupLabel>{language.t("workspace.move.menu.title")}</MenuV2.GroupLabel>
             <MenuV2.Item disabled={!!store.selected || blocked()} onSelect={() => void move("create")}>
               <Icon name="workspace-new" />
               {language.t("workspace.new")}
             </MenuV2.Item>
           </MenuV2.Group>
           <Show when={workspaces().length > 0}>
-            <MenuV2.Separator class="h-[0.5px]" />
+            <MenuV2.Separator class="h-[0.5px] bg-v2-border-border-base" />
             <MenuV2.Sub gutter={0} overlap overflowPadding={8}>
               <MenuV2.SubTrigger>
-                <Icon name="workspace" />
+                <Icon name="workspace-isolated" />
                 {language.t("session.new.workspace.existing").replace(/…$/, "")}
               </MenuV2.SubTrigger>
               <MenuV2.Portal>
diff --git a/packages/app/src/i18n/en.ts b/packages/app/src/i18n/en.ts
index 6f487e60fde..ac845a88b40 100644
--- a/packages/app/src/i18n/en.ts
+++ b/packages/app/src/i18n/en.ts
@@ -1141,6 +1141,7 @@ export const dict = {
   "settings.workspaces.default.local": "Local directory",
   "settings.workspaces.default.new": "New workspace",
   "workspace.move.title": "Move to workspace",
+  "workspace.move.menu.title": "Move session to",
   "workspace.move.failed": "Failed to move session",
   "workspace.lifecycle.creating": "Creating workspace",
   "workspace.lifecycle.created": "Workspace created",
diff --git a/packages/app/src/pages/session/timeline/message-timeline.tsx b/packages/app/src/pages/session/timeline/message-timeline.tsx
index a7fe95ee206..8e12d7af507 100644
--- a/packages/app/src/pages/session/timeline/message-timeline.tsx
+++ b/packages/app/src/pages/session/timeline/message-timeline.tsx
@@ -269,7 +269,8 @@ function WorkspaceMoveAction(props: {
       classList={{
         "group/workspace-move relative shrink-0": true,
         "ml-auto h-5 w-[167px]": inline(),
-        "h-[46px] w-full rounded-b-[6px] bg-v2-background-bg-layer-02 hover:bg-v2-background-bg-layer-03": !inline(),
+        "-mt-2.5 h-[46px] w-full rounded-b-[6px] bg-v2-background-bg-layer-02 hover:bg-v2-background-bg-layer-03":
+          !inline(),
         invisible: props.dismissed,
       }}
     >
@@ -280,7 +281,8 @@ function WorkspaceMoveAction(props: {
         directory={props.directory}
         messageID={props.messageID}
         placement={inline() ? "bottom-end" : "left-start"}
-        gutter={inline() ? 4 : -2}
+        gutter={inline() ? 4 : -22}
+        contentClass={inline() ? undefined : "relative top-3.5"}
         class={
           inline()
             ? "flex h-5 w-full items-center gap-1.5 rounded-[4px] pr-6 text-[13px] font-[440] leading-5 tracking-[-0.04px] text-v2-text-text-faint hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none data-[expanded]:bg-v2-overlay-simple-overlay-pressed"
@@ -332,9 +334,9 @@ function SessionSummaryPanel(props: {
   return (
     <div
       data-component="session-summary-panel"
-      class="w-[280px] overflow-hidden rounded-[6px] bg-v2-background-bg-layer-01 shadow-[var(--v2-elevation-floating)]"
+      class="w-[280px]"
     >
-      <div class="flex flex-col gap-1 px-0.5 py-1.5">
+      <div class="relative z-[70] flex flex-col gap-1 overflow-hidden rounded-[6px] bg-v2-background-bg-base px-0.5 py-1.5 shadow-[var(--v2-elevation-raised)]">
         <div class={row}>
           <ProjectAvatar
             fallback={displayName(props.project)}
@@ -358,7 +360,7 @@ function SessionSummaryPanel(props: {
             directory={props.directory}
             messageID={props.messageID}
             placement="left-start"
-            gutter={-2}
+            gutter={-22}
             class={`${row} hover:bg-v2-overlay-simple-overlay-hover focus-visible:bg-v2-overlay-simple-overlay-hover focus-visible:outline-none data-[expanded]:bg-v2-overlay-simple-overlay-pressed`}
           >
             <IconV2 name="monitor" class="shrink-0 text-v2-icon-icon-muted" />