# soumyadeepmagnusx/celebration-event-planner architecture

> Architecture diagram of the GitHub repository soumyadeepmagnusx/celebration-event-planner, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-10). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/soumyadeepmagnusx/celebration-event-planner
- Repository: https://github.com/soumyadeepmagnusx/celebration-event-planner

## Overview

Celebratify AI is a browser-based celebration planner. Users create or select an event, then manage its budget, milestones and day-of schedule, vendors, and creative materials; an overview and printable dossier help review and share the plan. EventContext is the central state layer, persisting event data locally and exposing planning actions to the screens. AI-assisted planning is an optional service capability. The graph follows documented capabilities where source excerpts are incomplete; dashed links mark the optional external AI integration.

Main entry points: [`src/context/EventContext.tsx`](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/context/EventContext.tsx) (Event context), [`src/App.tsx`](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/App.tsx) (App shell), [`src/components/budget/BudgetOverview.tsx`](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/budget/BudgetOverview.tsx) (Budget planner), [`src/services/geminiService.ts`](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/services/geminiService.ts) (Gemini service)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["Application shell"]
  node_entry["App entry<br/>[main.tsx]"]
  node_shell["App shell<br/>[App.tsx]"]
end

subgraph group_state["Event state"]
  node_state["Event context<br/>[EventContext.tsx]"]
  node_storage[("Local persistence<br/>[storageService.ts]")]
  node_presets["Event presets<br/>[defaultEvents.ts]"]
end

subgraph group_planning["Planning workspace"]
  node_event_ui["Event setup"]
  node_event_header["Event header<br/>[EventHeader.tsx]"]
  node_dashboard["Overview dashboard"]
  node_budget["Budget planner<br/>[BudgetOverview.tsx]"]
  node_timeline["Timeline planner<br/>[TimelineView.tsx]"]
  node_vendors["Vendor CRM<br/>[VendorList.tsx]"]
  node_studio["Creative studio"]
  node_copilot["AI co-planner"]
  node_dossier["Printable dossier"]
end

subgraph group_intelligence["AI and safeguards"]
  node_ai["Gemini service<br/>[geminiService.ts]"]
  node_validation["Input validation<br/>[validation.ts]"]
end

subgraph group_shared["Shared services"]
  node_calculations["Planning calculations<br/>[calculations.ts]"]
  node_categories["Planning categories<br/>[categories.ts]"]
  node_formatters["Display formatters<br/>[formatters.ts]"]
  node_types["Event data model<br/>[event.ts]"]
  node_exports["Export service<br/>[exportService.ts]"]
end

node_user(("Planner"))
node_gemini{{"Gemini API"}}

node_user -->|"opens"| node_entry
node_entry -->|"renders"| node_shell
node_shell -->|"provides"| node_state
node_shell -->|"renders"| node_event_header
node_shell -->|"routes to"| node_dashboard
node_shell -->|"routes to"| node_budget
node_shell -->|"routes to"| node_timeline
node_shell -->|"routes to"| node_vendors
node_shell -->|"routes to"| node_studio
node_shell -->|"routes to"| node_dossier
node_state -->|"persists events"| node_storage
node_state -->|"loads defaults"| node_presets
node_event_header -->|"updates event"| node_state
node_event_ui -->|"creates event"| node_state
node_dashboard -->|"reads event"| node_state
node_budget -->|"updates budget"| node_state
node_budget -->|"computes metrics"| node_calculations
node_budget -->|"requests optimization"| node_ai
node_budget -->|"validates input"| node_validation
node_timeline -->|"updates schedule"| node_state
node_vendors -->|"updates vendors"| node_state
node_vendors -->|"requests drafts"| node_ai
node_vendors -->|"sanitizes input"| node_validation
node_studio -->|"reads event"| node_state
node_studio -->|"requests ideas"| node_ai
node_copilot -->|"sends chat"| node_state
node_state -->|"requests chat"| node_ai
node_dossier -->|"prints dossier"| node_exports
node_ai -.->|"may call"| node_gemini
node_calculations -->|"uses categories"| node_categories
node_formatters -->|"uses currencies"| node_categories

