feat: introduce app configs with shared auth clients (#1213)

packages/web/src/hooks/useApp.ts

@@ -0,0 +1,26 @@
+import { useQuery } from '@apollo/client';
+import { IApp } from '@automatisch/types';
+
+import { GET_APP } from 'graphql/queries/get-app';
+
+type QueryResponse = {
+  getApp: IApp;
+}
+
+export default function useApp(key: string) {
+  const {
+    data,
+    loading
+  } = useQuery<QueryResponse>(
+    GET_APP,
+    {
+      variables: { key }
+    }
+  );
+  const app = data?.getApp;
+
+  return {
+    app,
+    loading,
+  };
+}

packages/web/src/hooks/useAppAuthClient.ee.ts

@@ -0,0 +1,31 @@
+import { useLazyQuery } from '@apollo/client';
+import { AppConfig } from '@automatisch/types';
+import * as React from 'react';
+
+import { GET_APP_AUTH_CLIENT } from 'graphql/queries/get-app-auth-client.ee';
+
+type QueryResponse = {
+  getAppAuthClient: AppConfig;
+}
+
+export default function useAppAuthClient(id: string) {
+  const [
+    getAppAuthClient,
+    {
+      data,
+      loading
+    }
+  ] = useLazyQuery<QueryResponse>(GET_APP_AUTH_CLIENT);
+  const appAuthClient = data?.getAppAuthClient;
+
+  React.useEffect(function fetchUponId() {
+    if (!id) return;
+
+    getAppAuthClient({ variables: { id } });
+  }, [id]);
+
+  return {
+    appAuthClient,
+    loading,
+  };
+}

packages/web/src/hooks/useAppAuthClients.ee.ts

@@ -0,0 +1,33 @@
+import { useLazyQuery } from '@apollo/client';
+import { AppAuthClient } from '@automatisch/types';
+import * as React from 'react';
+
+import { GET_APP_AUTH_CLIENTS } from 'graphql/queries/get-app-auth-clients.ee';
+
+type QueryResponse = {
+  getAppAuthClients: AppAuthClient[];
+}
+
+export default function useAppAuthClient(appKey: string) {
+  const [
+    getAppAuthClients,
+    {
+      data,
+      loading
+    }
+  ] = useLazyQuery<QueryResponse>(GET_APP_AUTH_CLIENTS, {
+    context: { autoSnackbar: false },
+  });
+  const appAuthClients = data?.getAppAuthClients;
+
+  React.useEffect(function fetchUponAppKey() {
+    if (!appKey) return;
+
+    getAppAuthClients({ variables: { appKey, active: true } });
+  }, [appKey]);
+
+  return {
+    appAuthClients,
+    loading,
+  };
+}

packages/web/src/hooks/useAppConfig.ee.ts

@@ -0,0 +1,27 @@
+import { useQuery } from '@apollo/client';
+import { AppConfig } from '@automatisch/types';
+
+import { GET_APP_CONFIG } from 'graphql/queries/get-app-config.ee';
+
+type QueryResponse = {
+  getAppConfig: AppConfig;
+}
+
+export default function useAppConfig(key: string) {
+  const {
+    data,
+    loading
+  } = useQuery<QueryResponse>(
+    GET_APP_CONFIG,
+    {
+      variables: { key },
+      context: { autoSnackbar: false }
+    }
+  );
+  const appConfig = data?.getAppConfig;
+
+  return {
+    appConfig,
+    loading,
+  };
+}

packages/web/src/hooks/useAuthenticateApp.ee.ts

@@ -0,0 +1,100 @@
+import { IApp } from '@automatisch/types';
+import * as React from 'react';
+
+import { processStep } from 'helpers/authenticationSteps';
+import computeAuthStepVariables from 'helpers/computeAuthStepVariables';
+import useApp from './useApp';
+
+type UseAuthenticateAppParams = {
+  appKey: string;
+  appAuthClientId?: string;
+  useShared?: boolean;
+  connectionId?: string;
+}
+
+type AuthenticatePayload = {
+  fields?: Record<string, string>;
+  appAuthClientId?: string;
+}
+
+function getSteps(auth: IApp['auth'], hasConnection: boolean, useShared: boolean) {
+  if (hasConnection) {
+    if (useShared) {
+      return auth?.sharedReconnectionSteps;
+    }
+
+    return auth?.reconnectionSteps;
+  }
+
+  if (useShared) {
+    return auth?.sharedAuthenticationSteps;
+  }
+
+  return auth?.authenticationSteps;
+}
+
+export default function useAuthenticateApp(payload: UseAuthenticateAppParams) {
+  const {
+    appKey,
+    appAuthClientId,
+    connectionId,
+    useShared = false,
+  } = payload;
+  const { app } = useApp(appKey);
+  const [
+    authenticationInProgress,
+    setAuthenticationInProgress
+  ] = React.useState(false);
+  const steps = getSteps(app?.auth, !!connectionId, useShared);
+
+  const authenticate = React.useMemo(() => {
+    if (!steps?.length) return;
+
+    return async function authenticate(payload: AuthenticatePayload = {}) {
+      const {
+        fields,
+      } = payload;
+      setAuthenticationInProgress(true);
+
+      const response: Record<string, any> = {
+        key: appKey,
+        appAuthClientId: appAuthClientId || payload.appAuthClientId,
+        connection: {
+          id: connectionId,
+        },
+        fields
+      };
+
+      let stepIndex = 0;
+      while (stepIndex < steps?.length) {
+        const step = steps[stepIndex];
+        const variables = computeAuthStepVariables(step.arguments, response);
+
+        try {
+          const stepResponse = await processStep(step, variables);
+
+          response[step.name] = stepResponse;
+        } catch (err) {
+          console.log(err);
+          throw err;
+
+          setAuthenticationInProgress(false);
+          break;
+        }
+
+        stepIndex++;
+
+        if (stepIndex === steps.length) {
+          return response;
+        }
+
+        setAuthenticationInProgress(false);
+      }
+    }
+  }, [steps, appKey, appAuthClientId, connectionId]);
+
+  return {
+    authenticate,
+    inProgress: authenticationInProgress,
+  };
+}