github-issue-tower-defence-management 1.143.5 → 1.144.0

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

@@ -1,6 +1,9 @@
 import { fireEvent, render, waitFor } from '@testing-library/react';
 import type { ConsoleComment } from '../../logic/types';
-import { ConsoleCommentComposer } from './ConsoleCommentComposer';
+import {
+  appendAttachmentMarkdown,
+  ConsoleCommentComposer,
+} from './ConsoleCommentComposer';
 
 jest.mock('../../lib/mermaidLoader', () => ({
   renderMermaidToSvg: jest.fn(async () => '<svg></svg>'),
@@ -78,4 +81,149 @@ describe('ConsoleCommentComposer', () => {
     const alert = await findByRole('alert');
     expect(alert.textContent).toContain('HTTP 500');
   });
+
+  it('does not render the attach control when no upload handler is given', () => {
+    const { queryByText } = render(
+      <ConsoleCommentComposer
+        isPr={false}
+        now={now}
+        onSubmit={async (body) => ({
+          author: 'HiromiShikata',
+          body,
+          createdAt: '2026-06-19T11:58:00.000Z',
+        })}
+      />,
+    );
+    expect(queryByText('📎 Attach files')).toBeNull();
+  });
+
+  it('uploads a selected file and inserts the returned markdown into the draft', async () => {
+    const onUploadFile = jest.fn(
+      async () => '![shot](https://github.com/user-attachments/assets/abc)',
+    );
+    const { getByPlaceholderText, getByLabelText } = render(
+      <ConsoleCommentComposer
+        isPr={false}
+        now={now}
+        onSubmit={async (body) => ({
+          author: 'HiromiShikata',
+          body,
+          createdAt: '2026-06-19T11:58:00.000Z',
+        })}
+        onUploadFile={onUploadFile}
+      />,
+    );
+    const textarea = getByPlaceholderText(
+      'Leave a comment…',
+    ) as HTMLTextAreaElement;
+    fireEvent.change(textarea, { target: { value: 'See the screen:' } });
+    const file = new File(['binary'], 'shot.png', { type: 'image/png' });
+    fireEvent.change(getByLabelText('Attach files'), {
+      target: { files: [file] },
+    });
+    await waitFor(() => {
+      expect(textarea.value).toBe(
+        'See the screen:\n![shot](https://github.com/user-attachments/assets/abc)\n',
+      );
+    });
+    expect(onUploadFile).toHaveBeenCalledWith(file);
+  });
+
+  it('uploads a pasted file', async () => {
+    const onUploadFile = jest.fn(
+      async () => '![pasted](https://github.com/user-attachments/assets/def)',
+    );
+    const { getByPlaceholderText } = render(
+      <ConsoleCommentComposer
+        isPr={false}
+        now={now}
+        onSubmit={async (body) => ({
+          author: 'HiromiShikata',
+          body,
+          createdAt: '2026-06-19T11:58:00.000Z',
+        })}
+        onUploadFile={onUploadFile}
+      />,
+    );
+    const textarea = getByPlaceholderText(
+      'Leave a comment…',
+    ) as HTMLTextAreaElement;
+    const file = new File(['binary'], 'pasted.png', { type: 'image/png' });
+    fireEvent.paste(textarea, { clipboardData: { files: [file] } });
+    await waitFor(() => {
+      expect(textarea.value).toBe(
+        '![pasted](https://github.com/user-attachments/assets/def)\n',
+      );
+    });
+    expect(onUploadFile).toHaveBeenCalledWith(file);
+  });
+
+  it('uploads a dropped file', async () => {
+    const onUploadFile = jest.fn(
+      async () => '![dropped](https://github.com/user-attachments/assets/ghi)',
+    );
+    const { getByPlaceholderText } = render(
+      <ConsoleCommentComposer
+        isPr={false}
+        now={now}
+        onSubmit={async (body) => ({
+          author: 'HiromiShikata',
+          body,
+          createdAt: '2026-06-19T11:58:00.000Z',
+        })}
+        onUploadFile={onUploadFile}
+      />,
+    );
+    const textarea = getByPlaceholderText(
+      'Leave a comment…',
+    ) as HTMLTextAreaElement;
+    const file = new File(['binary'], 'dropped.png', { type: 'image/png' });
+    fireEvent.drop(textarea, { dataTransfer: { files: [file] } });
+    await waitFor(() => {
+      expect(textarea.value).toBe(
+        '![dropped](https://github.com/user-attachments/assets/ghi)\n',
+      );
+    });
+    expect(onUploadFile).toHaveBeenCalledWith(file);
+  });
+
+  it('shows the upload failure reason when the upload rejects', async () => {
+    const { getByLabelText, findByRole } = render(
+      <ConsoleCommentComposer
+        isPr={false}
+        now={now}
+        onSubmit={async (body) => ({
+          author: 'HiromiShikata',
+          body,
+          createdAt: '2026-06-19T11:58:00.000Z',
+        })}
+        onUploadFile={async () => {
+          throw new Error('No GitHub web session is available');
+        }}
+      />,
+    );
+    fireEvent.change(getByLabelText('Attach files'), {
+      target: { files: [new File(['x'], 'shot.png', { type: 'image/png' })] },
+    });
+    const alert = await findByRole('alert');
+    expect(alert.textContent).toContain('No GitHub web session is available');
+  });
+});
+
+describe('appendAttachmentMarkdown', () => {
+  it('returns the markdown alone when the draft is empty', () => {
+    expect(appendAttachmentMarkdown('', '![a](b)')).toBe('![a](b)\n');
+  });
+
+  it('adds a separating newline when the draft does not end with one', () => {
+    expect(appendAttachmentMarkdown('hello', '![a](b)')).toBe(
+      'hello\n![a](b)\n',
+    );
+  });
+
+  it('does not add a second newline when the draft already ends with one', () => {
+    expect(appendAttachmentMarkdown('hello\n', '![a](b)')).toBe(
+      'hello\n![a](b)\n',
+    );
+  });
 });

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

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 import {
   formatFullTimestamp,
   formatRelativeTime,
@@ -10,6 +10,7 @@ export type ConsoleCommentComposerProps = {
   isPr: boolean;
   now: number;
   onSubmit: (body: string) => Promise<ConsoleComment>;
+  onUploadFile?: (file: File) => Promise<string>;
 };
 
 type ComposerStatus =
@@ -17,15 +18,38 @@ type ComposerStatus =
   | { kind: 'posting' }
   | { kind: 'error'; message: string };
 
+type UploadStatus =
+  | { kind: 'idle' }
+  | { kind: 'uploading'; fileName: string }
+  | { kind: 'error'; message: string };
+
+export const appendAttachmentMarkdown = (
+  draft: string,
+  markdown: string,
+): string => {
+  if (draft.length === 0) {
+    return `${markdown}\n`;
+  }
+  if (draft.endsWith('\n')) {
+    return `${draft}${markdown}\n`;
+  }
+  return `${draft}\n${markdown}\n`;
+};
+
 export const ConsoleCommentComposer = ({
   isPr,
   now,
   onSubmit,
+  onUploadFile,
 }: ConsoleCommentComposerProps) => {
   const [open, setOpen] = useState<boolean>(!isPr);
   const [draft, setDraft] = useState<string>('');
   const [status, setStatus] = useState<ComposerStatus>({ kind: 'idle' });
+  const [uploadStatus, setUploadStatus] = useState<UploadStatus>({
+    kind: 'idle',
+  });
   const [posted, setPosted] = useState<ConsoleComment[]>([]);
+  const fileInputRef = useRef<HTMLInputElement | null>(null);
 
   const submit = async (): Promise<void> => {
     const body = draft.trim();
@@ -46,6 +70,27 @@ export const ConsoleCommentComposer = ({
     }
   };
 
+  const uploadFiles = async (files: File[]): Promise<void> => {
+    if (onUploadFile === undefined || files.length === 0) {
+      return;
+    }
+    for (const file of files) {
+      setUploadStatus({ kind: 'uploading', fileName: file.name });
+      try {
+        const markdown = await onUploadFile(file);
+        setDraft((previous) => appendAttachmentMarkdown(previous, markdown));
+        setUploadStatus({ kind: 'idle' });
+      } catch (error) {
+        setUploadStatus({
+          kind: 'error',
+          message:
+            error instanceof Error ? error.message : 'failed to upload file',
+        });
+        return;
+      }
+    }
+  };
+
   return (
     <div className="console-composer">
       <button
@@ -87,7 +132,68 @@ export const ConsoleCommentComposer = ({
             placeholder="Leave a comment…"
             value={draft}
             onChange={(event) => setDraft(event.target.value)}
+            onDragOver={(event) => {
+              if (onUploadFile === undefined) {
+                return;
+              }
+              event.preventDefault();
+            }}
+            onDrop={(event) => {
+              if (onUploadFile === undefined) {
+                return;
+              }
+              event.preventDefault();
+              void uploadFiles(Array.from(event.dataTransfer.files));
+            }}
+            onPaste={(event) => {
+              if (onUploadFile === undefined) {
+                return;
+              }
+              const files = Array.from(event.clipboardData.files);
+              if (files.length === 0) {
+                return;
+              }
+              event.preventDefault();
+              void uploadFiles(files);
+            }}
           />
+          {onUploadFile !== undefined && (
+            <div className="console-composer-attach">
+              <input
+                ref={fileInputRef}
+                type="file"
+                multiple
+                className="console-composer-file-input"
+                aria-label="Attach files"
+                onChange={(event) => {
+                  const files = Array.from(event.target.files ?? []);
+                  event.target.value = '';
+                  void uploadFiles(files);
+                }}
+              />
+              <button
+                type="button"
+                className="console-composer-attach-button"
+                disabled={uploadStatus.kind === 'uploading'}
+                onClick={() => fileInputRef.current?.click()}
+              >
+                📎 Attach files
+              </button>
+              {uploadStatus.kind === 'uploading' && (
+                <span className="console-composer-status">
+                  Uploading {uploadStatus.fileName}…
+                </span>
+              )}
+              {uploadStatus.kind === 'error' && (
+                <span
+                  role="alert"
+                  className="console-composer-status console-composer-error"
+                >
+                  Upload failed: {uploadStatus.message}
+                </span>
+              )}
+            </div>
+          )}
           <div className="console-composer-row">
             {status.kind === 'posting' && (
               <span className="console-composer-status">Posting…</span>

package/src/adapter/entry-points/console/ui/src/features/console/hooks/useConsoleOperations.ts

@@ -4,6 +4,8 @@ import {
   type ConsoleReviewCommentSide,
   type ConsoleReviewRequest,
   type ConsoleTriageRequest,
+  encodeAttachmentContent,
+  postConsoleAttachment,
   postConsoleComment,
   postConsoleOperation,
   postConsoleReviewComment,
@@ -59,6 +61,7 @@ export type ConsoleOperationsApi = {
     action: ConsoleCloseAction,
   ) => Promise<void>;
   addComment: (item: ConsoleListItem, body: string) => Promise<ConsoleComment>;
+  uploadAttachment: (item: ConsoleListItem, file: File) => Promise<string>;
   addInlineReviewComment: (
     prUrl: string,
     path: string,
@@ -286,6 +289,24 @@ export const useConsoleOperations = (
     [pjcode, invalidateItemContent],
   );
 
+  const uploadAttachment = useCallback(
+    async (item: ConsoleListItem, file: File) => {
+      if (pjcode === null) {
+        throw new Error('no project in the URL path');
+      }
+      const contentBase64 = encodeAttachmentContent(
+        new Uint8Array(await file.arrayBuffer()),
+      );
+      return postConsoleAttachment({
+        pjcode,
+        url: item.url,
+        fileName: file.name,
+        contentBase64,
+      });
+    },
+    [pjcode],
+  );
+
   const addInlineReviewComment = useCallback(
     async (
       prUrl: string,
@@ -317,6 +338,7 @@ export const useConsoleOperations = (
     setInTmuxByHuman,
     closeIssue,
     addComment,
+    uploadAttachment,
     addInlineReviewComment,
   };
 };

package/src/adapter/entry-points/console/ui/src/features/console/hooks/useConsoleTabData.test.ts

@@ -1,6 +1,9 @@
-import { renderHook, waitFor } from '@testing-library/react';
+import { act, renderHook, waitFor } from '@testing-library/react';
 import { CONSOLE_TABS } from '../logic/types';
-import { useConsoleTabData } from './useConsoleTabData';
+import {
+  CONSOLE_TAB_REFRESH_INTERVAL_MS,
+  useConsoleTabData,
+} from './useConsoleTabData';
 
 describe('useConsoleTabData', () => {
   beforeEach(() => {
@@ -38,6 +41,42 @@ describe('useConsoleTabData', () => {
     );
   });
 
+  it('drops an item that disappeared from the snapshot after the refresh interval', async () => {
+    jest.useFakeTimers();
+    let closed = false;
+    const fetchMock = jest.fn(async (url: string) => ({
+      ok: true,
+      status: 200,
+      json: async () => ({
+        pjcode: 'umino',
+        generatedAt: '2026-06-19T00:00:00.000Z',
+        statusOptions: [],
+        storyColors: {},
+        items:
+          url.includes('/prs/') && !closed
+            ? [{ number: 1, itemId: 'PVTI_1', projectItemId: 'PVTI_1' }]
+            : [],
+      }),
+    }));
+    global.fetch = fetchMock as unknown as typeof fetch;
+
+    const { result } = renderHook(() => useConsoleTabData('umino'));
+    await waitFor(() => {
+      expect(result.current.snapshots.prs?.items.length).toBe(1);
+    });
+
+    closed = true;
+    await act(async () => {
+      jest.advanceTimersByTime(CONSOLE_TAB_REFRESH_INTERVAL_MS);
+    });
+
+    await waitFor(() => {
+      expect(result.current.snapshots.prs?.items.length).toBe(0);
+    });
+    expect(fetchMock.mock.calls.length).toBe(CONSOLE_TABS.length * 2);
+    jest.useRealTimers();
+  });
+
   it('surfaces an error when a tab fetch fails', async () => {
     const fetchMock = jest.fn(async () => ({
       ok: false,

package/src/adapter/entry-points/console/ui/src/features/console/hooks/useConsoleTabData.ts

@@ -66,6 +66,28 @@ const emptySnapshots = (): Record<
 const buildListUrl = (pjcode: string, tab: ConsoleTabName): string =>
   `/projects/${pjcode}/${tab}/list.json`;
 
+export const CONSOLE_TAB_REFRESH_INTERVAL_MS = 60000;
+
+const fetchSnapshots = async (
+  pjcode: string,
+): Promise<Record<ConsoleTabName, ConsoleTabSnapshot | null>> => {
+  const entries = await Promise.all(
+    CONSOLE_TABS.map(async (tab) => {
+      const response = await fetch(buildListUrl(pjcode, tab.name));
+      if (!response.ok) {
+        throw new Error(`HTTP ${response.status}`);
+      }
+      const payload: unknown = await response.json();
+      return [tab.name, parseSnapshot(payload)] as const;
+    }),
+  );
+  const next = emptySnapshots();
+  for (const [name, snapshot] of entries) {
+    next[name] = snapshot;
+  }
+  return next;
+};
+
 export const useConsoleTabData = (
   pjcode: string | null,
 ): ConsoleTabDataState => {
@@ -88,37 +110,31 @@ export const useConsoleTabData = (
       };
     }
 
-    Promise.all(
-      CONSOLE_TABS.map(async (tab) => {
-        const response = await fetch(buildListUrl(pjcode, tab.name));
-        if (!response.ok) {
-          throw new Error(`HTTP ${response.status}`);
-        }
-        const payload: unknown = await response.json();
-        return [tab.name, parseSnapshot(payload)] as const;
-      }),
-    )
-      .then((entries) => {
-        if (cancelled) {
-          return;
-        }
-        const next = emptySnapshots();
-        for (const [name, snapshot] of entries) {
-          next[name] = snapshot;
-        }
-        setSnapshots(next);
-        setIsLoading(false);
-      })
-      .catch((cause: unknown) => {
-        if (cancelled) {
-          return;
-        }
-        setError(cause instanceof Error ? cause.message : String(cause));
-        setIsLoading(false);
-      });
+    const load = (): void => {
+      fetchSnapshots(pjcode)
+        .then((next) => {
+          if (cancelled) {
+            return;
+          }
+          setSnapshots(next);
+          setError(null);
+          setIsLoading(false);
+        })
+        .catch((cause: unknown) => {
+          if (cancelled) {
+            return;
+          }
+          setError(cause instanceof Error ? cause.message : String(cause));
+          setIsLoading(false);
+        });
+    };
+
+    load();
+    const timer = setInterval(load, CONSOLE_TAB_REFRESH_INTERVAL_MS);
 
     return () => {
       cancelled = true;
+      clearInterval(timer);
     };
   }, [pjcode]);
 

package/src/adapter/entry-points/console/ui/src/features/console/lib/consoleApi.ts

@@ -288,6 +288,41 @@ export const postConsoleComment = async (
   return parsePostedComment(await response.json());
 };
 
+export const ATTACHMENT_UPLOAD_OPERATION_PATH = '/api/upload';
+
+export type ConsoleAttachmentUploadRequest = {
+  pjcode: string;
+  url: string;
+  fileName: string;
+  contentBase64: string;
+};
+
+export const encodeAttachmentContent = (bytes: Uint8Array): string => {
+  let binary = '';
+  for (const byte of bytes) {
+    binary += String.fromCharCode(byte);
+  }
+  return btoa(binary);
+};
+
+export const postConsoleAttachment = async (
+  request: ConsoleAttachmentUploadRequest,
+): Promise<string> => {
+  const response = await fetch(ATTACHMENT_UPLOAD_OPERATION_PATH, {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify(request),
+  });
+  if (!response.ok) {
+    throw new Error(await readOperationErrorReason(response));
+  }
+  const payload: unknown = await response.json();
+  if (!isRecord(payload) || typeof payload.markdown !== 'string') {
+    throw new Error('markdown was not returned');
+  }
+  return payload.markdown;
+};
+
 export const REVIEW_COMMENT_OPERATION_PATH = '/api/reviewcomment';
 
 export const postConsoleReviewComment = async (

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

@@ -75,6 +75,7 @@ const buildOperations = (): ConsoleOperationsApi => ({
     body: 'comment body',
     createdAt: '2026-06-19T11:58:00.000Z',
   })),
+  uploadAttachment: jest.fn(async () => ''),
   addInlineReviewComment: jest.fn(async () => {}),
 });
 

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

@@ -173,6 +173,7 @@ export const ConsoleItemDetailContainer = ({
           isPr={item.isPr}
           now={now}
           onSubmit={(body) => operations.addComment(item, body)}
+          onUploadFile={(file) => operations.uploadAttachment(item, file)}
         />
       }
       operationBar={