/**
 * IntegratedDetailTemplate Types
 *
 * 등록/상세/수정 페이지를 위한 통합 템플릿 타입 정의
 */

import type { LucideIcon } from 'lucide-react';
import type { ReactNode } from 'react';

// ===== 모드 =====
export type DetailMode = 'create' | 'view' | 'edit';

// ===== 필드 타입 =====
export type FieldType =
  | 'text'
  | 'number'
  | 'select'
  | 'date'
  | 'datetime-local'
  | 'textarea'
  | 'password'
  | 'email'
  | 'tel'
  | 'radio'
  | 'checkbox'
  | 'dateRange'
  | 'richtext'
  | 'file'
  | 'custom'
  // 포맷팅 입력 타입
  | 'phone'           // 전화번호 (자동 하이픈)
  | 'businessNumber'  // 사업자번호 (000-00-00000)
  | 'personalNumber'  // 주민번호 (000000-0000000)
  | 'cardNumber'      // 카드번호 (0000-0000-0000-0000)
  | 'accountNumber'   // 계좌번호 (4자리마다 하이픈)
  | 'currency'        // 금액 (₩, 천단위 콤마)
  | 'quantity';       // 수량 (정수, 최소 0)

// ===== 옵션 (select, radio용) =====
export interface FieldOption {
  value: string;
  label: string;
  disabled?: boolean;
}

// ===== 유효성 검사 =====
export interface ValidationRule {
  type: 'required' | 'minLength' | 'maxLength' | 'pattern' | 'custom';
  value?: number | string | RegExp;
  message: string;
  validate?: (value: unknown, formData: Record<string, unknown>) => boolean;
}

// ===== 필드 정의 =====
export interface FieldDefinition {
  /** 필드 키 (formData의 키) */
  key: string;
  /** 라벨 */
  label: string;
  /** 필드 타입 */
  type: FieldType;
  /** 필수 여부 */
  required?: boolean;
  /** 비활성화 여부 (모드별로 다르게 설정 가능) */
  disabled?: boolean | ((mode: DetailMode) => boolean);
  /** 읽기 전용 */
  readonly?: boolean;
  /** select, radio 옵션 */
  options?: FieldOption[];
  /** 동적 옵션 로드 함수 */
  fetchOptions?: () => Promise<FieldOption[]>;
  /** placeholder */
  placeholder?: string;
  /** 유효성 검사 규칙 */
  validation?: ValidationRule[];
  /** 그리드 span (1, 2, 3, 4) - 기본값 1, DetailField의 colSpan으로 매핑됨 */
  gridSpan?: 1 | 2 | 3 | 4;
  /** view 모드에서 숨김 */
  hideInView?: boolean;
  /** form 모드에서 숨김 */
  hideInForm?: boolean;
  /** 값 포맷터 (view 모드용) */
  formatValue?: (value: unknown) => string | ReactNode;
  /** 커스텀 렌더러 */
  renderField?: (props: {
    value: unknown;
    onChange: (value: unknown) => void;
    mode: DetailMode;
    disabled: boolean;
  }) => ReactNode;
  /** 도움말 텍스트 */
  helpText?: string;
  /** 부가 정보 (Badge 등) */
  suffix?: ReactNode | ((value: unknown) => ReactNode);
  /** 기본값 (create 모드에서 사용) */
  defaultValue?: unknown;
}

// ===== 섹션 정의 =====
export interface SectionDefinition {
  /** 섹션 ID */
  id: string;
  /** 섹션 제목 */
  title: string;
  /** 섹션 설명 */
  description?: string;
  /** 섹션에 포함될 필드 키 목록 */
  fields: string[];
  /** 접을 수 있는 섹션 여부 */
  collapsible?: boolean;
  /** 기본 접힌 상태 */
  defaultCollapsed?: boolean;
}

// ===== 액션 설정 =====
export interface ActionConfig {
  /** 저장 버튼 텍스트 */
  submitLabel?: string;
  /** 저장 버튼 텍스트 (submitLabel의 별칭) */
  saveLabel?: string;
  /** 등록 버튼 텍스트 */
  createLabel?: string;
  /** 취소 버튼 텍스트 */
  cancelLabel?: string;
  /** 저장 버튼 표시 */
  showSave?: boolean;
  /** 삭제 버튼 표시 */
  showDelete?: boolean;
  /** 삭제 버튼 텍스트 */
  deleteLabel?: string;
  /** 수정 버튼 표시 (view 모드) */
  showEdit?: boolean;
  /** 수정 버튼 텍스트 */
  editLabel?: string;
  /** 목록 버튼 표시 */
  showBack?: boolean;
  /** 목록 버튼 텍스트 */
  backLabel?: string;
  /** 하단 액션 바 전체 숨김 (컴포넌트가 자체 액션 바를 가진 경우) */
  hideActions?: boolean;
  /** 삭제 확인 메시지 */
  deleteConfirmMessage?: {
    title?: string;
    description?: string;
  };
}

// ===== 권한 설정 =====
export interface PermissionConfig {
  /** 수정 권한 */
  canEdit?: boolean | (() => boolean);
  /** 삭제 권한 */
  canDelete?: boolean | (() => boolean);
  /** 생성 권한 */
  canCreate?: boolean | (() => boolean);
}

// ===== 상세 페이지 설정 =====
 
