"use client";

import Link from "next/link";
import { Container } from "@/components/ui";
import { useTenantHost } from "@/hooks/useTenantHost";

const LINKS = [
  { href: "/discover", label: "کشف کسب‌وکار" },
  { href: "/pricing", label: "قیمت‌گذاری" },
  { href: "/help", label: "مرکز راهنما" },
  { href: "/apps", label: "اپ‌ها" },
  { href: "/billing", label: "Billing" },
  { href: "/domains", label: "دامنه" },
];

export function SiteFooter() {
  const host = useTenantHost();
  if (host.isTenantHost) return null;

  return (
    <footer className="mt-auto border-t border-gray-100 bg-white dark:border-gray-800 dark:bg-gray-950">
      <Container className="grid gap-8 py-12 sm:grid-cols-2 lg:grid-cols-4">
        <div>
          <p className="text-lg font-bold text-secondary dark:text-gray-100">TorbatYar</p>
          <p className="mt-2 text-sm leading-7 text-gray-600 dark:text-gray-400">
            سیستم‌عامل کسب‌وکار روی ابر — محصولات و قیمت از رجیستری زنده.
          </p>
        </div>
        <div>
          <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">محصول</p>
          <ul className="mt-3 space-y-2 text-sm">
            {LINKS.slice(0, 3).map((l) => (
              <li key={l.href}>
                <Link href={l.href} className="text-gray-600 hover:text-primary dark:text-gray-400">
                  {l.label}
                </Link>
              </li>
            ))}
          </ul>
        </div>
        <div>
          <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">Workspace</p>
          <ul className="mt-3 space-y-2 text-sm">
            {LINKS.slice(3).map((l) => (
              <li key={l.href}>
                <Link href={l.href} className="text-gray-600 hover:text-primary dark:text-gray-400">
                  {l.label}
                </Link>
              </li>
            ))}
          </ul>
        </div>
        <div>
          <p className="text-xs font-semibold uppercase tracking-wide text-gray-400">اعتماد</p>
          <ul className="mt-3 space-y-2 text-sm text-gray-600 dark:text-gray-400">
            <li>SSO و چندمستأجری</li>
            <li>سیاست دامنه و entitlement</li>
            <li>بدون کاتالوگ جعلی در UI</li>
          </ul>
        </div>
      </Container>
      <div className="border-t border-gray-100 py-4 text-center text-xs text-gray-400 dark:border-gray-800">
        © {new Date().getFullYear()} TorbatYar · Commercial SaaS Platform
      </div>
    </footer>
  );
}