From c14536d34fb061e0bda63af0ef5747ee29dbf9fd Mon Sep 17 00:00:00 2001
From: Maximilian Kaske <56969857+mxkaske@users.noreply.github.com>
Date: Thu, 31 Jul 2025 20:40:39 +0200
Subject: [PATCH] fix: link, font and toast error (#1302)

---
 .../app/(public)/login/_components/magic-link-form.tsx   | 2 +-
 apps/dashboard/src/app/(public)/login/layout.tsx         | 7 +++----
 apps/dashboard/src/app/(public)/login/page.tsx           | 8 ++++----
 apps/dashboard/src/app/layout.tsx                        | 8 +++++++-
 .../src/components/forms/onboarding/create-monitor.tsx   | 9 ++++++++-
 .../src/components/forms/onboarding/create-page.tsx      | 9 ++++++++-
 6 files changed, 31 insertions(+), 12 deletions(-)

diff --git a/apps/dashboard/src/app/(public)/login/_components/magic-link-form.tsx b/apps/dashboard/src/app/(public)/login/_components/magic-link-form.tsx
index 01705587..9ca16e66 100644
--- a/apps/dashboard/src/app/(public)/login/_components/magic-link-form.tsx
+++ b/apps/dashboard/src/app/(public)/login/_components/magic-link-form.tsx
@@ -32,7 +32,7 @@ export default function MagicLinkForm() {
         <Input id="email" name="email" type="email" required />
       </div>
       <Button variant="secondary" className="w-full">
-        {pending ? "Logging..." : "Log magic link"}
+        {pending ? "Logging..." : "Log Magic Link"}
       </Button>
     </form>
   );
diff --git a/apps/dashboard/src/app/(public)/login/layout.tsx b/apps/dashboard/src/app/(public)/login/layout.tsx
index 444f0ce3..3a0f825b 100644
--- a/apps/dashboard/src/app/(public)/login/layout.tsx
+++ b/apps/dashboard/src/app/(public)/login/layout.tsx
@@ -1,5 +1,4 @@
 import Image from "next/image";
-import Link from "next/link";
 import { redirect } from "next/navigation";
 
 import { auth } from "@/lib/auth";
@@ -14,8 +13,8 @@ export default async function AuthLayout({
 
   return (
     <div className="grid min-h-screen grid-cols-1 gap-4 md:grid-cols-2 xl:grid-cols-5">
-      <aside className="col-span-1 flex w-full flex-col gap-4 border border-border p-4 backdrop-blur-[2px] md:p-8 xl:col-span-2">
-        <Link href="/" className="relative h-8 w-8">
+      <aside className="col-span-1 flex w-full flex-col gap-4 border border-border p-4 backdrop-blur-[2px] md:p-8 xl:col-span-2 bg-sidebar">
+        <a href="https://openstatus.dev" className="relative h-8 w-8">
           <Image
             src="https://openstatus.dev/icon.png"
             alt="OpenStatus"
@@ -23,7 +22,7 @@ export default async function AuthLayout({
             width={32}
             className="rounded-full border border-border"
           />
-        </Link>
+        </a>
         <div className="mx-auto flex w-full max-w-lg flex-1 flex-col justify-center gap-8 text-center md:text-left">
           <div className="mx-auto grid gap-3">
             <h1 className="font-cal text-3xl text-foreground">
diff --git a/apps/dashboard/src/app/(public)/login/page.tsx b/apps/dashboard/src/app/(public)/login/page.tsx
index da603037..06ff01bf 100644
--- a/apps/dashboard/src/app/(public)/login/page.tsx
+++ b/apps/dashboard/src/app/(public)/login/page.tsx
@@ -16,8 +16,8 @@ export default async function Page(props: {
   const { redirectTo } = searchParamsCache.parse(searchParams);
 
   return (
-    <div className="my-4 grid w-full max-w-xl gap-6 md:p-10">
-      <div className="flex flex-col gap-2 text-center">
+    <div className="my-4 grid w-full max-w-lg gap-6">
+      <div className="flex flex-col gap-1 text-center">
         <h1 className="font-semibold text-3xl tracking-tight">Sign In</h1>
         <p className="text-muted-foreground text-sm">
           Get started now. No credit card required.
@@ -56,14 +56,14 @@ export default async function Page(props: {
       <p className="px-8 text-center text-muted-foreground text-sm">
         By clicking continue, you agree to our{" "}
         <Link
-          href="/legal/terms"
+          href="https://openstatus.dev/legal/terms"
           className="underline underline-offset-4 hover:text-primary hover:no-underline"
         >
           Terms of Service
         </Link>{" "}
         and{" "}
         <Link
-          href="/legal/privacy"
+          href="https://openstatus.dev/legal/privacy"
           className="underline underline-offset-4 hover:text-primary hover:no-underline"
         >
           Privacy Policy
diff --git a/apps/dashboard/src/app/layout.tsx b/apps/dashboard/src/app/layout.tsx
index 2f401012..10aa5900 100644
--- a/apps/dashboard/src/app/layout.tsx
+++ b/apps/dashboard/src/app/layout.tsx
@@ -5,6 +5,7 @@ import { DevelopmentIndicator } from "@/components/development-indicator";
 import { TailwindIndicator } from "@/components/tailwind-indicator";
 import { ThemeProvider } from "@/components/theme-provider";
 import { Toaster } from "@/components/ui/sonner";
+import { cn } from "@/lib/utils";
 import LocalFont from "next/font/local";
 import { NuqsAdapter } from "nuqs/adapters/next/app";
 import { ogMetadata, twitterMetadata } from "./metadata";
@@ -45,7 +46,12 @@ export default function RootLayout({
   return (
     <html lang="en" suppressHydrationWarning>
       <body
-        className={`${geistSans.variable}${geistMono.variable}${cal.variable} antialiased`}
+        className={cn(
+          geistSans.variable,
+          geistMono.variable,
+          cal.variable,
+          "antialiased",
+        )}
       >
         <NuqsAdapter>
           <ThemeProvider
diff --git a/apps/dashboard/src/components/forms/onboarding/create-monitor.tsx b/apps/dashboard/src/components/forms/onboarding/create-monitor.tsx
index dbaa157a..b13339fc 100644
--- a/apps/dashboard/src/components/forms/onboarding/create-monitor.tsx
+++ b/apps/dashboard/src/components/forms/onboarding/create-monitor.tsx
@@ -11,6 +11,7 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { isTRPCClientError } from "@trpc/client";
 import { useTransition } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -47,7 +48,13 @@ export function CreateMonitorForm({
         toast.promise(promise, {
           loading: "Saving...",
           success: () => "Saved",
-          error: "Failed to save",
+          error: (error) => {
+            if (isTRPCClientError(error)) {
+              return error.message;
+            }
+            console.error(error);
+            return "Failed to save";
+          },
         });
         await promise;
       } catch (error) {
diff --git a/apps/dashboard/src/components/forms/onboarding/create-page.tsx b/apps/dashboard/src/components/forms/onboarding/create-page.tsx
index f29c9afb..4f7ac797 100644
--- a/apps/dashboard/src/components/forms/onboarding/create-page.tsx
+++ b/apps/dashboard/src/components/forms/onboarding/create-page.tsx
@@ -11,6 +11,7 @@ import {
   FormMessage,
 } from "@/components/ui/form";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { isTRPCClientError } from "@trpc/client";
 import { useTransition } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -45,7 +46,13 @@ export function CreatePageForm({
         toast.promise(promise, {
           loading: "Saving...",
           success: () => "Saved",
-          error: "Failed to save",
+          error: (error) => {
+            if (isTRPCClientError(error)) {
+              return error.message;
+            }
+            console.error(error);
+            return "Failed to save";
+          },
         });
         await promise;
       } catch (error) {
-- 
2.51.2