first commit

src/components/layout/Container.tsx

@@ -0,0 +1,15 @@
+import { type ReactNode } from "react";
+import clsx from "clsx";
+
+interface ContainerProps {
+  children: ReactNode;
+  className?: string;
+}
+
+export function Container({ children, className }: ContainerProps) {
+  return (
+    <div className={clsx("max-w-screen-xl mx-auto px-6", className)}>
+      {children}
+    </div>
+  );
+}

src/components/layout/Footer.tsx

@@ -0,0 +1,13 @@
+import { Container } from "./Container";
+
+export function Footer() {
+  return (
+    <footer className="py-12 border-t border-neutral-100 mt-24">
+      <Container>
+        <p className="text-sm text-neutral-400 tracking-wide">
+          {new Date().getFullYear()}
+        </p>
+      </Container>
+    </footer>
+  );
+}

src/components/layout/Header.tsx

@@ -0,0 +1,51 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import Link from "next/link";
+import { Container } from "./Container";
+import { TextLink } from "@/components/ui/TextLink";
+import { useAuth } from "@/lib/hooks/useAuth";
+
+export function Header() {
+  const { isAuthenticated, logout } = useAuth();
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  return (
+    <header className="py-8 border-b border-neutral-100">
+      <Container>
+        <nav className="flex items-center justify-between">
+          <Link
+            href="/"
+            className="text-xl font-bold tracking-tighter hover:opacity-70 transition-opacity"
+          >
+            AI Blog
+          </Link>
+
+          <div className="flex items-center gap-8">
+            {mounted && (
+              <>
+                {isAuthenticated ? (
+                  <>
+                    <TextLink href="/admin">Dashboard</TextLink>
+                    <button
+                      onClick={logout}
+                      className="text-sm tracking-wide uppercase text-neutral-500 hover:text-black transition-colors"
+                    >
+                      Logout
+                    </button>
+                  </>
+                ) : (
+                  <TextLink href="/login">Login</TextLink>
+                )}
+              </>
+            )}
+          </div>
+        </nav>
+      </Container>
+    </header>
+  );
+}