diff --git a/src/app/admin/_components/PostForm.tsx b/src/app/admin/_components/PostForm.tsx index 8890f75..663cda0 100644 --- a/src/app/admin/_components/PostForm.tsx +++ b/src/app/admin/_components/PostForm.tsx @@ -4,26 +4,11 @@ import { useState, useEffect, FormEvent, ChangeEvent } from "react"; import { useAdmin } from "./useAdmin"; import MarkdownPreview from "./MarkdownPreview"; import styles from "./PostForm.module.scss"; - -interface Category { - id: string; - main_category: string; - sub_category: string; -} - -interface PostFormData { - title: string; - description: string; - markdown: string; - category_id: string; - thumbnail_id: string | null; - is_public: boolean; - datocms_id?: string | null; -} +import { AdminCategoryType, PostFormDataType } from "@/types/adminType"; interface PostFormProps { - initialData?: PostFormData; - onSubmit: (formData: PostFormData) => Promise; + initialData?: PostFormDataType; + onSubmit: (formData: PostFormDataType) => Promise; } export default function PostForm({ initialData, onSubmit }: PostFormProps) { @@ -31,7 +16,7 @@ export default function PostForm({ initialData, onSubmit }: PostFormProps) { const isEditMode = !!initialData; // Form state - const [formData, setFormData] = useState({ + const [formData, setFormData] = useState({ title: initialData?.title || "", description: initialData?.description || "", markdown: initialData?.markdown || "", @@ -42,7 +27,7 @@ export default function PostForm({ initialData, onSubmit }: PostFormProps) { }); // UI state - const [categories, setCategories] = useState([]); + const [categories, setCategories] = useState([]); const [thumbnailPreviewUrl, setThumbnailPreviewUrl] = useState(""); const [isUploading, setIsUploading] = useState(false); const [isSubmitting, setIsSubmitting] = useState(false); diff --git a/src/app/admin/_components/PostList.tsx b/src/app/admin/_components/PostList.tsx index 9983d3b..4afba62 100644 --- a/src/app/admin/_components/PostList.tsx +++ b/src/app/admin/_components/PostList.tsx @@ -2,36 +2,10 @@ import Link from "next/link"; import styles from "./PostList.module.scss"; - -interface Category { - id: string; - main_category: string; - sub_category: string | null; -} - -interface Thumbnail { - id: string; - s3_key: string; - alt: string | null; - title: string | null; - width: number; - height: number; - blur_data_url: string | null; -} - -interface Post { - id: string; - title: string; - description: string | null; - is_public: boolean; - created_at: string; - updated_at: string; - category: Category; - thumbnail: Thumbnail | null; -} +import { AdminCategoryType, AdminPostType } from "@/types/adminType"; interface PostListProps { - posts: Post[]; + posts: AdminPostType[]; onDelete: (id: string) => Promise; } @@ -45,7 +19,7 @@ export default function PostList({ posts, onDelete }: PostListProps) { }); }; - const getCategoryLabel = (category: Category) => { + const getCategoryLabel = (category: AdminCategoryType) => { if (category.sub_category) { return `${category.main_category} / ${category.sub_category}`; } diff --git a/src/types/adminType.ts b/src/types/adminType.ts new file mode 100644 index 0000000..a5abeb2 --- /dev/null +++ b/src/types/adminType.ts @@ -0,0 +1,41 @@ +/** + * Admin 컴포넌트용 타입 정의 + * Supabase 테이블 구조에 직접 매핑되는 타입 + */ + +export interface AdminCategoryType { + id: string; + main_category: string; + sub_category: string | null; +} + +export interface AdminThumbnailType { + id: string; + s3_key: string; + alt: string | null; + title: string | null; + width: number; + height: number; + blur_data_url: string | null; +} + +export interface AdminPostType { + id: string; + title: string; + description: string | null; + is_public: boolean; + created_at: string; + updated_at: string; + category: AdminCategoryType; + thumbnail: AdminThumbnailType | null; +} + +export interface PostFormDataType { + title: string; + description: string; + markdown: string; + category_id: string; + thumbnail_id: string | null; + is_public: boolean; + datocms_id?: string | null; +}