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

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

@@ -399,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/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 = {