# mizcausevic-dev/filmska-teorija architecture

> Architecture diagram of the GitHub repository mizcausevic-dev/filmska-teorija, 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/mizcausevic-dev/filmska-teorija
- Repository: https://github.com/mizcausevic-dev/filmska-teorija

## Overview

Filmska Teorija is a static, source-backed film-theory learning workbench. A learner selects a theory module, studies supplied media with timecoded scene evidence, compares interpretive lenses, follows sourced knowledge links, and uses practice prompts, quizzes, and local research notes. The React app orchestrates these experiences from a checked-in Wikipedia source registry and editorial datasets; browser localStorage keeps user research local. The README documents the broader feature set, while sampled excerpts only partially show App.tsx, so uncertain internal wiring is omitted.

Main entry points: [`src/App.tsx`](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx) (Workbench app), [`src/data/learning.ts`](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/learning.ts) (Source modules), [`src/main.tsx`](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/main.tsx) (React entry), [`src/components/TheoryGraph.tsx`](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/components/TheoryGraph.tsx) (Knowledge map)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["App experience"]
  node_entry["React entry<br/>[main.tsx]"]
  node_workbench["Workbench app<br/>[App.tsx]"]
  node_module_routes["Module routing<br/>[routes.ts]"]
end

subgraph group_study["Study tools"]
  node_module_browser["Module browser<br/>[App.tsx]"]
  node_media_study["Media study<br/>[App.tsx]"]
  node_scene_tags["Scene tagging<br/>[App.tsx]"]
  node_lens_simulator["Lens simulator<br/>[App.tsx]"]
  node_knowledge_map["Knowledge map<br/>[TheoryGraph.tsx]"]
  node_history_timeline["History timeline<br/>[App.tsx]"]
  node_practice_prompts["Practice prompts<br/>[App.tsx]"]
  node_glossary_quiz["Glossary quiz<br/>[App.tsx]"]
  node_paper_reader["Paper reader<br/>[App.tsx]"]
  node_essay_partner["Essay partner<br/>[App.tsx]"]
end

subgraph group_content["Learning content"]
  node_source_content["Source modules<br/>[learning.ts]"]
  node_source_registry["Wikipedia registry"]
  node_knowledge_data["Knowledge links<br/>[knowledge.ts]"]
  node_case_studies["Worked readings<br/>[caseStudies.ts]"]
  node_editorial_notes["Editorial notes<br/>[editorial.json]"]
end

subgraph group_state["Local state"]
  node_browser_store[("Browser storage")]
end

node_learner(("Learner"))
node_media_services["Media providers"]

node_learner -->|"opens app"| node_entry
node_entry -->|"renders"| node_workbench
node_workbench -->|"resolves module"| node_module_routes
node_workbench -->|"presents modules"| node_module_browser
node_module_browser -->|"reads modules"| node_source_content
node_source_content -->|"loads registry"| node_source_registry
node_workbench -->|"presents study"| node_media_study
node_media_study -.->|"embeds media"| node_media_services
node_workbench -->|"presents tagging"| node_scene_tags
node_scene_tags -->|"saves tags"| node_browser_store
node_workbench -->|"presents lenses"| node_lens_simulator
node_workbench -->|"loads on request"| node_knowledge_map
node_knowledge_map -->|"renders graph"| node_knowledge_data
node_workbench -->|"presents history"| node_history_timeline
node_history_timeline -->|"selects module"| node_source_content
node_workbench -->|"presents prompts"| node_practice_prompts
node_practice_prompts -->|"uses practice pages"| node_source_content
node_workbench -->|"presents quiz"| node_glossary_quiz
node_glossary_quiz -->|"uses extracts"| node_source_content
node_workbench -->|"presents reader"| node_paper_reader
node_paper_reader -->|"saves reader links"| node_browser_store
node_workbench -->|"presents partner"| node_essay_partner
node_essay_partner -->|"checks lenses"| node_source_content
node_workbench -->|"presents readings"| node_case_studies
node_workbench -->|"presents study notes"| node_editorial_notes

click node_entry "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/main.tsx"
click node_workbench "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_module_routes "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/routes.ts"
click node_module_browser "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_media_study "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_scene_tags "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_lens_simulator "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_knowledge_map "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/components/TheoryGraph.tsx"
click node_history_timeline "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_practice_prompts "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_glossary_quiz "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_paper_reader "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_essay_partner "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx"
click node_source_content "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/learning.ts"
click node_source_registry "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/wikipediaSources.json"
click node_knowledge_data "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/knowledge.ts"
click node_case_studies "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/caseStudies.ts"
click node_editorial_notes "https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/editorial.json"

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_workbench,node_module_routes toneBlue
class node_module_browser,node_media_study,node_scene_tags,node_lens_simulator,node_knowledge_map,node_history_timeline,node_practice_prompts,node_glossary_quiz,node_paper_reader,node_essay_partner toneAmber
class node_source_content,node_source_registry,node_knowledge_data,node_case_studies,node_editorial_notes toneMint
class node_browser_store toneRose
class node_learner,node_media_services toneIndigo
```

## Components

### App experience

- [React entry](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/main.tsx): `src/main.tsx`
- [Workbench app](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Module routing](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/routes.ts): `src/routes.ts`

### Study tools

- [Module browser](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Media study](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Scene tagging](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Lens simulator](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Knowledge map](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/components/TheoryGraph.tsx): `src/components/TheoryGraph.tsx`
- [History timeline](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Practice prompts](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Glossary quiz](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Paper reader](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`
- [Essay partner](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/App.tsx): `src/App.tsx`

### Learning content

- [Source modules](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/learning.ts): `src/data/learning.ts`
- [Wikipedia registry](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/wikipediaSources.json): `src/data/wikipediaSources.json`
- [Knowledge links](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/knowledge.ts): `src/data/knowledge.ts`
- [Worked readings](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/caseStudies.ts): `src/data/caseStudies.ts`
- [Editorial notes](https://github.com/mizcausevic-dev/filmska-teorija/blob/main/src/data/editorial.json): `src/data/editorial.json`

### Local state

- **Browser storage**

### Other components

- **Learner**
- **Media providers**

## Connections

- Learner → React entry: opens app
- React entry → Workbench app: renders
- Workbench app → Module routing: resolves module
- Workbench app → Module browser: presents modules
- Module browser → Source modules: reads modules
- Source modules → Wikipedia registry: loads registry
- Workbench app → Media study: presents study
- Media study → Media providers: embeds media
- Workbench app → Scene tagging: presents tagging
- Scene tagging → Browser storage: saves tags
- Workbench app → Lens simulator: presents lenses
- Workbench app → Knowledge map: loads on request
- Knowledge map → Knowledge links: renders graph
- Workbench app → History timeline: presents history
- History timeline → Source modules: selects module
- Workbench app → Practice prompts: presents prompts
- Practice prompts → Source modules: uses practice pages
- Workbench app → Glossary quiz: presents quiz
- Glossary quiz → Source modules: uses extracts
- Workbench app → Paper reader: presents reader
- Paper reader → Browser storage: saves reader links
- Workbench app → Essay partner: presents partner
- Essay partner → Source modules: checks lenses
- Workbench app → Worked readings: presents readings
- Workbench app → Editorial notes: presents study notes