import type { ModuleId } from '@/shared/types/app';
import type { DirectorQuickActionConfig } from '@/shared/constants/directorDashboard';
import { DirectorScaleButton } from '@/components/director-dashboard/DirectorScaleButton';
import {
  directorQuickActionIcons,
  directorQuickActionToneClasses,
} from '@/components/director-dashboard/directorDashboardViewConfig';

interface DirectorQuickActionsProps {
  readonly actions: readonly DirectorQuickActionConfig[];
  readonly onOpenModule: (module: ModuleId) => void;
}

export function DirectorQuickActions({
  actions,
  onOpenModule,
}: DirectorQuickActionsProps) {
  return (
    <div className="bg-white rounded-2xl border border-violet-100 shadow-sm p-5">
      <h3 className="font-semibold text-gray-800 mb-3">Quick Actions</h3>
      <div className="space-y-2">
        {actions.map((action) => {
          const ActionIcon = action.iconId ? directorQuickActionIcons[action.iconId] : undefined;

          return (
            <DirectorScaleButton
              key={action.label}
              type="button"
              onClick={() => onOpenModule(action.module)}
              className={`flex h-auto w-full items-center justify-start gap-2 rounded-xl px-4 py-2.5 text-left text-sm font-medium ${directorQuickActionToneClasses[action.tone]}`}
            >
              {ActionIcon && <ActionIcon size={14} />}
              {action.label}
            </DirectorScaleButton>
          );
        })}
      </div>
    </div>
  );
}
