Use InlineSpinner instead of a loading text.

element-hq · Nov 20, 2024 · 7ba528f · 7ba528f
1 parent 001b1d1
commit 7ba528f
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 2 deletions.
diff --git a/src/components/views/room_settings/UrlPreviewSettings.tsx b/src/components/views/room_settings/UrlPreviewSettings.tsx
@@ -11,6 +11,7 @@ Please see LICENSE files in the repository root for full details.
 
 import React, { ReactNode, JSX } from "react";
 import { Room } from "matrix-js-sdk/src/matrix";
+import { InlineSpinner } from "@vector-im/compound-web";
 
 import { _t } from "../../../languageHandler";
 import SettingsStore from "../../../settings/SettingsStore";
@@ -46,7 +47,7 @@ export function UrlPreviewSettings({ room }: UrlPreviewSettingsProps): JSX.Eleme
             description={!isLoading && <Description isEncrypted={isEncrypted} />}
         >
             {isLoading ? (
-                _t("common|loading")
+                <InlineSpinner />
             ) : (
                 <>
                     <PreviewsForRoom isEncrypted={isEncrypted} roomId={roomId} />

diff --git a/.../unit-tests/components/views/room_settings/__snapshots__/UrlPreviewSettings-test.tsx.snap b/.../unit-tests/components/views/room_settings/__snapshots__/UrlPreviewSettings-test.tsx.snap
@@ -215,7 +215,21 @@ exports[`UrlPreviewSettings should display the correct preview when the setting
     <div
       class="mx_SettingsFieldset_content"
     >
-      Loading…
+      <svg
+        class="_icon_1ye7b_27"
+        fill="currentColor"
+        height="1em"
+        style="width: 20px; height: 20px;"
+        viewBox="0 0 24 24"
+        width="1em"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          clip-rule="evenodd"
+          d="M12 4.031a8 8 0 1 0 8 8 1 1 0 0 1 2 0c0 5.523-4.477 10-10 10s-10-4.477-10-10 4.477-10 10-10a1 1 0 1 1 0 2Z"
+          fill-rule="evenodd"
+        />
+      </svg>
     </div>
   </fieldset>
 </DocumentFragment>