# srinath-13/cinemaos-tmdb-project architecture

> Architecture diagram of the GitHub repository srinath-13/cinemaos-tmdb-project, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-14). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/srinath-13/cinemaos-tmdb-project
- Repository: https://github.com/srinath-13/cinemaos-tmdb-project

## Overview

Cinemaos is a React movie-discovery and recommendation app. Users authenticate, explore or search TMDB’s movie catalog, inspect movie details and credits, and generate recommendations based on recorded searches, genres, cast, crew, runtime, release year, and movie interactions. The sampled code shows screen routing, catalog requests, and Firestore behavior writes; recommendation assembly internals were not sampled, so that branch is represented without guessed call links.

Main entry points: [`src/Row.js`](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Row.js) (Movie rows), [`src/App.js`](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/App.js) (App routing), [`src/screens/HomeScreen.js`](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/HomeScreen.js) (Home screen), [`src/search.js`](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/search.js) (Search and filters)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["App experience"]
  node_app["App routing<br/>[App.js]"]
  node_home["Home screen<br/>[HomeScreen.js]"]
  node_navigation["Navigation and banner<br/>[Nav.js]"]
end

subgraph group_discovery["Movie discovery"]
  node_explorer["Collection explorer<br/>[Explorer.js]"]
  node_search["Search and filters<br/>[search.js]"]
  node_movie_rows["Movie rows<br/>[Row.js]"]
  node_api_client["TMDB API client<br/>[axios.js]"]
  node_request_catalog["Request catalog<br/>[requests.js]"]
  node_movie_details["Movie details<br/>[Display.js]"]
  node_credits["Cast and genres<br/>[Cast.js]"]
  node_sorter["Movie sorting<br/>[Sorter.js]"]
end

subgraph group_recommendations["Recommendations"]
  node_recommender["Recommendation view<br/>[Recommender.js]"]
  node_assembler["Recommendation assembly<br/>[Assembler.js]"]
end

subgraph group_identity["Identity and behavior"]
  node_login["Login screen<br/>[LoginScreen.js]"]
  node_signup["Signup screen<br/>[SignupScreen.js]"]
  node_profile["Profile screen<br/>[ProfileScreen.js]"]
  node_behavior_state["User behavior state<br/>[userSlice.js]"]
  node_auth_db["Firebase auth<br/>[firebase.js]"]
  node_firestore[("Firestore behavior data<br/>[firebase.js]")]
end

node_viewer(("Viewer"))
node_tmdb["TMDB"]

node_viewer -->|"opens app"| node_app
node_app -->|"routes to"| node_home
node_app -->|"routes to"| node_login
node_app -->|"routes to"| node_profile
node_app -->|"checks auth"| node_auth_db
node_app -->|"dispatches auth"| node_behavior_state
node_login -->|"links to"| node_signup
node_signup -->|"creates account"| node_auth_db
node_profile -->|"signs out"| node_auth_db
node_home -->|"renders"| node_navigation
node_home -->|"shows collections"| node_explorer
node_home -->|"shows recommendations"| node_recommender
node_explorer -->|"renders search"| node_search
node_explorer -->|"renders collections"| node_movie_rows
node_search -->|"renders results"| node_movie_rows
node_search -->|"builds requests"| node_request_catalog
node_movie_rows -->|"fetches results"| node_api_client
node_movie_rows -->|"uses endpoints"| node_request_catalog
node_api_client -.->|"requests catalog"| node_tmdb
node_movie_rows -->|"renders credits"| node_credits
node_movie_rows -->|"records interactions"| node_firestore
node_movie_rows -->|"reads user"| node_behavior_state
node_movie_details -->|"records movie signals"| node_firestore
node_movie_details -->|"reads user"| node_behavior_state
node_home -->|"loads preferences"| node_firestore
node_search -->|"records genres"| node_firestore
node_recommender -->|"uses assembly"| node_assembler
node_recommender -->|"renders results"| node_movie_details
node_recommender -->|"renders navigation"| node_navigation

