// config/navigationConfig.tsx
import React from 'react';
import {
  Chat as ChatIcon,
  Dashboard as DashboardIcon,
  Description as DescriptionIcon,
  BarChart as BarChartIcon,
  Settings as SettingsIcon,
  Work as WorkIcon,
  Info as InfoIcon,
  Person as PersonIcon,
  Business as BusinessIcon,
  Search as SearchIcon,
  Bookmark as BookmarkIcon,
  History as HistoryIcon,
  QuestionAnswer as QuestionAnswerIcon,
  AttachMoney as AttachMoneyIcon,
} from '@mui/icons-material';

import { BackstoryLogo } from 'components/ui/BackstoryLogo';
import { HomePage } from 'pages/HomePage';
import { CandidateChatPage } from 'pages/CandidateChatPage';
import { ResumeBuilderPage } from 'pages/ResumeBuilderPage';
import { DocsPage } from 'pages/DocsPage';
import { CreateProfilePage } from 'pages/CreateProfilePage';
import { VectorVisualizerPage } from 'pages/VectorVisualizerPage';
import { BetaPage } from 'pages/BetaPage';
import { CandidateListingPage } from 'pages/FindCandidatePage';
import { JobAnalysisPage } from 'pages/JobAnalysisPage';
import { GenerateCandidate } from 'pages/GenerateCandidate';
import { ControlsPage } from 'pages/ControlsPage';
import { LoginPage } from 'pages/LoginPage';
import { CandidateDashboardPage } from 'pages/candidate/Dashboard';
import { EmailVerificationPage } from 'components/EmailVerificationComponents';
import { Typography } from '@mui/material';
import { NavigationConfig, NavigationItem } from 'types/navigation';

// Beta page components for placeholder routes
const BackstoryPage = () => (<BetaPage><Typography variant="h4">Backstory</Typography></BetaPage>);
const ResumesPage = () => (<BetaPage><Typography variant="h4">Resumes</Typography></BetaPage>);
const QASetupPage = () => (<BetaPage><Typography variant="h4">Q&A Setup</Typography></BetaPage>);
const SearchPage = () => (<BetaPage><Typography variant="h4">Search</Typography></BetaPage>);
const SavedPage = () => (<BetaPage><Typography variant="h4">Saved</Typography></BetaPage>);
const JobsPage = () => (<BetaPage><Typography variant="h4">Jobs</Typography></BetaPage>);
const CompanyPage = () => (<BetaPage><Typography variant="h4">Company</Typography></BetaPage>);
const LogoutPage = () => (<BetaPage><Typography variant="h4">Logout page...</Typography></BetaPage>);
const AnalyticsPage = () => (<BetaPage><Typography variant="h4">Analytics</Typography></BetaPage>);
const SettingsPage = () => (<BetaPage><Typography variant="h4">Settings</Typography></BetaPage>);

