# mrbanoth/disney architecture

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

- Interactive diagram: https://gitdiagram.com/mrbanoth/disney
- Repository: https://github.com/mrbanoth/disney

## Overview

This is a client-side, Disney+-inspired streaming discovery app, not a streaming backend. The main journey is local sign-in/profile selection, language-personalized browsing or search, title details, then trailer playback; users can also manage a library and preferences. The router, contexts and local storage connect those stages. README capabilities are included where their implementation was not sampled; those links are limited to documented behavior. The catalog context is sampled as static, while live YouTube search is a separate optional integration.

Main entry points: [`src/app/AppRouter.tsx`](https://github.com/mrbanoth/disney/blob/main/src/app/AppRouter.tsx) (Route protection), [`src/layouts/AppShell.tsx`](https://github.com/mrbanoth/disney/blob/main/src/layouts/AppShell.tsx) (App navigation), [`src/features/catalog/CatalogContext.tsx`](https://github.com/mrbanoth/disney/blob/main/src/features/catalog/CatalogContext.tsx) (Catalogue context), [`src/lib/storage.ts`](https://github.com/mrbanoth/disney/blob/main/src/lib/storage.ts) (Browser local storage)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["Entry and identity"]
  node_router["Route protection<br/>[AppRouter.tsx]"]
  node_authpages["Sign-in and welcome<br/>[AuthPage.tsx]"]
  node_profiles["Profile selection<br/>[ProfilesPage.tsx]"]
  node_authstate["Account state<br/>[AuthContext.tsx]"]
end

subgraph group_discovery["Discovery"]
  node_home["Personalized home<br/>[HomePage.tsx]"]
  node_browse["Browse and filters<br/>[BrowsePage.tsx]"]
  node_search["Search and moods<br/>[SearchPage.tsx]"]
  node_catalog["Bundled catalogue<br/>[catalog.ts]"]
  node_catalogstate["Catalogue context<br/>[CatalogContext.tsx]"]
  node_youtube["Live trailer search<br/>[youtubeSearch.ts]"]
end

subgraph group_watch["Title and playback"]
  node_details["Title details<br/>[DetailPage.tsx]"]
  node_player["Trailer player<br/>[PlayerPage.tsx]"]
end

subgraph group_personal["Personal state"]
  node_preferences["Language preferences"]
  node_library["Watchlist and history<br/>[LibraryPage.tsx]"]
  node_settings["Profile settings<br/>[SettingsPage.tsx]"]
  node_storage[("Browser local storage<br/>[storage.ts]")]
end

subgraph group_platform["App shell"]
  node_shell["App navigation<br/>[AppShell.tsx]"]
  node_errorseo["SEO and recovery<br/>[SeoManager.tsx]"]
  node_serviceworker["Offline app shell<br/>[sw.js]"]
end

node_viewer(("Viewer"))
node_google["YouTube Data API"]
node_browser(("Browser"))

node_viewer -->|"opens routes"| node_router
node_router -->|"routes unauthenticated"| node_authpages
node_authpages -->|"signs in or up"| node_authstate
node_router -->|"routes protected profile"| node_profiles
node_profiles -->|"uses account"| node_authstate
node_router -->|"routes protected app"| node_shell
node_shell -->|"renders home"| node_home
node_shell -->|"routes browsing"| node_browse
node_shell -->|"routes search"| node_search
node_shell -->|"routes titles"| node_details
node_router -->|"routes playback"| node_player
node_home -->|"reads catalogue"| node_catalogstate
node_browse -->|"reads catalogue"| node_catalogstate
node_search -->|"searches locally"| node_catalogstate
node_catalogstate -->|"provides data"| node_catalog
node_home -->|"uses language"| node_preferences
node_browse -->|"filters by preference"| node_preferences
node_search -->|"uses locale"| node_preferences
node_search -->|"requests live results"| node_youtube
node_youtube -.->|"queries API"| node_google
node_details -->|"looks up title"| node_catalogstate
node_library -->|"reads saved state"| node_storage
node_settings -->|"updates settings"| node_storage
node_authstate -->|"persists account"| node_storage
node_preferences -->|"persists preferences"| node_storage
node_player -->|"records playback state"| node_storage
node_router -->|"updates route metadata"| node_errorseo
node_browser -->|"registers in production"| node_serviceworker

click node_router "https://github.com/mrbanoth/disney/blob/main/src/app/AppRouter.tsx"
click node_authpages "https://github.com/mrbanoth/disney/blob/main/src/features/auth/AuthPage.tsx"
click node_profiles "https://github.com/mrbanoth/disney/blob/main/src/features/auth/ProfilesPage.tsx"
click node_authstate "https://github.com/mrbanoth/disney/blob/main/src/features/auth/AuthContext.tsx"
click node_shell "https://github.com/mrbanoth/disney/blob/main/src/layouts/AppShell.tsx"
click node_home "https://github.com/mrbanoth/disney/blob/main/src/features/home/HomePage.tsx"
click node_browse "https://github.com/mrbanoth/disney/blob/main/src/features/browse/BrowsePage.tsx"
click node_search "https://github.com/mrbanoth/disney/blob/main/src/features/search/SearchPage.tsx"
click node_catalog "https://github.com/mrbanoth/disney/blob/main/src/data/catalog.ts"
click node_catalogstate "https://github.com/mrbanoth/disney/blob/main/src/features/catalog/CatalogContext.tsx"
click node_preferences "https://github.com/mrbanoth/disney/blob/main/src/features/preferences/PreferencesContext.tsx"
click node_youtube "https://github.com/mrbanoth/disney/blob/main/src/services/youtubeSearch.ts"
click node_details "https://github.com/mrbanoth/disney/blob/main/src/features/details/DetailPage.tsx"
click node_player "https://github.com/mrbanoth/disney/blob/main/src/features/player/PlayerPage.tsx"
click node_library "https://github.com/mrbanoth/disney/blob/main/src/features/library/LibraryPage.tsx"
click node_settings "https://github.com/mrbanoth/disney/blob/main/src/features/profile/SettingsPage.tsx"
click node_storage "https://github.com/mrbanoth/disney/blob/main/src/lib/storage.ts"
click node_errorseo "https://github.com/mrbanoth/disney/blob/main/src/components/ui/SeoManager.tsx"
click node_serviceworker "https://github.com/mrbanoth/disney/blob/main/public/sw.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_router,node_authpages,node_profiles,node_authstate,node_viewer,node_browser toneBlue
class node_home,node_browse,node_search,node_catalog,node_catalogstate,node_youtube toneAmber
class node_details,node_player,node_google toneMint
class node_preferences,node_library,node_settings,node_storage toneRose
class node_shell,node_errorseo,node_serviceworker toneIndigo
```

## Components

### Entry and identity

- [Route protection](https://github.com/mrbanoth/disney/blob/main/src/app/AppRouter.tsx): `src/app/AppRouter.tsx`
- [Sign-in and welcome](https://github.com/mrbanoth/disney/blob/main/src/features/auth/AuthPage.tsx): `src/features/auth/AuthPage.tsx`
- [Profile selection](https://github.com/mrbanoth/disney/blob/main/src/features/auth/ProfilesPage.tsx): `src/features/auth/ProfilesPage.tsx`
- [Account state](https://github.com/mrbanoth/disney/blob/main/src/features/auth/AuthContext.tsx): `src/features/auth/AuthContext.tsx`

### Discovery

- [Personalized home](https://github.com/mrbanoth/disney/blob/main/src/features/home/HomePage.tsx): `src/features/home/HomePage.tsx`
- [Browse and filters](https://github.com/mrbanoth/disney/blob/main/src/features/browse/BrowsePage.tsx): `src/features/browse/BrowsePage.tsx`
- [Search and moods](https://github.com/mrbanoth/disney/blob/main/src/features/search/SearchPage.tsx): `src/features/search/SearchPage.tsx`
- [Bundled catalogue](https://github.com/mrbanoth/disney/blob/main/src/data/catalog.ts): `src/data/catalog.ts`
- [Catalogue context](https://github.com/mrbanoth/disney/blob/main/src/features/catalog/CatalogContext.tsx): `src/features/catalog/CatalogContext.tsx`
- [Live trailer search](https://github.com/mrbanoth/disney/blob/main/src/services/youtubeSearch.ts): `src/services/youtubeSearch.ts`

### Title and playback

- [Title details](https://github.com/mrbanoth/disney/blob/main/src/features/details/DetailPage.tsx): `src/features/details/DetailPage.tsx`
- [Trailer player](https://github.com/mrbanoth/disney/blob/main/src/features/player/PlayerPage.tsx): `src/features/player/PlayerPage.tsx`

### Personal state

- [Language preferences](https://github.com/mrbanoth/disney/blob/main/src/features/preferences/PreferencesContext.tsx): `src/features/preferences/PreferencesContext.tsx`
- [Watchlist and history](https://github.com/mrbanoth/disney/blob/main/src/features/library/LibraryPage.tsx): `src/features/library/LibraryPage.tsx`
- [Profile settings](https://github.com/mrbanoth/disney/blob/main/src/features/profile/SettingsPage.tsx): `src/features/profile/SettingsPage.tsx`
- [Browser local storage](https://github.com/mrbanoth/disney/blob/main/src/lib/storage.ts): `src/lib/storage.ts`

### App shell

- [App navigation](https://github.com/mrbanoth/disney/blob/main/src/layouts/AppShell.tsx): `src/layouts/AppShell.tsx`
- [SEO and recovery](https://github.com/mrbanoth/disney/blob/main/src/components/ui/SeoManager.tsx): `src/components/ui/SeoManager.tsx`
- [Offline app shell](https://github.com/mrbanoth/disney/blob/main/public/sw.js): `public/sw.js`

### Other components

- **Viewer**
- **YouTube Data API**
- **Browser**

## Connections

- Viewer → Route protection: opens routes
- Route protection → Sign-in and welcome: routes unauthenticated
- Sign-in and welcome → Account state: signs in or up
- Route protection → Profile selection: routes protected profile
- Profile selection → Account state: uses account
- Route protection → App navigation: routes protected app
- App navigation → Personalized home: renders home
- App navigation → Browse and filters: routes browsing
- App navigation → Search and moods: routes search
- App navigation → Title details: routes titles
- Route protection → Trailer player: routes playback
- Personalized home → Catalogue context: reads catalogue
- Browse and filters → Catalogue context: reads catalogue
- Search and moods → Catalogue context: searches locally
- Catalogue context → Bundled catalogue: provides data
- Personalized home → Language preferences: uses language
- Browse and filters → Language preferences: filters by preference
- Search and moods → Language preferences: uses locale
- Search and moods → Live trailer search: requests live results
- Live trailer search → YouTube Data API: queries API
- Title details → Catalogue context: looks up title
- Watchlist and history → Browser local storage: reads saved state
- Profile settings → Browser local storage: updates settings
- Account state → Browser local storage: persists account
- Language preferences → Browser local storage: persists preferences
- Trailer player → Browser local storage: records playback state
- Route protection → SEO and recovery: updates route metadata
- Browser → Offline app shell: registers in production