# thoshiranchanilka/lucky-spin architecture

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

- Interactive diagram: https://gitdiagram.com/thoshiranchanilka/lucky-spin
- Repository: https://github.com/thoshiranchanilka/lucky-spin

## Overview

This is a browser-based prize-wheel experience: a visitor starts a spin, the wheel selects and animates to a prize, then presents the result in a modal. The prize list, spin behavior, result presentation, and audio/confetti effects are supported by the sampled files. The page and its wiring were not sampled, so the entry-page-to-wheel and prize-data-to-page connections reflect the apparent runtime structure; other page/layout details are omitted.

Main entry points: [`src/components/SpinWheel.jsx`](https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/components/SpinWheel.jsx) (Spin wheel), [`src/pages/index.astro`](https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/pages/index.astro) (Home page), [`src/components/WinModal.jsx`](https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/components/WinModal.jsx) (Result modal), [`src/data/prizes.js`](https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/data/prizes.js) (Prize list)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["Spin experience"]
  node_home["Home page<br/>[index.astro]"]
  node_wheel["Spin wheel<br/>[SpinWheel.jsx]"]
end

subgraph group_outcomes["Prize outcomes"]
  node_prizes["Prize list<br/>[prizes.js]"]
  node_modal["Result modal<br/>[WinModal.jsx]"]
end

subgraph group_effects["Effects"]
  node_audio["Spin audio"]
  node_confetti["Confetti library"]
end

node_visitor(("Visitor"))

node_visitor -->|"opens"| node_home
node_home -->|"renders"| node_wheel
node_home -->|"supplies prizes"| node_prizes
node_wheel -->|"reads"| node_prizes
node_wheel -->|"shows result"| node_modal
node_wheel -->|"plays sounds"| node_audio
node_modal -->|"fires"| node_confetti

click node_home "https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/pages/index.astro"
click node_wheel "https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/components/SpinWheel.jsx"
click node_prizes "https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/data/prizes.js"
click node_modal "https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/components/WinModal.jsx"
click node_audio "https://github.com/thoshiranchanilka/lucky-spin/tree/main/public"

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_home,node_wheel toneBlue
class node_prizes,node_modal toneAmber
class node_audio,node_confetti toneMint
class node_visitor toneIndigo
```

## Components

### Spin experience

- [Home page](https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/pages/index.astro): `src/pages/index.astro`
- [Spin wheel](https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/components/SpinWheel.jsx): `src/components/SpinWheel.jsx`

### Prize outcomes

- [Prize list](https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/data/prizes.js): `src/data/prizes.js`
- [Result modal](https://github.com/thoshiranchanilka/lucky-spin/blob/main/src/components/WinModal.jsx): `src/components/WinModal.jsx`

### Effects

- [Spin audio](https://github.com/thoshiranchanilka/lucky-spin/tree/main/public): `public`
- **Confetti library**

### Other components

- **Visitor**

## Connections

- Visitor → Home page: opens
- Home page → Spin wheel: renders
- Home page → Prize list: supplies prizes
- Spin wheel → Prize list: reads
- Spin wheel → Result modal: shows result
- Spin wheel → Spin audio: plays sounds
- Result modal → Confetti library: fires
