boundlessfi
diff --git a/‎COMMENT_SYSTEM_README.md‎
Lines changed: 571 additions & 0 deletions b/‎COMMENT_SYSTEM_README.md‎
Lines changed: 571 additions & 0 deletions
diff --git a/‎app/(landing)/about/AboutUsHero.tsx‎
Lines changed: 2 additions & 2 deletions b/‎app/(landing)/about/AboutUsHero.tsx‎
Lines changed: 2 additions & 2 deletions
diff --git a/‎app/(landing)/about/AboutUsHero2.tsx‎
Lines changed: 4 additions & 4 deletions b/‎app/(landing)/about/AboutUsHero2.tsx‎
Lines changed: 4 additions & 4 deletions
diff --git a/‎app/(landing)/about/OurTeam.tsx‎
Lines changed: 4 additions & 4 deletions b/‎app/(landing)/about/OurTeam.tsx‎
Lines changed: 4 additions & 4 deletions
diff --git a/‎app/(landing)/about/page.tsx‎
Lines changed: 1 addition & 1 deletion b/‎app/(landing)/about/page.tsx‎
Lines changed: 1 addition & 1 deletion
diff --git a/‎app/(landing)/accept-invitation/[invitationId]/page.tsx‎
Lines changed: 38 additions & 11 deletions b/‎app/(landing)/accept-invitation/[invitationId]/page.tsx‎
Lines changed: 38 additions & 11 deletions
diff --git a/‎app/(landing)/accept-invitation/layout.tsx‎
Lines changed: 22 additions & 0 deletions b/‎app/(landing)/accept-invitation/layout.tsx‎
Lines changed: 22 additions & 0 deletions
diff --git a/‎app/(landing)/blog/[slug]/not-found.tsx‎
Lines changed: 1 addition & 1 deletion b/‎app/(landing)/blog/[slug]/not-found.tsx‎
Lines changed: 1 addition & 1 deletion
diff --git a/‎app/(landing)/blog/[slug]/page.tsx‎
Lines changed: 77 additions & 27 deletions b/‎app/(landing)/blog/[slug]/page.tsx‎
Lines changed: 77 additions & 27 deletions
@@ -66,7 +66,7 @@ export default function AboutUsHero() {
   return (
     <div
       ref={heroRef}
-      className='relative flex h-full min-h-[95vh] items-center justify-center overflow-hidden bg-[#030303]'
+      className='bg-background-main-bg relative flex h-full min-h-[95vh] items-center justify-center overflow-hidden'
     >
       <div
         className='absolute bottom-0 z-10 h-[772px] w-full'
@@ -87,7 +87,7 @@ export default function AboutUsHero() {
         }}
       />
       <div className='border-20px] absolute inset-0 top-1/2 left-1/2 h-[383px] w-[383px] -translate-x-1/2 -translate-y-1/2 rounded-full border-[#DBFFB7] opacity-[0.3] mix-blend-overlay blur-[25px]' />
-      <div className='absolute inset-0 top-1/2 left-1/2 h-[397px] w-[397px] -translate-x-1/2 -translate-y-1/2 rounded-full border-[100px] border-[#6DC01A] opacity-[0.2] mix-blend-hard-light blur-[100px]' />
+      <div className='absolute inset-0 top-1/2 left-1/2 h-[397px] w-[397px] -translate-x-1/2 -translate-y-1/2 rounded-full border-100 border-[#6DC01A] opacity-[0.2] mix-blend-hard-light blur-[100px]' />
       <div className='absolute inset-0 top-1/2 left-1/2 h-[560px] w-[560px] -translate-x-1/2 -translate-y-1/2 rounded-full bg-[#A7F9503D] blur-[400px]' />
 
       <div
 
@@ -23,7 +23,7 @@ export default function AboutUsHero() {
   }, []);
 
   return (
-    <div className='relative flex min-h-[100vh] flex-col justify-between overflow-hidden bg-[#030303] sm:min-h-[95vh] sm:justify-center'>
+    <div className='bg-background-main-bg relative flex min-h-screen flex-col justify-between overflow-hidden sm:min-h-[95vh] sm:justify-center'>
       <BeamBackground />
       <div
         ref={contentRef}
@@ -60,7 +60,7 @@ export default function AboutUsHero() {
               size='lg'
               fullWidth
               aria-label='Explore featured projects and campaigns'
-              className='min-h-[48px] touch-manipulation sm:min-h-[44px]'
+              className='min-h-12 touch-manipulation sm:min-h-11'
             >
               Explore Projects
             </BoundlessButton>
@@ -71,15 +71,15 @@ export default function AboutUsHero() {
               size='lg'
               fullWidth
               aria-label='Submit your project idea for funding'
-              className='min-h-[48px] touch-manipulation sm:min-h-[44px]'
+              className='min-h-12 touch-manipulation sm:min-h-11'
             >
               Submit Your Idea
             </BoundlessButton>
           </Link>
         </nav>
       </div>
       <div className='relative right-0 bottom-20 left-0 z-0 mt-auto sm:absolute sm:bottom-0 sm:mt-0'>
-        <div className='absolute right-0 bottom-0 left-0 h-[120px] w-full bg-gradient-to-t from-[#030303] to-transparent opacity-80 sm:h-[100px] sm:opacity-50' />
+        <div className='from-background-main-bg absolute right-0 bottom-0 left-0 h-[120px] w-full bg-linear-to-t to-transparent opacity-80 sm:h-[100px] sm:opacity-50' />
         <Image
           src='/about-map.svg'
           alt=''
 
@@ -36,7 +36,7 @@ const OurTeam = () => {
       <div className='grid grid-cols-1 gap-8 md:gap-12 lg:grid-cols-2 lg:gap-16 xl:gap-20'>
         {/* Team Member 1 */}
         <div className='flex w-full flex-col items-center gap-4 sm:flex-row sm:items-start md:gap-6'>
-          <div className='h-48 w-48 flex-shrink-0 cursor-pointer rounded-xl bg-[#D9D9D9] transition duration-300 hover:scale-105 sm:h-56 sm:w-56 md:h-60 md:w-60 lg:h-64 lg:w-64 xl:h-72 xl:w-72'></div>
+          <div className='h-48 w-48 shrink-0 cursor-pointer rounded-xl bg-[#D9D9D9] transition duration-300 hover:scale-105 sm:h-56 sm:w-56 md:h-60 md:w-60 lg:h-64 lg:w-64 xl:h-72 xl:w-72'></div>
           <div className='w-full flex-1 text-center sm:text-left'>
             <h3 className='mb-2 text-xl font-medium text-white md:text-2xl'>
               Collins Ikechukwu
@@ -45,7 +45,7 @@ const OurTeam = () => {
               Blockchain Developer
             </p>
             <hr
-              className='mb-4 h-[1px] w-full border-0 md:mb-6'
+              className='mb-4 h-px w-full border-0 md:mb-6'
               style={{
                 background:
                   'radial-gradient(113.1% 103.23% at 45.52% -1.51%, rgba(255, 255, 255, 0.4704) 0%, rgba(255, 255, 255, 0.0784) 100%)',
@@ -95,7 +95,7 @@ const OurTeam = () => {
 
         {/* Team Member 2 */}
         <div className='flex w-full flex-col items-center gap-4 sm:flex-row sm:items-start md:gap-6'>
-          <div className='h-48 w-48 flex-shrink-0 cursor-pointer rounded-xl bg-[#D9D9D9] transition duration-300 hover:scale-105 sm:h-56 sm:w-56 md:h-60 md:w-60 lg:h-64 lg:w-64 xl:h-72 xl:w-72'></div>
+          <div className='h-48 w-48 shrink-0 cursor-pointer rounded-xl bg-[#D9D9D9] transition duration-300 hover:scale-105 sm:h-56 sm:w-56 md:h-60 md:w-60 lg:h-64 lg:w-64 xl:h-72 xl:w-72'></div>
           <div className='w-full flex-1 text-center sm:text-left'>
             <h3 className='mb-2 text-xl font-medium text-white md:text-2xl'>
               Nnaji Benjamin
@@ -104,7 +104,7 @@ const OurTeam = () => {
               Full-Stack & Blockchain Developer
             </p>
             <hr
-              className='mb-4 h-[1px] w-full border-0 md:mb-6'
+              className='mb-4 h-px w-full border-0 md:mb-6'
               style={{
                 background:
                   'radial-gradient(113.1% 103.23% at 45.52% -1.51%, rgba(255, 255, 255, 0.4704) 0%, rgba(255, 255, 255, 0.0784) 100%)',
 
@@ -17,7 +17,7 @@ export const metadata: Metadata = generatePageMetadata('about');
 const AboutPage = () => {
   return (
     <section>
-      <div className='relative z-10 mx-auto max-w-[1440px] space-y-[23px] md:space-y-[80px]'>
+      <div className='relative z-10 mx-auto max-w-[1440px] space-y-[23px] md:space-y-20'>
         <AboutUsHero2 />
         <Missionpage />
         <AboutUsDifferent />
 
@@ -4,22 +4,22 @@ import { useEffect, useState } from 'react';
 import { useParams, useRouter } from 'next/navigation';
 import { authClient } from '@/lib/auth-client';
 import { toast } from 'sonner';
-import { Loader2, CheckCircle2, XCircle } from 'lucide-react';
+import { CheckCircle2, XCircle } from 'lucide-react';
+import LoadingSpinner from '@/components/LoadingSpinner';
+import { BoundlessButton } from '@/components/buttons';
 
 export default function AcceptInvitationPage() {
   const params = useParams();
   const router = useRouter();
   const [status, setStatus] = useState<'loading' | 'success' | 'error'>(
     'loading'
   );
-  const [errorMessage, setErrorMessage] = useState<string>('');
   const invitationId = params.invitationId as string;
 
   useEffect(() => {
     const acceptInvitation = async () => {
       if (!invitationId) {
         setStatus('error');
-        setErrorMessage('No invitation ID provided');
         return;
       }
 
@@ -54,9 +54,6 @@ export default function AcceptInvitationPage() {
           throw new Error('Failed to accept invitation');
         }
       } catch {
-        setErrorMessage(
-          'Failed to accept invitation. It may be expired or invalid.'
-        );
         toast.error(
           'Failed to accept invitation. It may be expired or invalid.'
         );
@@ -68,9 +65,38 @@ export default function AcceptInvitationPage() {
   }, [invitationId, router]);
 
   return (
-    <div className='flex min-h-screen items-center justify-center bg-black'>
-      <div className='w-full max-w-md rounded-xl border border-zinc-800 bg-zinc-900/50 p-8 text-center backdrop-blur-sm'>
-        {status === 'loading' && (
+    <div className='relative z-9999999 flex min-h-screen flex-col items-center justify-center gap-4 backdrop-blur-lg'>
+      {status === 'loading' && (
+        <>
+          <LoadingSpinner variant='spinner' size='xl' color='primary' />
+          <p className='text-sm text-white'>Accepting invitation...</p>
+        </>
+      )}
+      {status === 'success' && (
+        <>
+          <CheckCircle2 className='mx-auto h-12 w-12 text-green-500' />
+          <p className='text-sm text-white'>
+            Invitation accepted! Redirecting...
+          </p>
+        </>
+      )}
+      {status === 'error' && (
+        <>
+          <XCircle className='mx-auto h-12 w-12 text-red-500' />
+          <p className='text-sm text-white'>
+            Failed to accept invitation. It may be expired or invalid.
+          </p>
+          <BoundlessButton
+            onClick={() => router.push('/')}
+            size='xl'
+            className='bg-primary hover:bg-primary/90 text-black'
+          >
+            Go to Home
+          </BoundlessButton>
+        </>
+      )}
+      {/* <div className='w-full max-w-md rounded-xl border border-zinc-800 bg-zinc-900/50 p-8 text-center backdrop-blur-sm'> */}
+      {/* {status === 'loading' && (
           <div className='space-y-4'>
             <Loader2 className='text-primary mx-auto h-12 w-12 animate-spin' />
             <h1 className='text-2xl font-semibold text-white'>
@@ -81,6 +107,7 @@ export default function AcceptInvitationPage() {
             </p>
           </div>
         )}
+          
 
         {status === 'success' && (
           <div className='space-y-4'>
@@ -110,8 +137,8 @@ export default function AcceptInvitationPage() {
               Go to Organizations
             </button>
           </div>
-        )}
-      </div>
+        )} */}
+      {/* </div> */}
     </div>
   );
 }
@@ -0,0 +1,22 @@
+import AnimatedAuthLayout from '@/components/auth/AnimatedAuthLayout';
+import { Metadata } from 'next';
+import React from 'react';
+
+export const metadata: Metadata = {
+  title: 'Authentication - Boundless',
+  description: 'Sign in or create an account to access Boundless platform',
+  robots: 'noindex, nofollow',
+};
+
+interface AuthLayoutProps {
+  children: React.ReactNode;
+}
+
+export default function AuthLayoutWrapper({ children }: AuthLayoutProps) {
+  return (
+    <div className='absolute inset-0 z-50 flex min-h-screen items-center justify-center'>
+      <div className='absolute z-9999999 h-screen w-screen backdrop-blur-lg' />
+      <AnimatedAuthLayout>{children}</AnimatedAuthLayout>
+    </div>
+  );
+}
@@ -4,7 +4,7 @@ import { Button } from '@/components/ui/button';
 
 export default function BlogNotFound() {
   return (
-    <div className='flex min-h-[80vh] items-center justify-center bg-[#030303]'>
+    <div className='bg-background-main-bg flex min-h-[80vh] items-center justify-center'>
       <div className='mx-auto max-w-md px-6 text-center'>
         <div className='mb-8'>
           <h1 className='mb-4 text-6xl font-bold text-white'>404</h1>
 
@@ -1,17 +1,35 @@
 import React from 'react';
 import { Metadata } from 'next';
 import { notFound } from 'next/navigation';
-import BlogPostDetails from '../../../../components/landing-page/blog/BlogPostDetails';
+import BlogPostDetails from '@/components/landing-page/blog/BlogPostDetails';
 import { getBlogPost, getBlogPosts } from '@/lib/api/blog';
 import { generateBlogPostMetadata } from '@/lib/metadata';
 
-export async function generateStaticParams() {
+interface BlogPostPageProps {
+  params: Promise<{ slug: string }>;
+}
+
+interface StaticParams {
+  slug: string;
+}
+
+const STATIC_GENERATION_LIMIT = 100;
+
+export async function generateStaticParams(): Promise<StaticParams[]> {
   try {
-    // For static generation, we'll need to fetch all posts
-    // This might need to be adjusted based on your backend implementation
-    const { posts } = await getBlogPosts({ page: 1, limit: 50 });
+    const response = await getBlogPosts({
+      page: 1,
+      limit: STATIC_GENERATION_LIMIT,
+      status: 'PUBLISHED',
+    });
+
+    const data = response.data;
+
+    if (!data || data.length === 0) {
+      return [];
+    }
 
-    return posts.map(post => ({
+    return data.map(post => ({
       slug: post.slug,
     }));
   } catch {
@@ -21,48 +39,80 @@ export async function generateStaticParams() {
 
 export async function generateMetadata({
   params,
-}: {
-  params: Promise<{ slug: string }>;
-}): Promise<Metadata> {
-  const { slug } = await params;
-
+}: BlogPostPageProps): Promise<Metadata> {
   try {
+    const { slug } = await params;
+
+    if (!slug || typeof slug !== 'string') {
+      return getDefaultMetadata();
+    }
+
     const post = await getBlogPost(slug);
 
     if (!post) {
-      return {
-        title: 'Blog Post Not Found',
-        description: 'The requested blog post could not be found.',
-      };
+      return getNotFoundMetadata();
     }
 
     return generateBlogPostMetadata(post);
   } catch {
-    return {
-      title: 'Blog Post Not Found',
-      description: 'The requested blog post could not be found.',
-    };
+    return getDefaultMetadata();
   }
 }
 
-const BlogPostPage = async ({
-  params,
-}: {
-  params: Promise<{ slug: string }>;
-}) => {
-  const { slug } = await params;
-
+const BlogPostPage = async ({ params }: BlogPostPageProps) => {
   try {
+    const { slug } = await params;
+
+    if (!slug || typeof slug !== 'string') {
+      notFound();
+    }
+
     const post = await getBlogPost(slug);
 
     if (!post) {
       notFound();
     }
 
+    if (!post.id || !post.title || !post.content) {
+      notFound();
+    }
+
     return <BlogPostDetails post={post} />;
-  } catch {
+  } catch (error) {
+    if (error instanceof Error) {
+      if (
+        error.message.includes('404') ||
+        error.message.includes('not found')
+      ) {
+        notFound();
+      }
+    }
+
     notFound();
   }
 };
 
+function getDefaultMetadata(): Metadata {
+  return {
+    title: 'Blog Post | Boundless',
+    description: 'Read our latest blog posts and insights.',
+    robots: {
+      index: false,
+      follow: true,
+    },
+  };
+}
+
+function getNotFoundMetadata(): Metadata {
+  return {
+    title: 'Blog Post Not Found | Boundless',
+    description:
+      'The requested blog post could not be found. Please check the URL or browse our other posts.',
+    robots: {
+      index: false,
+      follow: true,
+    },
+  };
+}
+
 export default BlogPostPage;