Disable URL Preview setting if disabled on the homeserver

apps/web/src/i18n/strings/en_EN.json

@@ -476,6 +476,7 @@
         "description": "Description",
         "deselect_all": "Deselect all",
         "device": "Device",
+        "disabled_by_homeserver": "Disabled by homeserver",
         "edited": "edited",
         "email_address": "Email address",
         "emoji": "Emoji",

apps/web/src/settings/Settings.tsx

@@ -1150,7 +1150,16 @@ export const SETTINGS: Settings = {
         supportedLevelsAreOrdered: true,
         displayName: _td("settings|inline_url_previews_default"),
         default: true,
-        controller: new UIFeatureController(UIFeature.URLPreviews),
+        controller: new RequiresSettingsController([UIFeature.URLPreviews], false, (c) => {
+            if (
+                c["io.element.msc4452.preview_url"]?.enabled === undefined ||
+                c["io.element.msc4452.preview_url"].enabled
+            ) {
+                // If there is no capability, assume true.
+                return false;
+            }
+            return _t("common|disabled_by_homeserver");
+        }),
     },
     "urlPreviewsEnabled_e2ee": {
         // Can only be enabled per-device to ensure neither the homeserver nor client config

apps/web/src/settings/controllers/RequiresSettingsController.ts

@@ -5,30 +5,66 @@
 Please see LICENSE files in the repository root for full details.
 */
 
-import SettingController from "./SettingController";
+import type { Capabilities } from "matrix-js-sdk/src/matrix";
 import SettingsStore from "../SettingsStore";
 import type { BooleanSettingKey } from "../Settings.tsx";
+import MatrixClientBackedController from "./MatrixClientBackedController.ts";
 
 /**
  * Disables a setting & forces it's value if one or more settings are not enabled
+ * and/or a capability on the client check does not pass.
  */
-export default class RequiresSettingsController extends SettingController {
+export default class RequiresSettingsController extends MatrixClientBackedController {
     public constructor(
         public readonly settingNames: BooleanSettingKey[],
-        private forcedValue = false,
+        private readonly forcedValue = false,
+        /**
+         * Function to check the capabilites of the client.
+         * If defined this will be called when the MatrixClient is instantiated to check
+         * the returned capabilites.
+         * @returns `true` or a string if the feature is disabled by the feature, otherwise false.
+         */
+        private readonly isCapabilityDisabled?: (caps: Capabilities) => boolean | string,
     ) {
         super();
     }
 
+    protected initMatrixClient(): void {
+        if (this.client && this.isCapabilityDisabled) {
+            // Ensure we fetch capabilies at least once.
+            void this.client.getCapabilities();
+        }
+    }
+
+    private get isBlockedByCapabilites(): boolean | string {
+        if (!this.isCapabilityDisabled) {
+            return false;
+        }
+        // This works because the cached caps are stored forever, and we have made
+        // at least one call to get capaibilies.
+        const cachedCaps = this.client?.getCachedCapabilities();
+        if (!cachedCaps) {
+            // return forced value if caps aren't available yet.
+            return true;
+        }
+        return this.isCapabilityDisabled(cachedCaps);
+    }
+
+    public get settingDisabled(): boolean | string {
+        if (this.settingNames.some((s) => !SettingsStore.getValue(s))) {
+            return true;
+        }
+        return this.isBlockedByCapabilites;
+    }
+
     public getValueOverride(): any {
         if (this.settingDisabled) {
             // per the docs: we force a disabled state when the feature isn't active
             return this.forcedValue;
         }
+        if (this.isBlockedByCapabilites) {
+            return this.forcedValue;
+        }
         return null; // no override
     }
-
-    public get settingDisabled(): boolean {
-        return this.settingNames.some((s) => !SettingsStore.getValue(s));
-    }
 }

apps/web/test/unit-tests/settings/controllers/RequiresSettingsController-test.ts

@@ -5,9 +5,12 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only OR LicenseRef-Element-Com
 Please see LICENSE files in the repository root for full details.
 */
 
+import type { Capabilities } from "matrix-js-sdk/src/matrix";
 import RequiresSettingsController from "../../../../src/settings/controllers/RequiresSettingsController";
 import { SettingLevel } from "../../../../src/settings/SettingLevel";
 import SettingsStore from "../../../../src/settings/SettingsStore";
+import MatrixClientBackedController from "../../../../src/settings/controllers/MatrixClientBackedController";
+import { getMockClientWithEventEmitter, mockClientMethodsServer } from "../../../test-utils";
 
 describe("RequiresSettingsController", () => {
     afterEach(() => {
@@ -30,4 +33,100 @@ describe("RequiresSettingsController", () => {
         expect(controller.settingDisabled).toEqual(false);
         expect(controller.getValueOverride()).toEqual(null);
     });
+
+    describe("with capabilites", () => {
+        let caps: Capabilities;
+        let client: ReturnType<typeof getMockClientWithEventEmitter>;
+        beforeEach(() => {
+            client = getMockClientWithEventEmitter({
+                ...mockClientMethodsServer(),
+                getCachedCapabilities: jest.fn().mockImplementation(() => caps!),
+                getCapabilities: jest.fn(),
+            });
+            MatrixClientBackedController["_matrixClient"] = client;
+        });
+
+        it("will disable setting if capability check is true", async () => {
+            caps = {
+                "m.change_password": {
+                    enabled: false,
+                },
+            };
+            const controller = new RequiresSettingsController([], false, (c: Capabilities) => {
+                expect(c).toEqual(caps);
+                return !c["m.change_password"]?.enabled;
+            });
+
+            // Test that we fetch caps
+            controller["initMatrixClient"]();
+            expect(client.getCapabilities).toHaveBeenCalled();
+
+            // Test that we check caps.
+            expect(controller.settingDisabled).toEqual(true);
+            expect(controller.getValueOverride()).toEqual(false);
+            expect(client.getCachedCapabilities).toHaveBeenCalled();
+        });
+
+        it("will not disable setting if capability check is false", async () => {
+            caps = {
+                "m.change_password": {
+                    enabled: true,
+                },
+            };
+            const controller = new RequiresSettingsController([], false, (c: Capabilities) => {
+                expect(c).toEqual(caps);
+                return !c["m.change_password"]?.enabled;
+            });
+
+            // Test that we fetch caps
+            controller["initMatrixClient"]();
+            expect(client.getCapabilities).toHaveBeenCalled();
+
+            // Test that we check caps.
+            expect(controller.settingDisabled).toEqual(false);
+            expect(controller.getValueOverride()).toEqual(null);
+            expect(client.getCachedCapabilities).toHaveBeenCalled();
+        });
+
+        it("will check dependency settings before checking capabilites", async () => {
+            caps = {
+                "m.change_password": {
+                    enabled: false,
+                },
+            };
+            await SettingsStore.setValue("useCompactLayout", null, SettingLevel.DEVICE, false);
+            const controller = new RequiresSettingsController(["useCompactLayout"], false, (c: Capabilities) => false);
+
+            // Test that we fetch caps
+            controller["initMatrixClient"]();
+            expect(client.getCapabilities).toHaveBeenCalled();
+
+            // Test that we check caps.
+            expect(controller.settingDisabled).toEqual(true);
+            expect(controller.getValueOverride()).toEqual(false);
+            expect(client.getCachedCapabilities).not.toHaveBeenCalled();
+        });
+
+        it("will disable setting if capability check is true and dependency settings are true", async () => {
+            caps = {
+                "m.change_password": {
+                    enabled: false,
+                },
+            };
+            await SettingsStore.setValue("useCompactLayout", null, SettingLevel.DEVICE, true);
+            const controller = new RequiresSettingsController(["useCompactLayout"], false, (c: Capabilities) => {
+                expect(c).toEqual(caps);
+                return !c["m.change_password"]?.enabled;
+            });
+
+            // Test that we fetch caps
+            controller["initMatrixClient"]();
+            expect(client.getCapabilities).toHaveBeenCalled();
+
+            // Test that we check caps.
+            expect(controller.settingDisabled).toEqual(true);
+            expect(controller.getValueOverride()).toEqual(false);
+            expect(client.getCachedCapabilities).toHaveBeenCalled();
+        });
+    });
 });