Global configuration flag for media previews (#29582)

* Modify useMediaVisible to take a room.

* Add initial support for a account data level key.

* Update controls.

* Update settings

* Lint and fixes

* make some tests go happy

* lint

* i18n

* update preferences

* prettier

* Update settings tab.

* update screenshot

* Update docs

* Rewrite controller

* Rewrite tons of tests

* Rewrite RoomAvatar to be a functional component

This is so we can use hooks to determine the setting state.

* lint

* lint

* Tidy up comments

* Apply media visible hook to inline images.

* Move conditionals.

* copyright all the things

* Review changes

* Update html utils to properly discard media.

* Types fix

* Fixing tests that break settings getValue expectations

* Fix logic around media preview calculation

* Fix room header tests

* Fixup tests for timelinePanel

* Clear settings in matrixchat

* Update tests to use SettingsStore where possible.

* fix bug

* revert changes to client.ts

* copyright years

* Add header

* Add a test for MediaPreviewAccountSettingsTab

* Mark initMatrixClient as optional

* Improve on types

* Ensure we do not set the account data twice.

* lint

* Review changes

* Ensure we include the client on rendered messages.

* Fix test

* update labels

* clean designs

* update settings tab

* update snapshot

* copyright

* prevent mutation

test/unit-tests/components/views/avatars/RoomAvatar-test.tsx

@@ -17,6 +17,7 @@ import DMRoomMap from "../../../../../src/utils/DMRoomMap";
 import { LocalRoom } from "../../../../../src/models/LocalRoom";
 import * as AvatarModule from "../../../../../src/Avatar";
 import { DirectoryMember } from "../../../../../src/utils/direct-messages";
+import { MediaPreviewValue } from "../../../../../src/@types/media_preview";
 import SettingsStore from "../../../../../src/settings/SettingsStore";
 import { SettingLevel } from "../../../../../src/settings/SettingLevel";
 
@@ -37,18 +38,18 @@ describe("RoomAvatar", () => {
     });
 
     afterAll(() => {
+        SettingsStore.setValue(
+            "mediaPreviewConfig",
+            null,
+            SettingLevel.ACCOUNT,
+            SettingsStore.getDefaultValue("mediaPreviewConfig"),
+        );
         jest.restoreAllMocks();
     });
 
     afterEach(() => {
         mocked(DMRoomMap.shared().getUserIdForRoomId).mockReset();
         mocked(AvatarModule.defaultAvatarUrlForString).mockClear();
-        SettingsStore.setValue(
-            "showAvatarsOnInvites",
-            null,
-            SettingLevel.ACCOUNT,
-            SettingsStore.getDefaultValue("showAvatarsOnInvites"),
-        );
     });
 
     it("should render as expected for a Room", () => {
@@ -74,7 +75,6 @@ describe("RoomAvatar", () => {
         expect(render(<RoomAvatar room={localRoom} />).container).toMatchSnapshot();
     });
     it("should render an avatar for a room the user is invited to", () => {
-        SettingsStore.setValue("showAvatarsOnInvites", null, SettingLevel.ACCOUNT, true);
         const room = new Room("!room:example.com", client, client.getSafeUserId());
         jest.spyOn(room, "getMxcAvatarUrl").mockImplementation(() => "mxc://example.com/foobar");
         room.name = "test room";
@@ -93,7 +93,9 @@ describe("RoomAvatar", () => {
         expect(render(<RoomAvatar room={room} />).container).toMatchSnapshot();
     });
     it("should not render an invite avatar if the user has disabled it", () => {
-        SettingsStore.setValue("showAvatarsOnInvites", null, SettingLevel.ACCOUNT, false);
+        SettingsStore.setValue("mediaPreviewConfig", null, SettingLevel.ACCOUNT, {
+            invite_avatars: MediaPreviewValue.Off,
+        });
         const room = new Room("!room:example.com", client, client.getSafeUserId());
         room.name = "test room";
         room.updateMyMembership("invite");