diff --git a/src/apis/admin.ts b/src/apis/admin.ts index 8508d49..e2ef8de 100644 --- a/src/apis/admin.ts +++ b/src/apis/admin.ts @@ -63,11 +63,12 @@ const postBadWords = async (badWordsRequest: BadWords) => { } }; -// 내 상상대로 만든 필터링 단어 취소 버튼 -const patchBadWordsUsed = async (badWordId: string) => { +const patchBadWordsUsed = async (badWordId: string, isUsed: string) => { + const reverseIsUsed = isUsed === 'true' ? false : true; + try { - const res = await client.patch(`/api/bad-words/${badWordId}/status`, { isUsed: false }); - if (!res) throw new Error('검열 단어 삭제 도중 에러가 발생했습니다.'); + const res = await client.patch(`/api/bad-words/${badWordId}/status`, { isUsed: reverseIsUsed }); + if (!res) throw new Error('검열 활성화/비활성화 도중 에러가 발생했습니다.'); console.log(res); return res; } catch (error) { @@ -78,7 +79,18 @@ const patchBadWordsUsed = async (badWordId: string) => { const patchBadWords = async (badWordId: string, word: string) => { try { const res = await client.patch(`/api/bad-words/${badWordId}`, { word: word }); - if (!res) throw new Error('검열 단어 삭제 도중 에러가 발생했습니다.'); + if (!res) throw new Error('금칙어 수정중 에러가 발생했습니다.'); + console.log(res); + return res; + } catch (error) { + console.error(error); + } +}; + +const deleteBadWords = async (id: string) => { + try { + const res = await client.delete(`/api/bad-words/${id}`); + if (!res) throw new Error('금칙어 삭제 도중 에러가 발생했습니다.'); console.log(res); return res; } catch (error) { @@ -94,4 +106,5 @@ export { postBadWords, patchBadWordsUsed, patchBadWords, + deleteBadWords, }; diff --git a/src/pages/Admin/Filtering.tsx b/src/pages/Admin/Filtering.tsx index 8f59b21..aad0f86 100644 --- a/src/pages/Admin/Filtering.tsx +++ b/src/pages/Admin/Filtering.tsx @@ -1,7 +1,7 @@ import { useEffect, useState } from 'react'; -import { getBadWords, patchBadWordsUsed } from '@/apis/admin'; -import { AddIcon, AlarmIcon, CancelIcon } from '@/assets/icons'; +import { getBadWords } from '@/apis/admin'; +import { AddIcon, AlarmIcon } from '@/assets/icons'; import AddInputButton from './components/AddInputButton'; import AdminPageTitle from './components/AdminPageTitle'; diff --git a/src/pages/Admin/components/AddInputButton.tsx b/src/pages/Admin/components/AddInputButton.tsx index 1baf604..15ed676 100644 --- a/src/pages/Admin/components/AddInputButton.tsx +++ b/src/pages/Admin/components/AddInputButton.tsx @@ -23,7 +23,7 @@ export default function AddInputButton({ if (inputText.word === '') return setAddInputShow(false); const res = await postBadWords(inputText); if (res?.status === 200) { - setBadWords((cur) => [...cur, res.data.data]); + setBadWords((cur) => [...cur, { ...res.data.data, isUsed: `${res.data.data.isUsed}` }]); setAddInputShow(false); } }; diff --git a/src/pages/Admin/components/FilterTextItem.tsx b/src/pages/Admin/components/FilterTextItem.tsx index 34c3283..632cda2 100644 --- a/src/pages/Admin/components/FilterTextItem.tsx +++ b/src/pages/Admin/components/FilterTextItem.tsx @@ -1,7 +1,8 @@ -import { patchBadWordsUsed } from '@/apis/admin'; +import { deleteBadWords, patchBadWordsUsed } from '@/apis/admin'; import { DeleteIcon, PencilIcon, ToggleOff, ToggleOn } from '@/assets/icons'; import { useState } from 'react'; import PatchInput from './PatchInput'; +import { twMerge } from 'tailwind-merge'; export default function FilterTextItem({ badWord, @@ -12,8 +13,47 @@ export default function FilterTextItem({ }) { const [patchInputShow, setPatchInputShow] = useState(false); + const handleDeleteBadWords = async (id: string) => { + const res = await deleteBadWords(id); + if (res?.status === 200) { + setBadWords((cur) => + cur.filter((e) => { + if (e.id === id) { + return null; + } + return e; + }), + ); + } + }; + + const handlePatchBadWordsUsed = async (id: string, isUsed: string) => { + const res = await patchBadWordsUsed(id, isUsed); + if (res?.status === 200) { + setBadWords((cur) => + cur.map((e) => { + if (e.id === id) { + let reverseIsUsed: string; + if (e.isUsed === 'true') { + reverseIsUsed = 'false'; + } else { + reverseIsUsed = 'true'; + } + return { ...e, isUsed: reverseIsUsed }; + } + return e; + }), + ); + } + }; + + const buttonStyle = twMerge( + `flex items-center gap-1.5 rounded-2xl px-4 py-1.5`, + badWord.isUsed === 'true' ? 'bg-primary-3' : 'bg-[#c1c1c1]', + ); + return ( - + {patchInputShow ? ( - - ); diff --git a/src/pages/Admin/components/Sidebar.tsx b/src/pages/Admin/components/Sidebar.tsx index 6de7cc6..5e37509 100644 --- a/src/pages/Admin/components/Sidebar.tsx +++ b/src/pages/Admin/components/Sidebar.tsx @@ -4,9 +4,11 @@ import { twMerge } from 'tailwind-merge'; import { AlarmIcon, ArrowDownIcon } from '@/assets/icons'; import { ADMIN_MENU_LIST } from '../constants'; +import useAuthStore from '@/stores/authStore'; export default function Sidebar() { const location = useLocation(); + const logout = useAuthStore((state) => state.logout); return (
@@ -16,7 +18,7 @@ export default function Sidebar() {

현재 로그인 계정

-

{'admin123@test.com'}

+

{'wl990@naver.com'}


@@ -54,7 +56,9 @@ export default function Sidebar() {
); diff --git a/src/types/admin.d.ts b/src/types/admin.d.ts index 4efa604..27ba6ba 100644 --- a/src/types/admin.d.ts +++ b/src/types/admin.d.ts @@ -75,6 +75,7 @@ interface BadWords { interface BadWordsData extends BadWords { id: string; + isUsed: string; } //