# harihanshansdah/autosaathi-jsr architecture

> Architecture diagram of the GitHub repository harihanshansdah/autosaathi-jsr, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-08-09). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/harihanshansdah/autosaathi-jsr
- Repository: https://github.com/harihanshansdah/autosaathi-jsr

## Overview

#### Purpose and Runtime
This is an Expo/React Native universal application, structured with Expo Router file-based routes. It targets Expo-supported mobile runtimes and web. The repository also contains containerized web-serving infrastructure via `Dockerfile`, `docker-compose.yml`, and `nginx.conf`.

#### Application Entry and Navigation
The route hierarchy begins at `app/_layout.tsx`, with `app/index.tsx` as the root route. Tab navigation is defined by `app/(tabs)/_layout.tsx`; its primary screens are `app/(tabs)/index.tsx` and `app/(tabs)/explore.tsx`. Additional top-level destinations include `app/modal.tsx` and `app/settings.tsx`. `app/routes.tsx` likely centralizes route-specific application behavior beyond the filesystem hierarchy.

#### Map and Route Data Boundary
The app ships geographic data locally rather than exposing an evident backend integration. `data/jamshedpur.geojson` is the geographic feature dataset, while `data/routes.ts` supplies route/domain data. This creates a client-side data boundary: screens consume bundled static data with no server API, database, or authentication service represented in the repository.

#### Mapping Assets
Leaflet is vendored as static web assets in `assets/leaflet/leaflet.js` and `assets/leaflet/leaflet.css`. These assets, together with `data/jamshedpur.geojson`, indicate map rendering or geographic visualization is a defining application capability. The Leaflet dependency is asset-based rather than represented as a dedicated service or native map module in the visible tree.

#### Presentation and Theme System
Reusable UI primitives live under `components/`, including application-aware themed wrappers in `components/themed-text.tsx` and `components/themed-view.tsx`. Theme state is provided through `components/ThemeContext.tsx`, with tokens in `constants/theme.tsx` and supporting color logic in `components/colors.ts`. Screens can therefore remain focused on route-level composition while presentation behavior is shared.

#### Platform Adaptation
Platform-sensitive behavior is isolated in hooks and UI components, notably `hooks/use-color-scheme.ts`, `hooks/use-color-scheme.web.ts`, and `components/ui/icon-symbol.ios.tsx`. This supports differing native and web implementations without changing the route structure.

#### Delivery Boundary
Development starts through Expo (`npx expo start`, per README). For containerized deployment, `Dockerfile` and `docker-compose.yml` define the build/runtime boundary, while `nginx.conf` is the web-server configuration. No external cloud, API, persistence, or third-party service integration is evidenced by the supplied repository structure.

Main entry points: [`app/_layout.tsx`](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/_layout.tsx) (Root layout), [`app/(tabs)/explore.tsx`](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/(tabs)/explore.tsx) (Explore tab), [`components/themed-view.tsx`](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/components/themed-view.tsx) (Themed UI wrappers), [`app/(tabs)/_layout.tsx`](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/(tabs)/_layout.tsx) (Tab layout)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_navigation["Expo Router"]
  node_root_layout["Root layout<br/>router layout<br/>[_layout.tsx]"]
  node_root_route["Root route<br/>screen<br/>[index.tsx]"]
  node_tabs_layout["Tab layout<br/>router layout<br/>[_layout.tsx]"]
  node_home_tab["Home tab<br/>screen<br/>[index.tsx]"]
  node_explore_tab["Explore tab<br/>screen<br/>[explore.tsx]"]
  node_modal["Modal route<br/>screen<br/>[modal.tsx]"]
  node_settings["Settings route<br/>screen<br/>[settings.tsx]"]
  node_route_behavior["Route behavior<br/>route module<br/>[routes.tsx]"]
end

subgraph group_presentation["Presentation"]
  node_themed_ui["Themed UI wrappers<br/>UI primitives<br/>[themed-view.tsx]"]
  node_theme_context["Theme provider<br/>state provider<br/>[ThemeContext.tsx]"]
  node_theme_tokens["Theme tokens<br/>design tokens<br/>[theme.tsx]"]
  node_platform_adapters["Platform adapters<br/>platform UI"]
end

subgraph group_mapdata["Map Data"]
  node_route_data["Route data<br/>bundled domain data<br/>[routes.ts]"]
  node_geojson["Jamshedpur GeoJSON<br/>bundled geographic data<br/>[jamshedpur.geojson]"]
  node_leaflet["Leaflet assets<br/>web map library<br/>[leaflet.js]"]
end

subgraph group_delivery["Web Delivery"]
  node_container["Container build<br/>deployment"]
  node_compose["Compose runtime<br/>container orchestration<br/>[docker-compose.yml]"]
  node_nginx["Nginx web server<br/>web server config<br/>[nginx.conf]"]
end

node_expo{{"Expo runtime"}}

