95 lines
2.7 KiB
TypeScript
95 lines
2.7 KiB
TypeScript
import { useEffect } from 'react'
|
|
import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom'
|
|
import { useAppDispatch, useAppSelector } from '@/hooks/useRedux'
|
|
import { setUser } from '@/stores/authSlice'
|
|
import { authService } from '@/services/api'
|
|
|
|
import LoginPage from './pages/Login'
|
|
import SignupPage from './pages/Signup'
|
|
import ChatPage from './pages/Chat'
|
|
import CallsPage from './pages/Calls'
|
|
import SettingsPage from './pages/Settings'
|
|
import AdminPage from './pages/Admin'
|
|
import ProfilePage from './pages/Profile'
|
|
import FriendsPage from './pages/Friends'
|
|
import ProtectedRoute from '@/components/ProtectedRoute'
|
|
|
|
function App() {
|
|
const dispatch = useAppDispatch()
|
|
const { isAuthenticated, isLoading } = useAppSelector((state) => state.auth)
|
|
|
|
useEffect(() => {
|
|
// Check if user is already logged in
|
|
const checkAuth = async () => {
|
|
const token = localStorage.getItem('token')
|
|
if (token) {
|
|
try {
|
|
const response = await authService.getMe()
|
|
dispatch(setUser(response.data))
|
|
} catch (error) {
|
|
localStorage.removeItem('token')
|
|
}
|
|
}
|
|
}
|
|
|
|
checkAuth()
|
|
}, [dispatch])
|
|
|
|
if (isLoading) {
|
|
return (
|
|
<div className="flex items-center justify-center h-screen bg-gray-900">
|
|
<div className="text-center">
|
|
<div className="inline-block animate-spin rounded-full h-12 w-12 border-4 border-purple-600 border-t-transparent"></div>
|
|
<p className="text-white mt-4">Loading...</p>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<Router>
|
|
<Routes>
|
|
{/* Public Routes */}
|
|
<Route
|
|
path="/login"
|
|
element={isAuthenticated ? <Navigate to="/app" /> : <LoginPage />}
|
|
/>
|
|
<Route
|
|
path="/signup"
|
|
element={isAuthenticated ? <Navigate to="/app" /> : <SignupPage />}
|
|
/>
|
|
|
|
{/* Protected Routes */}
|
|
<Route
|
|
path="/app"
|
|
element={<ProtectedRoute element={<ChatPage />} />}
|
|
/>
|
|
<Route
|
|
path="/calls"
|
|
element={<ProtectedRoute element={<CallsPage />} />}
|
|
/>
|
|
<Route
|
|
path="/settings"
|
|
element={<ProtectedRoute element={<SettingsPage />} />}
|
|
/>
|
|
<Route
|
|
path="/friends"
|
|
element={<ProtectedRoute element={<FriendsPage />} />}
|
|
/>
|
|
<Route
|
|
path="/profile/:userId?"
|
|
element={<ProtectedRoute element={<ProfilePage />} />}
|
|
/>
|
|
<Route
|
|
path="/admin"
|
|
element={<ProtectedRoute element={<AdminPage />} />}
|
|
/>
|
|
|
|
{/* Default redirect */}
|
|
<Route path="/" element={<Navigate to={isAuthenticated ? '/app' : '/login'} />} />
|
|
</Routes>
|
|
</Router>
|
|
)
|
|
}
|
|
|
|
export default App
|