feat: Fallback to basic auth for instances and clusters

https://harperdb.atlassian.net/browse/STUDIO-588

Author: dawsontoth

src/config/getInstanceClient.ts

@@ -23,8 +23,10 @@ export function getInstanceClient({ id = OverallAppSignIn, operationsUrl, port,
 			baseURL = newURL.toString();
 		}
 	}
+	const auth = authStore.checkForBasicAuth(id);
 	const client = axios.create({
-		withCredentials: true,
+		auth,
+		withCredentials: !auth,
 		timeout: 15000,
 		headers: {
 			'Content-Type': 'application/json',

src/features/auth/hooks/useClusterInstanceSignIn.ts

@@ -3,7 +3,6 @@ import { InstanceClientIdConfig, InstanceTypeConfig } from '@/config/instanceCli
 import { currentUserQueryKey } from '@/features/auth/queries/getCurrentUser';
 import { authStore, OverallAppSignIn } from '@/features/auth/store/authStore';
 import { useInstanceLoginMutation } from '@/features/instance/operations/mutations/useInstanceLoginMutation';
-import { getInstanceUserInfo } from '@/features/instance/operations/queries/getInstanceUserInfo';
 import { UsernameSignInSchema } from '@/features/instance/operations/schemas/signInSchema';
 import { SchemaHdbInstance } from '@/lib/api.gen';
 import { Cluster } from '@/lib/api.patch';
@@ -36,9 +35,8 @@ export function useClusterInstanceSignIn({
 				...instanceParams,
 			},
 			{
-				onSuccess: async (response) => {
-					toast.success(response.message);
-					const user = await getInstanceUserInfo(instanceParams);
+				onSuccess: async ({ message, user }) => {
+					toast.success(message);
 					// If we sign in to the cluster, we've authenticated against all of its instances too.
 					if (cluster?.instances?.length && !instance) {
 						for (const clusterInstance of cluster.instances) {

src/features/auth/hooks/useLogout.ts

@@ -3,14 +3,14 @@ import { isLocalStudio } from '@/config/constants';
 import { InstanceClientConfig } from '@/config/instanceClientConfig';
 import { useInstanceClient } from '@/config/useInstanceClient';
 import { logoutOnSuccess } from '@/features/auth/handlers/logoutOnSuccess';
-import { authStore } from '@/features/auth/store/authStore';
+import { authStore, OverallAppSignIn } from '@/features/auth/store/authStore';
 import { onInstanceLogoutSubmit } from '@/features/instance/operations/mutations/onInstanceLogoutSubmit';
 import { useMutation } from '@tanstack/react-query';
 
 async function onLogoutSubmit(instanceClientConfig: InstanceClientConfig) {
 	await authStore.signOutFromPotentiallyAuthenticatedInstances();
 	if (isLocalStudio) {
-		await onInstanceLogoutSubmit(instanceClientConfig);
+		await onInstanceLogoutSubmit({ ...instanceClientConfig, entityId: OverallAppSignIn });
 	} else {
 		await apiClient.post('/Logout/');
 	}

src/features/auth/store/authStore.ts

@@ -43,13 +43,14 @@ class AuthStore {
 	private readonly broadListeners: Array<(connection: AuthenticatedConnection, id: EntityIds) => void> = [];
 	private readonly specificListeners: Record<EntityIds, Array<(connection: AuthenticatedConnection, id: EntityIds) => void>> = {};
 
-	private readonly localStorageKey = 'Studio:PotentiallyAuthenticated';
+	private readonly potentiallyAuthenticatedKey = 'Studio:PotentiallyAuthenticated';
+	private readonly basicAuthKeyPrefix = 'Studio:BasicAuth:';
 	private readonly potentiallyAuthenticated: Record<EntityIds, AuthenticatedConnectionKey>;
 	private readonly checkedAuthentication: Record<EntityIds, boolean> = {};
 	private readonly allConnections: Record<EntityIds, AuthenticatedConnection> = {};
 
 	constructor() {
-		this.potentiallyAuthenticated = JSON.parse(localStorage.getItem(this.localStorageKey) || '{}');
+		this.potentiallyAuthenticated = JSON.parse(localStorage.getItem(this.potentiallyAuthenticatedKey) || '{}');
 	}
 
 	public getAllConnections(): Record<EntityIds, AuthenticatedConnection> {
@@ -152,6 +153,19 @@ class AuthStore {
 		return undefined;
 	}
 
+	public flagForBasicAuth(id: EntityIds, credentials: null | { username: string; password: string; }) {
+		if (credentials === null) {
+			localStorage.removeItem(this.basicAuthKeyPrefix + id);
+		} else {
+			localStorage.setItem(this.basicAuthKeyPrefix + id, btoa(JSON.stringify(credentials)));
+		}
+	}
+
+	public checkForBasicAuth(id: EntityIds): undefined | { username: string; password: string; } {
+		const value = localStorage.getItem(this.basicAuthKeyPrefix + id);
+		return value ? JSON.parse(atob(value)) : undefined;
+	}
+
 	public async signOutFromPotentiallyAuthenticatedInstances() {
 		for (const entityId in this.potentiallyAuthenticated) {
 			this.allConnections[entityId].user = null;
@@ -162,7 +176,7 @@ class AuthStore {
 			}
 			try {
 				const instanceClient = getInstanceClient({ id: entityId });
-				await onInstanceLogoutSubmit({ instanceClient });
+				await onInstanceLogoutSubmit({ entityId, instanceClient });
 			} catch (err: unknown) {
 				console.error(`Failed to log out from ${entityId}, carrying on`, err);
 			}
@@ -202,14 +216,14 @@ class AuthStore {
 	private flagKeyAsSignedIn(id: EntityIds, key: AuthenticatedConnectionKey) {
 		if (this.potentiallyAuthenticated[id] !== key) {
 			this.potentiallyAuthenticated[id] = key;
-			localStorage.setItem(this.localStorageKey, JSON.stringify(this.potentiallyAuthenticated));
+			localStorage.setItem(this.potentiallyAuthenticatedKey, JSON.stringify(this.potentiallyAuthenticated));
 		}
 	}
 
 	private flagKeyAsSignedOut(id: EntityIds) {
 		if (this.potentiallyAuthenticated[id]) {
 			delete this.potentiallyAuthenticated[id];
-			localStorage.setItem(this.localStorageKey, JSON.stringify(this.potentiallyAuthenticated));
+			localStorage.setItem(this.potentiallyAuthenticatedKey, JSON.stringify(this.potentiallyAuthenticated));
 		}
 	}
 

src/features/cluster/FinishSetup.tsx

@@ -13,7 +13,6 @@ import { authStore } from '@/features/auth/store/authStore';
 import {
 	useInstanceResetPasswordMutation,
 } from '@/features/instance/operations/mutations/useInstanceResetPasswordMutation';
-import { getInstanceUserInfo } from '@/features/instance/operations/queries/getInstanceUserInfo';
 import { AddUserFormSchema } from '@/features/instance/operations/schemas/addUserFormSchema';
 import { useCloudAuth } from '@/hooks/useAuth';
 import { getOperationsUrlForCluster } from '@/lib/urls/getOperationsUrlForCluster';
@@ -73,10 +72,9 @@ export function FinishSetup() {
 			initialUsername: defaultClusterUsername,
 			desiredUsername: formData.username,
 		}, {
-			onSuccess: async (response) => {
-				toast.success(response.message);
-				const user = await getInstanceUserInfo({ instanceClient });
-				authStore.setUserForEntity(cluster || null, user);
+			onSuccess: async ({ message, user }) => {
+				toast.success(message);
+				authStore.setUserForEntity(cluster!, user);
 				void router.invalidate();
 				await navigate({ to: redirect?.startsWith('/') ? redirect : defaultInstanceRouteUpOne });
 			},

src/features/cluster/InstanceLogInCell.tsx

@@ -15,7 +15,7 @@ export function InstanceLogInCell({ instance }: { readonly instance: Instance })
 	const operationsUrl = useMemo(() => getOperationsUrlForInstance(instance), [instance]);
 	const instanceClient = useInstanceClient(operationsUrl);
 	const onSignOutClick = useCallback(async () => {
-		await onInstanceLogoutSubmit({ instanceClient });
+		await onInstanceLogoutSubmit({ instanceClient, entityId: instance.id });
 		authStore.setUserForEntity(instance, null);
 	}, [instance, instanceClient]);
 

src/features/clusters/components/ClusterCard.tsx

@@ -55,7 +55,7 @@ export function ClusterCard({ cluster }: { cluster: Cluster; }) {
 			console.error('Failed to lookup cluster details, proceeding without checking instances.', err);
 			return null;
 		});
-		await onInstanceLogoutSubmit({ instanceClient });
+		await onInstanceLogoutSubmit({ entityId: cluster.id, instanceClient });
 		if (fullCluster?.instances?.length) {
 			// Flag all cluster instances as signed out as well.
 			for (const instance of fullCluster.instances) {

src/features/instance/operations/mutations/onInstanceLogoutSubmit.ts

@@ -1,13 +1,15 @@
-import { InstanceClientConfig } from '@/config/instanceClientConfig';
+import { InstanceClientIdConfig } from '@/config/instanceClientConfig';
+import { authStore } from '@/features/auth/store/authStore';
 
 interface LogoutInfoResponse {
 	message: string;
 }
 
-export async function onInstanceLogoutSubmit({ instanceClient }: InstanceClientConfig): Promise<LogoutInfoResponse> {
+export async function onInstanceLogoutSubmit({ instanceClient, entityId }: InstanceClientIdConfig): Promise<LogoutInfoResponse> {
 	const { data } = await instanceClient.post('/', {
 		operation: 'logout',
 	});
+	authStore.flagForBasicAuth(entityId, null);
 	if (data) {
 		return data;
 	} else {

src/features/instance/operations/mutations/useInstanceLoginMutation.ts

@@ -1,29 +1,53 @@
-import { InstanceClientConfig } from '@/config/instanceClientConfig';
+import { InstanceClientIdConfig } from '@/config/instanceClientConfig';
+import { authStore } from '@/features/auth/store/authStore';
+import { getInstanceUserInfo } from '@/features/instance/operations/queries/getInstanceUserInfo';
+import { LocalUser } from '@/lib/api.patch';
 import { useMutation } from '@tanstack/react-query';
 
-interface InstanceLoginCredentials extends InstanceClientConfig {
+interface InstanceLoginCredentials extends InstanceClientIdConfig {
 	username: string;
 	password: string;
 }
 
 export interface LoginInfoResponse {
 	message: string;
+	user: LocalUser;
 }
 
 export async function onInstanceLoginSubmit({
 	username,
 	password,
 	instanceClient,
+	entityId,
 }: InstanceLoginCredentials): Promise<LoginInfoResponse> {
-	const { data } = await instanceClient.post('/', {
+	const { data: { message } } = await instanceClient.post('/', {
 		operation: 'login',
 		username,
 		password,
 	});
-	if (data) {
-		return data;
-	} else {
-		throw new Error('Something went wrong');
+
+	// Attempt to use the login with session storage only.
+	try {
+		const user = await getInstanceUserInfo({ instanceClient });
+		return {
+			message,
+			user,
+		};
+	} catch (err) {
+		console.error('Failed to get user after login, trying basic auth', err);
+
+		const user = await getInstanceUserInfo({
+			instanceClient,
+			auth: {
+				username,
+				password,
+			},
+		});
+		authStore.flagForBasicAuth(entityId, { username, password });
+		return {
+			message,
+			user,
+		};
 	}
 }
 

src/features/instance/operations/mutations/useInstanceResetPasswordMutation.ts

@@ -34,8 +34,9 @@ async function onInstanceResetPassword({
 			username: initialUsername,
 			password: tempPassword,
 			instanceClient,
+			entityId: clusterId,
 		});
-		// then create a new user
+		// then alter or create a new user
 		if (desiredUsername === defaultClusterUsername) {
 			await onAlterUser({
 				username: desiredUsername,
@@ -58,6 +59,7 @@ async function onInstanceResetPassword({
 				username: desiredUsername,
 				password: newPassword,
 				instanceClient,
+				entityId: clusterId,
 			});
 		}
 		// and finally, tell the central manager that we changed their password.
@@ -66,6 +68,7 @@ async function onInstanceResetPassword({
 	} catch (err) {
 		// If something went wrong, logout as well.
 		await onInstanceLogoutSubmit({
+			entityId: clusterId,
 			instanceClient,
 		});
 		throw err;