// src/components/SideNav.tsx (Conceptual Example)

import { useTranslation } from 'react-i18next';
import { type RouteConfig } from '@/routes/config';
import { Icon, type NavItemConfig } from '@rkheftan/harmony-ui';
import type { Icon as Iconsax } from 'iconsax-react';

const getIcon = (icon?: Iconsax) => (isSelected: boolean) =>
  icon ? (
    <Icon Component={icon} variant={isSelected ? 'Bold' : 'Broken'} />
  ) : undefined;

export function buildNavItems(routes: RouteConfig[]): NavItemConfig[] {
  const { t } = useTranslation();

  return routes.flatMap((route) => {
    // Check if route itself does not have a navItem but its child has
    if (!route.navConfig && route.children) {
      return buildNavItems(route.children);
    }

    // Check if route.navConfig is defined before destructuring
    if (!route.navConfig) {
      return []; // Return an empty array to be flattened
    }
    const { title, icon } = route.navConfig;
    return {
      text: t(title),
      getIcon: getIcon(icon),
      path: route.path,
      children: route.children ? buildNavItems(route.children) : undefined,
    };
  });
}