From f603b1ba5eabf804911476bfed2a8e56bb542c22 Mon Sep 17 00:00:00 2001
From: Maximilian Kaske <56969857+mxkaske@users.noreply.github.com>
Date: Tue, 22 Aug 2023 10:48:38 +0200
Subject: [PATCH] Fix/custom domain on save (#224)

* chore: little stuff

* fix: ssr error - checking csr user instead

* hotfix: missing custom domain
---
 apps/web/src/app/app/(auth)/layout.tsx          |  9 +++++++--
 .../app/(auth)/sign-in/[[...sign-in]]/page.tsx  | 10 +---------
 .../app/(auth)/sign-up/[[...sign-up]]/page.tsx  | 10 +---------
 apps/web/src/app/blog/[slug]/page.tsx           |  1 -
 .../src/components/forms/status-page-form.tsx   |  1 +
 apps/web/src/components/layout/app-header.tsx   |  2 +-
 .../src/components/layout/marketing-footer.tsx  | 17 ++++++++++-------
 .../src/components/layout/marketing-header.tsx  | 11 ++++++++++-
 8 files changed, 31 insertions(+), 30 deletions(-)

diff --git a/apps/web/src/app/app/(auth)/layout.tsx b/apps/web/src/app/app/(auth)/layout.tsx
index 93509cb0e..38673dcee 100644
--- a/apps/web/src/app/app/(auth)/layout.tsx
+++ b/apps/web/src/app/app/(auth)/layout.tsx
@@ -1,12 +1,17 @@
 import * as React from "react";
-
-// TODO: update description
+import { redirect } from "next/navigation";
+import { auth } from "@clerk/nextjs";
 
 export default function AuthLayout({
   children,
 }: {
   children: React.ReactNode;
 }) {
+  const { userId } = auth();
+
+  if (userId) {
+    redirect("/app");
+  }
   return (
     <div className="grid min-h-screen grid-cols-1 md:grid-cols-2 xl:grid-cols-3">
       <aside className="border-border col-span-1 flex w-full items-center justify-center border p-3 backdrop-blur-[2px] md:p-6">
diff --git a/apps/web/src/app/app/(auth)/sign-in/[[...sign-in]]/page.tsx b/apps/web/src/app/app/(auth)/sign-in/[[...sign-in]]/page.tsx
index 3a48f6797..889711c52 100644
--- a/apps/web/src/app/app/(auth)/sign-in/[[...sign-in]]/page.tsx
+++ b/apps/web/src/app/app/(auth)/sign-in/[[...sign-in]]/page.tsx
@@ -1,13 +1,5 @@
-import { redirect } from "next/navigation";
-import { auth, SignIn } from "@clerk/nextjs";
+import { SignIn } from "@clerk/nextjs";
 
 export default function Page() {
-  const { userId } = auth();
-
-  // TODO: we can improve the UX here. If user is logged in, (s)he will see the screen for a quick moment
-  if (userId) {
-    redirect("/app");
-  }
-
   return <SignIn redirectUrl={"/app"} afterSignInUrl={"/app"} />;
 }
diff --git a/apps/web/src/app/app/(auth)/sign-up/[[...sign-up]]/page.tsx b/apps/web/src/app/app/(auth)/sign-up/[[...sign-up]]/page.tsx
index d47b3a721..effaf9b5f 100644
--- a/apps/web/src/app/app/(auth)/sign-up/[[...sign-up]]/page.tsx
+++ b/apps/web/src/app/app/(auth)/sign-up/[[...sign-up]]/page.tsx
@@ -1,13 +1,5 @@
-import { redirect } from "next/navigation";
-import { auth, SignUp } from "@clerk/nextjs";
+import { SignUp } from "@clerk/nextjs";
 
 export default function Page() {
-  const { userId } = auth();
-
-  // TODO: we can improve the UX here. If user is logged in, (s)he will see the screen for a quick moment
-  if (userId) {
-    redirect("/app");
-  }
-
   return <SignUp redirectUrl={"/app"} afterSignUpUrl={"/app"} />;
 }
diff --git a/apps/web/src/app/blog/[slug]/page.tsx b/apps/web/src/app/blog/[slug]/page.tsx
index 139072163..3f6812ad4 100644
--- a/apps/web/src/app/blog/[slug]/page.tsx
+++ b/apps/web/src/app/blog/[slug]/page.tsx
@@ -75,7 +75,6 @@ export default function PostPage({ params }: { params: { slug: string } }) {
     );
   };
 
-  // TODO: add author.avatar and author.url
   return (
     <>
       <BackButton href="/blog" />
diff --git a/apps/web/src/components/forms/status-page-form.tsx b/apps/web/src/components/forms/status-page-form.tsx
index 886244b93..6df3a948e 100644
--- a/apps/web/src/components/forms/status-page-form.tsx
+++ b/apps/web/src/components/forms/status-page-form.tsx
@@ -54,6 +54,7 @@ export function StatusPageForm({
       workspaceId: defaultValues?.workspaceId || 0,
       id: defaultValues?.id || 0,
       monitors: defaultValues?.monitors ?? [],
+      customDomain: defaultValues?.customDomain || "", // HOTFIX: we need to keep all the other overwrites. Ideally, we append it in the api.update({ ...defaultValues, ...props })
       workspaceSlug: "",
       icon: defaultValues?.icon || "",
     },
diff --git a/apps/web/src/components/layout/app-header.tsx b/apps/web/src/components/layout/app-header.tsx
index 45927215b..e2ac29e96 100644
--- a/apps/web/src/components/layout/app-header.tsx
+++ b/apps/web/src/components/layout/app-header.tsx
@@ -19,7 +19,7 @@ export function AppHeader() {
           href="/"
           className="font-cal text-muted-foreground hover:text-foreground text-lg"
         >
-          openstatus
+          OpenStatus
         </Link>
         <div className="flex items-center gap-4">
           {/* can be moved to a different place */}
diff --git a/apps/web/src/components/layout/marketing-footer.tsx b/apps/web/src/components/layout/marketing-footer.tsx
index a80b0b968..f4ce4a81c 100644
--- a/apps/web/src/components/layout/marketing-footer.tsx
+++ b/apps/web/src/components/layout/marketing-footer.tsx
@@ -22,11 +22,8 @@ export function MarketingFooter({ className }: Props) {
         </div>
         <div className="flex flex-col gap-3 text-sm">
           <p className="text-foreground font-semibold">Community</p>
-          <FooterLink
-            href="https://github.com/openstatushq/openstatus"
-            label="GitHub"
-          />
-          <FooterLink href="https://discord.gg/dHD4JtSfsn" label="Discord" />
+          <FooterLink href="/github" label="GitHub" external />
+          <FooterLink href="/discord" label="Discord" external />
         </div>
         <div className="flex flex-col gap-3 text-sm">
           <p className="text-foreground font-semibold">Resources</p>
@@ -44,8 +41,14 @@ export function MarketingFooter({ className }: Props) {
   );
 }
 
-function FooterLink({ href, label }: Record<"href" | "label", string>) {
-  const isExternal = href.startsWith("http");
+interface FooterLinkProps {
+  href: string;
+  label: string;
+  external?: boolean;
+}
+
+function FooterLink({ href, label, external = false }: FooterLinkProps) {
+  const isExternal = external || href.startsWith("http");
 
   const LinkSlot = isExternal ? "a" : Link;
 
diff --git a/apps/web/src/components/layout/marketing-header.tsx b/apps/web/src/components/layout/marketing-header.tsx
index 8ef55ee1a..a1725bc0f 100644
--- a/apps/web/src/components/layout/marketing-header.tsx
+++ b/apps/web/src/components/layout/marketing-header.tsx
@@ -1,4 +1,7 @@
+"use client";
+
 import Link from "next/link";
+import { useUser } from "@clerk/nextjs";
 
 import { Button } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
@@ -9,6 +12,8 @@ interface Props {
 }
 
 export function MarketingHeader({ className }: Props) {
+  const { isSignedIn } = useUser();
+
   return (
     <header
       className={cn(
@@ -22,7 +27,11 @@ export function MarketingHeader({ className }: Props) {
           <Link href="/blog">Blog</Link>
         </Button>
         <Button asChild className="rounded-full">
-          <Link href="/app/sign-up">Sign Up</Link>
+          {isSignedIn ? (
+            <Link href="/app">Dashboard</Link>
+          ) : (
+            <Link href="/app/sign-up">Sign Up</Link>
+          )}
         </Button>
       </div>
     </header>
-- 
2.51.2