export interface DetailConfig<_T = Record<string, unknown>> {
  /** 페이지 제목 */
  title: string;
  /** 페이지 설명 */
  description?: string;
  /** 아이콘 */
  icon?: LucideIcon;
  /** 기본 경로 (목록으로 돌아갈 때 사용) */
  basePath: string;
  /** 필드 정의 */
  fields: FieldDefinition[];
  /** 섹션 정의 (필드 그룹핑) */
  sections?: SectionDefinition[];
  /** 그리드 컬럼 수 (기본값: 2) */
  gridColumns?: 1 | 2 | 3 | 4;
  /** 액션 설정 */
  actions?: ActionConfig;
  /** 권한 설정 */
  permissions?: PermissionConfig;
  /** 초기값 변환 (API 응답 → formData) */
  transformInitialData?: (data: any) => Record<string, unknown>;
  /** 제출 데이터 변환 (formData → API 요청) */
  transformSubmitData?: (formData: Record<string, unknown>) => any;
  /** View 모드 값 포맷터 (key별로 커스텀 표시) */
  formatViewValue?: (key: string, value: unknown, data: Record<string, unknown>) => string | ReactNode | undefined;
}

// ===== 컴포넌트 Props =====
export interface IntegratedDetailTemplateProps<T = Record<string, unknown>> {
  /** 설정 */
  config: DetailConfig<T>;
  /** 모드 */
  mode: DetailMode;
  /** 초기 데이터 (view/edit 모드) */
  initialData?: T;
  /** 아이템 ID (view/edit 모드) */
  itemId?: string | number;
  /** 로딩 상태 */
  isLoading?: boolean;
  /** 저장 핸들러 */
  onSubmit?: (data: Record<string, unknown>) => Promise<{ success: boolean; error?: string } | void>;
  /** 삭제 핸들러 */
  onDelete?: (id: string | number) => Promise<{ success: boolean; error?: string } | void>;
  /** 취소 핸들러 (기본: 목록으로 이동) */
  onCancel?: () => void;
  /** 모드 변경 핸들러 (view → edit) */
  onModeChange?: (mode: DetailMode) => void;
  /** 수정 버튼 클릭 핸들러 (기본: 내부 모드 변경, 제공 시 커스텀 동작) */
  onEdit?: () => void;
  /** 커스텀 상세 화면 렌더러 */
  renderView?: (data: T) => ReactNode;
  /** 커스텀 폼 렌더러 */
  renderForm?: (props: {
    formData: Record<string, unknown>;
    onChange: (key: string, value: unknown) => void;
    mode: DetailMode;
    errors: Record<string, string>;
  }) => ReactNode;
  /** 커스텀 필드 렌더러 (특정 필드만 커스텀) */
  renderField?: (
    field: FieldDefinition,
    props: {
      value: unknown;
      onChange: (value: unknown) => void;
      mode: DetailMode;
      disabled: boolean;
      error?: string;
    }
  ) => ReactNode | null;
  /** 헤더 우측 추가 액션 (자유 JSX - Badge 등 비버튼 요소용) */
  headerActions?: ReactNode;
  /** 헤더 우측 추가 버튼 (config 배열 - 모바일 아이콘 패턴 자동 적용) */
  headerActionItems?: ActionItem[];
  /** 폼 앞에 추가 콘텐츠 */
  beforeContent?: ReactNode;
  /** 폼 뒤에 추가 콘텐츠 */
  afterContent?: ReactNode;
  /** 버튼 위치 (기본값: 'bottom') */
  buttonPosition?: 'top' | 'bottom';
  /** 버튼 하단 고정 (sticky) - buttonPosition이 'bottom'일 때만 적용 */
  stickyButtons?: boolean;
  /** 뒤로가기 핸들러 */
  onBack?: () => void;
  /** 저장 핸들러 (onSubmit 대안) */
  onSave?: (data: Record<string, unknown>) => Promise<{ success: boolean; error?: string } | void>;
  /** 외부 제출 중 상태 */
  isSubmitting?: boolean;
}

// ===== 액션 아이템 (headerActionItems용) =====
export interface ActionItem {
  /** 아이콘 (lucide-react) */
  icon: LucideIcon;
  /** 버튼 라벨 (데스크탑에서 표시, 모바일은 아이콘만) */
  label: string;
  /** 클릭 핸들러 */
  onClick: () => void;
  /** 버튼 variant */
  variant?: 'default' | 'outline' | 'destructive' | 'secondary' | 'ghost';
  /** 커스텀 클래스 (예: 'bg-green-600 hover:bg-green-700') */
  className?: string;
  /** 비활성화 여부 */
  disabled?: boolean;
  /** 조건부 숨김 */
  hidden?: boolean;
  /** true면 Loader2 스피너로 아이콘 대체 */
  loading?: boolean;
}

// ===== API 응답 타입 =====
export interface ApiResponse<T = unknown> {
  success: boolean;
  data?: T;
  error?: string;
  message?: string;
}

// ===== Ref 타입 (외부에서 폼 데이터 조작용) =====
export interface IntegratedDetailTemplateRef {
  /** 폼 데이터 설정 (DevFill 등에서 사용) */
  setFormData: (data: Record<string, unknown>) => void;
  /** 현재 폼 데이터 가져오기 */
  getFormData: () => Record<string, unknown>;
  /** 특정 필드 값 변경 */
  setFieldValue: (key: string, value: unknown) => void;
  /** 폼 유효성 검사 실행 */
  validate: () => boolean;
  /** 폼 초기화 */
  reset: () => void;
}
