// @design-system: domain/admin/AdminBackLink
// Registered at /design-system#adminbacklink-domain

/**
 * AdminBackLink - standardised back-navigation link for admin detail pages.
 *
 * Renders a left-facing chevron icon (auto-flips in RTL via `mirror`) and a
 * resolved label string. When no `label` is provided the component resolves
 * `common.back` from the i18n bundle automatically.
 *
 * @example
 * ```tsx
 * <AdminBackLink href="/admin/vendors" />
 * <AdminBackLink href="/admin/deals" label={t('back_to_deals')} />
 * ```
 */

import { useT } from '@/lib/i18n/react';
import { Icon } from '@/components/ui/icons/Icon';
import { cn } from '@/lib/cn';

export interface AdminBackLinkProps {
  /** The href to navigate to when clicked. */
  href: string;
  /**
   * Pre-resolved label string. When omitted, falls back to `common.back`
   * from the active locale bundle.
   */
  label?: string;
  /** Optional extra className applied to the `<a>` element. */
  className?: string;
}

export function AdminBackLink({ href, label, className }: AdminBackLinkProps) {
  const tCommon = useT('common');
  const resolvedLabel = label ?? tCommon('back');

  return (
    <a
      href={href}
      className={cn(
        'text-text-secondary hover:text-text-primary',
        'inline-flex items-center gap-1',
        'text-sm',
        'transition-colors duration-[var(--duration-fast)]',
        'focus-visible:outline-none focus-visible:ring-2',
        'focus-visible:ring-brand-primary-500 focus-visible:ring-offset-1',
        'rounded-sm',
        className,
      )}
    >
      {/* ChevronRight mirrors to ChevronLeft in RTL (dir="ltr" = pointing left visually) */}
      <Icon name="ChevronRight" size="sm" mirror aria-hidden={true} />
      {resolvedLabel}
    </a>
  );
}