github-issue-tower-defence-management 1.182.0 → 1.184.0

package/src/adapter/entry-points/console/ui/e2e/consoleScenario.spec.ts

@@ -309,6 +309,80 @@ test('opens the comment input with the item detail, keeps it on screen while the
   expect(dockHeightAfterPosting).toBe(dockHeightBeforePosting);
 });
 
+test('preserves the unsent comment draft when swiping between tasks', async ({
+  page,
+}) => {
+  await page.goto(harness.appRootUrl);
+
+  await tabByLabel(page, 'Triage').click();
+
+  await itemRowByText(
+    page,
+    'Add Sonnet to Opus weekly-limit fallback routing per token',
+  ).click();
+
+  await expect(page.locator('.console-composer-input')).toBeVisible();
+  await page.locator('.console-composer-input').fill('work in progress draft');
+
+  const swipeDetailScreen = async (
+    fromX: number,
+    toX: number,
+  ): Promise<void> => {
+    await page.evaluate(
+      ([from, to]: [number, number]) => {
+        const screen = document.querySelector('.console-detail-screen');
+        if (!screen) throw new Error('.console-detail-screen not found');
+        const mkTouch = (x: number): Touch =>
+          new Touch({
+            identifier: 1,
+            target: screen,
+            clientX: x,
+            clientY: 200,
+            pageX: x,
+            pageY: 200,
+          });
+        screen.dispatchEvent(
+          new TouchEvent('touchstart', {
+            bubbles: true,
+            cancelable: true,
+            touches: [mkTouch(from)],
+          }),
+        );
+        screen.dispatchEvent(
+          new TouchEvent('touchmove', {
+            bubbles: true,
+            cancelable: true,
+            touches: [mkTouch(to)],
+          }),
+        );
+        screen.dispatchEvent(
+          new TouchEvent('touchend', {
+            bubbles: true,
+            cancelable: true,
+            changedTouches: [mkTouch(to)],
+            touches: [],
+          }),
+        );
+      },
+      [fromX, toX] as [number, number],
+    );
+  };
+
+  await swipeDetailScreen(300, 100);
+  await expect(page).toHaveURL(/PVTI_lADOABCD1234zgTRI00692/, {
+    timeout: 3000,
+  });
+
+  await swipeDetailScreen(100, 300);
+  await expect(page).toHaveURL(/PVTI_lADOABCD1234zgTRI00778/, {
+    timeout: 3000,
+  });
+
+  await expect(page.locator('.console-composer-input')).toHaveValue(
+    'work in progress draft',
+  );
+});
+
 test('renders the stories tab with non-gray stories, their open item counts, and an add-task button', async ({
   page,
 }) => {
@@ -325,10 +399,19 @@ test('renders the stories tab with non-gray stories, their open item counts, and
     tdpmRow.locator('.console-op-button', { hasText: 'Add task' }),
   ).toBeVisible();
 
+  const tdpmLink = tdpmRow.locator('a.console-storytag');
+  await expect(tdpmLink).toBeVisible();
+  await expect(tdpmLink).toHaveAttribute(
+    'href',
+    'https://github.com/orgs/HiromiShikata/projects/6/views/1?sliceBy%5Bvalue%5D=TDPM%20Console%20port',
+  );
+
   const publishRow = page.locator('.console-story-list-row', {
     hasText: 'Publish product documentation site',
   });
   await expect(publishRow.locator('.console-story-count')).toHaveText('1');
+  await expect(publishRow.locator('a.console-storytag')).toHaveCount(0);
+  await expect(publishRow.locator('span.console-storytag')).toBeVisible();
 
   await expect(
     page.locator('.console-story-list-row', {

package/src/adapter/entry-points/console/ui/e2e/consoleTestHarness.ts

@@ -282,12 +282,15 @@ const CONSOLE_E2E_STORIES_SNAPSHOT = {
       storyOptionId: '1491051e',
       color: 'BLUE',
       openItemCount: 4,
+      storyViewUrl:
+        'https://github.com/orgs/HiromiShikata/projects/6/views/1?sliceBy%5Bvalue%5D=TDPM%20Console%20port',
     },
     {
       storyName: 'Publish product documentation site',
       storyOptionId: 'f7cd5cbc',
       color: 'GREEN',
       openItemCount: 1,
+      storyViewUrl: null,
     },
     {
       storyName: 'regular / WORKFLOW BLOCKER',

package/src/adapter/entry-points/console/ui/src/features/console/components/detail/ConsoleCommentComposer.stories.tsx

@@ -44,3 +44,10 @@ export const ComposerUploadFailure: Story = {
     },
   },
 };
+
+export const ComposerWithSavedDraft: Story = {
+  args: {
+    initiallyOpen: true,
+    initialDraft: 'Previously typed text…',
+  },
+};

package/src/adapter/entry-points/console/ui/src/features/console/components/detail/ConsoleCommentComposer.test.tsx

@@ -26,6 +26,53 @@ describe('ConsoleCommentComposer', () => {
     expect(getByPlaceholderText('Leave a comment…')).toBeInTheDocument();
   });
 
+  it('initializes the textarea with initialDraft when provided', () => {
+    const { getByPlaceholderText } = render(
+      <ConsoleCommentComposer
+        initiallyOpen
+        initialDraft="Previously typed text"
+        onSubmit={stubSubmit}
+      />,
+    );
+    expect(getByPlaceholderText('Leave a comment…')).toHaveValue(
+      'Previously typed text',
+    );
+  });
+
+  it('calls onDraftChange with every keystroke', () => {
+    const onDraftChange = jest.fn();
+    const { getByPlaceholderText } = render(
+      <ConsoleCommentComposer
+        initiallyOpen
+        onSubmit={stubSubmit}
+        onDraftChange={onDraftChange}
+      />,
+    );
+    fireEvent.change(getByPlaceholderText('Leave a comment…'), {
+      target: { value: 'hello' },
+    });
+    expect(onDraftChange).toHaveBeenCalledWith('hello');
+  });
+
+  it('calls onDraftChange with empty string after successful submission', async () => {
+    const onDraftChange = jest.fn();
+    const { getByPlaceholderText, getByText } = render(
+      <ConsoleCommentComposer
+        initiallyOpen
+        onSubmit={stubSubmit}
+        onDraftChange={onDraftChange}
+      />,
+    );
+    fireEvent.change(getByPlaceholderText('Leave a comment…'), {
+      target: { value: 'My comment' },
+    });
+    fireEvent.click(getByText('Comment'));
+    await waitFor(() => {
+      expect(getByPlaceholderText('Leave a comment…')).toHaveValue('');
+    });
+    expect(onDraftChange).toHaveBeenCalledWith('');
+  });
+
   it('offers the opening control and hides the form when it starts closed', () => {
     const { queryByPlaceholderText, getByText } = render(
       <ConsoleCommentComposer initiallyOpen={false} onSubmit={stubSubmit} />,

package/src/adapter/entry-points/console/ui/src/features/console/components/detail/ConsoleCommentComposer.tsx

@@ -1,9 +1,11 @@
-import { useRef, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import type { ConsoleComment } from '../../logic/types';
 
 export type ConsoleCommentComposerProps = {
   initiallyOpen: boolean;
+  initialDraft?: string;
   onSubmit: (body: string) => Promise<ConsoleComment>;
+  onDraftChange?: (draft: string) => void;
   onUploadFile?: (file: File) => Promise<string>;
 };
 
@@ -73,11 +75,16 @@ export const removePlaceholder = (draft: string, fileName: string): string => {
 
 export const ConsoleCommentComposer = ({
   initiallyOpen,
+  initialDraft,
   onSubmit,
+  onDraftChange,
   onUploadFile,
 }: ConsoleCommentComposerProps) => {
   const [open, setOpen] = useState<boolean>(initiallyOpen);
-  const [draft, setDraft] = useState<string>('');
+  const [draft, setDraft] = useState<string>(initialDraft ?? '');
+  useEffect(() => {
+    onDraftChange?.(draft);
+  }, [draft, onDraftChange]);
   const [status, setStatus] = useState<ComposerStatus>({ kind: 'idle' });
   const [uploadStatus, setUploadStatus] = useState<UploadStatus>({
     kind: 'idle',

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleStoryList.stories.tsx

@@ -1,39 +1,52 @@
 import type { Meta, StoryObj } from '@storybook/react-vite';
 import { ConsoleStoryList } from './ConsoleStoryList';
 
-const stories = [
+const storiesWithoutUrl = [
   {
     storyName: 'TDPM Console port',
     storyOptionId: '1491051e',
     color: 'BLUE' as const,
     openItemCount: 12,
+    storyViewUrl: null,
   },
   {
     storyName: 'Publish product documentation site',
     storyOptionId: 'f7cd5cbc',
     color: 'GREEN' as const,
     openItemCount: 3,
+    storyViewUrl: null,
   },
   {
     storyName: 'Move to Okinawa',
     storyOptionId: '564803ee',
     color: 'PURPLE' as const,
     openItemCount: 0,
+    storyViewUrl: null,
   },
   {
     storyName: 'regular / regular payment invoice tax',
     storyOptionId: 'd7cdcb61',
     color: 'YELLOW' as const,
     openItemCount: 7,
+    storyViewUrl: null,
   },
   {
     storyName: 'regular / WORKFLOW BLOCKER',
     storyOptionId: 'e35b3da2',
     color: 'RED' as const,
     openItemCount: 2,
+    storyViewUrl: null,
   },
 ];
 
+const BASE_VIEW_URL =
+  'https://github.com/orgs/HiromiShikata/projects/6/views/1';
+
+const storiesWithUrl = storiesWithoutUrl.map((s) => ({
+  ...s,
+  storyViewUrl: `${BASE_VIEW_URL}?sliceBy%5Bvalue%5D=${encodeURI(s.storyName).replace(/#/g, '%23').replace(/&/g, '%26')}`,
+}));
+
 const meta: Meta<typeof ConsoleStoryList> = {
   title: 'Console/ConsoleStoryList',
   component: ConsoleStoryList,
@@ -46,7 +59,15 @@ type Story = StoryObj<typeof ConsoleStoryList>;
 
 export const WithStories: Story = {
   args: {
-    stories,
+    stories: storiesWithoutUrl,
+    isLoading: false,
+    error: null,
+  },
+};
+
+export const WithStoriesLinked: Story = {
+  args: {
+    stories: storiesWithUrl,
     isLoading: false,
     error: null,
   },

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleStoryList.test.tsx

@@ -8,12 +8,14 @@ const storyEntries: ConsoleStoryEntry[] = [
     storyOptionId: '1491051e',
     color: 'BLUE',
     openItemCount: 12,
+    storyViewUrl: null,
   },
   {
     storyName: 'Move to Okinawa',
     storyOptionId: '564803ee',
     color: 'PURPLE',
     openItemCount: 0,
+    storyViewUrl: null,
   },
 ];
 
@@ -193,4 +195,62 @@ describe('ConsoleStoryList', () => {
     expect(getByRole('alert')).toBeInTheDocument();
     expect(getByText(/HTTP 503/)).toBeInTheDocument();
   });
+
+  it('renders story name as a span when storyViewUrl is absent (old JSON format)', () => {
+    const oldFormatEntry = {
+      storyName: 'TDPM Console port',
+      storyOptionId: '1491051e',
+      color: 'BLUE',
+      openItemCount: 4,
+    } as unknown as ConsoleStoryEntry;
+    const { getByText } = render(
+      <ConsoleStoryList
+        stories={[oldFormatEntry]}
+        isLoading={false}
+        error={null}
+        onCreateIssue={() => Promise.resolve()}
+      />,
+    );
+    const nameEl = getByText('TDPM Console port');
+    expect(nameEl.tagName).toBe('SPAN');
+  });
+
+  it('renders story name as a span when storyViewUrl is null', () => {
+    const { getByText } = render(
+      <ConsoleStoryList
+        stories={storyEntries}
+        isLoading={false}
+        error={null}
+        onCreateIssue={() => Promise.resolve()}
+      />,
+    );
+    const nameEl = getByText('TDPM Console port');
+    expect(nameEl.tagName).toBe('SPAN');
+  });
+
+  it('renders story name as an anchor when storyViewUrl is non-null', () => {
+    const entriesWithUrl: ConsoleStoryEntry[] = [
+      {
+        ...storyEntries[0],
+        storyViewUrl:
+          'https://github.com/orgs/demo/projects/1/views/1?sliceBy%5Bvalue%5D=TDPM%20Console%20port',
+      },
+    ];
+    const { getByText } = render(
+      <ConsoleStoryList
+        stories={entriesWithUrl}
+        isLoading={false}
+        error={null}
+        onCreateIssue={() => Promise.resolve()}
+      />,
+    );
+    const nameEl = getByText('TDPM Console port');
+    expect(nameEl.tagName).toBe('A');
+    expect(nameEl).toHaveAttribute(
+      'href',
+      'https://github.com/orgs/demo/projects/1/views/1?sliceBy%5Bvalue%5D=TDPM%20Console%20port',
+    );
+    expect(nameEl).toHaveAttribute('target', '_blank');
+    expect(nameEl).toHaveAttribute('rel', 'noopener noreferrer');
+  });
 });

package/src/adapter/entry-points/console/ui/src/features/console/components/list/ConsoleStoryList.tsx

@@ -129,16 +129,32 @@ export const ConsoleStoryList = ({
         return (
           <li key={entry.storyOptionId} className="console-story-list-row">
             <div className="console-story-list-row-main">
-              <span
-                className="console-storytag"
-                style={{ color: palette.fg, borderColor: palette.border }}
-              >
+              {entry.storyViewUrl ? (
+                <a
+                  href={entry.storyViewUrl}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="console-storytag"
+                  style={{ color: palette.fg, borderColor: palette.border }}
+                >
+                  <span
+                    className="console-story-dot"
+                    style={{ backgroundColor: palette.dot }}
+                  />
+                  {entry.storyName}
+                </a>
+              ) : (
                 <span
-                  className="console-story-dot"
-                  style={{ backgroundColor: palette.dot }}
-                />
-                {entry.storyName}
-              </span>
+                  className="console-storytag"
+                  style={{ color: palette.fg, borderColor: palette.border }}
+                >
+                  <span
+                    className="console-story-dot"
+                    style={{ backgroundColor: palette.dot }}
+                  />
+                  {entry.storyName}
+                </span>
+              )}
               <span className="console-story-count">{entry.openItemCount}</span>
               <button
                 type="button"

package/src/adapter/entry-points/console/ui/src/features/console/logic/types.ts

@@ -155,6 +155,7 @@ export type ConsoleStoryEntry = {
   storyOptionId: string;
   color: ConsoleColor;
   openItemCount: number;
+  storyViewUrl: string | null;
 };
 
 export type ConsoleTab = {

package/src/adapter/entry-points/console/ui/src/features/console/pages/ConsoleItemDetailContainer.tsx

@@ -42,6 +42,8 @@ export type ConsoleItemDetailContainerProps = {
   storyName: string | null;
   overlayStatus: ConsoleOverlayStatus | null;
   now: number;
+  initialCommentDraft?: string;
+  onCommentDraftChange?: (draft: string) => void;
   onQueueAction: (input: ConsoleQueueActionInput) => void;
 };
 
@@ -56,6 +58,8 @@ export const ConsoleItemDetailContainer = ({
   storyName,
   overlayStatus,
   now,
+  initialCommentDraft,
+  onCommentDraftChange,
   onQueueAction,
 }: ConsoleItemDetailContainerProps) => {
   const detail = useConsoleItemDetailData(caches, item);
@@ -198,7 +202,9 @@ export const ConsoleItemDetailContainer = ({
       commentComposer={
         <ConsoleCommentComposer
           initiallyOpen
+          initialDraft={initialCommentDraft}
           onSubmit={addComment}
+          onDraftChange={onCommentDraftChange}
           onUploadFile={(file) => operations.uploadAttachment(item, file)}
         />
       }

package/src/adapter/entry-points/console/ui/src/features/console/pages/ConsolePage.test.tsx

@@ -837,6 +837,68 @@ describe('ConsolePage comment composer isolation', () => {
   });
 });
 
+describe('ConsolePage draft preservation', () => {
+  beforeEach(() => {
+    localStorage.clear();
+    window.history.replaceState({}, '', '/projects/acme/prs?k=token');
+    const fetchMock = jest.fn(async (url: string, init?: RequestInit) => {
+      const listMatch = url.match(/\/projects\/[^/]+\/([^/]+)\/list\.json/);
+      if (listMatch !== null) {
+        return {
+          ok: true,
+          status: 200,
+          json: async () =>
+            listMatch[1] === 'prs'
+              ? twoItemPrPayload()
+              : { ...twoItemPrPayload(), items: [] },
+        };
+      }
+      void init;
+      return { ok: true, status: 200, json: async () => ({ body: '# body' }) };
+    });
+    global.fetch = fetchMock as unknown as typeof fetch;
+  });
+
+  it('restores the typed text when returning to a task after navigating away', async () => {
+    const { container, getByText, findByText, getByPlaceholderText } = render(
+      <ConsolePage />,
+    );
+    await waitFor(() => {
+      expect(getByText('Add serveConsole subcommand')).toBeInTheDocument();
+    });
+
+    fireEvent.click(getByText('Add serveConsole subcommand'));
+    expect(await findByText('Approve & Merge')).toBeInTheDocument();
+
+    fireEvent.change(getByPlaceholderText('Leave a comment…'), {
+      target: { value: 'work in progress' },
+    });
+
+    const detailScreen = container.querySelector('.console-detail-screen');
+    expect(detailScreen).not.toBeNull();
+
+    swipeDetailScreen(
+      detailScreen as HTMLElement,
+      { clientX: 240, clientY: 100 },
+      { clientX: 40, clientY: 110 },
+    );
+    await waitFor(() => {
+      expect(window.location.hash).toBe('#item/PVTI_2');
+    });
+
+    swipeDetailScreen(
+      detailScreen as HTMLElement,
+      { clientX: 40, clientY: 100 },
+      { clientX: 240, clientY: 110 },
+    );
+    await waitFor(() => {
+      expect(getByPlaceholderText('Leave a comment…')).toHaveValue(
+        'work in progress',
+      );
+    });
+  });
+});
+
 describe('ConsolePage auto-advance tab', () => {
   beforeEach(() => {
     localStorage.clear();

package/src/adapter/entry-points/console/ui/src/features/console/pages/ConsolePage.tsx

@@ -112,6 +112,19 @@ export const ConsolePage = () => {
   const { activeTab, selectedItemKey, openItem, closeItem, selectTab } =
     navigation;
 
+  const commentDrafts = useRef(new Map<string, string>());
+  const handleCommentDraftChange = useCallback(
+    (draft: string) => {
+      if (selectedItemKey === null) return;
+      if (draft) {
+        commentDrafts.current.set(selectedItemKey, draft);
+      } else {
+        commentDrafts.current.delete(selectedItemKey);
+      }
+    },
+    [selectedItemKey],
+  );
+
   const caches = useConsoleCaches();
   const operations = useConsoleOperations(
     pjcode,
@@ -441,6 +454,10 @@ export const ConsolePage = () => {
             storyName={storyNameForSelected}
             overlayStatus={overlayStatusForSelected}
             now={now}
+            initialCommentDraft={
+              commentDrafts.current.get(selectedItem.projectItemId) ?? ''
+            }
+            onCommentDraftChange={handleCommentDraftChange}
             onQueueAction={handleQueueAction}
           />
         </div>