AlbyAuthRedirect.tsx raw

   1  import React from "react";
   2  import { useLocation } from "react-router";
   3  import AuthCodeForm from "src/components/AuthCodeForm";
   4  
   5  import Loading from "src/components/Loading";
   6  import { useInfo } from "src/hooks/useInfo";
   7  
   8  export default function AlbyAuthRedirect() {
   9    const { data: info } = useInfo();
  10    const location = useLocation();
  11    const queryParams = new URLSearchParams(location.search);
  12    const forceLogin = !!queryParams.get("force_login");
  13    const url = info?.albyAuthUrl
  14      ? (() => {
  15          const _url = new URL(info.albyAuthUrl);
  16          if (forceLogin) {
  17            _url.searchParams.append("force_login", "true");
  18          }
  19          if (info.albyUserIdentifier) {
  20            _url.searchParams.append("identifier", info.albyUserIdentifier);
  21          }
  22  
  23          return _url.toString();
  24        })()
  25      : undefined;
  26  
  27    React.useEffect(() => {
  28      if (!info || !url) {
  29        return;
  30      }
  31      if (info.oauthRedirect) {
  32        window.location.href = url;
  33      }
  34    }, [info, url]);
  35  
  36    return !info || info.oauthRedirect || !url ? (
  37      <>
  38        <title>Connect your Alby Account · Alby Hub</title>
  39        <Loading />
  40      </>
  41    ) : (
  42      <AuthCodeForm url={url} />
  43    );
  44  }
  45