OIDC: Persist details in session storage, create store (#11302)

* utils to persist clientId and issuer after oidc authentication

* add dep oidc-client-ts

* persist issuer and clientId after successful oidc auth

* add OidcClientStore

* comments and tidy

* format

src/Lifecycle.ts

@@ -66,6 +66,7 @@ import { OverwriteLoginPayload } from "./dispatcher/payloads/OverwriteLoginPaylo
 import { SdkContextClass } from "./contexts/SDKContext";
 import { messageForLoginError } from "./utils/ErrorUtils";
 import { completeOidcLogin } from "./utils/oidc/authorize";
+import { persistOidcAuthenticatedSettings } from "./utils/oidc/persistOidcSettings";
 
 const HOMESERVER_URL_KEY = "mx_hs_url";
 const ID_SERVER_URL_KEY = "mx_is_url";
@@ -215,7 +216,9 @@ export async function attemptDelegatedAuthLogin(
  */
 async function attemptOidcNativeLogin(queryParams: QueryDict): Promise<boolean> {
     try {
-        const { accessToken, homeserverUrl, identityServerUrl } = await completeOidcLogin(queryParams);
+        const { accessToken, homeserverUrl, identityServerUrl, clientId, issuer } = await completeOidcLogin(
+            queryParams,
+        );
 
         const {
             user_id: userId,
@@ -234,6 +237,8 @@ async function attemptOidcNativeLogin(queryParams: QueryDict): Promise<boolean>
 
         logger.debug("Logged in via OIDC native flow");
         await onSuccessfulDelegatedAuthLogin(credentials);
+        // this needs to happen after success handler which clears storages
+        persistOidcAuthenticatedSettings(clientId, issuer);
         return true;
     } catch (error) {
         logger.error("Failed to login via OIDC", error);

src/contexts/SDKContext.ts

@@ -31,6 +31,7 @@ import TypingStore from "../stores/TypingStore";
 import { UserProfilesStore } from "../stores/UserProfilesStore";
 import { WidgetLayoutStore } from "../stores/widgets/WidgetLayoutStore";
 import { WidgetPermissionStore } from "../stores/widgets/WidgetPermissionStore";
+import { OidcClientStore } from "../stores/oidc/OidcClientStore";
 import WidgetStore from "../stores/WidgetStore";
 import {
     VoiceBroadcastPlaybacksStore,
@@ -80,6 +81,7 @@ export class SdkContextClass {
     protected _VoiceBroadcastPlaybacksStore?: VoiceBroadcastPlaybacksStore;
     protected _AccountPasswordStore?: AccountPasswordStore;
     protected _UserProfilesStore?: UserProfilesStore;
+    protected _OidcClientStore?: OidcClientStore;
 
     /**
      * Automatically construct stores which need to be created eagerly so they can register with
@@ -203,6 +205,18 @@ export class SdkContextClass {
         return this._UserProfilesStore;
     }
 
+    public get oidcClientStore(): OidcClientStore {
+        if (!this.client) {
+            throw new Error("Unable to create OidcClientStore without a client");
+        }
+
+        if (!this._OidcClientStore) {
+            this._OidcClientStore = new OidcClientStore(this.client);
+        }
+
+        return this._OidcClientStore;
+    }
+
     public onLoggedOut(): void {
         this._UserProfilesStore = undefined;
     }

src/stores/oidc/OidcClientStore.ts

@@ -0,0 +1,88 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import { IDelegatedAuthConfig, MatrixClient, M_AUTHENTICATION } from "matrix-js-sdk/src/client";
+import { discoverAndValidateAuthenticationConfig } from "matrix-js-sdk/src/oidc/discovery";
+import { logger } from "matrix-js-sdk/src/logger";
+import { OidcClient } from "oidc-client-ts";
+
+import { getStoredOidcTokenIssuer, getStoredOidcClientId } from "../../utils/oidc/persistOidcSettings";
+
+/**
+ * @experimental
+ * Stores information about configured OIDC provider
+ */
+export class OidcClientStore {
+    private oidcClient?: OidcClient;
+    private initialisingOidcClientPromise: Promise<void> | undefined;
+    private authenticatedIssuer?: string;
+    private _accountManagementEndpoint?: string;
+
+    public constructor(private readonly matrixClient: MatrixClient) {
+        this.authenticatedIssuer = getStoredOidcTokenIssuer();
+        // don't bother initialising store when we didnt authenticate via oidc
+        if (this.authenticatedIssuer) {
+            this.getOidcClient();
+        }
+    }
+
+    /**
+     * True when the active user is authenticated via OIDC
+     */
+    public get isUserAuthenticatedWithOidc(): boolean {
+        return !!this.authenticatedIssuer;
+    }
+
+    public get accountManagementEndpoint(): string | undefined {
+        return this._accountManagementEndpoint;
+    }
+
+    private async getOidcClient(): Promise<OidcClient | undefined> {
+        if (!this.oidcClient && !this.initialisingOidcClientPromise) {
+            this.initialisingOidcClientPromise = this.initOidcClient();
+        }
+        await this.initialisingOidcClientPromise;
+        this.initialisingOidcClientPromise = undefined;
+        return this.oidcClient;
+    }
+
+    private async initOidcClient(): Promise<void> {
+        const wellKnown = this.matrixClient.getClientWellKnown();
+        if (!wellKnown) {
+            logger.error("Cannot initialise OidcClientStore: client well known required.");
+            return;
+        }
+
+        const delegatedAuthConfig = M_AUTHENTICATION.findIn<IDelegatedAuthConfig>(wellKnown) ?? undefined;
+        try {
+            const clientId = getStoredOidcClientId();
+            const { account, metadata, signingKeys } = await discoverAndValidateAuthenticationConfig(
+                delegatedAuthConfig,
+            );
+            // if no account endpoint is configured default to the issuer
+            this._accountManagementEndpoint = account ?? metadata.issuer;
+            this.oidcClient = new OidcClient({
+                ...metadata,
+                authority: metadata.issuer,
+                signingKeys,
+                redirect_uri: window.location.origin,
+                client_id: clientId,
+            });
+        } catch (error) {
+            logger.error("Failed to initialise OidcClientStore", error);
+        }
+    }
+}

src/utils/oidc/authorize.ts

@@ -81,9 +81,12 @@ export const completeOidcLogin = async (
     homeserverUrl: string;
     identityServerUrl?: string;
     accessToken: string;
+    clientId: string;
+    issuer: string;
 }> => {
     const { code, state } = getCodeAndStateFromQueryParams(queryParams);
-    const { homeserverUrl, tokenResponse, identityServerUrl } = await completeAuthorizationCodeGrant(code, state);
+    const { homeserverUrl, tokenResponse, identityServerUrl, oidcClientSettings } =
+        await completeAuthorizationCodeGrant(code, state);
 
     // @TODO(kerrya) do something with the refresh token https://github.com/vector-im/element-web/issues/25444
 
@@ -91,5 +94,7 @@ export const completeOidcLogin = async (
         homeserverUrl: homeserverUrl,
         identityServerUrl: identityServerUrl,
         accessToken: tokenResponse.access_token,
+        clientId: oidcClientSettings.clientId,
+        issuer: oidcClientSettings.issuer,
     };
 };

src/utils/oidc/persistOidcSettings.ts

@@ -0,0 +1,51 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+const clientIdStorageKey = "mx_oidc_client_id";
+const tokenIssuerStorageKey = "mx_oidc_token_issuer";
+
+/**
+ * Persists oidc clientId and issuer in session storage
+ * Only set after successful authentication
+ * @param clientId
+ * @param issuer
+ */
+export const persistOidcAuthenticatedSettings = (clientId: string, issuer: string): void => {
+    sessionStorage.setItem(clientIdStorageKey, clientId);
+    sessionStorage.setItem(tokenIssuerStorageKey, issuer);
+};
+
+/**
+ * Retrieve stored oidc issuer from session storage
+ * When user has token from OIDC issuer, this will be set
+ * @returns issuer or undefined
+ */
+export const getStoredOidcTokenIssuer = (): string | undefined => {
+    return sessionStorage.getItem(tokenIssuerStorageKey) ?? undefined;
+};
+
+/**
+ * Retrieves stored oidc client id from session storage
+ * @returns clientId
+ * @throws when clientId is not found in session storage
+ */
+export const getStoredOidcClientId = (): string => {
+    const clientId = sessionStorage.getItem(clientIdStorageKey);
+    if (!clientId) {
+        throw new Error("Oidc client id not found in storage");
+    }
+    return clientId;
+};