'use client';

import Link from 'next/link';
import { useTranslations } from 'next-intl';
import { AdminSidebar } from '@/components/admin/admin-sidebar';

export default function AdminLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  const t = useTranslations('settings');

  return (
    <div className="flex h-full flex-col md:flex-row">
      <AdminSidebar />
      <div className="min-w-0 flex-1 overflow-y-auto p-3 sm:p-6">
        <Link
          href="/"
          className="mb-4 inline-flex items-center gap-1 text-sm text-muted-foreground transition-colors hover:text-foreground"
        >
          <svg
            aria-hidden="true"
            xmlns="http://www.w3.org/2000/svg"
            width="16"
            height="16"
            viewBox="0 0 24 24"
            fill="none"
            stroke="currentColor"
            strokeWidth="2"
            strokeLinecap="round"
            strokeLinejoin="round"
          >
            <polyline points="15 18 9 12 15 6" />
          </svg>
          {t('backToDashboard')}
        </Link>
        {children}
      </div>
    </div>
  );
}