From 9e4ef90d7349bb9458e5985bef41493da4899ad7 Mon Sep 17 00:00:00 2001
From: Ahmad <103906421+ahmadk953@users.noreply.github.com>
Date: Mon, 23 Dec 2024 15:54:45 -0500
Subject: [PATCH] Started Migration to Fluid-Tailwind and Misc Fixes

---
 app/(main)/_components/footer.tsx      | 1 -
 app/(main)/blog/page.tsx               | 2 +-
 app/(main)/blog/posts/[post]/page.tsx  | 4 ++--
 app/(main)/blog/posts/blog-welcome.mdx | 2 +-
 app/(main)/layout.tsx                  | 6 +-----
 app/(main)/page.tsx                    | 8 ++++----
 app/api/cards/[cardId]/logs/route.ts   | 8 ++++++--
 app/api/cards/[cardId]/route.ts        | 6 +++++-
 sentry.client.config.ts                | 2 +-
 9 files changed, 21 insertions(+), 18 deletions(-)

diff --git a/app/(main)/_components/footer.tsx b/app/(main)/_components/footer.tsx
index 6d749fe..bf6da7a 100644
--- a/app/(main)/_components/footer.tsx
+++ b/app/(main)/_components/footer.tsx
@@ -1,6 +1,5 @@
 import { Logo } from '@/components/logo';
 import { Button } from '@/components/ui/button';
