refactor(web): remove typescript

2024-02-27 15:23:23 +00:00
parent 636870a075
commit b3ae2d2748
337 changed files with 2067 additions and 4997 deletions
--- a/packages/web/src/components/AddAppConnection/index.jsx
+++ b/packages/web/src/components/AddAppConnection/index.jsx
@@ -0,0 +1,139 @@
+import LoadingButton from '@mui/lab/LoadingButton';
+import Alert from '@mui/material/Alert';
+import Dialog from '@mui/material/Dialog';
+import DialogContent from '@mui/material/DialogContent';
+import DialogContentText from '@mui/material/DialogContentText';
+import DialogTitle from '@mui/material/DialogTitle';
+import * as React from 'react';
+import { useNavigate, useSearchParams } from 'react-router-dom';
+import AppAuthClientsDialog from 'components/AppAuthClientsDialog/index.ee';
+import InputCreator from 'components/InputCreator';
+import * as URLS from 'config/urls';
+import useAuthenticateApp from 'hooks/useAuthenticateApp.ee';
+import useFormatMessage from 'hooks/useFormatMessage';
+import { generateExternalLink } from 'helpers/translationValues';
+import { Form } from './style';
+export default function AddAppConnection(props) {
+  const { application, connectionId, onClose } = props;
+  const { name, authDocUrl, key, auth } = application;
+  const navigate = useNavigate();
+  const [searchParams] = useSearchParams();
+  const formatMessage = useFormatMessage();
+  const [error, setError] = React.useState(null);
+  const [inProgress, setInProgress] = React.useState(false);
+  const hasConnection = Boolean(connectionId);
+  const useShared = searchParams.get('shared') === 'true';
+  const appAuthClientId = searchParams.get('appAuthClientId') || undefined;
+  const { authenticate } = useAuthenticateApp({
+    appKey: key,
+    connectionId,
+    appAuthClientId,
+    useShared: !!appAuthClientId,
+  });
+  React.useEffect(function relayProviderData() {
+    if (window.opener) {
+      window.opener.postMessage({
+        source: 'automatisch',
+        payload: { search: window.location.search, hash: window.location.hash },
+      });
+      window.close();
+    }
+  }, []);
+  React.useEffect(
+    function initiateSharedAuthenticationForGivenAuthClient() {
+      if (!appAuthClientId) return;
+      if (!authenticate) return;
+      const asyncAuthenticate = async () => {
+        await authenticate();
+        navigate(URLS.APP_CONNECTIONS(key));
+      };
+      asyncAuthenticate();
+    },
+    [appAuthClientId, authenticate],
+  );
+  const handleClientClick = (appAuthClientId) =>
+    navigate(URLS.APP_ADD_CONNECTION_WITH_AUTH_CLIENT_ID(key, appAuthClientId));
+  const handleAuthClientsDialogClose = () =>
+    navigate(URLS.APP_CONNECTIONS(key));
+  const submitHandler = React.useCallback(
+    async (data) => {
+      if (!authenticate) return;
+      setInProgress(true);
+      try {
+        const response = await authenticate({
+          fields: data,
+        });
+        onClose(response);
+      } catch (err) {
+        const error = err;
+        console.log(error);
+        setError(error.graphQLErrors?.[0]);
+      } finally {
+        setInProgress(false);
+      }
+    },
+    [authenticate],
+  );
+  if (useShared)
+    return (
+      <AppAuthClientsDialog
+        appKey={key}
+        onClose={handleAuthClientsDialogClose}
+        onClientClick={handleClientClick}
+      />
+    );
+  if (appAuthClientId) return <React.Fragment />;
+  return (
+    <Dialog open={true} onClose={onClose} data-test="add-app-connection-dialog">
+      <DialogTitle>
+        {hasConnection
+          ? formatMessage('app.reconnectConnection')
+          : formatMessage('app.addConnection')}
+      </DialogTitle>
+
+      {authDocUrl && (
+        <Alert severity="info" sx={{ fontWeight: 300 }}>
+          {formatMessage('addAppConnection.callToDocs', {
+            appName: name,
+            docsLink: generateExternalLink(authDocUrl),
+          })}
+        </Alert>
+      )}
+
+      {error && (
+        <Alert
+          severity="error"
+          sx={{ mt: 1, fontWeight: 500, wordBreak: 'break-all' }}
+        >
+          {error.message}
+          {error.details && (
+            <pre style={{ whiteSpace: 'pre-wrap' }}>
+              {JSON.stringify(error.details, null, 2)}
+            </pre>
+          )}
+        </Alert>
+      )}
+
+      <DialogContent>
+        <DialogContentText tabIndex={-1} component="div">
+          <Form onSubmit={submitHandler}>
+            {auth?.fields?.map((field) => (
+              <InputCreator key={field.key} schema={field} />
+            ))}
+
+            <LoadingButton
+              type="submit"
+              variant="contained"
+              color="primary"
+              sx={{ boxShadow: 2 }}
+              loading={inProgress}
+              data-test="create-connection-button"
+            >
+              {formatMessage('addAppConnection.submit')}
+            </LoadingButton>
+          </Form>
+        </DialogContentText>
+      </DialogContent>
+    </Dialog>
+  );
+}