vaguer2/fleteandotechido

1. Project type and runtime

- This is an Expo / React Native application written in TypeScript.

- The repository is structured for cross-platform delivery: native mobile plus web, with platform-specific file variants like *.web.tsx and *.web.ts.

2. Application shell and routing

- The src/app folder is the main navigation root and appears to use Expo Router conventions.

- src/app/_layout.tsx is the top-level shell where app-wide providers, navigation containers, and shared layout concerns are likely defined.

- src/app/index.tsx and src/app/explore.tsx are route entry points, while src/app/Screen/... contains deeper screen content.

3. Screen composition layer

- The actual user-facing screens are organized under src/app/Screen/Home/.

- ScreenHomeUser.tsx and ScreenHomeDelivery.tsx suggest the app has at least two distinct home experiences or roles:

- a user-oriented home

- a delivery-oriented home

- src/app/MyNavegation.js likely contains custom navigation logic or a role-based navigation selector that chooses which screen stack the user sees.

4. Navigation boundary

- Navigation is a clear architectural boundary separating route-level orchestration from reusable UI.

- Route files in src/app should be viewed as the integration layer, while the screen components under Screen/Home hold the feature UI.

- This makes it easier to diagram the app as: app shell → navigation → role-specific screens.

5. Shared UI component system

- src/components contains the reusable presentation layer:

- themed-text.tsx, themed-view.tsx

- app-tabs.tsx

- animated-icon.tsx

- external-link.tsx

- hint-row.tsx

- web-badge.tsx

- src/components/ui/collapsible.tsx is a lower-level UI primitive used to build interactive interfaces.

- These components form the design system / shared widget layer used by multiple screens.

6. Theme and appearance handling

- Theme state is centralized in src/constants/theme.ts and src/hooks/use-theme.ts.

- src/hooks/use-color-scheme.ts and src/hooks/use-color-scheme.web.ts show that color scheme detection is platform-aware.

- themed-* components likely consume that theme context to keep styling consistent across screens and platforms.

7. Web-specific behavior

- The presence of *.web.tsx, *.web.ts, and src/global.css indicates the web target is first-class, not an afterthought.

- animated-icon.web.tsx, app-tabs.web.tsx, and use-color-scheme.web.ts override native behavior where the web platform needs different implementation details.

8. Assets and visual resources

- Static images and tab icons are stored under assets/images/tabIcons.

- These assets likely support navigation branding and bottom-tab UI, which matters when diagramming the visual entry points and persistent navigation areas.

9. Styling model

- Styling appears to combine React Native component styling with web CSS support.

- src/global.css is the main global stylesheet for the web build, while component-level styling is handled inside the .tsx files and the CSS module animated-icon.module.css.

10. Tooling and project infrastructure

- app.json, package.json, tsconfig.json, and package-lock.json indicate a standard Expo/TypeScript build setup.

- scripts/reset-project.js suggests the repo includes a maintenance/reset utility for re-initializing the project scaffold.

11. External documentation and backend context

- The README points to Figma, Drive documentation, daily logs, and Supabase.

- Supabase is an important architectural dependency at the project level, even though no backend code is present in this tree.

- For a system diagram, treat Supabase as the external data/backend service the app is expected to integrate with.

12. High-level data and control flow

- App startup enters through the Expo entry point, then the router shell in _layout.tsx.

- Navigation routes lead to top-level screens such as home and explore.

- Screens compose shared themed components and platform-specific UI pieces.

- Theme/color-scheme hooks feed presentation decisions, while assets and tabs provide persistent UI affordances.

13. What is not in this repository

- There is no visible server, API layer, or state-management backend implementation here.

- The repo is primarily the client application layer plus documentation pointers to external services and design sources.

14. How to draw it

- A good architecture diagram would show:

- Expo app entry / router shell

- Navigation layer

- Route screens

- Shared UI + theme layer

- Platform-specific web/native variants

- Static assets

- External Supabase backend and documentation/design tools