-import Link from 'next/link';
 
 export const Footer = () => {
   return (
diff --git a/app/(main)/blog/page.tsx b/app/(main)/blog/page.tsx
index 0b4accb..4e956f5 100644
--- a/app/(main)/blog/page.tsx
+++ b/app/(main)/blog/page.tsx
@@ -6,7 +6,7 @@ const BlogPage = () => {
   return (
     <div className='ml-4 mr-4 flex flex-col items-center space-y-10'>
       <h1 className='text-4xl font-semibold text-neutral-700'>Blog</h1>
-      <div className='grid grid-cols-2 gap-20 sm:grid-cols-3 lg:grid-cols-4'>
+      <div className='grid grid-cols-2 gap-20 md:grid-cols-3 lg:grid-cols-4'>
         {allBlogPosts.map((post) => (
           <div className='space-y-4 text-center' key={post._meta.path}>
             <Link href={`blog/posts/${post._meta.path}`}>
diff --git a/app/(main)/blog/posts/[post]/page.tsx b/app/(main)/blog/posts/[post]/page.tsx
index 38d1d15..f14cc20 100644
--- a/app/(main)/blog/posts/[post]/page.tsx
+++ b/app/(main)/blog/posts/[post]/page.tsx
@@ -19,9 +19,9 @@ const PostPage = async (props: PostPageProps) => {
   }
 
   return (
-    <div className='mx-auto p-4 md:p-6 lg:p-8'>
+    <div className='mx-auto ~/lg:~p-4/8'>
       <Image
-        className='mb-2 h-64 w-full rounded-md object-cover md:h-[500px]'
+        className='mb-2 w-full rounded-md object-cover ~/md:~h-64/[31rem]'
         src={post.coverImage}
         width={1200}
         height={600}
diff --git a/app/(main)/blog/posts/blog-welcome.mdx b/app/(main)/blog/posts/blog-welcome.mdx
index 8e53a64..0b80fa2 100644
--- a/app/(main)/blog/posts/blog-welcome.mdx
+++ b/app/(main)/blog/posts/blog-welcome.mdx
@@ -11,4 +11,4 @@ Hello and welcome to our new blog page! We are so exited to finally have a place
 
 ## What's next?
 
-As you can see, although we have a blog page, it's a bit basic at the moment. In the future, we are planning to add things such as tags and dates as well as other stuff. In terms of the website it's self, we have a few major feates that we plan to add in the comming months.
+As you can see, although we have a blog page, it's a bit basic at the moment. In the future, we are planning to add things such as tags and dates as well as other stuff. In terms of the website it's self, we have a few major features that we plan to add in the coming months.
diff --git a/app/(main)/layout.tsx b/app/(main)/layout.tsx
index 7e0005e..9cdd5d6 100644
--- a/app/(main)/layout.tsx
+++ b/app/(main)/layout.tsx
@@ -4,12 +4,8 @@ import { Navbar } from './_components/navbar';
 const MarketingLayout = ({ children }: { children: React.ReactNode }) => {
   return (
     <div className='h-full bg-slate-100'>
-      <meta
-        name='google-site-verification'
-        content='PRxg9VJRF6bNC8Gn2foGdrSvXjqihsgL4w9HPTt5nVk'
-      />
       <Navbar />
-      <main className='bg-slate-100 pb-20 pt-40'>{children}</main>
+      <main className='bg-slate-100 pb-20 pt-20'>{children}</main>
       <Footer />
     </div>
   );
diff --git a/app/(main)/page.tsx b/app/(main)/page.tsx
index fa9d594..ab5657e 100644
--- a/app/(main)/page.tsx
+++ b/app/(main)/page.tsx
@@ -15,7 +15,7 @@ const textFont = Poppins({
 
 const MarketingPage = () => {
   return (
-    <div className='flex flex-col items-center justify-center'>
+    <div className='flex flex-col items-center justify-center pt-20'>
       <div
         className={cn(
           'flex flex-col items-center justify-center',
@@ -26,16 +26,16 @@ const MarketingPage = () => {
           <Medal className='mr-2 h-6 w-6' />
           No 1 task management app
         </div>
-        <h1 className='mb-6 text-center text-3xl text-neutral-800 md:text-6xl'>
+        <h1 className='mb-6 text-center text-neutral-800 ~/md:~text-3xl/6xl'>
           Tasko helps teams move
         </h1>
-        <div className='w-fit rounded-md bg-gradient-to-r from-fuchsia-600 to-pink-600 p-2 px-4 pb-4 text-3xl text-white md:text-6xl'>
+        <div className='w-fit rounded-md bg-gradient-to-r from-fuchsia-600 to-pink-600 p-2 px-4 pb-4 text-white ~/md:~text-3xl/6xl'>
           Work forward
         </div>
       </div>
       <div
         className={cn(
-          'mx-auto mt-4 max-w-xs text-center text-sm text-neutral-400 md:max-w-2xl md:text-xl',
+          'mx-auto mt-4 text-center text-neutral-400 ~/md:~text-sm/xl ~/md:~max-w-xs/2xl',
           textFont.className
         )}
       >
diff --git a/app/api/cards/[cardId]/logs/route.ts b/app/api/cards/[cardId]/logs/route.ts
index e9fcb77..6dcaa9d 100644
--- a/app/api/cards/[cardId]/logs/route.ts
+++ b/app/api/cards/[cardId]/logs/route.ts
@@ -27,14 +27,18 @@ export async function GET(
         createdAt: 'desc',
       },
       take: 3,
+      cacheStrategy: {
+        ttl: 30,
+        swr: 60,
+      },
     });
 
     return new NextResponse(JSON.stringify(auditLogs), {
       status: 200,
       headers: {
-        'Cache-Control': 'public, s-maxage=5',
+        'Cache-Control': 'public, s-maxage=1',
         'CDN-Cache-Control': 'public, s-maxage=60',
-        'Vercel-CDN-Cache-Control': 'public, s-maxage=3600',
+        'Vercel-CDN-Cache-Control': 'public, s-maxage=120',
       },
     });
   } catch (error) {
diff --git a/app/api/cards/[cardId]/route.ts b/app/api/cards/[cardId]/route.ts
index 1f17946..27ebd8d 100644
--- a/app/api/cards/[cardId]/route.ts
+++ b/app/api/cards/[cardId]/route.ts
@@ -32,6 +32,10 @@ export async function GET(
           },
         },
       },
+      cacheStrategy: {
+        ttl: 30,
+        swr: 60,
+      },
     });
 
     return new NextResponse(JSON.stringify(card), {
@@ -39,7 +43,7 @@ export async function GET(
       headers: {
         'Cache-Control': 'public, s-maxage=1',
         'CDN-Cache-Control': 'public, s-maxage=60',
-        'Vercel-CDN-Cache-Control': 'public, s-maxage=3600',
+        'Vercel-CDN-Cache-Control': 'public, s-maxage=120',
       },
     });
   } catch (error) {
diff --git a/sentry.client.config.ts b/sentry.client.config.ts
index 0af7101..d174104 100644
--- a/sentry.client.config.ts
+++ b/sentry.client.config.ts
@@ -35,7 +35,7 @@ Sentry.init({
   profilesSampleRate: 1.0,
 
   // Define how likely Replay events are sampled.
-  replaysSessionSampleRate: 0.5,
+  replaysSessionSampleRate: 0.25,
 
   // Define how likely Replay events are sampled when an error occurs.
   replaysOnErrorSampleRate: 1.0,