integrated supabase with auth

package.json

@@ -40,6 +40,7 @@
     "@radix-ui/react-toggle": "^1.1.0",
     "@radix-ui/react-toggle-group": "^1.1.0",
     "@radix-ui/react-tooltip": "^1.1.4",
+    "@supabase/supabase-js": "^2.75.0",
     "@tanstack/react-query": "^5.56.2",
     "axios": "^1.11.0",
     "class-variance-authority": "^0.7.1",

src/App.tsx

@@ -3,7 +3,15 @@ import { Toaster } from "@/components/ui/toaster";
 import { Toaster as Sonner } from "@/components/ui/sonner";
 import { TooltipProvider } from "@/components/ui/tooltip";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+<<<<<<< Updated upstream
 import { BrowserRouter, Routes, Route, useLocation } from "react-router-dom";
+=======
+import { BrowserRouter, Routes, Route } from "react-router-dom";
+import { AuthProvider } from "@/contexts/AuthContext";
+<<<<<<< Updated upstream
+>>>>>>> Stashed changes
+=======
+>>>>>>> Stashed changes
 import Index from "./pages/Index";
 import NotFound from "./pages/NotFound";
 import GitHubGuidePage from "./pages/GitHubGuidePage";
@@ -15,11 +23,19 @@ import ResumeTemplateDetail from "./pages/ResumeTemplateDetail";
 import ProfilePage from "./pages/ProfilePage";
 import SettingsPage from "./pages/SettingsPage";
 import ComingSoon from './pages/ComingSoon';
+<<<<<<< Updated upstream
+<<<<<<< Updated upstream
 import PrivacyPolicy from './pages/PrivacyPolicy';
 import Terms from './pages/Terms';
 import ProgressTracker from './components/ProgressTracker';
 import FAQBot from './components/FAQBot';
 import React from 'react';
+=======
+import AuthenticationPage from './pages/AuthenticationPage';
+>>>>>>> Stashed changes
+=======
+import AuthenticationPage from './pages/AuthenticationPage';
+>>>>>>> Stashed changes
 
 const queryClient = new QueryClient();
 
@@ -33,6 +49,8 @@ function ScrollToTop() {
 
 const App = () => (
   <QueryClientProvider client={queryClient}>
+<<<<<<< Updated upstream
+<<<<<<< Updated upstream
     <TooltipProvider>
       <Toaster />
       <Sonner />
@@ -58,6 +76,36 @@ const App = () => (
         </Routes>
       </BrowserRouter>
     </TooltipProvider>
+=======
+=======
+>>>>>>> Stashed changes
+    <AuthProvider>
+      <TooltipProvider>
+        <Toaster />
+        <Sonner />
+        <BrowserRouter>
+          <Routes>
+            <Route path="/" element={<Index />} />
+            <Route path="/guides/github" element={<GitHubGuidePage />} />
+            <Route path="/guides/linkedin" element={<LinkedInGuidePage />} />
+            <Route path="/guides/portfolio" element={<PortfolioGuidePage />} />
+            <Route path="/guides/resume" element={<ResumeGuidePage />} />
+            <Route path="/resources/templates" element={<TemplatesPage />} />
+            <Route path="/templates/:templateId" element={<ResumeTemplateDetail />} />
+            <Route path="/profile" element={<ProfilePage />} />
+            <Route path="/settings" element={<SettingsPage />} />
+            <Route path="/coming-soon" element={<ComingSoon />} />
+            <Route path="/auth" element={<AuthenticationPage />} />
+            {/* ADD ALL CUSTOM ROUTES ABOVE THE CATCH-ALL "*" ROUTE */}
+            <Route path="*" element={<NotFound />} />
+          </Routes>
+        </BrowserRouter>
+      </TooltipProvider>
+    </AuthProvider>
+<<<<<<< Updated upstream
+>>>>>>> Stashed changes
+=======
+>>>>>>> Stashed changes
   </QueryClientProvider>
 );
 

src/components/ProtectedRoute.tsx

@@ -0,0 +1,30 @@
+import React from 'react';
+import { Navigate } from 'react-router-dom';
+import { useAuth } from '@/contexts/AuthContext';
+
+interface ProtectedRouteProps {
+  children: React.ReactNode;
+}
+
+const ProtectedRoute: React.FC<ProtectedRouteProps> = ({ children }) => {
+  const { user, loading } = useAuth();
+
+  if (loading) {
+    return (
+      <div className="min-h-screen bg-gradient-to-br from-blue-50 to-indigo-100 flex items-center justify-center">
+        <div className="text-center">
+          <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600 mx-auto"></div>
+          <p className="mt-2 text-gray-600">Loading...</p>
+        </div>
+      </div>
+    );
+  }
+
+  if (!user) {
+    return <Navigate to="/auth" replace />;
+  }
+
+  return <>{children}</>;
+};
+
+export default ProtectedRoute;