node_expo -->|"starts"| node_root_layout
node_root_layout -->|"hosts"| node_root_route
node_root_layout -->|"hosts"| node_tabs_layout
node_root_layout -->|"hosts"| node_modal
node_root_layout -->|"hosts"| node_settings
node_tabs_layout -->|"navigates to"| node_home_tab
node_tabs_layout -->|"navigates to"| node_explore_tab
node_root_layout -.->|"uses"| node_route_behavior
node_root_layout -->|"provides"| node_theme_context
node_theme_context -->|"uses"| node_theme_tokens
node_theme_context -->|"themes"| node_themed_ui
node_themed_ui -.->|"adapts through"| node_platform_adapters
node_home_tab -->|"composes"| node_themed_ui
node_explore_tab -->|"composes"| node_themed_ui
node_explore_tab -->|"reads"| node_route_data
node_explore_tab -->|"renders"| node_geojson
node_explore_tab -->|"uses"| node_leaflet
node_compose -->|"builds"| node_container
node_container -->|"serves through"| node_nginx

click node_root_layout "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/_layout.tsx"
click node_root_route "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/index.tsx"
click node_tabs_layout "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/(tabs)/_layout.tsx"
click node_home_tab "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/(tabs)/index.tsx"
click node_explore_tab "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/(tabs)/explore.tsx"
click node_modal "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/modal.tsx"
click node_settings "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/settings.tsx"
click node_route_behavior "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/routes.tsx"
click node_themed_ui "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/components/themed-view.tsx"
click node_theme_context "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/components/ThemeContext.tsx"
click node_theme_tokens "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/constants/theme.tsx"
click node_platform_adapters "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/hooks/use-color-scheme.web.ts"
click node_route_data "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/data/routes.ts"
click node_geojson "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/data/jamshedpur.geojson"
click node_leaflet "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/assets/leaflet/leaflet.js"
click node_container "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/Dockerfile"
click node_compose "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/docker-compose.yml"
click node_nginx "https://github.com/harihanshansdah/autosaathi-jsr/blob/main/nginx.conf"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_root_layout,node_root_route,node_tabs_layout,node_home_tab,node_explore_tab,node_modal,node_settings,node_route_behavior toneBlue
class node_themed_ui,node_theme_context,node_theme_tokens,node_platform_adapters toneAmber
class node_route_data,node_geojson,node_leaflet toneMint
class node_container,node_compose,node_nginx toneRose
class node_expo toneNeutral
```

## Components

### Expo Router

File-based application navigation.

- [Root layout](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/_layout.tsx): router layout · `app/_layout.tsx`
- [Root route](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/index.tsx): screen · `app/index.tsx`
- [Tab layout](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/(tabs)/_layout.tsx): router layout · `app/(tabs)/_layout.tsx`
- [Home tab](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/(tabs)/index.tsx): screen · `app/(tabs)/index.tsx`
- [Explore tab](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/(tabs)/explore.tsx): screen · `app/(tabs)/explore.tsx`
- [Modal route](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/modal.tsx): screen · `app/modal.tsx`
- [Settings route](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/settings.tsx): screen · `app/settings.tsx`
- [Route behavior](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/app/routes.tsx): route module · `app/routes.tsx`

### Presentation

Shared theming and platform adaptations.

- [Themed UI wrappers](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/components/themed-view.tsx): UI primitives · Shared themed text and view components. · `components/themed-view.tsx`
- [Theme provider](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/components/ThemeContext.tsx): state provider · `components/ThemeContext.tsx`
- [Theme tokens](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/constants/theme.tsx): design tokens · `constants/theme.tsx`
- [Platform adapters](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/hooks/use-color-scheme.web.ts): platform UI · Web color scheme and iOS icon implementations. · `hooks/use-color-scheme.web.ts`

### Map Data

Bundled geographic data and web map assets.

- [Route data](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/data/routes.ts): bundled domain data · `data/routes.ts`
- [Jamshedpur GeoJSON](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/data/jamshedpur.geojson): bundled geographic data · `data/jamshedpur.geojson`
- [Leaflet assets](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/assets/leaflet/leaflet.js): web map library · Vendored Leaflet JavaScript and CSS. · `assets/leaflet/leaflet.js`

### Web Delivery

Containerized web serving.

- [Container build](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/Dockerfile): deployment · `Dockerfile`
- [Compose runtime](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/docker-compose.yml): container orchestration · `docker-compose.yml`
- [Nginx web server](https://github.com/harihanshansdah/autosaathi-jsr/blob/main/nginx.conf): web server config · `nginx.conf`

### Other components

- **Expo runtime**: runtime · Runs the universal mobile and web application.

## Connections

- Expo runtime → Root layout: starts
- Root layout → Root route: hosts
- Root layout → Tab layout: hosts
- Root layout → Modal route: hosts
- Root layout → Settings route: hosts
- Tab layout → Home tab: navigates to
- Tab layout → Explore tab: navigates to
- Root layout → Route behavior: uses
- Root layout → Theme provider: provides
- Theme provider → Theme tokens: uses
- Theme provider → Themed UI wrappers: themes
- Themed UI wrappers → Platform adapters: adapts through
- Home tab → Themed UI wrappers: composes
- Explore tab → Themed UI wrappers: composes
- Explore tab → Route data: reads
- Explore tab → Jamshedpur GeoJSON: renders
- Explore tab → Leaflet assets: uses
- Compose runtime → Container build: builds
- Container build → Nginx web server: serves through