diff options
Diffstat (limited to 'components/layout/GroupedMenuRender.tsx')
| -rw-r--r-- | components/layout/GroupedMenuRender.tsx | 30 |
1 files changed, 17 insertions, 13 deletions
diff --git a/components/layout/GroupedMenuRender.tsx b/components/layout/GroupedMenuRender.tsx index 9006c85d..b56135eb 100644 --- a/components/layout/GroupedMenuRender.tsx +++ b/components/layout/GroupedMenuRender.tsx @@ -13,10 +13,11 @@ type GroupedMenuItems = { interface GroupedMenuRendererProps { items: MenuItem[]; lng: string; - activeMenus?: Record<string, boolean>; // 활성 메뉴 상태 추가 + activeMenus?: Record<string, boolean>; + t: (key: string) => string; // 번역 함수 추가 } -const GroupedMenuRenderer = ({ items, lng, activeMenus = {} }: GroupedMenuRendererProps) => { +const GroupedMenuRenderer = ({ items, lng, activeMenus = {}, t }: GroupedMenuRendererProps) => { // 활성 메뉴만 필터링 (activeMenus가 빈 객체면 모든 메뉴 표시) const filteredItems = Object.keys(activeMenus).length > 0 ? filterActiveAdditionalMenus(items, activeMenus) @@ -25,11 +26,14 @@ const GroupedMenuRenderer = ({ items, lng, activeMenus = {} }: GroupedMenuRender // 그룹별로 아이템 분류 const groupItems = (items: MenuItem[]): GroupedMenuItems => { return items.reduce((groups, item) => { - const group = item.group || 'default'; - if (!groups[group]) { - groups[group] = []; + // groupKey가 있으면 번역된 그룹명 사용, 없으면 'default' + const groupKey = item.groupKey || 'default'; + const groupName = item.groupKey ? t(item.groupKey) : 'default'; + + if (!groups[groupName]) { + groups[groupName] = []; } - groups[group].push(item); + groups[groupName].push(item); return groups; }, {} as GroupedMenuItems); }; @@ -42,7 +46,7 @@ const GroupedMenuRenderer = ({ items, lng, activeMenus = {} }: GroupedMenuRender return ( <div className="p-4 w-[600px]"> <p className="text-sm text-muted-foreground text-center py-8"> - 사용 가능한 메뉴가 없습니다. + {t('common.no_available_menus')} </p> </div> ); @@ -53,7 +57,7 @@ const GroupedMenuRenderer = ({ items, lng, activeMenus = {} }: GroupedMenuRender {groups.map((groupName, index) => { // 빈 그룹은 건너뛰기 if (groupedItems[groupName].length === 0) return null; - + return ( <div key={groupName} className={cn("mb-4", index < groups.length - 1 && "pb-2 border-b border-border/30")}> {groupName !== 'default' && ( @@ -61,7 +65,7 @@ const GroupedMenuRenderer = ({ items, lng, activeMenus = {} }: GroupedMenuRender )} <div className="grid grid-cols-2 gap-3"> {groupedItems[groupName].map((item) => ( - <MenuListItem key={item.title} item={item} lng={lng} /> + <MenuListItem key={item.titleKey} item={item} lng={lng} t={t} /> ))} </div> </div> @@ -71,7 +75,7 @@ const GroupedMenuRenderer = ({ items, lng, activeMenus = {} }: GroupedMenuRender ); }; -const MenuListItem = ({ item, lng }: { item: MenuItem; lng: string }) => { +const MenuListItem = ({ item, lng, t }: { item: MenuItem; lng: string; t: (key: string) => string }) => { return ( <NavigationMenuLink asChild> <Link @@ -84,10 +88,10 @@ const MenuListItem = ({ item, lng }: { item: MenuItem; lng: string }) => { )} > <div className="space-y-1"> - <div className="text-sm font-medium leading-none">{item.title}</div> - {item.description && ( + <div className="text-sm font-medium leading-none">{t(item.titleKey)}</div> + {item.descriptionKey && ( <p className="line-clamp-2 text-xs leading-snug text-muted-foreground"> - {item.description} + {t(item.descriptionKey)} </p> )} </div> |