How naticasta777-ai/cromoverso works
Cromoverso is a React web interface for a collectible-card album. Visitors enter through the public home page, browse worlds, then open a world catalog and filter/search its cards. Supporting branches provide API-backed interface text and catalog data, plus language, cookie-consent, and accessibility preferences. The README documents the API capabilities; unsampled page/component internals are represented only where the README or source index supports them.
Main entry points: CatalogoMundo.jsx World catalog page · App.jsx Route dispatcher · Inicio.jsx Home page · LayoutPublico.jsx Public layout
Components 25
Routing and shell
- Route dispatcher
src/App.jsx - Public layout
src/components/LayoutPublico/LayoutPublico.jsx - Navigation bar
src/components/Navbar/Navbar.jsx
World discovery
- Home page
src/pages/Inicio.jsx - Worlds page
src/pages/Mundos.jsx - Home sections
src/components/SeccionMundos/SeccionMundos.jsx - Home hero
src/components/HeroCromoverso/HeroCromoverso.jsx
Card catalog
- World catalog page
src/pages/CatalogoMundo.jsx - Catalog data hook
src/hooks/useCatalogo.js - World data hook
src/hooks/useMundos.js - World header
src/components/CabeceraMundo/CabeceraMundo.jsx - Catalog filters
src/components/BarraLateralMundo/BarraLateralMundo.jsx - Mobile filters
src/components/FiltrosMovil/FiltrosMovil.jsx - Card grid
src/components/GrillaCromos/GrillaCromos.jsx - Card rendering
src/components/Cromo/Cromo.jsx
Data and preferences
- API request hook
src/hooks/useApi.js - API client
src/api/cliente.js - Interface language text
src/context/TextosContext.jsx - Consent and language
src/context/PreferenciasContext.jsx - Accessibility settings
src/context/AccesibilidadContext.jsx - Cookie manager
src/components/GestorCookies/GestorCookies.jsx - Accessibility panel
src/components/PanelAccesibilidad/PanelAccesibilidad.jsx
Other components
- Visitor
- Cromoverso REST API
- Browser cookies
Connections 30
- Visitor → Route dispatcher: opens app
src/App.jsx - Route dispatcher → Home page: routes to
src/App.jsx - Route dispatcher → Worlds page: routes to
src/App.jsx - Route dispatcher → World catalog page: routes to
src/App.jsx - Home page → Home hero: renders
src/pages/Inicio.jsx - Home page → Home sections: renders
src/pages/Inicio.jsx - Worlds page → World data hook: loads worlds
src/pages/Mundos.jsx - World catalog page → Catalog data hook: loads catalog
src/pages/CatalogoMundo.jsx - World catalog page → World header: renders
src/pages/CatalogoMundo.jsx - World catalog page → Catalog filters: renders
src/pages/CatalogoMundo.jsx - World catalog page → Mobile filters: renders
src/pages/CatalogoMundo.jsx - World catalog page → Card grid: renders
src/pages/CatalogoMundo.jsx - Card grid → Card rendering: renders cards
src/components/GrillaCromos/GrillaCromos.jsx - Catalog data hook → World data hook: uses worlds
src/hooks/useCatalogo.js - Catalog data hook → API request hook: requests data
src/hooks/useCatalogo.js - World data hook → API request hook: requests data
src/hooks/useMundos.js - API request hook → API client: calls
src/hooks/useApi.js - API client → Cromoverso REST API: requests API
README.md - Home page → Public layout: uses layout
src/pages/Inicio.jsx - World catalog page → Public layout: uses layout
src/pages/CatalogoMundo.jsx - Public layout → Navigation bar: renders
src/components/LayoutPublico/LayoutPublico.jsx - Interface language text → API client: fetches translations
src/context/TextosContext.jsx - Interface language text → Consent and language: reads language
src/context/TextosContext.jsx - Public layout → Consent and language: reads language
src/components/LayoutPublico/LayoutPublico.jsx - Route dispatcher → Cookie manager: mounts
src/App.jsx - Route dispatcher → Accessibility panel: mounts
src/App.jsx - Accessibility panel → Accessibility settings: controls
src/components/PanelAccesibilidad/PanelAccesibilidad.jsx - Accessibility settings → Consent and language: checks consent
src/context/AccesibilidadContext.jsx - Consent and language → Browser cookies: reads and writes
src/context/PreferenciasContext.jsx - Accessibility settings → Browser cookies: reads and writes
src/context/AccesibilidadContext.jsx