import { ComponentType, ReactNode } from 'react';

/**
 * Shared navigation item type used across all platform apps.
 *
 * Each app defines its own navigation items using this shape, which feeds into
 * the LaunchpadGrid, FlyoutNavGrid, and Dock components.
 */
type NavigationMenuItem = {
    label: string;
    icon?: ReactNode;
    href?: string;
    onClick?: () => void;
    variant?: 'default' | 'danger';
};
type NavigationItem = {
    /** Unique identifier for this nav item (e.g. 'stations', 'customers') */
    id: string;
    /** Display name (typically translated) */
    name: string;
    /** Navigation target path */
    href: string;
    /** Hero icon component reference */
    icon: ComponentType<{
        className?: string;
    }>;
    /** Tailwind gradient classes (e.g. 'from-blue-400 to-blue-600') */
    gradient: string;
    /** Tailwind shadow class (e.g. 'shadow-blue-500/30') */
    shadow: string;
    /** RGB triplet for liquid-glass accent (e.g. '59, 130, 246') */
    accentRgb: string;
    /** Short description shown in flyout/launchpad subtitle */
    subtitle: string;
    /** Optional permission required to see this item */
    permission?: string;
    /** Optional numeric badge (e.g. notification count) */
    badge?: number;
    /** Context menu / long-press items */
    menuItems: NavigationMenuItem[];
    /**
     * Optional click handler — when defined, the item triggers this callback
     * instead of navigating to `href`. Useful for items that open modals,
     * drawers, or other non-navigation actions (e.g. settings).
     */
    onClick?: () => void;
};

export type { NavigationItem as N, NavigationMenuItem as a };
