From 7dd2b9fc1856306652f311d19697d9880955bfab Mon Sep 17 00:00:00 2001
From: dujinkim <dujin.kim@dtsolution.co.kr>
Date: Fri, 22 Aug 2025 02:12:15 +0000
Subject: (최겸) 공지사항, 인포메이션 기능 수정
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/notice/notice-client.tsx | 116 ++++++++++++++++--------------------
 1 file changed, 53 insertions(+), 63 deletions(-)

(limited to 'components/notice/notice-client.tsx')

diff --git a/components/notice/notice-client.tsx b/components/notice/notice-client.tsx
index e5c05d84..1eb6d75f 100644
--- a/components/notice/notice-client.tsx
+++ b/components/notice/notice-client.tsx
@@ -1,6 +1,6 @@
 "use client"
 
-import { useState, useEffect, useTransition } from "react"
+import React, { useState, useEffect, useTransition } from "react"
 import { useParams } from "next/navigation"
 import { useTranslation } from "@/i18n/client"
 import { Button } from "@/components/ui/button"
@@ -91,28 +91,12 @@ export function NoticeClient({ initialData = [], currentUserId }: NoticeClientPr
   const fetchNotices = async () => {
     try {
       setLoading(true)
-      const search = searchQuery || undefined
 
       startTransition(async () => {
-        const result = await getNoticeLists({
-          page: 1,
-          perPage: 50,
-          search: search,
-          sort: [{ id: sortField, desc: sortDirection === "desc" }],
-          flags: [],
-          filters: [],
-          joinOperator: "and",
-          pagePath: "",
-          title: "",
-          content: "",
-          authorId: null,
-          isActive: null,
-          from: "",
-          to: "",
-        })
+        const result = await getNoticeLists()
 
         if (result?.data) {
-          setNotices(result.data)
+          setNotices(result.data as NoticeWithAuthor[])
         } else {
           toast.error("공지사항 목록을 가져오는데 실패했습니다.")
         }
@@ -125,37 +109,12 @@ export function NoticeClient({ initialData = [], currentUserId }: NoticeClientPr
     }
   }
 
-  // 검색 핸들러
+  // 검색 핸들러 (클라이언트 사이드에서 필터링하므로 별도 동작 불필요)
   const handleSearch = () => {
-    fetchNotices()
+    // 클라이언트 사이드 필터링이므로 별도 서버 요청 불필요
   }
 
-  // 정렬 함수
-  const sortNotices = (notices: NoticeWithAuthor[]) => {
-    return [...notices].sort((a, b) => {
-      let aValue: string | Date
-      let bValue: string | Date
 
-      if (sortField === "title") {
-        aValue = a.title
-        bValue = b.title
-      } else if (sortField === "pagePath") {
-        aValue = a.pagePath
-        bValue = b.pagePath
-      } else {
-        aValue = new Date(a.createdAt)
-        bValue = new Date(b.createdAt)
-      }
-
-      if (aValue < bValue) {
-        return sortDirection === "asc" ? -1 : 1
-      }
-      if (aValue > bValue) {
-        return sortDirection === "asc" ? 1 : -1
-      }
-      return 0
-    })
-  }
 
   // 정렬 핸들러
   const handleSort = (field: SortField) => {
@@ -184,8 +143,49 @@ export function NoticeClient({ initialData = [], currentUserId }: NoticeClientPr
     }
   }
 
-  // 정렬된 공지사항 목록
-  const sortedNotices = sortNotices(notices)
+  // 클라이언트 사이드 필터링 및 정렬
+  const filteredAndSortedNotices = React.useMemo(() => {
+    let filtered = notices
+
+    // 검색 필터
+    if (searchQuery.trim()) {
+      const query = searchQuery.toLowerCase()
+      filtered = filtered.filter(notice => 
+        notice.title.toLowerCase().includes(query) ||
+        notice.pagePath.toLowerCase().includes(query) ||
+        notice.content.toLowerCase().includes(query)
+      )
+    }
+
+    // 정렬
+    filtered = filtered.sort((a, b) => {
+      let aValue: string | Date
+      let bValue: string | Date
+
+      switch (sortField) {
+        case "title":
+          aValue = a.title
+          bValue = b.title
+          break
+        case "pagePath":
+          aValue = a.pagePath
+          bValue = b.pagePath
+          break
+        case "createdAt":
+          aValue = new Date(a.createdAt)
+          bValue = new Date(b.createdAt)
+          break
+        default:
+          return 0
+      }
+
+      if (aValue < bValue) return sortDirection === "asc" ? -1 : 1
+      if (aValue > bValue) return sortDirection === "asc" ? 1 : -1
+      return 0
+    })
+
+    return filtered
+  }, [notices, searchQuery, sortField, sortDirection])
 
   // 페이지 경로 옵션 로딩
   const loadPagePathOptions = async () => {
@@ -227,13 +227,7 @@ export function NoticeClient({ initialData = [], currentUserId }: NoticeClientPr
     loadPagePathOptions()
   }, [])
 
-  useEffect(() => {
-    if (searchQuery !== "") {
-      fetchNotices()
-    } else if (initialData.length > 0) {
-      setNotices(initialData)
-    }
-  }, [searchQuery])
+  // 검색은 클라이언트 사이드에서 실시간으로 처리됨
 
   return (
     <div className="space-y-6">
@@ -243,16 +237,12 @@ export function NoticeClient({ initialData = [], currentUserId }: NoticeClientPr
           <div className="relative flex-1 max-w-md">
             <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 h-4 w-4" />
             <Input
-              placeholder="제목이나 페이지 경로로 검색..."
+              placeholder="제목, 페이지 경로, 내용으로 검색..."
               value={searchQuery}
               onChange={(e) => setSearchQuery(e.target.value)}
               className="pl-10"
-              onKeyPress={(e) => e.key === "Enter" && handleSearch()}
             />
           </div>
-          <Button onClick={handleSearch} variant="outline">
-            검색
-          </Button>
           <Button
             variant="outline"
             onClick={() => window.location.reload()}
@@ -328,14 +318,14 @@ export function NoticeClient({ initialData = [], currentUserId }: NoticeClientPr
                   로딩 중...
                 </TableCell>
               </TableRow>
-            ) : notices.length === 0 ? (
+            ) : filteredAndSortedNotices.length === 0 ? (
               <TableRow>
                 <TableCell colSpan={6} className="text-center py-8 text-gray-500">
-                  공지사항이 없습니다.
+                  {searchQuery.trim() ? "검색 결과가 없습니다." : "공지사항이 없습니다."}
                 </TableCell>
               </TableRow>
             ) : (
-              sortedNotices.map((notice) => (
+              filteredAndSortedNotices.map((notice) => (
                 <TableRow key={notice.id}>
                   <TableCell className="font-medium">
                     <div className="flex items-center gap-2">
-- 
cgit v1.2.3

