From ad7ff4fc6bb11d41084c6c561f075e94f960f0f8 Mon Sep 17 00:00:00 2001
From: Linus Rath <139418639+rathlinus@users.noreply.github.com>
Date: Wed, 4 Nov 2026 07:37:26 +0100
Subject: [PATCH] fix: label the Attach from Files dialog's X as Close

---
 components/files/__tests__/file-picker-dialog.test.tsx | 10 ++++++++++
 components/files/file-picker-dialog.tsx                |  3 ++-
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/components/files/__tests__/file-picker-dialog.test.tsx b/components/files/__tests__/file-picker-dialog.test.tsx
index 75933339e..8991dca32 100644
--- a/components/files/__tests__/file-picker-dialog.test.tsx
+++ b/components/files/__tests__/file-picker-dialog.test.tsx
@@ -44,6 +44,16 @@ function renderPicker(list: () => Promise<FileNode[]> = async () => TREE) {
 }
 
 describe('FilePickerDialog', () => {
+  // The X in the header was labelled "Cancel" like the footer button.
+  it('names the header X "Close" and keeps one Cancel button, both closing', async () => {
+    const { onClose } = renderPicker();
+    await screen.findByText('invoice.pdf');
+    expect(screen.getAllByRole('button', { name: 'cancel' })).toHaveLength(1);
+    fireEvent.click(screen.getByRole('button', { name: 'close' }));
+    fireEvent.click(screen.getByRole('button', { name: 'cancel' }));
+    expect(onClose).toHaveBeenCalledTimes(2);
+  });
+
   it('lists the root without hidden or shared nodes, and offers Shared with me', async () => {
     renderPicker();
     expect(await screen.findByText('invoice.pdf')).toBeInTheDocument();
diff --git a/components/files/file-picker-dialog.tsx b/components/files/file-picker-dialog.tsx
index 92d4168cb..a6dbf1fbb 100644
--- a/components/files/file-picker-dialog.tsx
+++ b/components/files/file-picker-dialog.tsx
@@ -45,6 +45,7 @@ function byFolderThenName(a: FileNode, b: FileNode): number {
 export function FilePickerDialog({ client, onClose, onPick }: FilePickerDialogProps) {
   const t = useTranslations("files");
   const tComposer = useTranslations("email_composer");
+  const tCommon = useTranslations("common");
   const [nodes, setNodes] = useState<FileNode[] | null>(null);
   const [failed, setFailed] = useState(false);
   const [attempt, setAttempt] = useState(0);
@@ -245,7 +246,7 @@ export function FilePickerDialog({ client, onClose, onPick }: FilePickerDialogPr
           <button
             type="button"
             onClick={onClose}
-            aria-label={t("cancel")}
+            aria-label={tCommon("close")}
             className="p-1.5 rounded-md hover:bg-muted transition-colors text-muted-foreground hover:text-foreground"
           >
             <X className="w-4 h-4" />