summaryrefslogtreecommitdiff
path: root/lib/email-whitelist
diff options
context:
space:
mode:
Diffstat (limited to 'lib/email-whitelist')
-rw-r--r--lib/email-whitelist/service.ts577
-rw-r--r--lib/email-whitelist/table/create-whitelist-dialog.tsx179
-rw-r--r--lib/email-whitelist/table/delete-whitelist-dialog.tsx137
-rw-r--r--lib/email-whitelist/table/update-whitelist-dialog.tsx193
-rw-r--r--lib/email-whitelist/table/whitelist-table-columns.tsx208
-rw-r--r--lib/email-whitelist/table/whitelist-table.tsx130
6 files changed, 1424 insertions, 0 deletions
diff --git a/lib/email-whitelist/service.ts b/lib/email-whitelist/service.ts
new file mode 100644
index 00000000..d7e968b0
--- /dev/null
+++ b/lib/email-whitelist/service.ts
@@ -0,0 +1,577 @@
+'use server';
+
+/* IMPORT */
+import { and, asc, count, desc, eq, ilike, or, sql, type SQL, type InferSelectModel, inArray } from 'drizzle-orm';
+import { authOptions } from '@/app/api/auth/[...nextauth]/route';
+import db from '@/db/db';
+import { getServerSession } from 'next-auth';
+import { type Filter } from '@/types/table';
+import {
+ emailWhitelist,
+} from '@/db/schema/emailWhitelist';
+import { users } from '@/db/schema/users';
+import { revalidatePath } from 'next/cache';
+
+// ----------------------------------------------------------------------------------------------------
+
+/* TYPES */
+export type EmailWhitelist = InferSelectModel<typeof emailWhitelist> & {
+ createdByName?: string;
+ updatedByName?: string;
+ type?: 'domain' | 'email'; // 표시용 타입
+ displayValue?: string; // 표시할 값 (domain 또는 email)
+}
+
+// ===========================================
+// Helper Functions
+// ===========================================
+
+/**
+ * 이메일 유효성 검증
+ */
+function validateEmail(email: string): { isValid: boolean; error?: string } {
+ const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+
+ if (!emailRegex.test(email)) {
+ return { isValid: false, error: '올바른 이메일 형식이 아닙니다.' };
+ }
+
+ // 길이 제한
+ if (email.length > 255) {
+ return { isValid: false, error: '이메일은 255자를 초과할 수 없습니다.' };
+ }
+
+ return { isValid: true };
+}
+
+/**
+ * 도메인 유효성 검증
+ */
+function validateDomain(domain: string): { isValid: boolean; error?: string } {
+ // 도메인 검증: 최소 하나의 .이 있어야 하고, TLD가 있어야 함
+ // 예: company.com, sub.company.com, company.co.kr
+ const domainRegex = /^[a-zA-Z0-9]([a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(\.[a-zA-Z0-9]([a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*\.[a-zA-Z]{2,}$/;
+
+ if (!domainRegex.test(domain)) {
+ return { isValid: false, error: '올바른 도메인 형식이 아닙니다. 최소 1개의 TLD가 필요합니다.' };
+ }
+
+ // 길이 제한
+ if (domain.length > 255) {
+ return { isValid: false, error: '도메인은 255자를 초과할 수 없습니다.' };
+ }
+
+ return { isValid: true };
+}
+
+/**
+ * 입력값이 이메일인지 도메인인지 판별
+ */
+function determineType(value: string): 'email' | 'domain' {
+ return value.includes('@') ? 'email' : 'domain';
+}
+
+/**
+ * 화이트리스트 항목 중복 검증
+ */
+async function checkWhitelistExists(value: string, type: 'email' | 'domain', excludeId?: number): Promise<boolean> {
+ let whereCondition;
+
+ if (type === 'email') {
+ whereCondition = eq(emailWhitelist.email, value);
+ } else {
+ whereCondition = eq(emailWhitelist.domain, value);
+ }
+
+ const existing = await db
+ .select({ id: emailWhitelist.id })
+ .from(emailWhitelist)
+ .where(whereCondition)
+ .limit(1);
+
+ if (existing.length === 0) return false;
+ if (excludeId && existing[0].id === excludeId) return false;
+
+ return true;
+}
+
+// ===========================================
+// CRUD Operations
+// ===========================================
+
+/**
+ * 이메일 화이트리스트 목록 조회
+ */
+export async function getEmailWhitelistList({
+ page = 1,
+ perPage = 10,
+ search,
+ sort = 'createdAt.desc',
+ filters,
+}: {
+ page?: number;
+ perPage?: number;
+ search?: string;
+ sort?: string;
+ filters?: Filter<EmailWhitelist>[];
+} = {}) {
+ try {
+ const session = await getServerSession(authOptions);
+ if (!session?.user?.id) {
+ throw new Error('인증이 필요합니다.');
+ }
+
+ const offset = (page - 1) * perPage;
+
+ // 정렬 처리
+ let orderBy: SQL<unknown>;
+ const [sortField, sortOrder] = sort.split('.');
+
+ // 계산된 필드에 대한 정렬 매핑
+ const sortFieldMapping: Record<string, string> = {
+ 'displayValue': 'domain', // displayValue는 domain 우선으로 정렬
+ 'createdByName': 'createdAt', // 이름 정렬 대신 생성일로 정렬
+ 'updatedByName': 'updatedAt', // 이름 정렬 대신 수정일로 정렬
+ };
+
+ const actualSortField = sortFieldMapping[sortField] || sortField;
+
+ if (actualSortField === 'domain') {
+ orderBy = sortOrder === 'desc' ? desc(emailWhitelist.domain) : asc(emailWhitelist.domain);
+ } else if (actualSortField === 'email') {
+ orderBy = sortOrder === 'desc' ? desc(emailWhitelist.email) : asc(emailWhitelist.email);
+ } else if (actualSortField === 'description') {
+ orderBy = sortOrder === 'desc' ? desc(emailWhitelist.description) : asc(emailWhitelist.description);
+ } else if (actualSortField === 'createdAt') {
+ orderBy = sortOrder === 'desc' ? desc(emailWhitelist.createdAt) : asc(emailWhitelist.createdAt);
+ } else if (actualSortField === 'updatedAt') {
+ orderBy = sortOrder === 'desc' ? desc(emailWhitelist.updatedAt) : asc(emailWhitelist.updatedAt);
+ } else {
+ orderBy = desc(emailWhitelist.createdAt);
+ }
+
+ // 필터 조건들
+ const filterConditions: SQL<unknown>[] = [];
+
+ // 검색 필터
+ if (search) {
+ const searchCondition = or(
+ ilike(emailWhitelist.domain, `%${search}%`),
+ ilike(emailWhitelist.email, `%${search}%`),
+ ilike(emailWhitelist.description, `%${search}%`)
+ ) as SQL<unknown>;
+ filterConditions.push(searchCondition);
+ }
+
+ // 고급 필터
+ if (filters && filters.length > 0) {
+ for (const filter of filters) {
+ const { id, value, operator = 'iLike' } = filter;
+
+ // string[] 타입은 지원하지 않음 (select 필터용)
+ if (!value || typeof value !== 'string') continue;
+
+ let condition: SQL<unknown> | undefined;
+
+ switch (id) {
+ case 'displayValue':
+ // displayValue는 domain이나 email 중 하나를 포함하므로 둘 다 검색
+ if (operator === 'iLike') {
+ condition = or(
+ ilike(emailWhitelist.domain, `%${value}%`),
+ ilike(emailWhitelist.email, `%${value}%`)
+ );
+ } else if (operator === 'eq') {
+ condition = or(
+ eq(emailWhitelist.domain, value),
+ eq(emailWhitelist.email, value)
+ );
+ }
+ break;
+ case 'domain':
+ if (operator === 'iLike') {
+ condition = ilike(emailWhitelist.domain, `%${value}%`);
+ } else if (operator === 'eq') {
+ condition = eq(emailWhitelist.domain, value);
+ }
+ break;
+ case 'email':
+ if (operator === 'iLike') {
+ condition = ilike(emailWhitelist.email, `%${value}%`);
+ } else if (operator === 'eq') {
+ condition = eq(emailWhitelist.email, value);
+ }
+ break;
+ case 'description':
+ if (operator === 'iLike') {
+ condition = ilike(emailWhitelist.description, `%${value}%`);
+ } else if (operator === 'eq') {
+ condition = eq(emailWhitelist.description, value);
+ }
+ break;
+ case 'createdAt':
+ if (operator === 'gte' && value) {
+ condition = sql`${emailWhitelist.createdAt} >= ${value}`;
+ } else if (operator === 'lte' && value) {
+ condition = sql`${emailWhitelist.createdAt} <= ${value}`;
+ }
+ break;
+ case 'updatedAt':
+ if (operator === 'gte' && value) {
+ condition = sql`${emailWhitelist.updatedAt} >= ${value}`;
+ } else if (operator === 'lte' && value) {
+ condition = sql`${emailWhitelist.updatedAt} <= ${value}`;
+ }
+ break;
+ }
+
+ if (condition) {
+ filterConditions.push(condition);
+ }
+ }
+ }
+
+ // 데이터 조회 (기본 데이터)
+ const query = db
+ .select()
+ .from(emailWhitelist)
+
+ if (filterConditions.length > 0) {
+ query.where(and(...filterConditions))
+ }
+
+ const rawData = await query
+ .orderBy(orderBy)
+ .limit(perPage)
+ .offset(offset);
+
+ // 사용자 ID들 수집
+ const userIds = new Set<number>();
+ rawData.forEach(item => {
+ if (item.createdBy) userIds.add(item.createdBy);
+ if (item.updatedBy) userIds.add(item.updatedBy);
+ });
+
+ // 사용자 정보 조회
+ const userMap = new Map<number, string>();
+ if (userIds.size > 0) {
+ const userData = await db
+ .select({ id: users.id, name: users.name })
+ .from(users)
+ .where(inArray(users.id, Array.from(userIds)));
+
+ userData.forEach(user => {
+ userMap.set(user.id, user.name);
+ });
+ }
+
+ // 데이터에 사용자 이름과 타입 정보 추가
+ const data: EmailWhitelist[] = rawData.map(item => {
+ const displayValue = item.email || item.domain || '';
+ const type = displayValue.includes('@') ? 'email' : 'domain';
+
+ return {
+ ...item,
+ createdByName: item.createdBy ? userMap.get(item.createdBy) : undefined,
+ updatedByName: item.updatedBy ? userMap.get(item.updatedBy) : undefined,
+ type,
+ displayValue,
+ };
+ });
+
+ // 전체 개수 조회
+ const countQuery = db
+ .select({ count: count() })
+ .from(emailWhitelist)
+
+ if (filterConditions.length > 0) {
+ countQuery.where(and(...filterConditions))
+ }
+
+ const totalResult = await countQuery;
+
+ const total = totalResult[0].count;
+ const pageCount = Math.ceil(total / perPage);
+
+ return {
+ data,
+ pageCount,
+ total,
+ };
+ } catch (error) {
+ throw new Error(error instanceof Error ? error.message : '목록 조회에 실패했습니다.');
+ }
+}
+
+/**
+ * 이메일 화이트리스트 생성
+ */
+export async function createEmailWhitelistAction(data: {
+ value: string; // 이메일 주소 또는 도메인
+ description?: string;
+}) {
+ try {
+ const session = await getServerSession(authOptions);
+ if (!session?.user?.id) {
+ return {
+ success: false,
+ error: '인증이 필요합니다.'
+ };
+ }
+
+ const type = determineType(data.value);
+
+ // 유효성 검증
+ let validation;
+ if (type === 'email') {
+ validation = validateEmail(data.value);
+ } else {
+ validation = validateDomain(data.value);
+ }
+
+ if (!validation.isValid) {
+ return {
+ success: false,
+ error: validation.error
+ };
+ }
+
+ // 중복 검증
+ const exists = await checkWhitelistExists(data.value.toLowerCase(), type);
+ if (exists) {
+ return {
+ success: false,
+ error: type === 'email' ? '이미 등록된 이메일입니다.' : '이미 등록된 도메인입니다.'
+ };
+ }
+
+ // 생성
+ const insertData: {
+ description?: string;
+ createdBy: number;
+ updatedBy: number;
+ domain?: string | null;
+ email?: string | null;
+ } = {
+ description: data.description,
+ createdBy: Number(session.user.id),
+ updatedBy: Number(session.user.id),
+ domain: null,
+ email: null,
+ };
+
+ if (type === 'email') {
+ insertData.email = data.value.toLowerCase();
+ } else {
+ insertData.domain = data.value.toLowerCase();
+ }
+
+ const [result] = await db
+ .insert(emailWhitelist)
+ .values(insertData)
+ .returning();
+
+ revalidatePath('/evcp/system/whitelist');
+
+ return {
+ success: true,
+ data: result
+ };
+ } catch (error) {
+ return {
+ success: false,
+ error: error instanceof Error ? error.message : '생성에 실패했습니다.'
+ };
+ }
+}
+
+/**
+ * 이메일 화이트리스트 수정
+ */
+export async function updateEmailWhitelistAction(data: {
+ id: number;
+ value: string; // 이메일 주소 또는 도메인
+ description?: string;
+}) {
+ try {
+ const session = await getServerSession(authOptions);
+ if (!session?.user?.id) {
+ return {
+ success: false,
+ error: '인증이 필요합니다.'
+ };
+ }
+
+ const type = determineType(data.value);
+
+ // 유효성 검증
+ let validation;
+ if (type === 'email') {
+ validation = validateEmail(data.value);
+ } else {
+ validation = validateDomain(data.value);
+ }
+
+ if (!validation.isValid) {
+ return {
+ success: false,
+ error: validation.error
+ };
+ }
+
+ // 중복 검증
+ const exists = await checkWhitelistExists(data.value.toLowerCase(), type, data.id);
+ if (exists) {
+ return {
+ success: false,
+ error: type === 'email' ? '이미 등록된 이메일입니다.' : '이미 등록된 도메인입니다.'
+ };
+ }
+
+ // 수정
+ const updateData: {
+ description?: string;
+ updatedBy: number;
+ updatedAt: ReturnType<typeof sql>;
+ domain: string | null;
+ email: string | null;
+ } = {
+ description: data.description,
+ updatedBy: Number(session.user.id),
+ updatedAt: sql`NOW()`,
+ domain: null,
+ email: null,
+ };
+
+ if (type === 'email') {
+ updateData.email = data.value.toLowerCase();
+ } else {
+ updateData.domain = data.value.toLowerCase();
+ }
+
+ const [result] = await db
+ .update(emailWhitelist)
+ .set(updateData)
+ .where(eq(emailWhitelist.id, data.id))
+ .returning();
+
+ if (!result) {
+ return {
+ success: false,
+ error: '수정할 데이터를 찾을 수 없습니다.'
+ };
+ }
+
+ revalidatePath('/evcp/system/whitelist');
+
+ return {
+ success: true,
+ data: result
+ };
+ } catch (error) {
+ return {
+ success: false,
+ error: error instanceof Error ? error.message : '수정에 실패했습니다.'
+ };
+ }
+}
+
+/**
+ * 이메일 화이트리스트 삭제
+ */
+export async function deleteEmailWhitelistAction(ids: number[]) {
+ try {
+ const session = await getServerSession(authOptions);
+ if (!session?.user?.id) {
+ return {
+ success: false,
+ error: '인증이 필요합니다.'
+ };
+ }
+
+ // 삭제
+ await db
+ .delete(emailWhitelist)
+ .where(inArray(emailWhitelist.id, ids));
+
+ revalidatePath('/evcp/system/whitelist');
+
+ return {
+ success: true
+ };
+ } catch (error) {
+ return {
+ success: false,
+ error: error instanceof Error ? error.message : '삭제에 실패했습니다.'
+ };
+ }
+}
+
+/**
+ * 단일 이메일 화이트리스트 조회
+ */
+export async function getEmailWhitelistById(id: number) {
+ try {
+ const session = await getServerSession(authOptions);
+ if (!session?.user?.id) {
+ throw new Error('인증이 필요합니다.');
+ }
+
+ const [result] = await db
+ .select()
+ .from(emailWhitelist)
+ .where(eq(emailWhitelist.id, id))
+ .limit(1);
+
+ if (!result) {
+ throw new Error('데이터를 찾을 수 없습니다.');
+ }
+
+ return result;
+ } catch (error) {
+ throw new Error(error instanceof Error ? error.message : '조회에 실패했습니다.');
+ }
+}
+
+/**
+ * 이메일 주소가 화이트리스트에 등록되어 있는지 확인
+ * @param email - 확인할 이메일 주소
+ * @returns 화이트리스트에 등록되어 있으면 true, 아니면 false
+ */
+export async function isEmailWhitelisted(email: string): Promise<boolean> {
+ try {
+ if (!email) return false;
+
+ const normalizedEmail = email.toLowerCase().trim();
+
+ // 이메일에서 도메인 추출
+ const emailParts = normalizedEmail.split('@');
+ if (emailParts.length !== 2) return false;
+
+ const domain = emailParts[1];
+
+ // 1. 개별 이메일이 화이트리스트에 있는지 확인
+ const exactEmailMatch = await db
+ .select({ id: emailWhitelist.id })
+ .from(emailWhitelist)
+ .where(eq(emailWhitelist.email, normalizedEmail))
+ .limit(1);
+
+ if (exactEmailMatch.length > 0) {
+ return true;
+ }
+
+ // 2. 도메인이 화이트리스트에 있는지 확인
+ const domainMatch = await db
+ .select({ id: emailWhitelist.id })
+ .from(emailWhitelist)
+ .where(eq(emailWhitelist.domain, domain))
+ .limit(1);
+
+ return domainMatch.length > 0;
+ } catch (error) {
+ console.error('화이트리스트 확인 중 오류:', error);
+ // 오류 발생 시 안전하게 false 반환 (기본 SMS 인증 사용)
+ return false;
+ }
+}
diff --git a/lib/email-whitelist/table/create-whitelist-dialog.tsx b/lib/email-whitelist/table/create-whitelist-dialog.tsx
new file mode 100644
index 00000000..d82ac168
--- /dev/null
+++ b/lib/email-whitelist/table/create-whitelist-dialog.tsx
@@ -0,0 +1,179 @@
+'use client'
+
+import * as React from "react"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { Loader } from "lucide-react"
+import { useForm } from "react-hook-form"
+import { toast } from "sonner"
+import { z } from "zod"
+import { useSession } from "next-auth/react"
+
+import { Button } from "@/components/ui/button"
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog"
+import {
+ Form,
+ FormControl,
+ FormDescription,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+} from "@/components/ui/form"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+
+import { createEmailWhitelistAction } from "../service"
+
+// Validation Schema
+const createWhitelistSchema = z.object({
+ value: z.string()
+ .min(1, "값은 필수입니다")
+ .max(255, "값은 255자를 초과할 수 없습니다")
+ .refine((value) => {
+ // 이메일 형식 또는 도메인 형식 중 하나여야 함
+ const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+
+ // 도메인 검증: 최소 하나의 .이 있어야 하고, TLD가 있어야 함
+ // 예: company.com, sub.company.com, company.co.kr
+ const domainRegex = /^[a-zA-Z0-9]([a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(\.[a-zA-Z0-9]([a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*\.[a-zA-Z]{2,}$/;
+
+ return emailRegex.test(value) || domainRegex.test(value);
+ }, "올바른 이메일 주소 또는 도메인 형식이 아닙니다 (도메인은 최소 1개의 TLD가 필요합니다)"),
+ description: z.string().max(500, "설명은 500자 이하여야 합니다").optional(),
+})
+
+type CreateWhitelistSchema = z.infer<typeof createWhitelistSchema>
+
+interface CreateWhitelistDialogProps
+ extends Omit<React.ComponentPropsWithRef<typeof Dialog>, 'children'> {
+ open?: boolean
+ onOpenChange?: (open: boolean) => void
+}
+
+export function CreateWhitelistDialog({ ...props }: CreateWhitelistDialogProps) {
+ const [isCreatePending, startCreateTransition] = React.useTransition()
+ const { data: session } = useSession();
+
+ const form = useForm<CreateWhitelistSchema>({
+ resolver: zodResolver(createWhitelistSchema),
+ defaultValues: {
+ value: "",
+ description: "",
+ },
+ })
+
+ // 입력값 소문자 변환
+ React.useEffect(() => {
+ const watchedValue = form.watch("value")
+ if (watchedValue && watchedValue !== watchedValue.toLowerCase()) {
+ form.setValue("value", watchedValue.toLowerCase())
+ }
+ }, [form])
+
+ function onSubmit(input: CreateWhitelistSchema) {
+ startCreateTransition(async () => {
+ if (!session?.user?.id) {
+ toast.error("로그인이 필요합니다")
+ return
+ }
+
+ const { error } = await createEmailWhitelistAction({
+ value: input.value,
+ description: input.description,
+ })
+
+ if (error) {
+ toast.error(error)
+ return
+ }
+
+ form.reset()
+ props.onOpenChange?.(false)
+ toast.success("화이트리스트 도메인이 추가되었습니다")
+ })
+ }
+
+ return (
+ <Dialog {...props}>
+ <DialogContent className="sm:max-w-[425px]">
+ <DialogHeader>
+ <DialogTitle>화이트리스트 추가</DialogTitle>
+ <DialogDescription>
+ SMS 인증을 우회할 이메일 주소 또는 도메인을 추가합니다. 등록된 이메일이나 도메인의 주소로 로그인 시 SMS 인증을 건너뜁니다.
+ </DialogDescription>
+ </DialogHeader>
+ <Form {...form}>
+ <form
+ onSubmit={form.handleSubmit(onSubmit)}
+ className="space-y-4"
+ >
+ <FormField
+ control={form.control}
+ name="value"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>이메일 주소 또는 도메인</FormLabel>
+ <FormControl>
+ <Input
+ placeholder="예: user@company.com 또는 company.com"
+ {...field}
+ />
+ </FormControl>
+ <FormDescription>
+ 이메일 주소나 도메인을 입력하세요. @가 포함되면 개별 이메일로, 그렇지 않으면 도메인 전체로 등록됩니다. 도메인은 최소 1개의 TLD가 필요합니다.
+ </FormDescription>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+
+ <FormField
+ control={form.control}
+ name="description"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>설명 (선택사항)</FormLabel>
+ <FormControl>
+ <Textarea
+ placeholder="도메인에 대한 설명을 입력하세요"
+ className="min-h-[80px]"
+ {...field}
+ />
+ </FormControl>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+
+ <DialogFooter>
+ <Button
+ type="button"
+ variant="outline"
+ onClick={() => props.onOpenChange?.(false)}
+ disabled={isCreatePending}
+ >
+ 취소
+ </Button>
+ <Button disabled={isCreatePending}>
+ {isCreatePending && (
+ <Loader
+ className="mr-2 size-4 animate-spin"
+ aria-hidden="true"
+ />
+ )}
+ 추가
+ </Button>
+ </DialogFooter>
+ </form>
+ </Form>
+ </DialogContent>
+ </Dialog>
+ )
+}
diff --git a/lib/email-whitelist/table/delete-whitelist-dialog.tsx b/lib/email-whitelist/table/delete-whitelist-dialog.tsx
new file mode 100644
index 00000000..c01e675b
--- /dev/null
+++ b/lib/email-whitelist/table/delete-whitelist-dialog.tsx
@@ -0,0 +1,137 @@
+// delete-whitelist-dialog.tsx
+"use client"
+
+import * as React from "react"
+import { Loader, Trash } from "lucide-react"
+import { toast } from "sonner"
+
+import { Button } from "@/components/ui/button"
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+ DialogTrigger,
+} from "@/components/ui/dialog"
+import { type EmailWhitelist } from "../service"
+
+import { deleteEmailWhitelistAction } from "../service"
+
+interface DeleteWhitelistDialogProps
+ extends React.ComponentPropsWithRef<typeof Dialog> {
+ whitelists: EmailWhitelist[]
+ showTrigger?: boolean
+ onSuccess?: () => void
+}
+
+export function DeleteWhitelistDialog({
+ whitelists,
+ showTrigger = true,
+ onSuccess,
+ ...props
+}: DeleteWhitelistDialogProps) {
+ const [isDeletePending, startDeleteTransition] = React.useTransition()
+
+ const isMultiple = whitelists.length > 1
+ const whitelistInfo = isMultiple ? `${whitelists.length}개 도메인` : whitelists[0]?.domain
+
+ function onDelete() {
+ startDeleteTransition(async () => {
+ const ids = whitelists.map(w => w.id)
+ const { error } = await deleteEmailWhitelistAction(ids)
+
+ if (error) {
+ toast.error(error)
+ return
+ }
+
+ props.onOpenChange?.(false)
+ onSuccess?.()
+ toast.success(
+ isMultiple
+ ? `${whitelists.length}개 도메인이 삭제되었습니다`
+ : "도메인이 삭제되었습니다"
+ )
+ })
+ }
+
+ return (
+ <Dialog {...props}>
+ {showTrigger && (
+ <DialogTrigger asChild>
+ <Button
+ variant="outline"
+ size="sm"
+ className="text-destructive hover:text-destructive"
+ >
+ <Trash className="mr-2 size-4" aria-hidden="true" />
+ 삭제
+ </Button>
+ </DialogTrigger>
+ )}
+ <DialogContent>
+ <DialogHeader>
+ <DialogTitle>화이트리스트 도메인 삭제 확인</DialogTitle>
+ <DialogDescription>
+ 정말로 <strong>{whitelistInfo}</strong>을(를) 삭제하시겠습니까?
+ {!isMultiple && (
+ <>
+ <br />
+ 이 작업은 되돌릴 수 없습니다.
+ </>
+ )}
+ </DialogDescription>
+ </DialogHeader>
+
+ {/* 삭제될 도메인 목록 표시 */}
+ {whitelists.length > 0 && (
+ <div className="rounded-lg bg-muted p-3 max-h-40 overflow-y-auto">
+ <h4 className="text-sm font-medium mb-2">삭제될 항목</h4>
+ <div className="space-y-1">
+ {whitelists.map((whitelist) => {
+ const displayValue = whitelist.email || whitelist.domain || '';
+ const isEmail = displayValue.includes('@');
+
+ return (
+ <div key={whitelist.id} className="text-xs text-muted-foreground">
+ <div className="font-medium font-mono">
+ {isEmail ? displayValue : `@${displayValue}`}
+ </div>
+ {whitelist.description && (
+ <div className="text-xs">{whitelist.description}</div>
+ )}
+ </div>
+ );
+ })}
+ </div>
+ </div>
+ )}
+
+ <DialogFooter>
+ <Button
+ variant="outline"
+ onClick={() => props.onOpenChange?.(false)}
+ disabled={isDeletePending}
+ >
+ 취소
+ </Button>
+ <Button
+ variant="destructive"
+ onClick={onDelete}
+ disabled={isDeletePending}
+ >
+ {isDeletePending && (
+ <Loader
+ className="mr-2 size-4 animate-spin"
+ aria-hidden="true"
+ />
+ )}
+ {isMultiple ? `${whitelists.length}개 삭제` : "삭제"}
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ )
+}
diff --git a/lib/email-whitelist/table/update-whitelist-dialog.tsx b/lib/email-whitelist/table/update-whitelist-dialog.tsx
new file mode 100644
index 00000000..2a798e30
--- /dev/null
+++ b/lib/email-whitelist/table/update-whitelist-dialog.tsx
@@ -0,0 +1,193 @@
+'use client'
+
+import * as React from "react"
+import { zodResolver } from "@hookform/resolvers/zod"
+import { Loader } from "lucide-react"
+import { useForm } from "react-hook-form"
+import { toast } from "sonner"
+import { z } from "zod"
+import { useSession } from "next-auth/react"
+
+import { Button } from "@/components/ui/button"
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog"
+import {
+ Form,
+ FormControl,
+ FormDescription,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+} from "@/components/ui/form"
+import { Input } from "@/components/ui/input"
+import { Textarea } from "@/components/ui/textarea"
+
+import { updateEmailWhitelistAction, type EmailWhitelist } from "../service"
+
+// Validation Schema
+const updateWhitelistSchema = z.object({
+ value: z.string()
+ .min(1, "값은 필수입니다")
+ .max(255, "값은 255자를 초과할 수 없습니다")
+ .refine((value) => {
+ // 이메일 형식 또는 도메인 형식 중 하나여야 함
+ const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+
+ // 도메인 검증: 최소 하나의 .이 있어야 하고, TLD가 있어야 함
+ // 예: company.com, sub.company.com, company.co.kr
+ const domainRegex = /^[a-zA-Z0-9]([a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(\.[a-zA-Z0-9]([a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*\.[a-zA-Z]{2,}$/;
+
+ return emailRegex.test(value) || domainRegex.test(value);
+ }, "올바른 이메일 주소 또는 도메인 형식이 아닙니다 (도메인은 최소 1개의 TLD가 필요합니다)"),
+ description: z.string().max(500, "설명은 500자 이하여야 합니다").optional(),
+})
+
+type UpdateWhitelistSchema = z.infer<typeof updateWhitelistSchema>
+
+interface UpdateWhitelistDialogProps
+ extends React.ComponentPropsWithRef<typeof Dialog> {
+ whitelist?: EmailWhitelist | null
+}
+
+export function UpdateWhitelistDialog({ whitelist, ...props }: UpdateWhitelistDialogProps) {
+ const [isUpdatePending, startUpdateTransition] = React.useTransition()
+ const { data: session } = useSession();
+
+ const form = useForm<UpdateWhitelistSchema>({
+ resolver: zodResolver(updateWhitelistSchema),
+ defaultValues: {
+ value: "",
+ description: "",
+ },
+ })
+
+ // 화이트리스트 데이터가 변경되면 폼 초기화
+ React.useEffect(() => {
+ if (whitelist) {
+ form.reset({
+ value: whitelist.displayValue || "",
+ description: whitelist.description || "",
+ })
+ }
+ }, [whitelist, form])
+
+ // 입력값 소문자 변환
+ React.useEffect(() => {
+ const watchedValue = form.watch("value")
+ if (watchedValue && watchedValue !== watchedValue.toLowerCase()) {
+ form.setValue("value", watchedValue.toLowerCase())
+ }
+ }, [form])
+
+ function onSubmit(input: UpdateWhitelistSchema) {
+ startUpdateTransition(async () => {
+ if (!session?.user?.id) {
+ toast.error("로그인이 필요합니다")
+ return
+ }
+
+ if (!whitelist) {
+ toast.error("수정할 데이터를 찾을 수 없습니다")
+ return
+ }
+
+ const { error } = await updateEmailWhitelistAction({
+ id: whitelist.id,
+ value: input.value,
+ description: input.description,
+ })
+
+ if (error) {
+ toast.error(error)
+ return
+ }
+
+ props.onOpenChange?.(false)
+ toast.success("화이트리스트 도메인이 수정되었습니다")
+ })
+ }
+
+ return (
+ <Dialog {...props}>
+ <DialogContent className="sm:max-w-[425px]">
+ <DialogHeader>
+ <DialogTitle>화이트리스트 수정</DialogTitle>
+ <DialogDescription>
+ 화이트리스트 정보를 수정합니다.
+ </DialogDescription>
+ </DialogHeader>
+ <Form {...form}>
+ <form
+ onSubmit={form.handleSubmit(onSubmit)}
+ className="space-y-4"
+ >
+ <FormField
+ control={form.control}
+ name="value"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>이메일 주소 또는 도메인</FormLabel>
+ <FormControl>
+ <Input
+ placeholder="예: user@company.com 또는 company.com"
+ {...field}
+ />
+ </FormControl>
+ <FormDescription>
+ 이메일 주소나 도메인을 입력하세요. @가 포함되면 개별 이메일로, 그렇지 않으면 도메인 전체로 등록됩니다. 도메인은 최소 1개의 TLD가 필요합니다.
+ </FormDescription>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+
+ <FormField
+ control={form.control}
+ name="description"
+ render={({ field }) => (
+ <FormItem>
+ <FormLabel>설명 (선택사항)</FormLabel>
+ <FormControl>
+ <Textarea
+ placeholder="도메인에 대한 설명을 입력하세요"
+ className="min-h-[80px]"
+ {...field}
+ />
+ </FormControl>
+ <FormMessage />
+ </FormItem>
+ )}
+ />
+
+ <DialogFooter>
+ <Button
+ type="button"
+ variant="outline"
+ onClick={() => props.onOpenChange?.(false)}
+ disabled={isUpdatePending}
+ >
+ 취소
+ </Button>
+ <Button disabled={isUpdatePending}>
+ {isUpdatePending && (
+ <Loader
+ className="mr-2 size-4 animate-spin"
+ aria-hidden="true"
+ />
+ )}
+ 수정
+ </Button>
+ </DialogFooter>
+ </form>
+ </Form>
+ </DialogContent>
+ </Dialog>
+ )
+}
diff --git a/lib/email-whitelist/table/whitelist-table-columns.tsx b/lib/email-whitelist/table/whitelist-table-columns.tsx
new file mode 100644
index 00000000..2533d863
--- /dev/null
+++ b/lib/email-whitelist/table/whitelist-table-columns.tsx
@@ -0,0 +1,208 @@
+'use client';
+
+/* IMPORT */
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import { Checkbox } from '@/components/ui/checkbox';
+import { MoreHorizontal, Trash, Pencil } from 'lucide-react';
+import { DataTableColumnHeaderSimple } from '@/components/data-table/data-table-column-simple-header';
+import {
+ DropdownMenu,
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuSeparator,
+ DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
+import { formatDate } from '@/lib/utils';
+import { type ColumnDef } from '@tanstack/react-table';
+import { type Dispatch, type SetStateAction } from 'react';
+import { type DataTableRowAction } from '@/types/table';
+import { type EmailWhitelist } from '../service';
+
+// ----------------------------------------------------------------------------------------------------
+
+/* TYPES */
+interface GetColumnsProps {
+ setRowAction: Dispatch<SetStateAction<DataTableRowAction<EmailWhitelist> | null>>;
+}
+
+// ----------------------------------------------------------------------------------------------------
+
+/* FUNCTION FOR GETTING COLUMNS SETTING */
+export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<EmailWhitelist>[] {
+ return [
+ // [1] Checkbox Column
+ {
+ id: 'select',
+ header: ({ table }) => (
+ <Checkbox
+ checked={
+ table.getIsAllPageRowsSelected() ||
+ (table.getIsSomePageRowsSelected() && 'indeterminate')
+ }
+ onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
+ aria-label="Select all"
+ className="translate-y-0.5"
+ />
+ ),
+ cell: ({ row }) => (
+ <Checkbox
+ checked={row.getIsSelected()}
+ onCheckedChange={(value) => row.toggleSelected(!!value)}
+ aria-label="Select row"
+ className="translate-y-0.5"
+ />
+ ),
+ enableSorting: false,
+ enableHiding: false,
+ },
+
+ // [2] ID Column
+ {
+ accessorKey: 'id',
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="ID" />
+ ),
+ cell: ({ row }) => <div>{row.getValue('id')}</div>,
+ enableSorting: false,
+ enableHiding: false,
+ size: 80,
+ },
+
+ // [3] Email/Domain Column
+ {
+ accessorKey: 'displayValue',
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="이메일/도메인" />
+ ),
+ cell: ({ row }) => {
+ const displayValue = row.getValue('displayValue') as string;
+ const isEmail = displayValue.includes('@');
+
+ return (
+ <div className="flex space-x-2">
+ <Badge variant={isEmail ? 'default' : 'outline'} className="font-mono">
+ {isEmail ? displayValue : `@${displayValue}`}
+ </Badge>
+ </div>
+ );
+ },
+ enableSorting: false,
+ size: 220,
+ },
+
+ // [4] Description Column
+ {
+ accessorKey: 'description',
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="설명" />
+ ),
+ cell: ({ row }) => {
+ const description = row.getValue('description') as string;
+ return (
+ <div className="truncate" title={description || ''}>
+ {description || '-'}
+ </div>
+ );
+ },
+ enableSorting: false,
+ size: 200,
+ },
+
+ // [5] Created At Column
+ {
+ accessorKey: 'createdAt',
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="생성일" />
+ ),
+ cell: ({ row }) => {
+ const date = row.getValue('createdAt') as Date;
+ return <div>{formatDate(date, "KR")}</div>;
+ },
+ enableSorting: false,
+ size: 120,
+ },
+
+ // [6] Created By Column
+ {
+ accessorKey: 'createdByName',
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="생성자" />
+ ),
+ cell: ({ row }) => {
+ const name = row.getValue('createdByName') as string;
+ return <div>{name || '-'}</div>;
+ },
+ enableSorting: false,
+ size: 100,
+ },
+
+ // [7] Updated At Column
+ {
+ accessorKey: 'updatedAt',
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="수정일" />
+ ),
+ cell: ({ row }) => {
+ const date = row.getValue('updatedAt') as Date;
+ return <div>{formatDate(date, "KR")}</div>;
+ },
+ enableSorting: false,
+ size: 120,
+ },
+
+ // [8] Updated By Column
+ {
+ accessorKey: 'updatedByName',
+ header: ({ column }) => (
+ <DataTableColumnHeaderSimple column={column} title="수정자" />
+ ),
+ cell: ({ row }) => {
+ const name = row.getValue('updatedByName') as string;
+ return <div>{name || '-'}</div>;
+ },
+ enableSorting: false,
+ size: 100,
+ },
+
+ // [9] Actions Column
+ {
+ id: 'actions',
+ cell: ({ row }) => (
+ <DropdownMenu>
+ <DropdownMenuTrigger asChild>
+ <Button
+ aria-label="Open menu"
+ variant="ghost"
+ className="flex size-6 p-0 data-[state=open]:bg-muted"
+ >
+ <MoreHorizontal className="size-4" />
+ </Button>
+ </DropdownMenuTrigger>
+ <DropdownMenuContent align="end" className="w-[160px]">
+ <DropdownMenuItem
+ onSelect={() => setRowAction({ row, type: 'update' })}
+ >
+ <Pencil className="mr-2 size-4" />
+ 수정
+ </DropdownMenuItem>
+ <DropdownMenuSeparator />
+ <DropdownMenuItem
+ onSelect={() => setRowAction({ row, type: 'delete' })}
+ className="text-destructive"
+ >
+ <Trash className="mr-2 size-4" />
+ 삭제
+ </DropdownMenuItem>
+ </DropdownMenuContent>
+ </DropdownMenu>
+ ),
+ enableSorting: false,
+ enableHiding: false,
+ enableResizing: false,
+ size: 80,
+ minSize: 80,
+ maxSize: 80,
+ },
+ ];
+}
diff --git a/lib/email-whitelist/table/whitelist-table.tsx b/lib/email-whitelist/table/whitelist-table.tsx
new file mode 100644
index 00000000..5d623669
--- /dev/null
+++ b/lib/email-whitelist/table/whitelist-table.tsx
@@ -0,0 +1,130 @@
+"use client"
+
+import * as React from "react"
+import type {
+ DataTableAdvancedFilterField,
+ DataTableFilterField,
+ DataTableRowAction,
+} from "@/types/table"
+
+import { useDataTable } from "@/hooks/use-data-table"
+import { DataTable } from "@/components/data-table/data-table"
+import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar"
+
+import { getColumns } from "./whitelist-table-columns"
+import { type EmailWhitelist } from "../service"
+import { getEmailWhitelistList } from "../service"
+import { UpdateWhitelistDialog } from "./update-whitelist-dialog"
+import { CreateWhitelistDialog } from "./create-whitelist-dialog"
+import { DeleteWhitelistDialog } from "./delete-whitelist-dialog"
+
+interface WhitelistTableProps {
+ promises: Promise<
+ [
+ Awaited<ReturnType<typeof getEmailWhitelistList>>,
+ ]
+ >
+}
+
+export function WhitelistTable({ promises }: WhitelistTableProps) {
+ const [{ data, pageCount }] = React.use(promises)
+
+ const [rowAction, setRowAction] =
+ React.useState<DataTableRowAction<EmailWhitelist> | null>(null)
+
+ const [showCreateDialog, setShowCreateDialog] = React.useState(false)
+
+ const columns = React.useMemo(
+ () => getColumns({ setRowAction }),
+ [setRowAction]
+ )
+
+ /**
+ * 기본 필터 필드 (드롭다운 형태)
+ */
+ const filterFields: DataTableFilterField<EmailWhitelist>[] = []
+
+ /**
+ * 고급 필터 필드 (검색, 날짜 등)
+ */
+ const advancedFilterFields: DataTableAdvancedFilterField<EmailWhitelist>[] = [
+ {
+ id: "displayValue",
+ label: "이메일/도메인",
+ type: "text",
+ },
+ {
+ id: "description",
+ label: "설명",
+ type: "text",
+ },
+ {
+ id: "createdAt",
+ label: "생성일",
+ type: "date",
+ },
+ {
+ id: "updatedAt",
+ label: "수정일",
+ type: "date",
+ },
+ ]
+
+ const { table } = useDataTable({
+ data,
+ columns,
+ pageCount,
+ filterFields,
+ enableAdvancedFilter: true,
+ initialState: {
+ sorting: [{ id: "createdAt", desc: true }],
+ columnPinning: { right: ["actions"] },
+ },
+ getRowId: (originalRow) => String(originalRow.id),
+ shallow: false,
+ clearOnDefault: true,
+ })
+
+ return (
+ <>
+ <DataTable table={table}>
+ <DataTableAdvancedToolbar
+ table={table}
+ filterFields={advancedFilterFields}
+ shallow={false}
+ >
+ <CreateWhitelistDialog
+ open={showCreateDialog}
+ onOpenChange={setShowCreateDialog}
+ />
+ <button
+ type="button"
+ className="inline-flex items-center justify-center rounded-md bg-primary px-4 py-2 text-sm font-medium text-primary-foreground shadow transition-colors hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50"
+ onClick={() => setShowCreateDialog(true)}
+ >
+ 이메일/도메인 추가
+ </button>
+ </DataTableAdvancedToolbar>
+ </DataTable>
+
+ {/* 도메인 수정 Dialog */}
+ <UpdateWhitelistDialog
+ open={rowAction?.type === "update"}
+ onOpenChange={() => setRowAction(null)}
+ whitelist={rowAction?.type === "update" ? rowAction.row.original : null}
+ />
+
+ {/* 도메인 삭제 Dialog */}
+ <DeleteWhitelistDialog
+ open={rowAction?.type === "delete"}
+ onOpenChange={() => setRowAction(null)}
+ whitelists={rowAction?.type === "delete" ? [rowAction.row.original] : []}
+ showTrigger={false}
+ onSuccess={() => {
+ setRowAction(null)
+ // 테이블 새로고침은 server action에서 자동으로 처리됨
+ }}
+ />
+ </>
+ )
+}
generated by cgit v1.2.3 (git 2.39.1) at 2025-12-07 09:44:44 +0000