From 5a42f70b65823a810cae50e38ca5c62b4a668875 Mon Sep 17 00:00:00 2001
From: Tom Moor <tom.moor@gmail.com>
Date: Fri, 25 Nov 2022 10:22:45 -0500
Subject: [PATCH] Add case for un-mapped custom domain to login page

---
 app/scenes/Login/index.tsx                 | 28 ++++++++++++++++++----
 shared/i18n/locales/en_US/translation.json |  4 ++++
 2 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/app/scenes/Login/index.tsx b/app/scenes/Login/index.tsx
index 81adf346e..c4b408425 100644
--- a/app/scenes/Login/index.tsx
+++ b/app/scenes/Login/index.tsx
@@ -13,7 +13,6 @@ import Fade from "~/components/Fade";
 import Flex from "~/components/Flex";
 import Heading from "~/components/Heading";
 import LoadingIndicator from "~/components/LoadingIndicator";
-import NoticeAlert from "~/components/NoticeAlert";
 import OutlineLogo from "~/components/OutlineLogo";
 import PageTitle from "~/components/PageTitle";
 import TeamLogo from "~/components/TeamLogo";
@@ -109,7 +108,8 @@ function Login({ children }: Props) {
         <Header />
         <Centered align="center" justify="center" column auto>
           <PageTitle title={t("Login")} />
-          <NoticeAlert>
+          <Heading centered>{t("Error")}</Heading>
+          <Note>
             {t("Failed to load configuration.")}
             {!isCloudHosted && (
               <p>
@@ -118,7 +118,7 @@ function Login({ children }: Props) {
                 )}
               </p>
             )}
-          </NoticeAlert>
+          </Note>
         </Centered>
       </Background>
     );
@@ -130,6 +130,26 @@ function Login({ children }: Props) {
     return <LoadingIndicator />;
   }
 
+  const isCustomDomain = parseDomain(window.location.origin).custom;
+
+  // Unmapped custom domain
+  if (isCloudHosted && isCustomDomain && !config.name) {
+    return (
+      <Background>
+        <Header config={config} />
+        <Centered align="center" justify="center" column auto>
+          <PageTitle title={t("Custom domain setup")} />
+          <Heading centered>{t("Almost there")}…</Heading>
+          <Note>
+            {t(
+              "Your custom domain is successfully pointing at Outline. To complete the setup process please contact support."
+            )}
+          </Note>
+        </Centered>
+      </Background>
+    );
+  }
+
   const hasMultipleProviders = config.providers.length > 1;
   const defaultProvider = find(
     config.providers,
@@ -168,7 +188,7 @@ function Login({ children }: Props) {
           title={config.name ? `${config.name} – ${t("Login")}` : t("Login")}
         />
         <Logo>
-          {config.logo ? (
+          {config.logo && !isCreate ? (
             <TeamLogo size={48} src={config.logo} />
           ) : (
             <OutlineLogo size={42} fill="currentColor" />
diff --git a/shared/i18n/locales/en_US/translation.json b/shared/i18n/locales/en_US/translation.json
index f72730ed9..f18ba3b51 100644
--- a/shared/i18n/locales/en_US/translation.json
+++ b/shared/i18n/locales/en_US/translation.json
@@ -577,8 +577,12 @@
   "Continue with {{ authProviderName }}": "Continue with {{ authProviderName }}",
   "Back to home": "Back to home",
   "Login": "Login",
+  "Error": "Error",
   "Failed to load configuration.": "Failed to load configuration.",
   "Check the network requests and server logs for full details of the error.": "Check the network requests and server logs for full details of the error.",
+  "Custom domain setup": "Custom domain setup",
+  "Almost there": "Almost there",
+  "Your custom domain is successfully pointing at Outline. To complete the setup process please contact support.": "Your custom domain is successfully pointing at Outline. To complete the setup process please contact support.",
   "Check your email": "Check your email",
   "A magic sign-in link has been sent to the email <em>{{ emailLinkSentTo }}</em> if an account exists.": "A magic sign-in link has been sent to the email <em>{{ emailLinkSentTo }}</em> if an account exists.",
   "Back to login": "Back to login",