import Link from "next/link";
import { MessageSquarePlus, LifeBuoy } from "@/components/ui/icons";
import { Topbar } from "@/components/shell/topbar";
import { Panel } from "@/components/ui/panel";
import { Button } from "@/components/ui/button";
import { EmptyState } from "@/components/ui/empty-state";

export default function SupportListPage() {
  return (
    <>
      <Topbar
        title="Support"
        subtitle="Posez vos questions, suivez vos demandes en cours"
        trailing={
          <Link href="/portail/support/nouveau">
            <Button variant="primary" size="sm">
              <MessageSquarePlus className="size-3.5" />
              Nouvelle demande
            </Button>
          </Link>
        }
      />

      <div className="pt-6">
        <Panel>
          <EmptyState
            icon={LifeBuoy}
            title="Aucun ticket ouvert"
            description="Vous n'avez pas encore contacté l'équipe. Ouvrez un ticket si vous avez une question ou une demande."
            action={
              <Link href="/portail/support/nouveau">
                <Button variant="primary" size="sm">
                  <MessageSquarePlus className="size-3.5" />
                  Ouvrir un ticket
                </Button>
              </Link>
            }
          />
        </Panel>
      </div>
    </>
  );
}