diff --git a/src/component/Common/HeaderLayout/Drawer/DropList.tsx b/src/component/Common/HeaderLayout/Drawer/DropList.tsx index efb71d17..3f84b8ec 100644 --- a/src/component/Common/HeaderLayout/Drawer/DropList.tsx +++ b/src/component/Common/HeaderLayout/Drawer/DropList.tsx @@ -3,7 +3,6 @@ import { useState } from 'react'; import DownArrow from '../../Icon/drawer/DownArrow'; import UpArrow from '../../Icon/drawer/UpArrow'; import DropListItem from './DropListItem'; -import { bodyFontState } from '@/recoil/font/body'; import { titleFontState } from '@/recoil/font/title'; import { drawerBoard } from '@/types/drawerBoard'; import { defaultState } from '@/utils/theme/default'; @@ -11,9 +10,10 @@ import { defaultState } from '@/utils/theme/default'; interface Props { title: string; list: drawerBoard[]; + type: 'personal' | 'history'; } -export default function DropList({ title, list }: Props) { +export default function DropList({ title, list, type }: Props) { const [dropList, setDropList] = useState(false); return ( @@ -34,7 +34,7 @@ export default function DropList({ title, list }: Props) { defaultState.drawerList } w-full scrollbar-thumb-textarea-bg scrollbar-thin scrollbar-thumb-rounded-[7px] `} > - + ); diff --git a/src/component/Common/HeaderLayout/Drawer/DropListItem.tsx b/src/component/Common/HeaderLayout/Drawer/DropListItem.tsx index 8761774e..f173b10a 100644 --- a/src/component/Common/HeaderLayout/Drawer/DropListItem.tsx +++ b/src/component/Common/HeaderLayout/Drawer/DropListItem.tsx @@ -3,34 +3,32 @@ import { useRecoilState } from 'recoil'; import { usePathname, useRouter } from 'next/navigation'; import { Check } from '../../Icon/Drawer'; +import PublicBadge from '../../Icon/PublicBadge'; import { drawerState } from '@/recoil/drawer'; import { drawerBoard } from '@/types/drawerBoard'; import { defaultState } from '@/utils/theme/default'; interface Props { list: drawerBoard[]; - category: string; + type: 'personal' | 'history'; } -export default function DropListItem({ list, category }: Props) { +export default function DropListItem({ list, type }: Props) { const router = useRouter(); const pathname = usePathname(); const [, setDrawer] = useRecoilState(drawerState); - const truncateTitle = (title: string) => { - if (title.length <= 17) { - return title; - } else { - return title.substring(0, 17) + '...'; - } + const truncateTitle = (title: string, isPublic: boolean) => { + const limit = isPublic ? 15 : 17; + return title.length <= limit ? title : title.substring(0, limit) + '...'; }; return list.map((item: drawerBoard) => { - const url = '/'.concat(category, '/', item.id); + const url = '/personal/'.concat(item.id); const isActive = pathname === url; return (
{ router.push(url); @@ -44,7 +42,10 @@ export default function DropListItem({ list, category }: Props) { }`} > {isActive && } -
{truncateTitle(item.title)}
+ {item.public && } +
+ {truncateTitle(item.title, item.public)} +
); diff --git a/src/component/Common/HeaderLayout/Drawer/index.tsx b/src/component/Common/HeaderLayout/Drawer/index.tsx index 070665bb..a659e872 100644 --- a/src/component/Common/HeaderLayout/Drawer/index.tsx +++ b/src/component/Common/HeaderLayout/Drawer/index.tsx @@ -144,8 +144,16 @@ export default function Drawer() {
{isLogin ? ( <> - - + +
- + )}