diff --git a/src/components/IconRenderer.tsx b/src/components/IconRenderer.tsx new file mode 100644 index 0000000..ec0232c --- /dev/null +++ b/src/components/IconRenderer.tsx @@ -0,0 +1,41 @@ +import { Icon } from 'astro-icon/components'; +import type { IconType, LucideIcon, AstroIconName, CustomIconComponent } from '../types'; + +interface IconRendererProps { + icon: IconType; + size?: number; + class?: string; + [key: string]: any; // For additional props like client:load for custom components +} + +// Type guard functions +function isLucideIcon(icon: IconType): icon is LucideIcon { + return typeof icon === 'function' && icon.length <= 1; // Lucide icons are function components +} + +function isAstroIconName(icon: IconType): icon is AstroIconName { + return typeof icon === 'string'; +} + +function isCustomComponent(icon: IconType): icon is CustomIconComponent { + return typeof icon === 'function' && !isLucideIcon(icon); +} + +export default function IconRenderer({ icon, size, class: className, ...props }: IconRendererProps) { + if (isLucideIcon(icon)) { + const LucideComponent = icon; + return ; + } + + if (isAstroIconName(icon)) { + return ; + } + + if (isCustomComponent(icon)) { + const CustomComponent = icon; + return ; + } + + // Fallback + return null; +} \ No newline at end of file diff --git a/src/components/NavigationBar.tsx b/src/components/NavigationBar.tsx index 42e2136..eabf9fe 100644 --- a/src/components/NavigationBar.tsx +++ b/src/components/NavigationBar.tsx @@ -1,14 +1,7 @@ import { useComputed, useSignal } from "@preact/signals"; import { useEffect } from "preact/hooks"; -import { - Home, - NotebookPen, - BriefcaseBusiness, - CodeXml, - Terminal as TerminalIcon, - Megaphone, -} from "lucide-preact"; import { navigationItems } from '../config/data'; +import type { LucideIcon } from '../types'; interface NavigationBarProps { currentPath: string; @@ -26,6 +19,9 @@ export default function NavigationBar({ currentPath }: NavigationBarProps) { return prevScrollPos.value > currentPos; }); + // Filter out disabled navigation items + const enabledNavigationItems = navigationItems.filter(item => item.enabled !== false); + // Update client path when location changes useEffect(() => { const updatePath = () => { @@ -67,15 +63,6 @@ export default function NavigationBar({ currentPath }: NavigationBarProps) { ? activePath.slice(0, -1) : activePath; - const iconMap = { - Home, - NotebookPen, - BriefcaseBusiness, - CodeXml, - TerminalIcon, - Megaphone, - }; - useEffect(() => { let scrollTimer: ReturnType | undefined; @@ -106,8 +93,8 @@ export default function NavigationBar({ currentPath }: NavigationBarProps) { >