click node_app "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/App.js"
click node_login "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/LoginScreen.js"
click node_signup "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/SignupScreen.js"
click node_profile "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/ProfileScreen.js"
click node_home "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/HomeScreen.js"
click node_navigation "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Nav.js"
click node_explorer "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/Explorer.js"
click node_search "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/search.js"
click node_movie_rows "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Row.js"
click node_api_client "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/axios.js"
click node_request_catalog "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/requests.js"
click node_movie_details "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Display.js"
click node_credits "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Cast.js"
click node_sorter "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Sorter.js"
click node_recommender "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Recommender.js"
click node_assembler "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Assembler.js"
click node_behavior_state "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/features/userSlice.js"
click node_auth_db "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/firebase.js"
click node_firestore "https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/firebase.js"

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_app,node_home,node_navigation,node_viewer toneBlue
class node_explorer,node_search,node_movie_rows,node_api_client,node_request_catalog,node_movie_details,node_credits,node_sorter toneAmber
class node_recommender,node_assembler toneMint
class node_login,node_signup,node_profile,node_behavior_state,node_auth_db,node_firestore toneRose
class node_tmdb toneIndigo
```

## Components

### App experience

- [App routing](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/App.js): `src/App.js`
- [Home screen](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/HomeScreen.js): `src/screens/HomeScreen.js`
- [Navigation and banner](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Nav.js): `src/Nav.js`

### Movie discovery

- [Collection explorer](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/Explorer.js): `src/screens/Explorer.js`
- [Search and filters](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/search.js): `src/search.js`
- [Movie rows](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Row.js): `src/Row.js`
- [TMDB API client](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/axios.js): `src/axios.js`
- [Request catalog](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/requests.js): `src/requests.js`
- [Movie details](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Display.js): `src/Display.js`
- [Cast and genres](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Cast.js): `src/Cast.js`
- [Movie sorting](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Sorter.js): `src/Sorter.js`

### Recommendations

- [Recommendation view](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Recommender.js): `src/Recommender.js`
- [Recommendation assembly](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/Assembler.js): `src/Assembler.js`

### Identity and behavior

- [Login screen](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/LoginScreen.js): `src/screens/LoginScreen.js`
- [Signup screen](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/SignupScreen.js): `src/screens/SignupScreen.js`
- [Profile screen](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/screens/ProfileScreen.js): `src/screens/ProfileScreen.js`
- [User behavior state](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/features/userSlice.js): `src/features/userSlice.js`
- [Firebase auth](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/firebase.js): `src/firebase.js`
- [Firestore behavior data](https://github.com/srinath-13/cinemaos-tmdb-project/blob/master/src/firebase.js): `src/firebase.js`

### Other components

- **Viewer**
- **TMDB**

## Connections

- Viewer → App routing: opens app
- App routing → Home screen: routes to (evidence: `src/App.js`)
- App routing → Login screen: routes to (evidence: `src/App.js`)
- App routing → Profile screen: routes to (evidence: `src/App.js`)
- App routing → Firebase auth: checks auth (evidence: `src/App.js`)
- App routing → User behavior state: dispatches auth (evidence: `src/App.js`)
- Login screen → Signup screen: links to (evidence: `src/screens/LoginScreen.js`)
- Signup screen → Firebase auth: creates account (evidence: `src/screens/SignupScreen.js`)
- Profile screen → Firebase auth: signs out (evidence: `src/screens/ProfileScreen.js`)
- Home screen → Navigation and banner: renders (evidence: `src/screens/HomeScreen.js`)
- Home screen → Collection explorer: shows collections (evidence: `src/screens/HomeScreen.js`)
- Home screen → Recommendation view: shows recommendations (evidence: `src/screens/HomeScreen.js`)
- Collection explorer → Search and filters: renders search (evidence: `src/screens/Explorer.js`)
- Collection explorer → Movie rows: renders collections (evidence: `src/screens/Explorer.js`)
- Search and filters → Movie rows: renders results (evidence: `src/search.js`)
- Search and filters → Request catalog: builds requests (evidence: `src/search.js`)
- Movie rows → TMDB API client: fetches results (evidence: `src/Row.js`)
- Movie rows → Request catalog: uses endpoints (evidence: `src/Row.js`)
- TMDB API client → TMDB: requests catalog
- Movie rows → Cast and genres: renders credits (evidence: `src/Row.js`)
- Movie rows → Firestore behavior data: records interactions (evidence: `src/Row.js`)
- Movie rows → User behavior state: reads user (evidence: `src/Row.js`)
- Movie details → Firestore behavior data: records movie signals (evidence: `src/Display.js`)
- Movie details → User behavior state: reads user (evidence: `src/Display.js`)
- Home screen → Firestore behavior data: loads preferences (evidence: `src/screens/HomeScreen.js`)
- Search and filters → Firestore behavior data: records genres (evidence: `src/search.js`)
- Recommendation view → Recommendation assembly: uses assembly (evidence: `src/Recommender.js`)
- Recommendation view → Movie details: renders results (evidence: `src/Recommender.js`)
- Recommendation view → Navigation and banner: renders navigation (evidence: `src/Recommender.js`)