import React from 'react';
import { HashRouter, Routes, Route, Navigate } from 'react-router-dom';
import { useAuth } from '../context/AuthContext';
import LoginPage from '../pages/LoginPage';
import StudioPage from '../pages/StudioPage';
import WorkspacePage from '../pages/WorkspacePage';
import PipelineListPage from '../pages/PipelineListPage';
import ComponentDocsPage from '../pages/ComponentDocsPage';
import SettingsPage from '../pages/SettingsPage';

function ProtectedRoute({ children }) {
  const { isAuthenticated } = useAuth();
  if (!isAuthenticated) {
    return <Navigate to="/login" replace />;
  }
  return children;
}

export default function AppRouter() {
  const { isAuthenticated } = useAuth();

  return (
    <HashRouter>
      <Routes>
        <Route path="/" element={<Navigate to={isAuthenticated ? '/studio' : '/login'} replace />} />
        <Route path="/login" element={isAuthenticated ? <Navigate to="/studio" replace /> : <LoginPage />} />
        <Route path="/auth/callback" element={<LoginPage />} />
        
        <Route
          path="/overview"
          element={
            <ProtectedRoute>
              <WorkspacePage isAllPipelines={false} />
            </ProtectedRoute>
          }
        />
        <Route
          path="/studio"
          element={
            <ProtectedRoute>
              <StudioPage />
            </ProtectedRoute>
          }
        />
        <Route
          path="/studio/:pipelineId"
          element={
            <ProtectedRoute>
              <StudioPage />
            </ProtectedRoute>
          }
        />
        <Route
          path="/pipelines"
          element={
            <ProtectedRoute>
              <WorkspacePage isAllPipelines={true} />
            </ProtectedRoute>
          }
        />
        <Route
          path="/docs"
          element={
            <ProtectedRoute>
              <ComponentDocsPage />
            </ProtectedRoute>
          }
        />
        <Route
          path="/settings"
          element={
            <ProtectedRoute>
              <SettingsPage />
            </ProtectedRoute>
          }
        />

        <Route path="*" element={<Navigate to={isAuthenticated ? '/studio' : '/login'} replace />} />
      </Routes>
    </HashRouter>
  );
}