# jaedb/iris architecture

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

- Interactive diagram: https://gitdiagram.com/jaedb/iris
- Repository: https://github.com/jaedb/iris

## Overview

Iris is Mopidy’s web-based music interface. The browser enters a routed React application, browses/searches local and provider catalogs, then manages playback queues and settings through service actions; the Python Mopidy extension exposes HTTP/WebSocket methods that connect the UI to server capabilities. The README also documents Spotify discovery, Last.fm metadata, Genius lyrics, and Snapcast multi-device streaming. Some subsystem links are based on documented capabilities and the file tree; unsampled implementation details are not inferred.

Main entry points: [`src/js/App.js`](https://github.com/jaedb/iris/blob/master/src/js/App.js) (Application router), [`src/js/views/Settings.js`](https://github.com/jaedb/iris/blob/master/src/js/views/Settings.js) (Service settings), [`src/js/services/mopidy/actions.js`](https://github.com/jaedb/iris/blob/master/src/js/services/mopidy/actions.js) (Mopidy actions), [`src/js/services/spotify/actions.js`](https://github.com/jaedb/iris/blob/master/src/js/services/spotify/actions.js) (Spotify actions)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_interface["Web interface"]
  node_entry["Browser entry<br/>[index.js]"]
  node_app["Application router<br/>[App.js]"]
end

subgraph group_music["Music workflows"]
  node_library["Library browsing"]
  node_search["Catalog search<br/>[Search.js]"]
  node_discover["Music discovery"]
  node_queue["Queue and playback<br/>[Queue.js]"]
  node_settings["Service settings<br/>[Settings.js]"]
end

subgraph group_state["Client services"]
  node_store["Redux store<br/>[index.js]"]
  node_mopidy_service["Mopidy actions<br/>[actions.js]"]
  node_spotify_service["Spotify actions<br/>[actions.js]"]
  node_lastfm_service["Last.fm actions<br/>[actions.js]"]
  node_genius_service["Genius actions<br/>[actions.js]"]
  node_snapcast_service["Snapcast actions<br/>[actions.js]"]
  node_local_storage[("Browser preferences<br/>[storage.js]")]
end

subgraph group_server["Mopidy extension"]
  node_extension["Mopidy extension<br/>[frontend.py]"]
  node_handlers["HTTP and WebSocket<br/>[handlers.py]"]
  node_core["Mopidy integration<br/>[core.py]"]
end

subgraph group_integrations["Provider integrations"]
  node_spotify(("Spotify"))
  node_lastfm(("Last.fm"))
  node_genius(("Genius"))
  node_snapcast(("Snapcast"))
end

node_listener(("Listener"))
node_mopidy(("Mopidy server"))

node_listener -->|"opens"| node_entry
node_entry -->|"renders"| node_app
node_app -->|"reads and dispatches"| node_store
node_app -->|"routes to"| node_library
node_app -->|"routes to"| node_search
node_app -->|"routes to"| node_discover
node_app -->|"routes to"| node_queue
node_app -->|"routes to"| node_settings
node_library -->|"requests library data"| node_mopidy_service
node_search -->|"searches catalogs"| node_mopidy_service
node_search -.->|"searches provider"| node_spotify_service
node_discover -.->|"requests discovery"| node_spotify_service
node_queue -->|"controls playback"| node_mopidy_service
node_settings -.->|"configures authorization"| node_spotify_service
node_settings -.->|"configures authorization"| node_lastfm_service
node_settings -.->|"configures authorization"| node_genius_service
node_settings -.->|"configures streaming"| node_snapcast_service
node_store -->|"persists state"| node_local_storage
node_mopidy_service -->|"calls methods"| node_extension
node_extension -->|"registers endpoints"| node_handlers
node_handlers -->|"dispatches methods"| node_core
node_core -->|"uses server core"| node_mopidy
node_spotify_service -.->|"requests provider data"| node_spotify
node_lastfm_service -.->|"requests metadata"| node_lastfm
node_genius_service -.->|"requests lyrics"| node_genius
node_snapcast_service -.->|"controls stream clients"| node_snapcast

click node_entry "https://github.com/jaedb/iris/blob/master/src/js/index.js"
click node_app "https://github.com/jaedb/iris/blob/master/src/js/App.js"
click node_library "https://github.com/jaedb/iris/tree/master/src/js/views/Library"
click node_search "https://github.com/jaedb/iris/blob/master/src/js/views/Search.js"
click node_discover "https://github.com/jaedb/iris/tree/master/src/js/views/Discover"
click node_queue "https://github.com/jaedb/iris/blob/master/src/js/views/Queue.js"
click node_settings "https://github.com/jaedb/iris/blob/master/src/js/views/Settings.js"
click node_store "https://github.com/jaedb/iris/blob/master/src/js/store/index.js"
click node_mopidy_service "https://github.com/jaedb/iris/blob/master/src/js/services/mopidy/actions.js"
click node_spotify_service "https://github.com/jaedb/iris/blob/master/src/js/services/spotify/actions.js"
click node_lastfm_service "https://github.com/jaedb/iris/blob/master/src/js/services/lastfm/actions.js"
click node_genius_service "https://github.com/jaedb/iris/blob/master/src/js/services/genius/actions.js"
click node_snapcast_service "https://github.com/jaedb/iris/blob/master/src/js/services/snapcast/actions.js"
click node_local_storage "https://github.com/jaedb/iris/blob/master/src/js/util/storage.js"
click node_extension "https://github.com/jaedb/iris/blob/master/mopidy_iris/frontend.py"
click node_handlers "https://github.com/jaedb/iris/blob/master/mopidy_iris/handlers.py"
click node_core "https://github.com/jaedb/iris/blob/master/mopidy_iris/core.py"

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_entry,node_app toneBlue
class node_library,node_search,node_discover,node_queue,node_settings toneAmber
class node_store,node_mopidy_service,node_spotify_service,node_lastfm_service,node_genius_service,node_snapcast_service,node_local_storage,node_mopidy toneMint
class node_extension,node_handlers,node_core toneRose
class node_spotify,node_lastfm,node_genius,node_snapcast,node_listener toneIndigo
```

## Components

### Web interface

- [Browser entry](https://github.com/jaedb/iris/blob/master/src/js/index.js): `src/js/index.js`
- [Application router](https://github.com/jaedb/iris/blob/master/src/js/App.js): `src/js/App.js`

### Music workflows

- [Library browsing](https://github.com/jaedb/iris/tree/master/src/js/views/Library): `src/js/views/Library`
- [Catalog search](https://github.com/jaedb/iris/blob/master/src/js/views/Search.js): `src/js/views/Search.js`
- [Music discovery](https://github.com/jaedb/iris/tree/master/src/js/views/Discover): `src/js/views/Discover`
- [Queue and playback](https://github.com/jaedb/iris/blob/master/src/js/views/Queue.js): `src/js/views/Queue.js`
- [Service settings](https://github.com/jaedb/iris/blob/master/src/js/views/Settings.js): `src/js/views/Settings.js`

### Client services

- [Redux store](https://github.com/jaedb/iris/blob/master/src/js/store/index.js): `src/js/store/index.js`
- [Mopidy actions](https://github.com/jaedb/iris/blob/master/src/js/services/mopidy/actions.js): `src/js/services/mopidy/actions.js`
- [Spotify actions](https://github.com/jaedb/iris/blob/master/src/js/services/spotify/actions.js): `src/js/services/spotify/actions.js`
- [Last.fm actions](https://github.com/jaedb/iris/blob/master/src/js/services/lastfm/actions.js): `src/js/services/lastfm/actions.js`
- [Genius actions](https://github.com/jaedb/iris/blob/master/src/js/services/genius/actions.js): `src/js/services/genius/actions.js`
- [Snapcast actions](https://github.com/jaedb/iris/blob/master/src/js/services/snapcast/actions.js): `src/js/services/snapcast/actions.js`
- [Browser preferences](https://github.com/jaedb/iris/blob/master/src/js/util/storage.js): `src/js/util/storage.js`

### Mopidy extension

- [Mopidy extension](https://github.com/jaedb/iris/blob/master/mopidy_iris/frontend.py): `mopidy_iris/frontend.py`
- [HTTP and WebSocket](https://github.com/jaedb/iris/blob/master/mopidy_iris/handlers.py): `mopidy_iris/handlers.py`
- [Mopidy integration](https://github.com/jaedb/iris/blob/master/mopidy_iris/core.py): `mopidy_iris/core.py`

### Provider integrations

- **Spotify**
- **Last.fm**
- **Genius**
- **Snapcast**

### Other components

- **Listener**
- **Mopidy server**

## Connections

- Listener → Browser entry: opens
- Browser entry → Application router: renders
- Application router → Redux store: reads and dispatches
- Application router → Library browsing: routes to
- Application router → Catalog search: routes to
- Application router → Music discovery: routes to
- Application router → Queue and playback: routes to
- Application router → Service settings: routes to
- Library browsing → Mopidy actions: requests library data
- Catalog search → Mopidy actions: searches catalogs
- Catalog search → Spotify actions: searches provider
- Music discovery → Spotify actions: requests discovery
- Queue and playback → Mopidy actions: controls playback
- Service settings → Spotify actions: configures authorization
- Service settings → Last.fm actions: configures authorization
- Service settings → Genius actions: configures authorization
- Service settings → Snapcast actions: configures streaming
- Redux store → Browser preferences: persists state
- Mopidy actions → Mopidy extension: calls methods
- Mopidy extension → HTTP and WebSocket: registers endpoints
- HTTP and WebSocket → Mopidy integration: dispatches methods
- Mopidy integration → Mopidy server: uses server core
- Spotify actions → Spotify: requests provider data
- Last.fm actions → Last.fm: requests metadata
- Genius actions → Genius: requests lyrics
- Snapcast actions → Snapcast: controls stream clients