"use client"

import * as React from "react"
import {
  Dialog,
  DialogContent,
  DialogHeader,
  DialogTitle,
} from "@/components/ui/dialog"
import type { Notice } from "@/db/schema/notice"

type NoticeWithAuthor = Notice & {
  authorName: string | null
  authorEmail: string | null
}

interface NoticeViewDialogProps {
  open: boolean
  onOpenChange: (open: boolean) => void
  notice: NoticeWithAuthor | null
}

export function NoticeViewDialog({
  open,
  onOpenChange,
  notice,
}: NoticeViewDialogProps) {

  if (!notice) return null

  return (
    <Dialog open={open} onOpenChange={onOpenChange}>
      <DialogContent className="max-w-4xl max-h-[80vh] overflow-y-auto">
        <DialogHeader>
          <div className="flex items-start justify-between">
            <div className="space-y-2 flex-1">
              <div className="flex items-center gap-2">
                <DialogTitle className="text-xl font-bold">
                  제목: {notice.title}
                </DialogTitle>
              </div>              
            </div>
          </div>
        </DialogHeader>
        
        <div className="mt-6 rounded-lg border border-gray-200 p-4">
          <div 
            className="prose prose-sm max-w-none"
            dangerouslySetInnerHTML={{ __html: notice.content }}
          />
        </div>
      </DialogContent>

    </Dialog>
  )
}