# denel91/law-flashcards architecture

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

- Interactive diagram: https://gitdiagram.com/denel91/law-flashcards
- Repository: https://github.com/denel91/law-flashcards

## Overview

Flashcards Giuridiche is a web app for studying law by subject. Learners choose one of three study areas, review and navigate interactive question-and-answer cards, and can create, edit, or delete cards; study outcomes feed area and global progress statistics. Search, filters, and optional spaced repetition are documented capabilities. The service layer connects card and statistics operations to Supabase. The map uses the README and sampled sources; some capabilities and route wiring are documented but not fully visible in the excerpts.

Main entry points: [`src/app/area/[id]/page.js`](https://github.com/denel91/law-flashcards/blob/master/src/app/area/%5Bid%5D/page.js) (Area study), [`src/lib/flashcardService.js`](https://github.com/denel91/law-flashcards/blob/master/src/lib/flashcardService.js) (Flashcard service), [`src/components/Flashcard.jsx`](https://github.com/denel91/law-flashcards/blob/master/src/components/Flashcard.jsx) (Flashcard interaction), [`src/components/FlashcardForm.jsx`](https://github.com/denel91/law-flashcards/blob/master/src/components/FlashcardForm.jsx) (Card editor)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_study["Study workflow"]
  node_area["Area study<br/>[page.js]"]
  node_card["Flashcard interaction<br/>[Flashcard.jsx]"]
  node_form["Card editor<br/>[FlashcardForm.jsx]"]
  node_search["Search and filters"]
  node_srs["Spaced repetition<br/>[page.js]"]
end

subgraph group_progress["Progress and review"]
  node_area_stats["Area statistics<br/>[AreaStats.jsx]"]
  node_stats_client["Global statistics view"]
end

subgraph group_data["Data access"]
  node_service["Flashcard service"]
  node_supabase_client["Browser client<br/>[client.js]"]
end

subgraph group_site["Site pages"]
  node_home["Study dashboard<br/>[page.js]"]
  node_stats_route["Global stats route<br/>[page.jsx]"]
  node_contacts["Contacts page<br/>[page.jsx]"]
end

node_learner(("Learner"))
node_supabase[("Supabase")]

node_learner -->|"opens"| node_home
node_home -->|"counts cards"| node_service
node_learner -->|"chooses area"| node_area
node_area -->|"loads and changes cards"| node_service
node_area -->|"displays cards"| node_card
node_card -->|"sends actions"| node_area
node_area -->|"opens editor"| node_form
node_form -->|"submits card"| node_area
node_area -->|"searches and filters"| node_search
node_area -.->|"prioritizes review"| node_srs
node_area -->|"records study results"| node_service
node_area -->|"passes area metrics"| node_area_stats
node_learner -->|"opens"| node_stats_route
node_stats_route -->|"renders"| node_stats_client
node_stats_client -->|"requests global stats"| node_service
node_service -->|"aggregates area stats"| node_service
node_service -->|"creates client"| node_supabase_client
node_supabase_client -->|"queries data"| node_supabase
node_learner -->|"opens"| node_contacts

click node_home "https://github.com/denel91/law-flashcards/blob/master/src/app/page.js"
click node_area "https://github.com/denel91/law-flashcards/blob/master/src/app/area/%5Bid%5D/page.js"
click node_card "https://github.com/denel91/law-flashcards/blob/master/src/components/Flashcard.jsx"
click node_form "https://github.com/denel91/law-flashcards/blob/master/src/components/FlashcardForm.jsx"
click node_service "https://github.com/denel91/law-flashcards/blob/master/src/lib/flashcardService.js"
click node_search "https://github.com/denel91/law-flashcards/blob/master/src/lib/flashcardService.js"
click node_srs "https://github.com/denel91/law-flashcards/blob/master/src/app/area/%5Bid%5D/page.js"
click node_area_stats "https://github.com/denel91/law-flashcards/blob/master/src/components/AreaStats.jsx"
click node_stats_client "https://github.com/denel91/law-flashcards/blob/master/src/components/GlobalStatsClient.jsx"
click node_stats_route "https://github.com/denel91/law-flashcards/blob/master/src/app/global-stats/page.jsx"
click node_contacts "https://github.com/denel91/law-flashcards/blob/master/src/app/contacts/page.jsx"
click node_supabase_client "https://github.com/denel91/law-flashcards/blob/master/src/utils/supabase/client.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_area,node_card,node_form,node_search,node_srs toneBlue
class node_area_stats,node_stats_client,node_supabase toneAmber
class node_service,node_supabase_client toneMint
class node_home,node_stats_route,node_contacts toneRose
class node_learner toneIndigo
```

## Components

### Study workflow

- [Area study](https://github.com/denel91/law-flashcards/blob/master/src/app/area/%5Bid%5D/page.js): `src/app/area/[id]/page.js`
- [Flashcard interaction](https://github.com/denel91/law-flashcards/blob/master/src/components/Flashcard.jsx): `src/components/Flashcard.jsx`
- [Card editor](https://github.com/denel91/law-flashcards/blob/master/src/components/FlashcardForm.jsx): `src/components/FlashcardForm.jsx`
- [Search and filters](https://github.com/denel91/law-flashcards/blob/master/src/lib/flashcardService.js): `src/lib/flashcardService.js`
- [Spaced repetition](https://github.com/denel91/law-flashcards/blob/master/src/app/area/%5Bid%5D/page.js): `src/app/area/[id]/page.js`

### Progress and review

- [Area statistics](https://github.com/denel91/law-flashcards/blob/master/src/components/AreaStats.jsx): `src/components/AreaStats.jsx`
- [Global statistics view](https://github.com/denel91/law-flashcards/blob/master/src/components/GlobalStatsClient.jsx): `src/components/GlobalStatsClient.jsx`

### Data access

- [Flashcard service](https://github.com/denel91/law-flashcards/blob/master/src/lib/flashcardService.js): `src/lib/flashcardService.js`
- [Browser client](https://github.com/denel91/law-flashcards/blob/master/src/utils/supabase/client.js): `src/utils/supabase/client.js`

### Site pages

- [Study dashboard](https://github.com/denel91/law-flashcards/blob/master/src/app/page.js): `src/app/page.js`
- [Global stats route](https://github.com/denel91/law-flashcards/blob/master/src/app/global-stats/page.jsx): `src/app/global-stats/page.jsx`
- [Contacts page](https://github.com/denel91/law-flashcards/blob/master/src/app/contacts/page.jsx): `src/app/contacts/page.jsx`

### Other components

- **Learner**
- **Supabase**

## Connections

- Learner → Study dashboard: opens
- Study dashboard → Flashcard service: counts cards
- Learner → Area study: chooses area
- Area study → Flashcard service: loads and changes cards
- Area study → Flashcard interaction: displays cards
- Flashcard interaction → Area study: sends actions
- Area study → Card editor: opens editor
- Card editor → Area study: submits card
- Area study → Search and filters: searches and filters
- Area study → Spaced repetition: prioritizes review
- Area study → Flashcard service: records study results
- Area study → Area statistics: passes area metrics
- Learner → Global stats route: opens
- Global stats route → Global statistics view: renders
- Global statistics view → Flashcard service: requests global stats
- Flashcard service → Flashcard service: aggregates area stats
- Flashcard service → Browser client: creates client
- Browser client → Supabase: queries data
- Learner → Contacts page: opens