github-issue-tower-defence-management 2.12.1 → 2.13.0

package/bin/adapter/entry-points/console/ui-dist/index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>TDPM Console</title>
-    <script type="module" crossorigin src="/assets/index-D6QOQvoN.js"></script>
+    <script type="module" crossorigin src="/assets/index-BTFgj8n5.js"></script>
     <link rel="stylesheet" crossorigin href="/assets/index-CLHvrafO.css">
   </head>
   <body>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "github-issue-tower-defence-management",
-  "version": "2.12.1",
+  "version": "2.13.0",
   "description": "",
   "main": "bin/index.js",
   "scripts": {

package/src/adapter/entry-points/console/ui/src/features/console/components/operations/ConsoleOfflinePendingActionsPanel.stories.tsx

@@ -0,0 +1,115 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+import { ConsoleOfflinePendingActionsPanel } from './ConsoleOfflinePendingActionsPanel';
+
+const approveAction = {
+  id: 'offline-1',
+  message: 'Approved — PR #851',
+  color: 'green' as const,
+  itemNumber: 851,
+  isPr: true,
+  currentTitle: 'Add serveConsole subcommand under entry-points',
+  currentState: 'open' as const,
+  currentPrStatus: {
+    found: true,
+    isConflicted: false,
+    mergeableStatus: 'MERGEABLE' as const,
+    isPassedAllCiJob: true,
+    isCiStateSuccess: true,
+    isBranchOutOfDate: false,
+    missingRequiredCheckNames: [],
+  },
+  fetchError: false,
+};
+
+const rejectAction = {
+  id: 'offline-2',
+  message: 'Rejected — PR #853',
+  color: 'amber' as const,
+  itemNumber: 853,
+  isPr: true,
+  currentTitle: 'Add server-side console API handlers',
+  currentState: 'open' as const,
+  currentPrStatus: {
+    found: true,
+    isConflicted: true,
+    mergeableStatus: 'CONFLICTING' as const,
+    isPassedAllCiJob: false,
+    isCiStateSuccess: false,
+    isBranchOutOfDate: true,
+    missingRequiredCheckNames: ['test', 'build'],
+  },
+  fetchError: false,
+};
+
+const meta: Meta<typeof ConsoleOfflinePendingActionsPanel> = {
+  title: 'Console/ConsoleOfflinePendingActionsPanel',
+  component: ConsoleOfflinePendingActionsPanel,
+  args: {
+    isOnline: true,
+    isConfirming: false,
+    onConfirm: () => {},
+    onDiscard: () => {},
+  },
+};
+
+export default meta;
+
+type Story = StoryObj<typeof ConsoleOfflinePendingActionsPanel>;
+
+export const SingleActionOnline: Story = {
+  args: {
+    actions: [approveAction],
+    isOnline: true,
+  },
+};
+
+export const MultipleActionsOnline: Story = {
+  args: {
+    actions: [approveAction, rejectAction],
+    isOnline: true,
+  },
+};
+
+export const LoadingCurrentState: Story = {
+  args: {
+    actions: [
+      {
+        ...approveAction,
+        currentTitle: null,
+        currentState: null,
+        currentPrStatus: null,
+      },
+    ],
+    isOnline: true,
+  },
+};
+
+export const FetchError: Story = {
+  args: {
+    actions: [
+      {
+        ...approveAction,
+        currentTitle: null,
+        currentState: null,
+        currentPrStatus: null,
+        fetchError: true,
+      },
+    ],
+    isOnline: true,
+  },
+};
+
+export const OfflineWithQueuedActions: Story = {
+  args: {
+    actions: [approveAction, rejectAction],
+    isOnline: false,
+  },
+};
+
+export const ConfirmingInProgress: Story = {
+  args: {
+    actions: [approveAction],
+    isOnline: true,
+    isConfirming: true,
+  },
+};

package/src/adapter/entry-points/console/ui/src/features/console/components/operations/ConsoleOfflinePendingActionsPanel.test.tsx

@@ -0,0 +1,262 @@
+import { fireEvent, render } from '@testing-library/react';
+import {
+  type ConsoleOfflinePendingActionItem,
+  ConsoleOfflinePendingActionsPanel,
+} from './ConsoleOfflinePendingActionsPanel';
+
+const approveAction: ConsoleOfflinePendingActionItem = {
+  id: 'offline-1',
+  message: 'Approved — PR #851',
+  color: 'green',
+  itemNumber: 851,
+  isPr: true,
+  currentTitle: 'Add serveConsole subcommand under entry-points',
+  currentState: 'open',
+  currentPrStatus: null,
+  fetchError: false,
+};
+
+const baseProps = {
+  actions: [approveAction],
+  isOnline: true,
+  isConfirming: false,
+  onConfirm: () => {},
+  onDiscard: () => {},
+};
+
+describe('ConsoleOfflinePendingActionsPanel', () => {
+  it('renders nothing when the action list is empty', () => {
+    const { container } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} actions={[]} />,
+    );
+    expect(container.firstChild).toBeNull();
+  });
+
+  it('shows the action count and a confirm-before-sending message when online', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} />,
+    );
+    expect(getByText(/1 action held/)).toBeInTheDocument();
+    expect(getByText(/confirm each before sending/)).toBeInTheDocument();
+  });
+
+  it('shows an awaiting-connectivity message when offline', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} isOnline={false} />,
+    );
+    expect(getByText(/awaiting connectivity/)).toBeInTheDocument();
+  });
+
+  it('shows per-action rows with item target when offline', () => {
+    const { getByText, queryByText } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} isOnline={false} />,
+    );
+    expect(getByText(/PR #851 — Add serveConsole/)).toBeInTheDocument();
+    expect(getByText('Approved — PR #851')).toBeInTheDocument();
+    expect(queryByText('Send')).not.toBeInTheDocument();
+  });
+
+  it('shows Discard button even when offline', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} isOnline={false} />,
+    );
+    expect(getByText('Discard')).toBeInTheDocument();
+  });
+
+  it('shows the action message and item label when online', () => {
+    const { getByText, container } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} />,
+    );
+    expect(getByText('Approved — PR #851')).toBeInTheDocument();
+    expect(
+      container.querySelector('.console-offline-panel-item-target')
+        ?.textContent,
+    ).toContain('PR #851');
+  });
+
+  it('shows the current item title and state when loaded', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} />,
+    );
+    expect(
+      getByText(/Add serveConsole subcommand under entry-points/),
+    ).toBeInTheDocument();
+    expect(getByText(/open/)).toBeInTheDocument();
+  });
+
+  it('shows a loading indicator when the current state is not yet fetched', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        actions={[{ ...approveAction, currentTitle: null, currentState: null }]}
+      />,
+    );
+    expect(getByText(/loading current state/)).toBeInTheDocument();
+  });
+
+  it('disables the Send button while the current state is loading', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        actions={[{ ...approveAction, currentTitle: null, currentState: null }]}
+      />,
+    );
+    expect(getByText('Send')).toBeDisabled();
+  });
+
+  it('enables the Send button once the current state is loaded', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} />,
+    );
+    expect(getByText('Send')).not.toBeDisabled();
+  });
+
+  it('enables the Send button when the state fetch failed so the operator can still proceed', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        actions={[
+          {
+            ...approveAction,
+            currentTitle: null,
+            currentState: null,
+            fetchError: true,
+          },
+        ]}
+      />,
+    );
+    expect(getByText('Send')).not.toBeDisabled();
+  });
+
+  it('shows a fetch error message when the state could not be loaded', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        actions={[
+          {
+            ...approveAction,
+            currentTitle: null,
+            currentState: null,
+            fetchError: true,
+          },
+        ]}
+      />,
+    );
+    expect(getByText(/Failed to load current state/)).toBeInTheDocument();
+  });
+
+  it('disables the Send button while a confirmation is in progress', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} isConfirming={true} />,
+    );
+    expect(getByText('Send')).toBeDisabled();
+  });
+
+  it('calls onConfirm with the action id when Send is clicked', () => {
+    const onConfirm = jest.fn();
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        onConfirm={onConfirm}
+      />,
+    );
+    fireEvent.click(getByText('Send'));
+    expect(onConfirm).toHaveBeenCalledWith('offline-1');
+  });
+
+  it('calls onDiscard with the action id when Discard is clicked', () => {
+    const onDiscard = jest.fn();
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        onDiscard={onDiscard}
+      />,
+    );
+    fireEvent.click(getByText('Discard'));
+    expect(onDiscard).toHaveBeenCalledWith('offline-1');
+  });
+
+  it('uses plural phrasing for the count when more than one action is queued', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        actions={[
+          approveAction,
+          { ...approveAction, id: 'offline-2', message: 'Rejected — PR #853' },
+        ]}
+      />,
+    );
+    expect(getByText(/2 actions held/)).toBeInTheDocument();
+  });
+
+  it('renders a Send and Discard button for each queued action when online', () => {
+    const { getAllByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        actions={[
+          approveAction,
+          { ...approveAction, id: 'offline-2', message: 'Rejected — PR #853' },
+        ]}
+      />,
+    );
+    expect(getAllByText('Send')).toHaveLength(2);
+    expect(getAllByText('Discard')).toHaveLength(2);
+  });
+
+  it('applies the color modifier class to the action row', () => {
+    const { container } = render(
+      <ConsoleOfflinePendingActionsPanel {...baseProps} />,
+    );
+    expect(
+      container.querySelector('.console-offline-panel-item-green'),
+    ).toBeInTheDocument();
+  });
+
+  it('shows PR status information when the action targets a PR and status is loaded', () => {
+    const { getByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        actions={[
+          {
+            ...approveAction,
+            currentPrStatus: {
+              found: true,
+              isConflicted: false,
+              mergeableStatus: 'MERGEABLE',
+              isPassedAllCiJob: true,
+              isCiStateSuccess: true,
+              isBranchOutOfDate: false,
+              missingRequiredCheckNames: [],
+            },
+          },
+        ]}
+      />,
+    );
+    expect(getByText(/CI: pass/)).toBeInTheDocument();
+    expect(getByText(/Merge: mergeable/)).toBeInTheDocument();
+  });
+
+  it('does not show PR status when offline even if currentPrStatus is set', () => {
+    const { queryByText } = render(
+      <ConsoleOfflinePendingActionsPanel
+        {...baseProps}
+        isOnline={false}
+        actions={[
+          {
+            ...approveAction,
+            currentPrStatus: {
+              found: true,
+              isConflicted: false,
+              mergeableStatus: 'MERGEABLE',
+              isPassedAllCiJob: true,
+              isCiStateSuccess: true,
+              isBranchOutOfDate: false,
+              missingRequiredCheckNames: [],
+            },
+          },
+        ]}
+      />,
+    );
+    expect(queryByText(/CI: pass/)).not.toBeInTheDocument();
+  });
+});