export const navigationConfig: NavigationConfig = {
  items: [
    {
      id: 'home',
      label: <BackstoryLogo />,
      path: '/',
      component: <HomePage />,
      userTypes: ['guest', 'candidate', 'employer'],
      exact: true,
    },
    {
      id: 'find-candidate',
      label: 'Find a Candidate',
      path: '/find-a-candidate',
      icon: <InfoIcon />,
      component: <CandidateListingPage />,
      userTypes: ['guest', 'candidate', 'employer'],
    },
    {
      id: 'docs',
      label: 'Docs',
      path: '/docs',
      icon: <InfoIcon />,
      component: <DocsPage />,
      userTypes: ['guest', 'candidate', 'employer'],
      children: [
        {
          id: 'docs-subpage',
          label: 'Docs Subpage',
          path: '/docs/:subPage',
          component: <DocsPage />,
          userTypes: ['guest', 'candidate', 'employer'],
        },
      ],
    },
    {
      id: 'chat',
      label: 'Chat',
      path: '/chat',
      icon: <ChatIcon />,
      component: <CandidateChatPage />,
      userTypes: ['candidate', 'employer'],
    },
    {
      id: 'candidate-menu',
      label: 'Candidate Tools',
      icon: <PersonIcon />,
      userTypes: ['candidate'],
      children: [
        {
          id: 'candidate-dashboard',
          label: 'Dashboard',
          path: '/candidate/dashboard',
          icon: <DashboardIcon />,
          component: <CandidateDashboardPage />,
          userTypes: ['candidate'],
          children: [
            {
              id: 'candidate-dashboard-subpage',
              label: 'Dashboard Subpage',
              path: '/candidate/dashboard/:subPage',
              component: <CandidateDashboardPage />,
              userTypes: ['candidate'],
            },
          ],
        },
        {
          id: 'candidate-job-analysis',
          label: 'Job Analysis',
          path: '/candidate/job-analysis',
          icon: <WorkIcon />,
          component: <JobAnalysisPage />,
          userTypes: ['candidate'],
        },
        {
          id: 'candidate-resume-builder',
          label: 'Resume Builder',
          path: '/candidate/resume-builder',
          icon: <DescriptionIcon />,
          component: <ResumeBuilderPage />,
          userTypes: ['candidate'],
        },
        {
          id: 'candidate-backstory',
          label: 'Backstory',
          path: '/candidate/backstory',
          icon: <HistoryIcon />,
          component: <BackstoryPage />,
          userTypes: ['candidate'],
        },
        {
          id: 'candidate-resumes',
          label: 'Resumes',
          path: '/candidate/resumes',
          icon: <DescriptionIcon />,
          component: <ResumesPage />,
          userTypes: ['candidate'],
        },
        {
          id: 'candidate-qa-setup',
          label: 'Q&A Setup',
          path: '/candidate/qa-setup',
          icon: <QuestionAnswerIcon />,
          component: <QASetupPage />,
          userTypes: ['candidate'],
        },
        {
          id: 'candidate-analytics',
          label: 'Analytics',
          path: '/candidate/analytics',
          icon: <BarChartIcon />,
          component: <AnalyticsPage />,
          userTypes: ['candidate'],
        },
        {
          id: 'candidate-settings',
          label: 'Settings',
          path: '/candidate/settings',
          icon: <SettingsIcon />,
          component: <SettingsPage />,
          userTypes: ['candidate'],
        },
      ],
    },
    {
      id: 'employer-menu',
      label: 'Employer Tools',
      icon: <BusinessIcon />,
      userTypes: ['employer'],
      children: [
        {
          id: 'employer-job-analysis',
          label: 'Job Analysis',
          path: '/employer/job-analysis',
          icon: <WorkIcon />,
          component: <JobAnalysisPage />,
          userTypes: ['employer'],
        },
        {
          id: 'employer-resume-builder',
          label: 'Resume Builder',
          path: '/employer/resume-builder',
          icon: <DescriptionIcon />,
          component: <ResumeBuilderPage />,
          userTypes: ['employer'],
        },
        {
          id: 'employer-knowledge-explorer',
          label: 'Knowledge Explorer',
          path: '/employer/knowledge-explorer',
          icon: <WorkIcon />,
          component: <VectorVisualizerPage />,
          userTypes: ['employer'],
        },
        {
          id: 'employer-search',
          label: 'Search',
          path: '/employer/search',
          icon: <SearchIcon />,
          component: <SearchPage />,
          userTypes: ['employer'],
        },
        {
          id: 'employer-saved',
          label: 'Saved',
          path: '/employer/saved',
          icon: <BookmarkIcon />,
          component: <SavedPage />,
          userTypes: ['employer'],
        },
        {
          id: 'employer-jobs',
          label: 'Jobs',
          path: '/employer/jobs',
          icon: <WorkIcon />,
          component: <JobsPage />,
          userTypes: ['employer'],
        },
        {
          id: 'employer-company',
          label: 'Company',
          path: '/employer/company',
          icon: <BusinessIcon />,
          component: <CompanyPage />,
          userTypes: ['employer'],
        },
        {
          id: 'employer-analytics',
          label: 'Analytics',
          path: '/employer/analytics',
          icon: <BarChartIcon />,
          component: <AnalyticsPage />,
          userTypes: ['employer'],
        },
        {
          id: 'employer-settings',
          label: 'Settings',
          path: '/employer/settings',
          icon: <SettingsIcon />,
          component: <SettingsPage />,
          userTypes: ['employer'],
        },
      ],
    },
    {
      id: 'global-tools',
      label: 'Tools',
      icon: <SettingsIcon />,
      userTypes: ['candidate', 'employer'],
      children: [
        {
          id: 'resume-builder',
          label: 'Resume Builder',
          path: '/resume-builder',
          icon: <DescriptionIcon />,
          component: <ResumeBuilderPage />,
          userTypes: ['candidate', 'employer'],
        },
        {
          id: 'knowledge-explorer',
          label: 'Knowledge Explorer',
          path: '/knowledge-explorer',
          icon: <WorkIcon />,
          component: <VectorVisualizerPage />,
          userTypes: ['candidate', 'employer'],
        },
        {
          id: 'job-analysis',
          label: 'Job Analysis',
          path: '/job-analysis',
          icon: <WorkIcon />,
          component: <JobAnalysisPage />,
          userTypes: ['candidate', 'employer'],
        },
        {
          id: 'generate-candidate',
          label: 'Generate Candidate',
          path: '/generate-candidate',
          icon: <PersonIcon />,
          component: <GenerateCandidate />,
          userTypes: ['candidate', 'employer'],
        },
        {
          id: 'settings',
          label: 'Settings',
          path: '/settings',
          icon: <SettingsIcon />,
          component: <ControlsPage />,
          userTypes: ['candidate', 'employer'],
        },
      ],
    },
    // Auth routes (special handling)
    {
      id: 'auth',
      label: 'Auth',
      userTypes: ['guest', 'candidate', 'employer'],
      children: [
        {
          id: 'register',
          label: 'Register',
          path: '/register',
          component: <BetaPage><CreateProfilePage /></BetaPage>,
          userTypes: ['guest'],
        },
        {
          id: 'login',
          label: 'Login',
          path: '/login',
          component: <LoginPage />,
          userTypes: ['guest', 'candidate', 'employer'],
        },
        {
          id: 'verify-email',
          label: 'Verify Email',
          path: '/login/verify-email',
          component: <EmailVerificationPage />,
          userTypes: ['guest', 'candidate', 'employer'],
        },
        {
          id: 'logout',
          label: 'Logout',
          path: '/logout',
          component: <LogoutPage />,
          userTypes: ['candidate', 'employer'],
        },
      ],
    },
    // Catch-all route
    {
      id: 'catch-all',
      label: 'Not Found',
      path: '*',
      component: <BetaPage />,
      userTypes: ['guest', 'candidate', 'employer'],
    },
  ],
};

