Switch to swagger-ui-dist, to avoid sharing the same react version

frontend/package.json

@@ -35,7 +35,7 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "react-i18next": "^15.4.0",
-    "swagger-ui-react": "^5.18.3",
+    "swagger-ui-dist": "^5.18.3",
     "vaul": "^1.1.2",
     "zod": "^3.24.1"
   },
@@ -62,7 +62,7 @@
     "@types/node": "^22.13.1",
     "@types/react": "19.0.8",
     "@types/react-dom": "19.0.3",
-    "@types/swagger-ui-react": "^5.18.0",
+    "@types/swagger-ui-dist": "^3.30.5",
     "@vitejs/plugin-react": "^4.3.4",
     "@vitest/coverage-v8": "^3.0.5",
     "autoprefixer": "^10.4.20",
@@ -89,11 +89,5 @@
   },
   "msw": {
     "workerDirectory": [".storybook/public"]
-  },
-  "overrides": {
-    "swagger-ui-react": {
-      "react": "$react",
-      "react-dom": "$react-dom"
-    }
   }
 }

frontend/src/swagger.tsx

@@ -1,12 +1,11 @@
-// Copyright 2024 New Vector Ltd.
+// Copyright 2024, 2025 New Vector Ltd.
 // Copyright 2024 The Matrix.org Foundation C.I.C.
 //
 // SPDX-License-Identifier: AGPL-3.0-only
 // Please see LICENSE in the repository root for full details.
 
-import { createRoot } from "react-dom/client";
-import SwaggerUI from "swagger-ui-react";
-import "swagger-ui-react/swagger-ui.css";
+import { SwaggerUIBundle, SwaggerUIStandalonePreset } from "swagger-ui-dist";
+import "swagger-ui-dist/swagger-ui.css";
 
 type ApiConfig = {
   openapiUrl: string;
@@ -22,10 +21,9 @@ if (!config) {
   throw new Error("API_CONFIG is not defined");
 }
 
-createRoot(document.getElementById("root") as HTMLElement).render(
-  <SwaggerUI
-    url={config.openapiUrl}
-    deepLinking={true}
-    oauth2RedirectUrl={config.callbackUrl}
-  />,
-);
+SwaggerUIBundle({
+  url: "./spec.json",
+  dom_id: "#swagger-ui",
+  deepLinking: true,
+  presets: [SwaggerUIStandalonePreset],
+});