How sifatahammed/van-life works
VanLife is a React single-page van-rental demo. Visitors browse and filter vans, then open deferred detail views; hosts sign in to reach a protected dashboard and van-management views. The route tree in src/main.jsx mounts these experiences, while route loaders use shared data helpers. Authentication persists in localStorage and is synchronized across tabs. The README also describes revenue and review summaries. Source excerpts do not include the data-helper or Mirage implementation, so their internal behavior and backend wiring are represented only where the README or sampled callers support them.
Main entry points: main.jsx Router and app · loader.jsx Data helpers · Dashboard.jsx Host dashboard · HostVanLayout.jsx Van editor layout
Components 21
App routing
- Router and app
src/main.jsx - Page layout
src/components/layout.jsx
Rental discovery
- Home and about
src/pages/Home.jsx - Van listings
src/pages/Vans.jsx - Van details
src/pages/Van-Detail.jsx
Authentication
- Login form
src/pages/Login.jsx - Route guard
src/components/Auth.jsx - Auth state
src/components/AuthContext.jsx - Browser storage
Host console
- Host layout
src/components/hostlayout.jsx - Host dashboard
src/pages/host/Dashboard.jsx - Managed vans
src/pages/host/VansList.jsx - Van editor layout
src/components/HostVanLayout.jsx - Van details edit
src/pages/host/Details.jsx - Van pricing
src/pages/host/price.jsx - Van photos
src/pages/host/Photo.jsx - Revenue summary
src/pages/host/income.jsx - Review summary
src/pages/host/reviews.jsx
Data access
- Data helpers
src/components/loader.jsx - Mock API
src/assets/server.js
Other components
- Visitor
Connections 30
- Visitor → Router and app: opens
- Router and app → Page layout: mounts routes
- Page layout → Home and about: renders route
- Router and app → Van listings: routes to
- Router and app → Van details: routes to
- Van listings → Data helpers: loads vans
- Van details → Data helpers: loads van
- Data helpers → Mock API: requests data
- Router and app → Login form: routes to
- Login form → Data helpers: authenticates via
- Login form → Browser storage: writes login
- Auth state → Browser storage: reads and writes
- Auth state → Login form: provides auth state
- Router and app → Route guard: protects host routes
- Route guard → Browser storage: checks login
- Router and app → Host layout: routes to
- Router and app → Host dashboard: routes to
- Host dashboard → Route guard: checks access
- Host dashboard → Data helpers: loads host vans
- Host dashboard → Revenue summary: links to
- Host dashboard → Review summary: links to
- Host dashboard → Managed vans: links to
- Router and app → Managed vans: routes to
- Managed vans → Data helpers: loads host vans
- Router and app → Van editor layout: routes to
- Van editor layout → Route guard: checks access
- Van editor layout → Data helpers: loads host van
- Van editor layout → Van details edit: renders child route
- Van editor layout → Van pricing: renders child route
- Van editor layout → Van photos: renders child route