@nextclaw/ui 0.26.4 → 0.27.0

package/src/features/inbox/components/inbox-reader-dialog.tsx

@@ -4,7 +4,8 @@ import { useRef, useState } from "react";
 import { ChevronLeft, ChevronRight, Inbox } from "lucide-react";
 import { useNavigate } from "react-router-dom";
 import { useAppPresenter } from "@/app/components/app-presenter-provider";
-import { CHAT_DRAFT_SESSION_PATH } from "@/features/chat";
+import { useViewportLayout } from "@/app/hooks/use-viewport-layout";
+import { buildSessionPath, CHAT_DRAFT_SESSION_PATH } from "@/features/chat";
 import { InboxDeliveryContent } from "@/features/inbox/components/inbox-delivery-content";
 import { useInboxDeliveries } from "@/features/inbox/hooks/use-inbox-deliveries";
 import { useInboxStore } from "@/features/inbox/stores/inbox.store";
@@ -13,6 +14,7 @@ import {
   Dialog,
   DialogContent,
   DialogDescription,
+  DialogHeader,
   DialogTitle,
 } from "@/shared/components/ui/dialog";
 import { IconActionButton } from "@/shared/components/ui/actions/icon-action-button";
@@ -28,7 +30,8 @@ function formatPosition(current: number, total: number): string {
 export function InboxReaderDialog() {
   const titleRef = useRef<HTMLHeadingElement>(null);
   const navigate = useNavigate();
-  const { chatDraftIntentManager, inboxManager } = useAppPresenter();
+  const { chatComposerIntentManager, docBrowserManager, inboxManager } = useAppPresenter();
+  const { isMobile } = useViewportLayout();
   const { data } = useInboxDeliveries();
   const { activeDeliveryId, readerOpen } = useInboxStore((state) => state.snapshot);
   const [pendingAction, setPendingAction] = useState<string | null>(null);
@@ -77,9 +80,10 @@ export function InboxReaderDialog() {
       return;
     }
     void runAction("continue", async () => {
-      const { reference } = await inboxManager.prepareChatReference(activeDelivery.id);
-      chatDraftIntentManager.requestSystemObjectReference(reference);
-      navigate(CHAT_DRAFT_SESSION_PATH);
+      const { reference, targetSessionKey } = await inboxManager.prepareChatReference(activeDelivery.id);
+      chatComposerIntentManager.requestSystemObjectReference({ targetSessionKey, reference });
+      if (isMobile) docBrowserManager.close();
+      navigate(targetSessionKey ? buildSessionPath(targetSessionKey) : CHAT_DRAFT_SESSION_PATH);
     });
   };
 
@@ -96,15 +100,18 @@ export function InboxReaderDialog() {
   const positionControls = unreadDeliveries.length > 1 ? (
     <div className="flex shrink-0 items-center gap-1 pr-1">
       <span className="mr-1 text-[11px] tabular-nums text-muted-foreground">
-        {formatPosition(activeIndex + 1, unreadDeliveries.length)}
+        <span className="hidden md:inline">{formatPosition(activeIndex + 1, unreadDeliveries.length)}</span>
+        <span className="md:hidden" aria-label={formatPosition(activeIndex + 1, unreadDeliveries.length)}>{activeIndex + 1}/{unreadDeliveries.length}</span>
       </span>
       <IconActionButton
+        size="sm"
         icon={<ChevronLeft className="h-4 w-4" />}
         label={t("inboxPrevious")}
         disabled={activeIndex <= 0 || pendingAction === "select"}
         onClick={() => selectAt(activeIndex - 1)}
       />
       <IconActionButton
+        size="sm"
         icon={<ChevronRight className="h-4 w-4" />}
         label={t("inboxNext")}
         disabled={activeIndex >= unreadDeliveries.length - 1 || pendingAction === "select"}
@@ -123,7 +130,7 @@ export function InboxReaderDialog() {
       }}
     >
       <DialogContent
-        className="flex h-[min(82vh,760px)] w-[calc(100vw-2rem)] max-w-[820px] flex-col gap-0 overflow-hidden rounded-[24px] border-border/70 bg-background p-0 shadow-[0_20px_55px_-22px_rgba(15,23,42,0.32)] max-sm:h-[100dvh] max-sm:max-h-none max-sm:w-screen max-sm:rounded-none max-sm:border-0"
+        className="flex h-[min(82vh,760px)] w-[calc(100vw-2rem)] max-w-[820px] flex-col gap-0 overflow-hidden rounded-[24px] border-border/70 bg-background p-0 shadow-[0_20px_55px_-22px_rgba(15,23,42,0.32)] max-md:h-[100dvh] max-md:max-h-[100dvh] max-md:w-screen max-md:max-w-none max-md:rounded-none max-md:border-0 max-md:pt-[env(safe-area-inset-top,0px)] max-md:pb-[env(safe-area-inset-bottom,0px)]"
         onOpenAutoFocus={(event) => {
           event.preventDefault();
           titleRef.current?.focus();
@@ -131,10 +138,15 @@ export function InboxReaderDialog() {
       >
         {activeDelivery ? (
           <>
-            <header className="shrink-0 border-b border-border/50 px-5 py-3 pr-14 sm:px-6">
-              <div className="flex min-h-7 items-center justify-between gap-3">
+            <DialogHeader
+              className="items-center gap-1 border-b border-border/50 px-3 py-2 md:gap-3 md:px-6 md:py-3"
+              actions={<>
+                {positionControls}
+                <PageResourceActionsMenu page={pageResourceFromSystemObject("inbox-delivery", activeDelivery.id, activeDelivery.title)} />
+              </>}
+            >
                 <div className="flex min-w-0 items-center gap-2">
-                  <span className="flex h-7 w-7 shrink-0 items-center justify-center rounded-lg bg-muted/70 text-muted-foreground">
+                  <span className="hidden h-7 w-7 shrink-0 items-center justify-center rounded-lg bg-muted/70 text-muted-foreground md:flex">
                     <Inbox className="h-3.5 w-3.5" />
                   </span>
                   <DialogTitle
@@ -145,29 +157,24 @@ export function InboxReaderDialog() {
                   >
                     {activeDelivery.title}
                   </DialogTitle>
-                  <span className="hidden shrink-0 text-muted-foreground sm:inline" aria-hidden="true">·</span>
+                  <span className="hidden shrink-0 text-muted-foreground md:inline" aria-hidden="true">·</span>
                   <time
-                    className="hidden shrink-0 text-[11px] tabular-nums text-muted-foreground sm:block"
+                    className="hidden shrink-0 text-[11px] tabular-nums text-muted-foreground md:block"
                     dateTime={activeDelivery.createdAt}
                   >
                     {formatDateTime(activeDelivery.createdAt)}
                   </time>
                 </div>
-                <div className="flex shrink-0 items-center gap-1">
-                  {positionControls}
-                  <PageResourceActionsMenu page={pageResourceFromSystemObject("inbox-delivery", activeDelivery.id, activeDelivery.title)} />
-                </div>
-              </div>
               <DialogDescription className="sr-only">
                 {activeDelivery.summary ?? t("inboxNoSummary")}
               </DialogDescription>
-            </header>
+            </DialogHeader>
 
             <div className={cn(
               "min-h-0 flex-1",
               isHtml
-                ? "p-3 sm:p-4"
-                : "custom-scrollbar overflow-y-auto px-6 py-5 sm:px-8 sm:py-6",
+                ? "p-0 md:p-4"
+                : "custom-scrollbar overflow-y-auto overscroll-contain px-4 py-3 md:px-8 md:py-6",
             )}>
               <InboxDeliveryContent
                 className={isHtml ? "h-full" : undefined}
@@ -178,24 +185,26 @@ export function InboxReaderDialog() {
               />
             </div>
 
-            <footer className="shrink-0 border-t border-border/50 bg-background px-5 py-3 sm:px-6">
+            <footer className="shrink-0 border-t border-border/50 bg-background px-3 py-2 md:px-6 md:py-3">
               {error ? (
                 <p role="alert" className="mb-3 text-sm text-destructive">{error}</p>
               ) : null}
-              <div className="flex flex-col-reverse gap-2 sm:flex-row sm:items-center sm:justify-between">
-                <div className="flex flex-col-reverse gap-1 sm:flex-row sm:flex-wrap">
-                  <Button size="sm" variant="ghost" onClick={inboxManager.closeReader}>
+              <div className="flex items-center justify-between gap-2 [--control-touch-size:2rem]">
+                <div className="flex items-center gap-1">
+                  <Button size="sm" className="px-2 md:px-3" variant="ghost" onClick={inboxManager.closeReader}>
                     {t("inboxReadLater")}
                   </Button>
-                  <Button size="sm" variant="outline" disabled={pendingAction !== null} onClick={markRead}>
+                  <Button size="sm" className="px-2 md:px-3" variant="outline" disabled={pendingAction !== null} onClick={markRead}>
                     {t("inboxMarkRead")}
                   </Button>
-                  <Button size="sm" variant="ghost" disabled={pendingAction !== null} onClick={openInbox}>
-                    {t("inboxOpenInbox")}
+                  <Button size="sm" className="px-2 md:px-3" variant="ghost" aria-label={t("inboxOpenInbox")} disabled={pendingAction !== null} onClick={openInbox}>
+                    <span className="md:hidden">{t("inboxTitle")}</span>
+                    <span className="hidden md:inline">{t("inboxOpenInbox")}</span>
                   </Button>
                 </div>
-                <Button size="sm" disabled={pendingAction !== null} onClick={continueInChat}>
-                  {t("inboxContinueChat")}
+                <Button size="sm" className="px-2 md:px-3" aria-label={t("inboxContinueChat")} disabled={pendingAction !== null} onClick={continueInChat}>
+                  <span className="md:hidden">{t("inboxContinueChatCompact")}</span>
+                  <span className="hidden md:inline">{t("inboxContinueChat")}</span>
                 </Button>
               </div>
             </footer>

package/src/features/inbox/managers/inbox.manager.test.ts

@@ -1,10 +1,13 @@
 import { QueryClient } from "@tanstack/react-query";
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import type { InboxDelivery } from "@nextclaw/shared";
+import { NextClawClientError } from "@nextclaw/client-sdk";
 import { InboxManager } from "@/features/inbox/managers/inbox.manager";
 import { useInboxStore } from "@/features/inbox/stores/inbox.store";
 
 const mocks = vi.hoisted(() => ({
+  getDelivery: vi.fn(),
+  getSession: vi.fn(),
   delete: vi.fn(),
   resolveReference: vi.fn(),
   list: vi.fn(),
@@ -16,6 +19,7 @@ vi.mock("@/shared/lib/api", () => ({
   nextclawClient: {
     eventBus: { on: mocks.on },
     inboxDeliveries: {
+      get: mocks.getDelivery,
       delete: mocks.delete,
       list: mocks.list,
       updateState: mocks.updateState,
@@ -23,6 +27,7 @@ vi.mock("@/shared/lib/api", () => ({
     systemObjectReferences: {
       resolve: mocks.resolveReference,
     },
+    sessions: { get: mocks.getSession },
   },
 }));
 
@@ -43,6 +48,8 @@ const delivery: InboxDelivery = {
 describe("InboxManager", () => {
   beforeEach(() => {
     vi.clearAllMocks();
+    mocks.getDelivery.mockResolvedValue(delivery);
+    mocks.getSession.mockResolvedValue({ sessionId: "source-session" });
     Object.defineProperty(document, "visibilityState", { configurable: true, value: "visible" });
     useInboxStore.setState({
       snapshot: { readerOpen: false, activeDeliveryId: null },
@@ -107,5 +114,26 @@ describe("InboxManager", () => {
     );
     expect(mocks.updateState).toHaveBeenCalledWith(delivery.id, "read");
     expect(result.reference.assetUri).toBe("asset://store/report");
+    expect(result.targetSessionKey).toBeNull();
+  });
+
+  it("targets the original report session", async () => {
+    mocks.getDelivery.mockResolvedValue({ ...delivery, source: { ...delivery.source, sessionId: "source-session" } });
+    const result = await new InboxManager(new QueryClient()).prepareChatReference(delivery.id);
+    expect(mocks.getSession).toHaveBeenCalledWith("source-session");
+    expect(result.targetSessionKey).toBe("source-session");
+  });
+
+  it("falls back to a draft only when the source session was deleted", async () => {
+    mocks.getDelivery.mockResolvedValue({ ...delivery, source: { ...delivery.source, sessionId: "deleted" } });
+    mocks.getSession.mockRejectedValueOnce(new NextClawClientError({ message: "Missing", status: 404 }));
+    expect((await new InboxManager(new QueryClient()).prepareChatReference(delivery.id)).targetSessionKey).toBeNull();
+  });
+
+  it("keeps the report unread when the source session lookup fails", async () => {
+    mocks.getDelivery.mockResolvedValue({ ...delivery, source: { ...delivery.source, sessionId: "source-session" } });
+    mocks.getSession.mockRejectedValueOnce(new NextClawClientError({ message: "Offline", status: 503 }));
+    await expect(new InboxManager(new QueryClient()).prepareChatReference(delivery.id)).rejects.toThrow("Offline");
+    expect(mocks.updateState).not.toHaveBeenCalled();
   });
 });

package/src/features/inbox/managers/inbox.manager.ts

@@ -13,6 +13,7 @@ import {
 import { appQueryClient } from "@/app-query-client";
 import { useInboxStore } from "@/features/inbox/stores/inbox.store";
 import { nextclawClient } from "@/shared/lib/api";
+import { NextClawClientError } from "@nextclaw/client-sdk";
 
 export const INBOX_DELIVERIES_QUERY_KEY = ["inbox-deliveries"] as const;
 
@@ -112,13 +113,26 @@ export class InboxManager {
   prepareChatReference = async (deliveryId: string): Promise<{
     delivery: InboxDelivery;
     reference: SystemObjectResolvedReference;
+    targetSessionKey: string | null;
   }> => {
-    const reference = await nextclawClient.systemObjectReferences.resolve(
-      createSystemObjectReferenceUri(SYSTEM_OBJECT_TYPE_INBOX_DELIVERY, deliveryId),
-    );
+    const [reference, sourceDelivery] = await Promise.all([
+      nextclawClient.systemObjectReferences.resolve(
+        createSystemObjectReferenceUri(SYSTEM_OBJECT_TYPE_INBOX_DELIVERY, deliveryId),
+      ),
+      nextclawClient.inboxDeliveries.get(deliveryId),
+    ]);
+    let targetSessionKey = sourceDelivery.source.sessionId?.trim() || null;
+    if (targetSessionKey) {
+      try {
+        await nextclawClient.sessions.get(targetSessionKey);
+      } catch (error) {
+        if (!(error instanceof NextClawClientError) || error.status !== 404) throw error;
+        targetSessionKey = null;
+      }
+    }
     const delivery = await this.updateState(deliveryId, "read");
     this.closeReader();
-    return { delivery, reference };
+    return { delivery, reference, targetSessionKey };
   };
 
   private updateState = async (

package/src/features/inbox/pages/inbox-page.test.ts

@@ -7,13 +7,15 @@ import { InboxPage, resolveInboxFilter } from "@/features/inbox/pages/inbox-page
 import { t } from "@/shared/lib/i18n";
 
 const mocks = vi.hoisted(() => ({
+  isMobile: false,
   prepareChatReference: vi.fn(),
   requestSystemObjectReference: vi.fn(),
 }));
 
 vi.mock("@/app/components/app-presenter-provider", () => ({
   useAppPresenter: () => ({
-    chatDraftIntentManager: {
+    docBrowserManager: { close: vi.fn() },
+    chatComposerIntentManager: {
       requestSystemObjectReference: mocks.requestSystemObjectReference,
     },
     inboxManager: {
@@ -28,7 +30,7 @@ vi.mock("@/app/components/app-presenter-provider", () => ({
 }));
 
 vi.mock("@/app/hooks/use-viewport-layout", () => ({
-  useViewportLayout: () => ({ isMobile: false }),
+  useViewportLayout: () => ({ isMobile: mocks.isMobile }),
 }));
 
 vi.mock("@/features/inbox/hooks/use-inbox-deliveries", () => ({
@@ -101,7 +103,9 @@ describe("resolveInboxFilter", () => {
 describe("InboxPage", () => {
   beforeEach(() => {
     vi.clearAllMocks();
+    mocks.isMobile = false;
     mocks.prepareChatReference.mockResolvedValue({
+      targetSessionKey: null,
       reference: {
         uri: "nextclaw://objects/inbox-delivery/delivery-1",
         label: "A considered report",
@@ -109,7 +113,8 @@ describe("InboxPage", () => {
     });
   });
 
-  it("opens a draft with the same visible system object intent as the reader dialog", async () => {
+  it.each([false, true])("opens a draft with the same system object intent (mobile=%s)", async (isMobile) => {
+    mocks.isMobile = isMobile;
     render(
       createElement(
         MemoryRouter,
@@ -134,14 +139,20 @@ describe("InboxPage", () => {
       ),
     );
 
-    fireEvent.click(screen.getByRole("button", { name: t("inboxContinueChat") }));
+    const continueButton = screen.getByRole("button", { name: t("inboxContinueChat") });
+    if (isMobile) {
+      const moreButton = screen.getByRole("button", { name: t("more") });
+      expect(continueButton.compareDocumentPosition(moreButton) & Node.DOCUMENT_POSITION_FOLLOWING).toBeTruthy();
+      expect(screen.getByRole("button", { name: t("inboxTitle") })).toBeTruthy();
+    }
+    fireEvent.click(continueButton);
 
     await waitFor(() => {
       expect(screen.getByTestId("current-path").textContent).toBe(CHAT_DRAFT_SESSION_PATH);
     });
     expect(mocks.prepareChatReference).toHaveBeenCalledWith("delivery-1");
     expect(mocks.requestSystemObjectReference).toHaveBeenCalledWith(
-      expect.objectContaining({ uri: "nextclaw://objects/inbox-delivery/delivery-1" }),
+      { targetSessionKey: null, reference: expect.objectContaining({ uri: "nextclaw://objects/inbox-delivery/delivery-1" }) },
     );
   });
 });

package/src/features/inbox/pages/inbox-page.tsx

@@ -2,14 +2,14 @@ import { PageResourceActionsMenu } from '@/features/right-panel-resources';
 import { pageResourceFromSystemObject } from '@/features/right-panel-resources';
 import { useEffect, useMemo, useState } from "react";
 import type { InboxDelivery } from "@nextclaw/shared";
-import { Archive, Inbox, MessageCircle, MoreVertical, RotateCcw, Trash2 } from "lucide-react";
+import { Archive, ArrowLeft, Inbox, MessageCircle, MoreVertical, RotateCcw, Trash2 } from "lucide-react";
 import { ContextMenu, ContextMenuTrigger } from '@/shared/components/ui/context-menu/context-menu';
 import { IconActionButton } from '@/shared/components/ui/actions/icon-action-button';
 import { Link, useNavigate, useParams } from "react-router-dom";
 import { useAppPresenter } from "@/app/components/app-presenter-provider";
 import { PageHeader } from "@/app/components/layout/page-layout";
 import { useViewportLayout } from "@/app/hooks/use-viewport-layout";
-import { CHAT_DRAFT_SESSION_PATH } from "@/features/chat";
+import { buildSessionPath, CHAT_DRAFT_SESSION_PATH } from "@/features/chat";
 import { InboxDeliveryContent } from "@/features/inbox/components/inbox-delivery-content";
 import { useInboxDeliveries } from "@/features/inbox/hooks/use-inbox-deliveries";
 import { Button } from "@/shared/components/ui/button";
@@ -167,6 +167,7 @@ function InboxListPane({
 
 function InboxDetailPane({
   delivery,
+  isMobile,
   error,
   pending,
   onArchiveToggle,
@@ -175,6 +176,7 @@ function InboxDetailPane({
   onReadToggle,
 }: {
   delivery: InboxDelivery | null;
+  isMobile: boolean;
   error: string | null;
   pending: boolean;
   onArchiveToggle: () => void;
@@ -182,38 +184,52 @@ function InboxDetailPane({
   onDelete: () => void;
   onReadToggle: () => void;
 }) {
+  const navigate = useNavigate();
+  const backButton = <IconActionButton size="sm" icon={<ArrowLeft className="h-4 w-4" />} label={t("inboxTitle")} onClick={() => navigate('/inbox')} />;
   const scrollRestoration = useScrollRestoration<HTMLDivElement>({
     restorationKey: delivery ? `inbox:delivery:${delivery.id}` : null,
   });
   const { onScroll, scrollRef } = scrollRestoration;
   if (!delivery) {
-    return <main className="flex min-h-0 flex-col"><InboxEmptyState selection /></main>;
+    return <main className="flex min-h-0 flex-col"><div className="md:hidden">{backButton}</div><InboxEmptyState selection /></main>;
   }
   const isHtml = delivery.contentType === "html";
   return (
-    <main className="flex min-h-0 flex-col">
-      <div className="shrink-0 px-4 py-2 md:border-b md:border-border/50 md:px-6 md:py-3">
-        <div className="flex min-h-7 min-w-0 items-center gap-2">
+    <main className="flex min-h-0 min-w-0 flex-col max-md:pt-[env(safe-area-inset-top,0px)] max-md:pb-[env(safe-area-inset-bottom,0px)]">
+      <div className="shrink-0 border-b border-border/50 px-2 py-2 md:px-6 md:py-3">
+        <div className="flex min-h-7 min-w-0 items-center gap-1">
+          <div className="md:hidden">{backButton}</div>
           <h2
             title={delivery.title}
-            className="min-w-0 truncate text-sm font-medium text-foreground"
+            className="min-w-0 flex-1 truncate text-sm font-medium text-foreground md:flex-none"
           >
             {delivery.title}
           </h2>
-          <span className="hidden shrink-0 text-muted-foreground sm:inline" aria-hidden="true">·</span>
+          <span className="hidden shrink-0 text-muted-foreground md:inline" aria-hidden="true">·</span>
           <time
-            className="hidden shrink-0 text-[11px] tabular-nums text-muted-foreground sm:block"
+            className="hidden shrink-0 text-[11px] tabular-nums text-muted-foreground md:block"
             dateTime={delivery.createdAt}
           >
             {formatDateTime(delivery.createdAt)}
           </time>
+          {isMobile ? <div className="flex shrink-0 items-center">
+            <IconActionButton size="sm" icon={<MessageCircle className="h-4 w-4" />} label={t('inboxContinueChat')} disabled={pending} onClick={onContinue} />
+            <ContextMenu label={t('inboxTitle')} groups={[{ key: 'delivery', items: [
+              { key: 'read', label: delivery.readAt ? t('inboxMarkUnread') : t('inboxMarkRead'), disabled: pending, onSelect: onReadToggle },
+              { key: 'archive', label: delivery.archivedAt ? t('inboxRestore') : t('inboxArchive'), icon: <Archive className="h-4 w-4" />, disabled: pending, onSelect: onArchiveToggle },
+              { key: 'delete', label: t('inboxDelete'), icon: <Trash2 className="h-4 w-4" />, destructive: true, disabled: pending, onSelect: onDelete },
+            ] }]}>
+              <div><ContextMenuTrigger><IconActionButton size="sm" icon={<MoreVertical className="h-4 w-4" />} label={t('more')} /></ContextMenuTrigger></div>
+            </ContextMenu>
+          </div> : null}
         </div>
       </div>
+      {error ? <p role="alert" className="shrink-0 px-4 py-2 text-sm text-destructive">{error}</p> : null}
       <div className={cn(
         "min-h-0 flex-1",
         isHtml
           ? "p-0 md:p-4"
-          : "custom-scrollbar overflow-y-auto px-5 py-5 sm:px-6 sm:py-6",
+          : "custom-scrollbar overflow-y-auto overscroll-contain px-4 py-4 sm:px-6 sm:py-6",
       )}
       ref={scrollRef}
       onScroll={onScroll}
@@ -228,8 +244,7 @@ function InboxDetailPane({
           />
         </div>
       </div>
-      <div className="shrink-0 border-t border-border/50 px-4 py-2 md:px-6 md:py-3">
-        {error ? <p role="alert" className="mb-2 text-sm text-destructive">{error}</p> : null}
+      {!isMobile ? <div className="shrink-0 border-t border-border/50 px-6 py-3">
         <div className="flex items-center justify-between gap-2">
           <div className="hidden md:flex flex-wrap items-center gap-1">
             <Button size="sm" variant="outline" disabled={pending} onClick={onReadToggle}>
@@ -246,21 +261,12 @@ function InboxDetailPane({
               {t("inboxDelete")}
             </Button>
           </div>
-          <div className="md:hidden">
-            <ContextMenu label={t('inboxTitle')} groups={[{ key: 'delivery', items: [
-              { key: 'read', label: delivery.readAt ? t('inboxMarkUnread') : t('inboxMarkRead'), disabled: pending, onSelect: onReadToggle },
-              { key: 'archive', label: delivery.archivedAt ? t('inboxRestore') : t('inboxArchive'), icon: <Archive className="h-4 w-4" />, disabled: pending, onSelect: onArchiveToggle },
-              { key: 'delete', label: t('inboxDelete'), icon: <Trash2 className="h-4 w-4" />, destructive: true, disabled: pending, onSelect: onDelete },
-            ] }]}>
-              <div><ContextMenuTrigger><IconActionButton icon={<MoreVertical className="h-4 w-4" />} label={t('more')} /></ContextMenuTrigger></div>
-            </ContextMenu>
-          </div>
           <Button size="sm" disabled={pending} onClick={onContinue}>
             <MessageCircle className="mr-2 h-4 w-4" />
             {t("inboxContinueChat")}
           </Button>
         </div>
-      </div>
+      </div> : null}
     </main>
   );
 }
@@ -269,7 +275,7 @@ export function InboxPage() {
   const navigate = useNavigate();
   const { deliveryId } = useParams<{ deliveryId?: string }>();
   const { isMobile } = useViewportLayout();
-  const { chatDraftIntentManager, inboxManager } = useAppPresenter();
+  const { chatComposerIntentManager, docBrowserManager, inboxManager } = useAppPresenter();
   const deliveriesQuery = useInboxDeliveries();
   const { confirm, ConfirmDialog } = useConfirmDialog();
   const [selectedFilter, setSelectedFilter] = useState<InboxFilter | null>(null);
@@ -310,9 +316,10 @@ export function InboxPage() {
       return;
     }
     void runAction("continue", async () => {
-      const { reference } = await inboxManager.prepareChatReference(activeDelivery.id);
-      chatDraftIntentManager.requestSystemObjectReference(reference);
-      navigate(CHAT_DRAFT_SESSION_PATH);
+      const { reference, targetSessionKey } = await inboxManager.prepareChatReference(activeDelivery.id);
+      chatComposerIntentManager.requestSystemObjectReference({ targetSessionKey, reference });
+      if (isMobile) docBrowserManager.close();
+      navigate(targetSessionKey ? buildSessionPath(targetSessionKey) : CHAT_DRAFT_SESSION_PATH);
     });
   };
 
@@ -359,8 +366,8 @@ export function InboxPage() {
     });
   };
 
-  const showList = !isMobile || !activeDelivery;
-  const showDetail = !isMobile || Boolean(activeDelivery);
+  const showList = !isMobile || !deliveryId;
+  const showDetail = !isMobile || Boolean(deliveryId);
 
   return (
     <div className="flex h-full min-h-0 flex-col md:gap-6">
@@ -372,7 +379,7 @@ export function InboxPage() {
 
       <div className="min-h-0 flex-1 overflow-hidden bg-background md:rounded-2xl md:border md:border-border/60">
         {deliveriesQuery.isError ? (
-          <div role="alert" className="p-6 text-sm text-destructive">{t("inboxLoadError")}</div>
+          <div className="p-4">{isMobile && deliveryId ? <IconActionButton icon={<ArrowLeft className="h-4 w-4" />} label={t("inboxTitle")} onClick={() => navigate('/inbox')} /> : null}<p role="alert" className="text-sm text-destructive">{t("inboxLoadError")}</p></div>
         ) : (
           <div className="grid h-full min-h-0 grid-cols-1 md:grid-cols-[300px_minmax(0,1fr)]">
             {showList ? <InboxListPane
@@ -383,6 +390,7 @@ export function InboxPage() {
             /> : null}
             {showDetail ? <InboxDetailPane
               delivery={activeDelivery}
+              isMobile={isMobile}
               error={error}
               pending={pendingAction !== null}
               onArchiveToggle={toggleArchive}

package/src/features/panel-apps/components/panel-app-list-item.tsx

@@ -1,3 +1,4 @@
+import { ACTION_FEEDBACK, ACTION_MENU_ITEM_CLASS } from '@/shared/components/ui/actions/action-feedback';
 import { useState, type MouseEvent } from 'react';
 import { MoreVertical, Star, Trash2, type LucideIcon } from 'lucide-react';
 import type { PanelAppEntryView } from '@/shared/lib/api';
@@ -127,13 +128,13 @@ function PanelAppMenuItem({
     <button
       type="button"
       className={cn(
-        'flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-sm transition-colors disabled:cursor-not-allowed disabled:opacity-50',
-        destructive ? 'text-destructive hover:bg-destructive/10' : 'text-muted-foreground hover:bg-[var(--interaction-hover)] hover:text-accent-foreground',
+        ACTION_MENU_ITEM_CLASS,
+        destructive ? ACTION_FEEDBACK.destructive : `text-foreground ${ACTION_FEEDBACK.item}`,
       )}
       disabled={disabled}
       onClick={onClick}
     >
-      <Icon className="h-4 w-4 shrink-0" />
+      <Icon className={cn("h-4 w-4 shrink-0", !destructive && "text-muted-foreground")} />
       <span>{label}</span>
     </button>
   );

package/src/features/panel-apps/components/panel-app-service-action-authorization-dialog.tsx

@@ -26,8 +26,8 @@ export function PanelAppServiceActionAuthorizationDialog() {
         }
       }}
     >
-      <DialogContent className="[&>:last-child]:hidden">
-        <DialogHeader>
+      <DialogContent>
+        <DialogHeader showClose={false}>
           <DialogTitle className="flex items-center gap-2">
             <ShieldAlert className="h-4 w-4 text-amber-600" />
             {t('serviceActionAuthorizationTitle')}

package/src/features/panel-apps/utils/panel-app-doc-browser.utils.tsx

@@ -2,16 +2,15 @@ import { AppWindow, Boxes } from 'lucide-react';
 import type { DocBrowserContextValue } from '@/shared/components/doc-browser/doc-browser-context';
 import type { DocBrowserCustomTabRenderers } from '@/shared/components/doc-browser/doc-browser-renderer.types';
 import { getPresenter } from '@/app/presenters/app.presenter';
-import { AppsPanel, type AppsPanelTab } from '@/features/apps';
+import { AppsPanel } from '@/features/apps';
 import { PanelAppDocBrowserToolbar } from '@/features/panel-apps/components/panel-app-toolbar';
 import {
   createPanelAppRightPanelResourceTarget,
   RIGHT_PANEL_APPS_TAB_KIND,
-  RIGHT_PANEL_APPS_URL,
+  createRightPanelAppsUrl,
+  getRightPanelAppsTabFromUrl,
   RIGHT_PANEL_HOME_TAB_KIND,
   RIGHT_PANEL_PANEL_APP_TAB_KIND,
-  RIGHT_PANEL_PANEL_APPS_URL,
-  RIGHT_PANEL_SERVICE_APPS_URL,
   RightPanelResourceHomePage,
 } from '@/features/right-panel-resources';
 import { t } from '@/shared/lib/i18n';
@@ -19,26 +18,8 @@ import { PANEL_APP_IFRAME_SANDBOX, focusPanelAppIframe } from './panel-app-ifram
 
 export const APPS_TAB_KIND = RIGHT_PANEL_APPS_TAB_KIND;
 export const PANEL_APP_TAB_KIND = RIGHT_PANEL_PANEL_APP_TAB_KIND;
-const DEFAULT_APPS_PANEL_TAB: AppsPanelTab = 'apps';
-
-function isAppsPanelTab(value: unknown): value is AppsPanelTab {
-  return value === 'apps' || value === 'panel-apps' || value === 'service-apps';
-}
-
-export function createAppsPanelUrl(tab: AppsPanelTab = DEFAULT_APPS_PANEL_TAB): string {
-  if (tab === 'panel-apps') return RIGHT_PANEL_PANEL_APPS_URL;
-  if (tab === 'service-apps') return RIGHT_PANEL_SERVICE_APPS_URL;
-  return RIGHT_PANEL_APPS_URL;
-}
-
-export function getAppsPanelTabFromUrl(url: string): AppsPanelTab {
-  try {
-    const tab = new URL(url).searchParams.get('tab');
-    return isAppsPanelTab(tab) ? tab : DEFAULT_APPS_PANEL_TAB;
-  } catch {
-    return DEFAULT_APPS_PANEL_TAB;
-  }
-}
+export const createAppsPanelUrl = createRightPanelAppsUrl;
+export const getAppsPanelTabFromUrl = getRightPanelAppsTabFromUrl;
 
 export function openApps(docBrowser: Pick<DocBrowserContextValue, 'open'>): void {
   docBrowser.open(createAppsPanelUrl(), {

package/src/features/projects/components/work/project-work-items.tsx

@@ -255,7 +255,7 @@ function ProjectWorkStateGroup({
         <div
           className={
             view === "board"
-              ? "min-h-0 flex-1 space-y-2 overflow-y-auto overscroll-contain px-1 pb-3"
+              ? "min-h-0 flex-1 space-y-2 overflow-y-auto px-1 pb-3"
               : "space-y-2 px-1 pb-3"
           }
         >

package/src/features/projects/pages/project-home-page.tsx

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { useNavigate, useParams } from "react-router-dom";
+import { useLocation, useNavigate, useParams } from "react-router-dom";
 import { useProjects } from "@/shared/hooks/use-projects";
 import { useViewportLayout } from "@/app/hooks/use-viewport-layout";
 import { t } from "@/shared/lib/i18n";
@@ -43,6 +43,7 @@ export function ProjectsPage() {
     tab?: string;
   }>();
   const navigate = useNavigate();
+  const { state } = useLocation();
   const presenter = usePresenter();
   const { isMobile } = useViewportLayout();
   const projects = useProjects();
@@ -86,7 +87,7 @@ export function ProjectsPage() {
         <select
           id="project-home-selection"
           value=""
-          onChange={(event) => navigate(`/projects/${encodeURIComponent(event.target.value)}/overview`)}
+          onChange={(event) => navigate(`/projects/${encodeURIComponent(event.target.value)}/overview`, { state })}
           className="min-h-11 w-full rounded-xl border border-border bg-card px-3 text-base text-foreground"
         >
           <option value="" disabled>{t("projectsChoose")}</option>
@@ -117,6 +118,7 @@ export function ProjectsPage() {
             onValueChange={(value) =>
               navigate(
                 `/projects/${encodeURIComponent(selectedProject.id)}/${value}`,
+                { state },
               )
             }
           >