Add ability to hide images after clicking "show image" (#29467)

* start hide

* Move useSettingsValueWithSetter to useSettings

* Add new setting showMediaEventIds

* Add a migration path

* Add an action button to hide settings.

* Tweaks to MImageBody to support new setting.

* Fixup and add tests

* add description for migration

* docs fixes

* add type

* i18n

* appese prettier

* Add tests for HideActionButton

* lint

* lint

* Use a hook for media visibility.

* Drop setting hook usage.

* Fixup MImageBody test

* Fixup tests

* Support functional components for message body rendering.

* Add a comment

* Move props into IProps

src/hooks/useMediaVisible.ts

@@ -0,0 +1,35 @@
+/*
+Copyright 2025 New Vector Ltd.
+
+SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Commercial
+Please see LICENSE files in the repository root for full details.
+*/
+
+import { useCallback } from "react";
+
+import { SettingLevel } from "../settings/SettingLevel";
+import { useSettingValue } from "./useSettings";
+import SettingsStore from "../settings/SettingsStore";
+
+/**
+ * Should the media event be visible in the client, or hidden.
+ * @param eventId The eventId of the media event.
+ * @returns A boolean describing the hidden status, and a function to set the visiblity.
+ */
+export function useMediaVisible(eventId: string): [boolean, (visible: boolean) => void] {
+    const defaultShowImages = useSettingValue("showImages", SettingLevel.DEVICE);
+    const eventVisibility = useSettingValue("showMediaEventIds", SettingLevel.DEVICE);
+    const setMediaVisible = useCallback(
+        (visible: boolean) => {
+            SettingsStore.setValue("showMediaEventIds", null, SettingLevel.DEVICE, {
+                ...eventVisibility,
+                [eventId]: visible,
+            });
+        },
+        [eventId, eventVisibility],
+    );
+
+    // Always prefer the explicit per-event user preference here.
+    const imgIsVisible = eventVisibility[eventId] ?? defaultShowImages;
+    return [imgIsVisible, setMediaVisible];
+}