iamcoolvivek007/freightdesk
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat[router]: add Shipper Dashboard route and nav link

Browse source
This commit is contained in:
Hermes Agent 2026-06-08 02:15:26 +00:00
parent 8e8e7a5ff2
commit c4343e6958
1 changed files with 30 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

52
frontend/src/router.jsx
View file

@ -1,26 +1,35 @@
import React from 'react';
import { createRootRoute, RouterProvider, createBrowserRouter, Link } from '@tanstack/react-router';
import { createRootRoute, RouterProvider, createBrowserRouter } from '@tanstack/react-router';
import LoadsList from './components/LoadsList';
import ShippersList from './components/ShippersList';
import VehicleMap from './components/VehicleMap';
import ShipperDashboard from './components/ShipperDashboard';
// Root layout – can later include a navbar or sidebar
function RootLayout({ children }) {
return (
<div>
{/* Simple header */}
<header className="bg-primary text-white p-3">
<h1 className="mb-0" style={{ fontSize: '1.5rem' }}>FreightDesk Dashboard</h1>
<div className="min-vh-100 bg-light">
{/* Navigation Header */}
<header className="bg-primary text-white p-3 shadow-sm">
<div className="container d-flex justify-content-between align-items-center">
<h1 className="mb-0" style={{ fontSize: '1.5rem', fontWeight: 'bold' }}>FreightDesk Dashboard</h1>
<nav>
<ul className="nav">
<li className="nav-item">
<a className="nav-link text-white" href="/loads">Loads</a>
</li>
<li className="nav-item">
<a className="nav-link text-white" href="/shippers">Shippers</a>
</li>
<li className="nav-item">
<a className="nav-link text-white" href="/shipper-dashboard">Shipper Dashboard</a>
</li>
</ul>
</nav>
</div>
</header>
{/* Navigation */}
<nav className="mb-4">
<Link href="/loads" className="nav-link">Loads</Link>
<Link href="/shippers" className="nav-link">Shippers</Link>
<Link href="/vehicles" className="nav-link">Vehicles</Link>
</nav>
<main>{children}</main>
<main className="container py-4">
{children}
</main>
</div>
);
}
@ -42,17 +51,16 @@ const shippersRoute = rootRoute.createRoute({
component: ShippersList,
});
// Vehicle tracking page route
const vehiclesRoute = rootRoute.createRoute({
path: '/vehicles',
component: VehicleMap,
// Shipper Dashboard route
const shipperDashboardRoute = rootRoute.createRoute({
path: '/shipper-dashboard',
component: ShipperDashboard,
});
// Default route – redirect to /loads
const indexRoute = rootRoute.createRoute({
path: '/',
component: () => {
// Simple redirect component
React.useEffect(() => {
window.location.replace('/loads');
}, []);
@ -61,10 +69,10 @@ const indexRoute = rootRoute.createRoute({
});
// Build the router
const routeTree = rootRoute.addChildren([loadsRoute, shippersRoute, vehiclesRoute, indexRoute]);
const routeTree = rootRoute.addChildren([loadsRoute, shippersRoute, shipperDashboardRoute, indexRoute]);
export const router = createBrowserRouter({ routeTree });
export function AppRouter() {
return <RouterProvider router={router} />;
}
}