49 lines
1.3 KiB
React
49 lines
1.3 KiB
React
|
import { useAuth } from '../contexts/AuthContext';
|
||
|
|
|
||
|
|
const Dashboard = () => {
|
||
|
|
const { user, logout } = useAuth();
|
||
|
|
|
||
|
|
const handleLogout = async () => {
|
||
|
|
await logout();
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="dashboard">
|
||
|
|
<header className="dashboard-header">
|
||
|
|
<h1>Trip Planner Dashboard</h1>
|
||
|
|
<div className="user-info">
|
||
|
|
<span>Welcome, {user?.name}!</span>
|
||
|
|
<button onClick={handleLogout} className="logout-btn">
|
||
|
|
Logout
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<main className="dashboard-content">
|
||
|
|
<div className="welcome-section">
|
||
|
|
<h2>Welcome to Your Trip Planner</h2>
|
||
|
|
<p>Start planning your next adventure!</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="features-grid">
|
||
|
|
<div className="feature-card">
|
||
|
|
<h3>Plan Trips</h3>
|
||
|
|
<p>Create and organize your travel itineraries</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="feature-card">
|
||
|
|
<h3>Save Destinations</h3>
|
||
|
|
<p>Keep track of places you want to visit</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="feature-card">
|
||
|
|
<h3>Share Plans</h3>
|
||
|
|
<p>Collaborate with friends and family</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</main>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
export default Dashboard;
|