How juliayooo/tonton works
TONTON is a customer-facing café website whose main workflow routes visitors to location and ordering information or to a live menu. The menu page fetches rows from Google Sheets through OpenSheet, resolves available item images from Firebase Storage, and renders categories and items. The home page adds a rotating slideshow, location links, reviews, and social links. The graph reflects the sampled React components and README capabilities; it does not infer wiring for features whose implementation was not provided.
Main entry points: Home.tsx Home page · Menu.tsx Menu page · App.tsx App routes · OrderButton.tsx Order button
Components 16
Site navigation
- App routes
src/App.tsx - Brand header
src/components/Header.tsx
Home experience
- Home page
src/pages/Home.tsx - Photo slideshow
src/components/Slideshow.tsx - Order button
src/components/OrderButton.tsx - Location details
src/pages/Home.tsx - Review links
src/pages/Home.tsx - Social link
src/pages/Home.tsx
Menu experience
- Menu page
src/pages/Menu.tsx - Menu spreadsheet
- Firebase Storage
Other components
- Site visitor
- Google Maps
- Mobile ordering
- Google reviews
Connections 18
- Site visitor → App routes: opens site
- App routes → Brand header: renders
- App routes → Home page: routes to
- App routes → Menu page: routes to
- Home page → Photo slideshow: renders
- Home page → Order button: renders
- Home page → Location details: renders
- Home page → Review links: renders
- Home page → Social link: renders
- Home page → Menu page: links to
- Location details → Google Maps: links to
- Order button → Mobile ordering: opens order page
- Review links → Google reviews: links to
- Social link → Instagram: links to
- Menu page → Menu spreadsheet: fetches rows
- Menu spreadsheet → Menu page: returns menu data
- Menu page → Firebase Storage: resolves image URLs
- Firebase Storage → Menu page: returns image URLs