chore: refactor domain parsing to be more general (#3448)

* change the api of domain parsing to just parseDomain and getCookieDomain
* adds getBaseDomain as the method to get the domain after any official subdomains

app/components/Authenticated.tsx

@@ -2,7 +2,7 @@ import { observer } from "mobx-react";
 import * as React from "react";
 import { useTranslation } from "react-i18next";
 import { Redirect } from "react-router-dom";
-import { isCustomSubdomain } from "@shared/utils/domains";
+import { parseDomain } from "@shared/utils/domains";
 import LoadingIndicator from "~/components/LoadingIndicator";
 import env from "~/env";
 import useStores from "~/hooks/useStores";
@@ -40,9 +40,7 @@ const Authenticated = ({ children }: Props) => {
       }
     } else if (
       env.SUBDOMAINS_ENABLED &&
-      team.subdomain &&
-      isCustomSubdomain(hostname) &&
-      !hostname.startsWith(`${team.subdomain}.`)
+      parseDomain(hostname).teamSubdomain !== (team.subdomain ?? "")
     ) {
       window.location.href = `${team.url}${window.location.pathname}`;
       return <LoadingIndicator />;

app/scenes/Document/components/Document.tsx

@@ -15,6 +15,7 @@ import {
 import styled from "styled-components";
 import breakpoint from "styled-components-breakpoint";
 import { Heading } from "@shared/editor/lib/getHeadings";
+import { parseDomain } from "@shared/utils/domains";
 import getTasks from "@shared/utils/getTasks";
 import RootStore from "~/stores/RootStore";
 import Document from "~/models/Document";
@@ -33,7 +34,6 @@ import withStores from "~/components/withStores";
 import type { Editor as TEditor } from "~/editor";
 import { NavigationNode } from "~/types";
 import { client } from "~/utils/ApiClient";
-import { isCustomDomain } from "~/utils/domains";
 import { emojiToUrl } from "~/utils/emoji";
 import { isModKey } from "~/utils/keyboard";
 import {
@@ -630,7 +630,7 @@ class DocumentScene extends React.Component<Props> {
                 </Flex>
               </React.Suspense>
             </MaxWidth>
-            {isShare && !isCustomDomain() && (
+            {isShare && !parseDomain(window.location.origin).custom && (
               <Branding href="//www.getoutline.com?ref=sharelink" />
             )}
           </Container>

app/scenes/Login/index.tsx

@@ -6,6 +6,7 @@ import { Trans, useTranslation } from "react-i18next";
 import { useLocation, Link, Redirect } from "react-router-dom";
 import styled from "styled-components";
 import { getCookie, setCookie } from "tiny-cookie";
+import { parseDomain } from "@shared/utils/domains";
 import { Config } from "~/stores/AuthStore";
 import ButtonLarge from "~/components/ButtonLarge";
 import Fade from "~/components/Fade";
@@ -20,7 +21,6 @@ import Text from "~/components/Text";
 import env from "~/env";
 import useQuery from "~/hooks/useQuery";
 import useStores from "~/hooks/useStores";
-import { isCustomDomain } from "~/utils/domains";
 import isCloudHosted from "~/utils/isCloudHosted";
 import { changeLanguage, detectLanguage } from "~/utils/language";
 import AuthenticationProvider from "./AuthenticationProvider";
@@ -30,7 +30,7 @@ function Header({ config }: { config?: Config | undefined }) {
   const { t } = useTranslation();
   const isSubdomain = !!config?.hostname;
 
-  if (!isCloudHosted || isCustomDomain()) {
+  if (!isCloudHosted || parseDomain(window.location.origin).custom) {
     return null;
   }
 

app/scenes/Settings/Details.tsx

@@ -3,6 +3,7 @@ import { TeamIcon } from "outline-icons";
 import { useRef, useState } from "react";
 import * as React from "react";
 import { useTranslation, Trans } from "react-i18next";
+import { getBaseDomain } from "@shared/utils/domains";
 import Button from "~/components/Button";
 import DefaultCollectionInputSelect from "~/components/DefaultCollectionInputSelect";
 import Heading from "~/components/Heading";
@@ -141,7 +142,9 @@ function Details() {
             subdomain ? (
               <>
                 <Trans>Your knowledge base will be accessible at</Trans>{" "}
-                <strong>{subdomain}.getoutline.com</strong>
+                <strong>
+                  {subdomain}.{getBaseDomain()}
+                </strong>
               </>
             ) : (
               t("Choose a subdomain to enable a login page just for your team.")

app/stores/AuthStore.ts

@@ -2,6 +2,7 @@ import * as Sentry from "@sentry/react";
 import invariant from "invariant";
 import { observable, action, computed, autorun, runInAction } from "mobx";
 import { getCookie, setCookie, removeCookie } from "tiny-cookie";
+import { getCookieDomain } from "@shared/utils/domains";
 import RootStore from "~/stores/RootStore";
 import Policy from "~/models/Policy";
 import Team from "~/models/Team";
@@ -9,7 +10,6 @@ import User from "~/models/User";
 import env from "~/env";
 import { client } from "~/utils/ApiClient";
 import Storage from "~/utils/Storage";
-import { getCookieDomain } from "~/utils/domains";
 
 const AUTH_STORE = "AUTH_STORE";
 const NO_REDIRECT_PATHS = ["/", "/create", "/home"];

app/utils/domains.ts

@@ -1,14 +0,0 @@
-import { parseDomain, stripSubdomain } from "@shared/utils/domains";
-import env from "~/env";
-
-export function getCookieDomain(domain: string) {
-  return env.SUBDOMAINS_ENABLED ? stripSubdomain(domain) : domain;
-}
-
-export function isCustomDomain() {
-  const parsed = parseDomain(window.location.origin);
-  const main = parseDomain(env.URL);
-  return (
-    parsed && main && (main.domain !== parsed.domain || main.tld !== parsed.tld)
-  );
-}