package/src/adapter/entry-points/console/ui/src/features/console/components/operations/ConsoleOfflinePendingActionsPanel.tsx

@@ -0,0 +1,123 @@
+import type { ConsoleToastColor } from '../../logic/actionToast';
+import type { ConsolePullRequestStatus } from '../../logic/types';
+
+export type ConsoleOfflinePendingActionItem = {
+  id: string;
+  message: string;
+  color: ConsoleToastColor;
+  itemNumber: number;
+  isPr: boolean;
+  currentTitle: string | null;
+  currentState: 'open' | 'closed' | null;
+  currentPrStatus: ConsolePullRequestStatus | null;
+  fetchError: boolean;
+};
+
+export type ConsoleOfflinePendingActionsPanelProps = {
+  actions: ConsoleOfflinePendingActionItem[];
+  isOnline: boolean;
+  isConfirming: boolean;
+  onConfirm: (id: string) => void;
+  onDiscard: (id: string) => void;
+};
+
+const itemLabel = (item: ConsoleOfflinePendingActionItem): string =>
+  `${item.isPr ? 'PR' : 'Issue'} #${item.itemNumber}`;
+
+const stateLabel = (state: 'open' | 'closed' | null): string => {
+  if (state === null) return 'loading…';
+  return state;
+};
+
+const prStatusLabel = (prStatus: ConsolePullRequestStatus): string => {
+  const parts: string[] = [];
+  parts.push(`CI: ${prStatus.isCiStateSuccess ? 'pass' : 'fail'}`);
+  parts.push(`Merge: ${prStatus.mergeableStatus.toLowerCase()}`);
+  if (prStatus.isBranchOutOfDate) {
+    parts.push('branch out of date');
+  }
+  return parts.join(' · ');
+};
+
+const targetText = (action: ConsoleOfflinePendingActionItem): string => {
+  if (action.fetchError) {
+    return `${itemLabel(action)} — failed to load current state`;
+  }
+  if (action.currentTitle === null) {
+    return `${itemLabel(action)} — loading current state…`;
+  }
+  return `${itemLabel(action)} — ${action.currentTitle} (${stateLabel(action.currentState)})`;
+};
+
+export const ConsoleOfflinePendingActionsPanel = ({
+  actions,
+  isOnline,
+  isConfirming,
+  onConfirm,
+  onDiscard,
+}: ConsoleOfflinePendingActionsPanelProps) => {
+  if (actions.length === 0) return null;
+
+  return (
+    <section
+      className="console-offline-panel"
+      aria-label="Offline actions queue"
+    >
+      <div className="console-offline-panel-header">
+        {actions.length} action{actions.length !== 1 ? 's' : ''} held
+        {isOnline
+          ? ' — confirm each before sending'
+          : ' — awaiting connectivity'}
+      </div>
+      {actions.map((action) => (
+        <div
+          key={action.id}
+          className={`console-offline-panel-item console-offline-panel-item-${action.color}`}
+        >
+          <div className="console-offline-panel-item-message">
+            {action.message}
+          </div>
+          <div className="console-offline-panel-item-target">
+            {targetText(action)}
+          </div>
+          {action.fetchError && (
+            <div className="console-offline-panel-item-fetch-error">
+              Failed to load current state — sending will act on the last known
+              state
+            </div>
+          )}
+          {isOnline &&
+            action.isPr &&
+            action.currentPrStatus !== null &&
+            !action.fetchError && (
+              <div className="console-offline-panel-item-pr-status">
+                {prStatusLabel(action.currentPrStatus)}
+              </div>
+            )}
+          <div className="console-offline-panel-item-controls">
+            {isOnline && (
+              <button
+                type="button"
+                className="console-offline-panel-confirm"
+                disabled={
+                  isConfirming ||
+                  (action.currentTitle === null && !action.fetchError)
+                }
+                onClick={() => onConfirm(action.id)}
+              >
+                Send
+              </button>
+            )}
+            <button
+              type="button"
+              className="console-offline-panel-discard"
+              onClick={() => onDiscard(action.id)}
+            >
+              Discard
+            </button>
+          </div>
+        </div>
+      ))}
+    </section>
+  );
+};