/**
 * DeveloperFab - Main component
 *
 * Unified developer tools FAB with configurable categories.
 * Uses the compound component pattern from @lilith/ui-fab.
 */

import { FAB } from '@lilith/ui-fab';
import { WrenchIcon } from '@lilith/ui-icons';

import { AccessLevelCategory } from './categories/AccessLevelCategory';
import { ProfileCategory } from './categories/ProfileCategory';
import { StorageCategory } from './categories/StorageCategory';
import { ContentOverlayToggle } from './components/ContentOverlayToggle';

import type { DeveloperFabProps } from './types';

export const DeveloperFab = ({
  position = 'bottom-right',
  accessLevels,
  profiles,
  showStorage = true,
  showContentEditor = false,
  devUserContext,
  onAccessLevelChange,
  onProfileChange,
}: DeveloperFabProps) => {
  // Only render in development mode
  if (import.meta.env.PROD) {
    return null;
  }

  const fabPosition = position === 'bottom-left' ? 'left' : 'right';

  const hasAccessLevels = accessLevels && accessLevels.length > 0;
  const hasProfiles = profiles && profiles.length > 0;
  const hasAnyCategory = hasAccessLevels || hasProfiles || showStorage || showContentEditor;

  // Don't render if no categories are configured
  if (!hasAnyCategory) {
    return null;
  }

  return (
    <FAB.Root position={fabPosition} layout="V">
      <FAB.ActionButton
        icon={<WrenchIcon size={24} />}
        ariaLabels={{
          open: 'Open developer tools',
          close: 'Close developer tools',
          title: 'Developer Tools',
        }}
      />

      {hasAccessLevels && devUserContext && onAccessLevelChange && (
        <AccessLevelCategory
          levels={accessLevels}
          devUserContext={devUserContext}
          onAccessLevelChange={onAccessLevelChange}
        />
      )}

      {hasProfiles && devUserContext && onProfileChange && (
        <ProfileCategory
          profiles={profiles}
          devUserContext={devUserContext}
          onProfileChange={onProfileChange}
        />
      )}

      {showStorage && <StorageCategory />}

      {showContentEditor && <ContentOverlayToggle />}
    </FAB.Root>
  );
}