refactor: reorganize layout structure by moving Header and Footer components to RootLayout

apps/landing/src/app/(frontend)/_components/header.tsx

@@ -134,9 +134,15 @@ export function Header() {
             >
               Testimoni
             </Link>
-            <Button className="mt-4 bg-gradient-to-r from-primary to-blue-400 hover:from-primary/90 hover:to-blue-400/90 font-bold text-black hover:text-white cursor-pointer">
-              Gabung Discord
-            </Button>
+            <a
+              href="https://discord.com/invite/imphnen"
+              target="_blank"
+              className="mt-4"
+            >
+              <Button className="mt-4 bg-gradient-to-r from-primary to-blue-400 hover:from-primary/90 hover:to-blue-400/90 font-bold text-black hover:text-white cursor-pointer">
+                Gabung Discord
+              </Button>
+            </a>
           </nav>
         </div>
       )}

apps/landing/src/app/(frontend)/_components/learning-resources.tsx

@@ -111,10 +111,7 @@ export function LearningResources(props: LearningResourcesSection) {
               </p>
               <div className="flex flex-wrap gap-4">
                 <a href={featured.primaryButtonLink} target="_blank">
-                  <Button
-                    className="bg-gradient-to-r from-primary to-blue-400 hover:from-primary/90 hover:to-blue-400/90
-font-bold text-black hover:text-white cursor-pointer"
-                  >
+                  <Button className="bg-gradient-to-r from-primary to-blue-400 hover:from-primary/90 hover:to-blue-400/90 font-bold text-black hover:text-white cursor-pointer">
                     {featured.primaryButtonText}
                   </Button>
                 </a>

apps/landing/src/app/(frontend)/layout.tsx

@@ -1,6 +1,8 @@
 import { type Metadata } from 'next';
 import { Inter } from 'next/font/google';
 import '../../styles/globals.css';
+import Footer from './_components/footer';
+import { Header } from './_components/header';
 import { ThemeProvider } from './_components/theme-provider';
 
 const inter = Inter({ subsets: ['latin'] });
@@ -24,7 +26,11 @@ export default function RootLayout({
           enableSystem
           disableTransitionOnChange
         >
-          {children}
+          <div className="flex min-h-screen flex-col">
+            <Header />
+            <main className="flex-1">{children}</main>
+            <Footer />
+          </div>
         </ThemeProvider>
       </body>
     </html>

apps/landing/src/app/(frontend)/page.tsx

@@ -5,8 +5,6 @@ import { getGlobalsLearningResourcesSection } from '../../services/get-globals-l
 import { CallToAction } from './_components/call-to-action';
 import { Community } from './_components/community';
 import { Features } from './_components/features';
-import Footer from './_components/footer';
-import { Header } from './_components/header';
 import { Hero } from './_components/hero';
 import { LearningResources } from './_components/learning-resources';
 import { Testimonials } from './_components/testimonials';
@@ -23,17 +21,13 @@ export default async function Page() {
     ]);
 
   return (
-    <div className="flex min-h-screen flex-col">
-      <Header />
-      <main className="flex-1">
-        <Hero {...heroData} />
-        <Features {...featuresData} />
-        <Community {...communitiesData} />
-        <LearningResources {...learningResourcesData} />
-        <Testimonials />
-        <CallToAction />
-      </main>
-      <Footer />
-    </div>
+    <>
+      <Hero {...heroData} />
+      <Features {...featuresData} />
+      <Community {...communitiesData} />
+      <LearningResources {...learningResourcesData} />
+      <Testimonials />
+      <CallToAction />
+    </>
   );
 }