feat: proper routing - landing at /, app at /app
This commit is contained in:
parent
15123e8aa8
commit
a10e9c9c6a
2 changed files with 101 additions and 13 deletions
|
|
@ -1,33 +1,105 @@
|
|||
import React from 'react';
|
||||
import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
|
||||
import { AuthProvider, useAuth } from './contexts/AuthContext';
|
||||
import { MessagingProvider } from './contexts/MessagingContext';
|
||||
import MainLayout from './mockup/MainLayout';
|
||||
import LandingPage from './mockup/pages/LandingPage';
|
||||
import LoginPage from './mockup/pages/LoginPage';
|
||||
import RegisterPage from './mockup/pages/RegisterPage';
|
||||
import AboutPage from './mockup/pages/AboutPage';
|
||||
import FeaturesPage from './mockup/pages/FeaturesPage';
|
||||
import './index.css';
|
||||
import './mockup/mockup.css';
|
||||
|
||||
/**
|
||||
* Main application component
|
||||
* AeThex Connect - Discord-style communication platform
|
||||
* Protected route - requires authentication
|
||||
*/
|
||||
function AppContent() {
|
||||
const { user, loading } = useAuth();
|
||||
|
||||
function ProtectedRoute({ children }) {
|
||||
const { isAuthenticated, loading } = useAuth();
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="flex items-center justify-center h-screen bg-zinc-900">
|
||||
<div className="animate-spin rounded-full h-12 w-12 border-t-2 border-purple-500"></div>
|
||||
<div className="loading-screen">
|
||||
<div className="loading-spinner"></div>
|
||||
<span>Loading...</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return isAuthenticated ? children : <Navigate to="/login" replace />;
|
||||
}
|
||||
|
||||
return <MainLayout />;
|
||||
/**
|
||||
* Public route - redirects to app if logged in
|
||||
*/
|
||||
function PublicRoute({ children }) {
|
||||
const { isAuthenticated, loading } = useAuth();
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="loading-screen">
|
||||
<div className="loading-spinner"></div>
|
||||
<span>Loading...</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return !isAuthenticated ? children : <Navigate to="/app" replace />;
|
||||
}
|
||||
|
||||
/**
|
||||
* Main app with routing
|
||||
*/
|
||||
function AppRoutes() {
|
||||
const { login, register, logout } = useAuth();
|
||||
|
||||
return (
|
||||
<Routes>
|
||||
{/* Marketing pages - public */}
|
||||
<Route path="/" element={<LandingPage />} />
|
||||
<Route path="/features" element={<FeaturesPage />} />
|
||||
<Route path="/about" element={<AboutPage />} />
|
||||
|
||||
{/* Auth pages */}
|
||||
<Route path="/login" element={
|
||||
<PublicRoute>
|
||||
<LoginPage onLogin={login} />
|
||||
</PublicRoute>
|
||||
} />
|
||||
<Route path="/register" element={
|
||||
<PublicRoute>
|
||||
<RegisterPage onRegister={register} />
|
||||
</PublicRoute>
|
||||
} />
|
||||
|
||||
{/* Connect App - protected */}
|
||||
<Route path="/app" element={
|
||||
<ProtectedRoute>
|
||||
<MessagingProvider>
|
||||
<MainLayout onLogout={logout} />
|
||||
</MessagingProvider>
|
||||
</ProtectedRoute>
|
||||
} />
|
||||
<Route path="/app/*" element={
|
||||
<ProtectedRoute>
|
||||
<MessagingProvider>
|
||||
<MainLayout onLogout={logout} />
|
||||
</MessagingProvider>
|
||||
</ProtectedRoute>
|
||||
} />
|
||||
|
||||
{/* Catch all - redirect to home */}
|
||||
<Route path="*" element={<Navigate to="/" replace />} />
|
||||
</Routes>
|
||||
);
|
||||
}
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<AuthProvider>
|
||||
<MessagingProvider>
|
||||
<AppContent />
|
||||
</MessagingProvider>
|
||||
</AuthProvider>
|
||||
<BrowserRouter>
|
||||
<AuthProvider>
|
||||
<AppRoutes />
|
||||
</AuthProvider>
|
||||
</BrowserRouter>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -49,6 +49,21 @@ export function AuthProvider({ children }) {
|
|||
return { success: true };
|
||||
};
|
||||
|
||||
const register = async (email, password, metadata = {}) => {
|
||||
const { data, error } = await supabase.auth.signUp({
|
||||
email,
|
||||
password,
|
||||
options: {
|
||||
data: metadata
|
||||
}
|
||||
});
|
||||
if (error) {
|
||||
return { success: false, error: error.message };
|
||||
}
|
||||
setUser(data.user);
|
||||
return { success: true };
|
||||
};
|
||||
|
||||
const logout = async () => {
|
||||
await supabase.auth.signOut();
|
||||
setUser(null);
|
||||
|
|
@ -62,6 +77,7 @@ export function AuthProvider({ children }) {
|
|||
user,
|
||||
loading,
|
||||
login,
|
||||
register,
|
||||
logout,
|
||||
updateUser,
|
||||
isAuthenticated: !!user
|
||||
|
|
|
|||
Loading…
Reference in a new issue