import { Button } from "@/components/ui/button";
import { Card, CardContent } from "@/components/ui/card";
import Link from "next/link";

export default function Home() {
  return (
    <main className="min-h-screen p-8 bg-background text-foreground">
      <h1 className="text-3xl font-bold mb-6">Laser Everything Community Database</h1>

      <div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">Fiber Laser Settings</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Browse and submit settings for fiber laser engraving.
            </p>
            <Link href="/fiber-settings">
              <Button>View Settings</Button>
            </Link>
          </CardContent>
        </Card>

        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">CO2 Galvo Settings</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Settings for CO2 Galvo laser machines.
            </p>
            <Link href="/co2-galvo-settings">
              <Button>View Settings</Button>
            </Link>
          </CardContent>
        </Card>

        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">CO2 Gantry Settings</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Settings for CO2 Gantry laser systems.
            </p>
            <Link href="/co2-gantry-settings">
              <Button>View Settings</Button>
            </Link>
          </CardContent>
        </Card>

        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">UV Laser Settings</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Settings for UV laser engraving and marking.
            </p>
            <Link href="/uv-settings">
              <Button>View Settings</Button>
            </Link>
          </CardContent>
        </Card>

        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">Materials and Coatings</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Explore materials and surface coatings along with their laser safety classifications.
            </p>
            <div className="flex flex-col sm:flex-row gap-2">
              <Link href="/materials">
                <Button className="w-full sm:w-auto">View Materials</Button>
              </Link>
              <Link href="/materials-coatings">
                <Button className="w-full sm:w-auto">View Coatings</Button>
              </Link>
            </div>
          </CardContent>
        </Card>

        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">Laser Source Database</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Technical specs and info on various laser sources.
            </p>
            <Link href="/lasers">
              <Button>View Sources</Button>
            </Link>
          </CardContent>
        </Card>

        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">Projects Database</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Community-submitted projects and guides.
            </p>
            <Link href="/projects">
              <Button>View Projects</Button>
            </Link>
          </CardContent>
        </Card>

        {/* 🔽 NEW FILE DOWNLOAD SECTION 🔽 */}
        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">Downloadable Files</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Browse and download shared files from the server.
            </p>
            <Link href="/files">
              <Button>View Files</Button>
            </Link>
          </CardContent>
        </Card>

        {/* 🔽 NEW BUYING GUIDE CARD 🔽 */}
        <Card>
          <CardContent className="p-6">
            <h2 className="text-xl font-semibold mb-2">Buying Guide</h2>
            <p className="mb-4 text-sm text-muted-foreground">
              Reviews and recommendations for laser products and accessories.
            </p>
            <Link href="/buying-guide">
              <Button>View Guide</Button>
            </Link>
          </CardContent>
        </Card>
      </div>
    </main>
  );
}

