# hueppi92/poll-app architecture

> Architecture diagram of the GitHub repository hueppi92/poll-app, 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/hueppi92/poll-app
- Repository: https://github.com/hueppi92/poll-app

## Overview

PollApp is an Angular survey app whose main workflow is browsing surveys, opening one to answer its questions, submitting votes, and viewing updated result percentages. A separate creation flow validates survey details and question/answer choices, saves them, then navigates to the new survey. The graph preserves the documented home, filtering, and ending-soon capabilities. Some UI components are unsampled; their inclusion and links reflect the README and project structure, while service and realtime links follow sampled source.

Main entry points: [`src/app/components/service/survey-service.ts`](https://github.com/hueppi92/poll-app/blob/main/src/app/components/service/survey-service.ts) (Survey service), [`src/app/app.routes.ts`](https://github.com/hueppi92/poll-app/blob/main/src/app/app.routes.ts) (Application routes), [`src/app/components/home/home.ts`](https://github.com/hueppi92/poll-app/blob/main/src/app/components/home/home.ts) (Home screen), [`src/app/components/single-survey-view/single-survey-view.ts`](https://github.com/hueppi92/poll-app/blob/main/src/app/components/single-survey-view/single-survey-view.ts) (Survey view)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_navigation["Navigation and shell"]
  node_routes["Application routes<br/>[app.routes.ts]"]
  node_app["App shell<br/>[app.ts]"]
  node_header["Header<br/>[header.ts]"]
end

subgraph group_discovery["Survey discovery"]
  node_home["Home screen<br/>[home.ts]"]
  node_hero["Home hero<br/>[hero.ts]"]
  node_surveylist["Survey list<br/>[survey-list.ts]"]
  node_endinglist["Ending-soon list"]
  node_surveycard["Survey snippet<br/>[survey-snippet.ts]"]
end

subgraph group_participation["Create and answer"]
  node_newform["Survey creator<br/>[new-survey.ts]"]
  node_surveyview["Survey view"]
  node_question["Question interaction<br/>[question.ts]"]
  node_answer["Answer choice<br/>[answer.ts]"]
  node_results["Result display<br/>[result-snippet.ts]"]
end

subgraph group_services["Application services"]
  node_surveyservice["Survey service<br/>[survey-service.ts]"]
  node_resultservice["Result service<br/>[result-service.ts]"]
  node_dbservice["Database client<br/>[db-service.ts]"]
  node_models["Survey data types<br/>[survey.ts]"]
end

subgraph group_persistence["Persistence and realtime"]
  node_supabase[("Supabase")]
end

node_user(("Survey user"))

node_user -->|"navigates"| node_routes
node_routes -->|"routes to"| node_home
node_routes -->|"routes to"| node_newform
node_routes -->|"routes to"| node_surveyview
node_app -->|"hosts outlet"| node_routes
node_app -->|"renders"| node_header
node_home -->|"renders"| node_hero
node_home -->|"renders"| node_surveylist
node_home -->|"renders"| node_endinglist
node_surveylist -->|"loads surveys"| node_surveyservice
node_endinglist -->|"loads soon-ending"| node_surveyservice
node_surveylist -->|"displays surveys"| node_surveycard
node_newform -->|"creates records"| node_surveyservice
node_surveyview -->|"loads and submits"| node_surveyservice
node_surveyview -->|"renders questions"| node_question
node_surveyview -->|"renders results"| node_results
node_question -->|"loads answers"| node_surveyservice
node_question -->|"renders choices"| node_answer
node_results -->|"loads result data"| node_surveyservice
node_results -->|"subscribes to updates"| node_dbservice
node_surveyservice -->|"uses client"| node_dbservice
node_dbservice -->|"connects to"| node_supabase
node_resultservice -->|"uses client"| node_dbservice
node_surveyservice -->|"uses types"| node_models
node_results -->|"uses types"| node_models

click node_routes "https://github.com/hueppi92/poll-app/blob/main/src/app/app.routes.ts"
click node_app "https://github.com/hueppi92/poll-app/blob/main/src/app/app.ts"
click node_header "https://github.com/hueppi92/poll-app/blob/main/src/app/components/header/header.ts"
click node_home "https://github.com/hueppi92/poll-app/blob/main/src/app/components/home/home.ts"
click node_hero "https://github.com/hueppi92/poll-app/blob/main/src/app/components/hero/hero.ts"
click node_surveylist "https://github.com/hueppi92/poll-app/blob/main/src/app/components/lists/survey-list/survey-list.ts"
click node_endinglist "https://github.com/hueppi92/poll-app/blob/main/src/app/components/lists/ending-soon-list/ending-soon-list.ts"
click node_surveycard "https://github.com/hueppi92/poll-app/blob/main/src/app/components/survey-snippet/survey-snippet.ts"
click node_newform "https://github.com/hueppi92/poll-app/blob/main/src/app/components/new-survey/new-survey.ts"
click node_surveyview "https://github.com/hueppi92/poll-app/blob/main/src/app/components/single-survey-view/single-survey-view.ts"
click node_question "https://github.com/hueppi92/poll-app/blob/main/src/app/components/question/question.ts"
click node_answer "https://github.com/hueppi92/poll-app/blob/main/src/app/components/answer/answer.ts"
click node_results "https://github.com/hueppi92/poll-app/blob/main/src/app/components/result-snippet/result-snippet.ts"
click node_surveyservice "https://github.com/hueppi92/poll-app/blob/main/src/app/components/service/survey-service.ts"
click node_resultservice "https://github.com/hueppi92/poll-app/blob/main/src/app/components/service/result-service.ts"
click node_dbservice "https://github.com/hueppi92/poll-app/blob/main/src/app/components/service/db-service.ts"
click node_models "https://github.com/hueppi92/poll-app/blob/main/src/app/components/interfaces/survey.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_routes,node_app,node_header,node_user toneBlue
class node_home,node_hero,node_surveylist,node_endinglist,node_surveycard toneAmber
class node_newform,node_surveyview,node_question,node_answer,node_results toneMint
class node_surveyservice,node_resultservice,node_dbservice,node_models toneRose
class node_supabase toneIndigo
```

## Components

### Navigation and shell

- [Application routes](https://github.com/hueppi92/poll-app/blob/main/src/app/app.routes.ts): `src/app/app.routes.ts`
- [App shell](https://github.com/hueppi92/poll-app/blob/main/src/app/app.ts): `src/app/app.ts`
- [Header](https://github.com/hueppi92/poll-app/blob/main/src/app/components/header/header.ts): `src/app/components/header/header.ts`

### Survey discovery

- [Home screen](https://github.com/hueppi92/poll-app/blob/main/src/app/components/home/home.ts): `src/app/components/home/home.ts`
- [Home hero](https://github.com/hueppi92/poll-app/blob/main/src/app/components/hero/hero.ts): `src/app/components/hero/hero.ts`
- [Survey list](https://github.com/hueppi92/poll-app/blob/main/src/app/components/lists/survey-list/survey-list.ts): `src/app/components/lists/survey-list/survey-list.ts`
- [Ending-soon list](https://github.com/hueppi92/poll-app/blob/main/src/app/components/lists/ending-soon-list/ending-soon-list.ts): `src/app/components/lists/ending-soon-list/ending-soon-list.ts`
- [Survey snippet](https://github.com/hueppi92/poll-app/blob/main/src/app/components/survey-snippet/survey-snippet.ts): `src/app/components/survey-snippet/survey-snippet.ts`

### Create and answer

- [Survey creator](https://github.com/hueppi92/poll-app/blob/main/src/app/components/new-survey/new-survey.ts): `src/app/components/new-survey/new-survey.ts`
- [Survey view](https://github.com/hueppi92/poll-app/blob/main/src/app/components/single-survey-view/single-survey-view.ts): `src/app/components/single-survey-view/single-survey-view.ts`
- [Question interaction](https://github.com/hueppi92/poll-app/blob/main/src/app/components/question/question.ts): `src/app/components/question/question.ts`
- [Answer choice](https://github.com/hueppi92/poll-app/blob/main/src/app/components/answer/answer.ts): `src/app/components/answer/answer.ts`
- [Result display](https://github.com/hueppi92/poll-app/blob/main/src/app/components/result-snippet/result-snippet.ts): `src/app/components/result-snippet/result-snippet.ts`

### Application services

- [Survey service](https://github.com/hueppi92/poll-app/blob/main/src/app/components/service/survey-service.ts): `src/app/components/service/survey-service.ts`
- [Result service](https://github.com/hueppi92/poll-app/blob/main/src/app/components/service/result-service.ts): `src/app/components/service/result-service.ts`
- [Database client](https://github.com/hueppi92/poll-app/blob/main/src/app/components/service/db-service.ts): `src/app/components/service/db-service.ts`
- [Survey data types](https://github.com/hueppi92/poll-app/blob/main/src/app/components/interfaces/survey.ts): `src/app/components/interfaces/survey.ts`

### Persistence and realtime

- **Supabase**

### Other components

- **Survey user**

## Connections

- Survey user → Application routes: navigates
- Application routes → Home screen: routes to
- Application routes → Survey creator: routes to
- Application routes → Survey view: routes to
- App shell → Application routes: hosts outlet
- App shell → Header: renders
- Home screen → Home hero: renders
- Home screen → Survey list: renders
- Home screen → Ending-soon list: renders
- Survey list → Survey service: loads surveys
- Ending-soon list → Survey service: loads soon-ending
- Survey list → Survey snippet: displays surveys
- Survey creator → Survey service: creates records
- Survey view → Survey service: loads and submits
- Survey view → Question interaction: renders questions
- Survey view → Result display: renders results
- Question interaction → Survey service: loads answers
- Question interaction → Answer choice: renders choices
- Result display → Survey service: loads result data
- Result display → Database client: subscribes to updates
- Survey service → Database client: uses client
- Database client → Supabase: connects to
- Result service → Database client: uses client
- Survey service → Survey data types: uses types
- Result display → Survey data types: uses types