Enhancement: Save image on CTRL+S (#30330)

* Save image on CTRL+S

* fixed cosmetic comments

* fixed test

* refactored out downloading functionality from buttons to useDownloadMedia hook

* ImageView CTRL+S use button component

* added CTRL+S test & lint

* removed forwardRef

* fix lint

* i18n

test/unit-tests/components/views/elements/ImageView-test.tsx

@@ -44,6 +44,28 @@ describe("<ImageView />", () => {
         expect(fetchMock).toHaveFetched("https://example.com/image.png");
     });
 
+    it("should start download on Ctrl+S", async () => {
+        fetchMock.get("https://example.com/image.png", "TESTFILE");
+
+        const { container } = render(
+            <ImageView src="https://example.com/image.png" name="filename.png" onFinished={jest.fn()} />,
+        );
+
+        const dialog = container.querySelector('[role="dialog"]') as HTMLElement;
+        dialog?.focus();
+
+        fireEvent.keyDown(dialog!, { key: "s", code: "KeyS", ctrlKey: true });
+
+        await waitFor(() => {
+            expect(mocked(FileDownloader).mock.instances[0].download).toHaveBeenCalledWith({
+                blob: expect.anything(),
+                name: "filename.png",
+            });
+        });
+
+        expect(fetchMock).toHaveFetched("https://example.com/image.png");
+    });
+
     it("should handle download errors", async () => {
         const modalSpy = jest.spyOn(Modal, "createDialog");
         fetchMock.get("https://example.com/image.png", { status: 500 });

test/unit-tests/components/views/settings/tabs/user/__snapshots__/KeyboardUserSettingsTab-test.tsx.snap

@@ -742,6 +742,26 @@ exports[`KeyboardUserSettingsTab renders list of keyboard shortcuts 1`] = `
                     </kbd>
                   </div>
                 </li>
+                <li
+                  class="mx_KeyboardShortcut_shortcutRow"
+                >
+                  Save
+                  <div
+                    class="mx_KeyboardShortcut"
+                  >
+                    <kbd>
+                       
+                      Ctrl
+                       
+                    </kbd>
+                    +
+                    <kbd>
+                       
+                      s
+                       
+                    </kbd>
+                  </div>
+                </li>
               </ul>
             </div>
           </div>