// @design-system: domain/AdminLinkBadge
'use client';

/**
 * AdminLinkBadge - pill-shaped link to /admin shown to admin users.
 *
 * Renders nothing when `isAdmin` is false, so parents can unconditionally
 * mount it without an outer ternary. Used in customer DesktopTopBar end slot
 * and mobile TopBar end slot so the admin entry point is visible on every
 * customer page for a signed-in admin.
 */

import { cn } from '@/lib/cn';
import { useT } from '@/lib/i18n/react';

export interface AdminLinkBadgeProps {
  /** When false the component renders nothing. */
  isAdmin?: boolean;
  className?: string;
}

export function AdminLinkBadge({ isAdmin = false, className }: AdminLinkBadgeProps) {
  const t = useT('common');
  if (!isAdmin) return null;
  return (
    <a
      href="/admin"
      aria-label={t('admin_link_aria')}
      className={cn(
        'bg-warning-500 text-text-inverse hover:bg-warning-600 focus-visible:outline-text-inverse inline-flex items-center rounded-sm px-2 py-1 text-xs font-bold focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2',
        className,
      )}
    >
      {t('admin_badge')}
    </a>
  );
}