click node_entry "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/main.tsx"
click node_shell "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/App.tsx"
click node_event_ui "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/event/CreateEventModal.tsx"
click node_event_header "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/event/EventHeader.tsx"
click node_state "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/context/EventContext.tsx"
click node_storage "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/services/storageService.ts"
click node_presets "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/constants/defaultEvents.ts"
click node_dashboard "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/dashboard/OverviewDashboard.tsx"
click node_budget "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/budget/BudgetOverview.tsx"
click node_timeline "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/timeline/TimelineView.tsx"
click node_vendors "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/vendors/VendorList.tsx"
click node_studio "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/ideas/CreativeIdeationHub.tsx"
click node_copilot "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/chat/AICoPlannerDrawer.tsx"
click node_dossier "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/print/PrintableDossier.tsx"
click node_ai "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/services/geminiService.ts"
click node_validation "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/utils/validation.ts"
click node_calculations "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/utils/calculations.ts"
click node_categories "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/constants/categories.ts"
click node_formatters "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/utils/formatters.ts"
click node_types "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/types/event.ts"
click node_exports "https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/services/exportService.ts"

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_shell toneBlue
class node_state,node_storage,node_presets toneAmber
class node_event_ui,node_event_header,node_dashboard,node_budget,node_timeline,node_vendors,node_studio,node_copilot,node_dossier,node_gemini toneMint
class node_ai,node_validation toneRose
class node_calculations,node_categories,node_formatters,node_types,node_exports,node_user toneIndigo
```

## Components

### Application shell

- [App entry](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/main.tsx): `src/main.tsx`
- [App shell](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/App.tsx): `src/App.tsx`

### Event state

- [Event context](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/context/EventContext.tsx): `src/context/EventContext.tsx`
- [Local persistence](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/services/storageService.ts): `src/services/storageService.ts`
- [Event presets](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/constants/defaultEvents.ts): `src/constants/defaultEvents.ts`

### Planning workspace

- [Event setup](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/event/CreateEventModal.tsx): `src/components/event/CreateEventModal.tsx`
- [Event header](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/event/EventHeader.tsx): `src/components/event/EventHeader.tsx`
- [Overview dashboard](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/dashboard/OverviewDashboard.tsx): `src/components/dashboard/OverviewDashboard.tsx`
- [Budget planner](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/budget/BudgetOverview.tsx): `src/components/budget/BudgetOverview.tsx`
- [Timeline planner](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/timeline/TimelineView.tsx): `src/components/timeline/TimelineView.tsx`
- [Vendor CRM](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/vendors/VendorList.tsx): `src/components/vendors/VendorList.tsx`
- [Creative studio](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/ideas/CreativeIdeationHub.tsx): `src/components/ideas/CreativeIdeationHub.tsx`
- [AI co-planner](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/chat/AICoPlannerDrawer.tsx): `src/components/chat/AICoPlannerDrawer.tsx`
- [Printable dossier](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/components/print/PrintableDossier.tsx): `src/components/print/PrintableDossier.tsx`

### AI and safeguards

- [Gemini service](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/services/geminiService.ts): `src/services/geminiService.ts`
- [Input validation](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/utils/validation.ts): `src/utils/validation.ts`

### Shared services

- [Planning calculations](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/utils/calculations.ts): `src/utils/calculations.ts`
- [Planning categories](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/constants/categories.ts): `src/constants/categories.ts`
- [Display formatters](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/utils/formatters.ts): `src/utils/formatters.ts`
- [Event data model](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/types/event.ts): `src/types/event.ts`
- [Export service](https://github.com/soumyadeepmagnusx/celebration-event-planner/blob/main/src/services/exportService.ts): `src/services/exportService.ts`

### Other components

- **Planner**
- **Gemini API**

## Connections

- Planner → App entry: opens (evidence: `README.md`)
- App entry → App shell: renders (evidence: `src/main.tsx`)
- App shell → Event context: provides (evidence: `src/App.tsx`)
- App shell → Event header: renders (evidence: `src/App.tsx`)
- App shell → Overview dashboard: routes to (evidence: `src/App.tsx`)
- App shell → Budget planner: routes to (evidence: `src/App.tsx`)
- App shell → Timeline planner: routes to (evidence: `src/App.tsx`)
- App shell → Vendor CRM: routes to (evidence: `src/App.tsx`)
- App shell → Creative studio: routes to (evidence: `src/App.tsx`)
- App shell → Printable dossier: routes to (evidence: `src/App.tsx`)
- Event context → Local persistence: persists events (evidence: `src/context/EventContext.tsx`)
- Event context → Event presets: loads defaults (evidence: `src/context/EventContext.tsx`)
- Event header → Event context: updates event (evidence: `src/components/event/EventHeader.tsx`)
- Event setup → Event context: creates event (evidence: `src/components/event/CreateEventModal.tsx`)
- Overview dashboard → Event context: reads event (evidence: `src/components/dashboard/OverviewDashboard.tsx`)
- Budget planner → Event context: updates budget (evidence: `src/components/budget/BudgetOverview.tsx`)
- Budget planner → Planning calculations: computes metrics (evidence: `src/components/budget/BudgetOverview.tsx`)
- Budget planner → Gemini service: requests optimization (evidence: `src/components/budget/BudgetOverview.tsx`)
- Budget planner → Input validation: validates input (evidence: `src/components/budget/BudgetOverview.tsx`)
- Timeline planner → Event context: updates schedule (evidence: `src/components/timeline/TimelineView.tsx`)
- Vendor CRM → Event context: updates vendors (evidence: `src/components/vendors/VendorList.tsx`)
- Vendor CRM → Gemini service: requests drafts (evidence: `src/components/vendors/VendorList.tsx`)
- Vendor CRM → Input validation: sanitizes input (evidence: `src/components/vendors/VendorList.tsx`)
- Creative studio → Event context: reads event (evidence: `src/components/ideas/CreativeIdeationHub.tsx`)
- Creative studio → Gemini service: requests ideas (evidence: `src/components/ideas/CreativeIdeationHub.tsx`)
- AI co-planner → Event context: sends chat (evidence: `src/context/EventContext.tsx`)
- Event context → Gemini service: requests chat (evidence: `src/context/EventContext.tsx`)
- Printable dossier → Export service: prints dossier (evidence: `src/components/print/PrintableDossier.tsx`)
- Gemini service → Gemini API: may call (evidence: `README.md`)
- Planning calculations → Planning categories: uses categories (evidence: `src/utils/calculations.ts`)
- Display formatters → Planning categories: uses currencies (evidence: `src/utils/formatters.ts`)