'use client';

import { useEffect, useState } from 'react';
import { Button } from '@/components/ui/button';
import {
  Dialog,
  DialogContent,
  DialogDescription,
  DialogFooter,
  DialogHeader,
  DialogTitle
} from '@/components/ui/dialog';
import { Textarea } from '@/components/ui/textarea';
import type { ContentApprovalAction, ContentModule } from '../lib/workflow';

const actionMeta: Record<
  Extract<ContentApprovalAction, 'approve' | 'return' | 'reject'>,
  {
    title: string;
    description: (contentLabel: string, contentTitle: string) => string;
    confirmLabel: string;
    placeholder: string;
    required: boolean;
  }
> = {
  approve: {
    title: 'ยืนยันการอนุมัติ',
    description: (contentLabel, contentTitle) => `เพิ่มหมายเหตุสำหรับการอนุมัติ${contentLabel} "${contentTitle}" ได้ถ้าต้องการ`,
    confirmLabel: 'อนุมัติ',
    placeholder: 'ระบุหมายเหตุเพิ่มเติม (ถ้ามี)',
    required: false
  },
  return: {
    title: 'ส่งกลับเพื่อแก้ไข',
    description: (contentLabel, contentTitle) => `กรุณาระบุเหตุผลที่ส่งกลับ${contentLabel} "${contentTitle}"`,
    confirmLabel: 'ส่งกลับ',
    placeholder: 'ระบุสิ่งที่ต้องแก้ไข',
    required: true
  },
  reject: {
    title: 'ไม่อนุมัติรายการ',
    description: (contentLabel, contentTitle) => `กรุณาระบุเหตุผลที่ไม่อนุมัติ${contentLabel} "${contentTitle}"`,
    confirmLabel: 'ไม่อนุมัติ',
    placeholder: 'ระบุเหตุผลที่ไม่อนุมัติ',
    required: true
  }
};

export function ContentReviewActionDialog({
  open,
  onOpenChange,
  action,
  module,
  contentTitle,
  isSubmitting,
  onConfirm
}: {
  open: boolean;
  onOpenChange: (open: boolean) => void;
  action: Extract<ContentApprovalAction, 'approve' | 'return' | 'reject'> | null;
  module: ContentModule;
  contentTitle: string;
  isSubmitting: boolean;
  onConfirm: (payload: {
    action: Extract<ContentApprovalAction, 'approve' | 'return' | 'reject'>;
    comment?: string;
  }) => void;
}) {
  const [comment, setComment] = useState('');

  useEffect(() => {
    if (!open) {
      setComment('');
    }
  }, [open]);

  if (!action) {
    return null;
  }

  const meta = actionMeta[action];
  const contentLabel = module === 'announcement' ? 'ประกาศ' : 'บทเรียน';
  const normalizedComment = comment.trim();
  const isInvalid = meta.required && normalizedComment.length === 0;

  return (
    <Dialog open={open} onOpenChange={onOpenChange}>
      <DialogContent>
        <DialogHeader>
          <DialogTitle>{meta.title}</DialogTitle>
          <DialogDescription>{meta.description(contentLabel, contentTitle)}</DialogDescription>
        </DialogHeader>
        <div className='space-y-2'>
          <label htmlFor='review-comment' className='text-sm font-medium'>
            หมายเหตุผู้ตรวจ
            {meta.required ? ' *' : ''}
          </label>
          <Textarea
            id='review-comment'
            rows={5}
            value={comment}
            onChange={(event) => setComment(event.target.value)}
            placeholder={meta.placeholder}
            disabled={isSubmitting}
          />
          {isInvalid ? <p className='text-destructive text-xs'>กรุณาระบุหมายเหตุ</p> : null}
        </div>
        <DialogFooter>
          <Button variant='outline' onClick={() => onOpenChange(false)} disabled={isSubmitting}>
            ยกเลิก
          </Button>
          <Button
            onClick={() =>
              onConfirm({
                action,
                ...(normalizedComment ? { comment: normalizedComment } : {})
              })
            }
            disabled={isSubmitting || isInvalid}
          >
            {meta.confirmLabel}
          </Button>
        </DialogFooter>
      </DialogContent>
    </Dialog>
  );
}