// Utility functions for working with navigation config
export const getNavigationItemsForUser = (userType: 'guest' | 'candidate' | 'employer' | null): NavigationItem[] => {
  const currentUserType = userType || 'guest';
  
  const filterItems = (items: NavigationItem[]): NavigationItem[] => {
    return items
      .filter(item => !item.userTypes || item.userTypes.includes(currentUserType))
      .map(item => ({
        ...item,
        children: item.children ? filterItems(item.children) : undefined,
      }))
      .filter(item => item.path || (item.children && item.children.length > 0));
  };

  return filterItems(navigationConfig.items);
};

export const getAllRoutes = (userType: 'guest' | 'candidate' | 'employer' | null): NavigationItem[] => {
  const currentUserType = userType || 'guest';
  
  const extractRoutes = (items: NavigationItem[]): NavigationItem[] => {
    const routes: NavigationItem[] = [];
    
    items.forEach(item => {
      if (!item.userTypes || item.userTypes.includes(currentUserType)) {
        if (item.path && item.component) {
          routes.push(item);
        }
        if (item.children) {
          routes.push(...extractRoutes(item.children));
        }
      }
    });
    
    return routes;
  };

  return extractRoutes(navigationConfig.items);
};

export const getMainNavigationItems = (userType: 'guest' | 'candidate' | 'employer' | null): NavigationItem[] => {
  return getNavigationItemsForUser(userType)
    .filter(item => 
      item.id !== 'auth' && 
      item.id !== 'catch-all' &&
      (item.path || (item.children && item.children.length > 0))
    );
};