Function SlackConnectView

webapp/src/component/slack/SlackConnectView.tsx:54–176

()

}

export const SlackConnectView = () => {
  const { t } = useTranslate();
  const location = useLocation();
  const user = useUser();
  const history = useHistory();

  const queryParameters = new URLSearchParams(location.search);
  const encryptedData = queryParameters.get('data');

  const slackMutation = useApiMutation({
    url: '/v2/slack/user-login',
    method: 'post',
    fetchOptions: {
      disableErrorNotification: true,
    },
  });

  const connectionInfo = useApiQuery({
    url: '/v2/slack/user-login-info',
    method: 'get',
    query: {
      data: encryptedData!,
    },
    fetchOptions: {
      disableErrorNotification: true,
    },
  });

  if (!encryptedData) {
    return <div>Invalid slack login parameters</div>;
  }
  const connectSlack = () => {
    slackMutation.mutate(
      { query: { data: encryptedData } },
      {
        onSuccess: () => {
          history.replace(LINKS.SLACK_CONNECTED.build());
        },
      }
    );
  };

  const error = slackMutation.error || connectionInfo.error;

  return (
    <DashboardPage>
      <CompactView
        alerts={
          error?.code && (
            <Alert severity="error" sx={{ mb: 1 }}>
              <TranslatedError code={error.code} />
            </Alert>
          )
        }
        maxWidth={800}
        windowTitle={t('slack_connect_title')}
        primaryContent={
          <>