From 6aab6ac3fa7a7a63c0c7fd97ba5f4c35c291b4b9 Mon Sep 17 00:00:00 2001
From: Mathieu Virbel <mat@meltingrocks.com>
Date: Wed, 4 Sep 2024 09:26:23 -0600
Subject: [PATCH] fix: fix global layout overscroll + link colors (#404)

---
 www/app/(app)/browse/page.tsx                 |  2 +-
 www/app/(app)/layout.tsx                      | 16 ++------
 www/app/(app)/transcripts/new/page.tsx        |  5 ++-
 .../(app)/transcripts/useTranscriptList.ts    |  1 -
 www/app/(auth)/userInfo.tsx                   | 39 +++++++------------
 www/app/layout.tsx                            |  2 +-
 6 files changed, 23 insertions(+), 42 deletions(-)

diff --git a/www/app/(app)/browse/page.tsx b/www/app/(app)/browse/page.tsx
index 21fa553d..52e80454 100644
--- a/www/app/(app)/browse/page.tsx
+++ b/www/app/(app)/browse/page.tsx
@@ -128,13 +128,13 @@ export default function TranscriptBrowser() {
       gap={2}
       overflowY="auto"
       minH="100%"
-      mt={8}
     >
       <Flex
         flexDir="row"
         justify="flex-end"
         align="center"
         flexWrap={"wrap-reverse"}
+        mt={4}
       >
         {session?.user?.name ? (
           <Heading size="md">{session?.user?.name}'s Meetings</Heading>
diff --git a/www/app/(app)/layout.tsx b/www/app/(app)/layout.tsx
index 89e9c276..f700a31a 100644
--- a/www/app/(app)/layout.tsx
+++ b/www/app/(app)/layout.tsx
@@ -54,7 +54,7 @@ export default async function AppLayout({
           <Link
             as={NextLink}
             href="/transcripts/new"
-            className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
+            className="font-light px-2"
           >
             Create
           </Link>
@@ -64,7 +64,7 @@ export default async function AppLayout({
               <Link
                 href="/browse"
                 as={NextLink}
-                className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
+                className="font-light px-2"
                 prefetch={false}
               >
                 Browse
@@ -79,7 +79,7 @@ export default async function AppLayout({
               <Link
                 href="/rooms"
                 as={NextLink}
-                className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2"
+                className="font-light px-2"
                 prefetch={false}
               >
                 Rooms
@@ -88,16 +88,6 @@ export default async function AppLayout({
           ) : (
             <></>
           )}
-          &nbsp;·&nbsp;
-          <About buttonText="About" />
-          {privacy ? (
-            <>
-              &nbsp;·&nbsp;
-              <Privacy buttonText="Privacy" />
-            </>
-          ) : (
-            <></>
-          )}
           {requireLogin ? (
             <>
               &nbsp;·&nbsp;
diff --git a/www/app/(app)/transcripts/new/page.tsx b/www/app/(app)/transcripts/new/page.tsx
index fd3fdcb5..eea51291 100644
--- a/www/app/(app)/transcripts/new/page.tsx
+++ b/www/app/(app)/transcripts/new/page.tsx
@@ -102,14 +102,15 @@ const TranscriptCreate = () => {
       flexDir="column"
       margin="auto"
       gap={2}
-      overflowY="auto"
       maxH="100%"
+      px={{ base: 5, md: 10 }}
+      py={5}
     >
       <Flex
         flexDir={{ base: "column", md: "row" }}
         justify="space-between"
         align="center"
-        gap={4}
+        gap={8}
       >
         <Flex
           flexDir="column"
diff --git a/www/app/(app)/transcripts/useTranscriptList.ts b/www/app/(app)/transcripts/useTranscriptList.ts
index 378b3036..d0f62eee 100644
--- a/www/app/(app)/transcripts/useTranscriptList.ts
+++ b/www/app/(app)/transcripts/useTranscriptList.ts
@@ -10,7 +10,6 @@ type TranscriptList = {
   refetch: () => void;
 };
 
-//always protected
 const useTranscriptList = (page: number): TranscriptList => {
   const [response, setResponse] = useState<Page_GetTranscript_ | null>(null);
   const [loading, setLoading] = useState<boolean>(true);
diff --git a/www/app/(auth)/userInfo.tsx b/www/app/(auth)/userInfo.tsx
index a2958371..9fe890b0 100644
--- a/www/app/(auth)/userInfo.tsx
+++ b/www/app/(auth)/userInfo.tsx
@@ -1,7 +1,6 @@
 "use client";
 import { useSession, signOut, signIn } from "next-auth/react";
-import { Spinner } from "@chakra-ui/react";
-import Link from "next/link";
+import { Spinner, Link } from "@chakra-ui/react";
 
 export default function UserInfo() {
   const { status } = useSession();
@@ -11,28 +10,20 @@ export default function UserInfo() {
   return !sessionReady ? (
     <Spinner size="xs" thickness="1px" className="mx-3" />
   ) : !isAuthenticated ? (
-    <span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px] font-light px-2">
-      <Link
-        href="/"
-        onClick={() => signIn("authentik")}
-        className="outline-none"
-        prefetch={false}
-      >
-        Log in
-      </Link>
-    </span>
+    <Link
+      href="/"
+      className="font-light px-2"
+      onClick={() => signIn("authentik")}
+    >
+      Log in
+    </Link>
   ) : (
-    <span className="font-light px-2">
-      <span className="hover:underline focus-within:underline underline-offset-2 decoration-[.5px]">
-        <Link
-          href="#"
-          onClick={() => signOut({ callbackUrl: "/" })}
-          className="outline-none"
-          prefetch={false}
-        >
-          Log out
-        </Link>
-      </span>
-    </span>
+    <Link
+      href="#"
+      className="font-light px-2"
+      onClick={() => signOut({ callbackUrl: "/" })}
+    >
+      Log out
+    </Link>
   );
 }
diff --git a/www/app/layout.tsx b/www/app/layout.tsx
index a1fa1af2..5afc432c 100644
--- a/www/app/layout.tsx
+++ b/www/app/layout.tsx
@@ -65,7 +65,7 @@ export default async function RootLayout({
 
   return (
     <html lang="en">
-      <body className={"h-[100svh] w-[100svw] overflow-hidden relative"}>
+      <body className={"h-[100svh] w-[100svw] overflow-x-hidden relative"}>
         <SessionProvider>
           <DomainContextProvider config={config}>
             <ErrorBoundary fallback={<p>"something went really wrong"</p>}>