import { createFileRoute, Link } from "@tanstack/react-router";
import { Handshake } from "lucide-react";

import { AppShell } from "@/components/app-shell";
import { Button } from "@/components/ui/button";

export const Route = createFileRoute("/_authenticated/mentors")({
  head: () => ({
    meta: [
      { title: "Mentors | UZIA Academy" },
      { name: "description", content: "Mentor matching for Kenyan MSMEs, coming soon." },
      { name: "robots", content: "noindex" },
    ],
  }),
  component: Mentors,
});

function Mentors() {
  return (
    <AppShell
      title="Mentors"
      description="One-to-one guidance from experienced operators, matched to your weakest growth areas."
    >
      <div className="rounded-2xl border border-dashed border-border bg-surface p-12 text-center">
        <Handshake className="mx-auto size-8 text-secondary" />
        <h2 className="mt-4 font-display text-xl font-bold">Mentor matching is coming next</h2>
        <p className="mx-auto mt-3 max-w-lg text-sm text-muted-foreground">
          We're onboarding mentors across finance, marketing, operations and export readiness. Your
          assessment results will drive the match, so complete it first.
        </p>
        <Button asChild className="mt-6" variant="outline">
          <Link to="/dashboard">Back to dashboard</Link>
        </Button>
      </div>
    </AppShell>
  );
}