Final touches

package.json

@@ -11,13 +11,14 @@
   },
   "dependencies": {
     "@heroicons/react": "^2.1.5",
+    "@next/third-parties": "^14.2.15",
     "@nextui-org/react": "^2.4.6",
     "@vercel/analytics": "^1.3.1",
     "axios": "^1.3.1",
     "framer-motion": "^10.18.0",
     "he": "^1.2.0",
     "mongoose": "^7.8.0",
-    "next": "^14.2.6",
+    "next": "^14.2.15",
     "nodemailer": "^6.9.14",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",

src/app/layout.tsx

@@ -2,6 +2,8 @@ import type { Metadata, Viewport } from "next";
 import dynamic from "next/dynamic";
 import { Inter } from "next/font/google";
 
+import { GoogleAnalytics } from "@next/third-parties/google";
+
 import "./globals.css";
 import Providers from "./providers";
 
@@ -39,6 +41,7 @@ export default function RootLayout({
           <Footer />
         </Providers>
       </body>
+      <GoogleAnalytics gaId="G-JKPDWZ2PLD" />
     </html>
   );
 }

src/app/page.tsx

@@ -2,6 +2,7 @@ import dynamic from "next/dynamic";
 import Image from "next/image";
 
 import Section from "@/components/Section";
+import { Banner } from "@/components/banner";
 import { MainHeader } from "@/components/header";
 import certificates from "@/data/certifications";
 import degrees from "@/data/degrees";
@@ -76,6 +77,7 @@ const Degrees = () => (
 
 const Home = () => (
   <>
+    <Banner />
     <MainHeader />
     <Intro />
     <Skills />

src/app/robots.ts

@@ -0,0 +1,12 @@
+import { MetadataRoute } from "next";
+
+export default function robots(): MetadataRoute.Robots {
+  return {
+    rules: {
+      userAgent: "*",
+      allow: "/",
+      disallow: "/private/",
+    },
+    sitemap: "https://amrabed.com/sitemap.xml",
+  };
+}

src/app/sitemap.ts

@@ -0,0 +1,24 @@
+import { MetadataRoute } from "next";
+
+export default function sitemap(): MetadataRoute.Sitemap {
+  return [
+    {
+      url: "https://amrabed.com",
+      lastModified: new Date(),
+      changeFrequency: "yearly",
+      priority: 1,
+    },
+    {
+      url: "https://amrabed.com/projects",
+      lastModified: new Date(),
+      changeFrequency: "yearly",
+      priority: 0.8,
+    },
+    {
+      url: "https://amrabed.com/positions",
+      lastModified: new Date(),
+      changeFrequency: "yearly",
+      priority: 0.5,
+    },
+  ];
+}

src/components/banner.tsx

@@ -0,0 +1,14 @@
+export const Banner = () => (
+  <div className="fixed left-0 right-0 top-0 z-[999] flex h-[40px] w-full flex-col items-center justify-center py-2 text-sm bg-[#1e7748] sm:flex-row sm:py-0 sm:text-lg">
+    <div className="mr-1 hidden text-white sm:block">Free Palestine 🇵🇸</div>
+    <a
+      href="https://freepalestine.dev"
+      target="_blank"
+      rel="noopener"
+      className="text-link ms-0 text-white hover:underline sm:ms-1"
+    >
+      <div className="mr-1 inline text-white sm:hidden">🇵🇸</div>
+      Help Spread Awareness for Palestine
+    </a>
+  </div>
+);

src/components/header.tsx

@@ -54,7 +54,11 @@ export const MainHeader = () => {
   const [isMenuOpen, setIsMenuOpen] = useState(false);
 
   return (
-    <Navbar isMenuOpen={isMenuOpen} onMenuOpenChange={setIsMenuOpen}>
+    <Navbar
+      isMenuOpen={isMenuOpen}
+      onMenuOpenChange={setIsMenuOpen}
+      className="pt-10"
+    >
       <NavbarBrand>
         <Title />
       </NavbarBrand>