# mikhail-ramirez/lighterpack architecture

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

- Interactive diagram: https://gitdiagram.com/mikhail-ramirez/lighterpack
- Repository: https://github.com/mikhail-ramirez/lighterpack

## Overview

LighterPack is a web app for organizing adventure gear into lists and tracking quantities, weight, and optional prices. The main workflow is editing a list in the dashboard, organizing items by category, and viewing calculated totals; signed-in users can sync library data through the server. The README establishes the gear-tracking purpose, while the sampled client and server excerpts support the editing, authentication, and persistence connections shown. Several capabilities are documented by components or endpoint names, but their detailed wiring is not visible in the excerpts.

Main entry points: [`client/views/dashboard.vue`](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/views/dashboard.vue) (Dashboard), [`client/store/store.js`](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/store/store.js) (Client state), [`app.js`](https://github.com/mikhail-ramirez/lighterpack/blob/master/app.js) (HTTP application), [`server/endpoints.js`](https://github.com/mikhail-ramirez/lighterpack/blob/master/server/endpoints.js) (User endpoints)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Gear planning"]
  node_dashboard["Dashboard<br/>[dashboard.vue]"]
  node_list["List editor<br/>[list.vue]"]
  node_item["Gear item<br/>[item.vue]"]
  node_summary["Totals summary<br/>[list-summary.vue]"]
  node_sidebar["Library navigation<br/>[sidebar.vue]"]
  node_share["List sharing<br/>[share.vue]"]
  node_csv["CSV import<br/>[import-csv.vue]"]
  node_image["Gear images<br/>[item-image.vue]"]
end

subgraph group_domain["Library model"]
  node_store["Client state<br/>[store.js]"]
  node_library["Library model<br/>[lighterpack.js]"]
  node_data_types["Domain types<br/>[dataTypes.js]"]
  node_weight["Weight calculations<br/>[weight.js]"]
end

subgraph group_server["Web services"]
  node_app["HTTP application<br/>[app.js]"]
  node_endpoints["User endpoints<br/>[endpoints.js]"]
  node_views["Page delivery<br/>[views.js]"]
end

subgraph group_identity["Accounts and moderation"]
  node_auth["Authentication<br/>[auth.js]"]
  node_moderation["Moderation endpoints"]
  node_moderation_ui["Moderation UI<br/>[moderation.vue]"]
end

node_adventurer(("Adventurer"))
node_mongo[("MongoDB")]

node_adventurer -->|"edits gear"| node_dashboard
node_dashboard -->|"renders"| node_list
node_dashboard -->|"renders"| node_sidebar
node_dashboard -->|"renders"| node_share
node_dashboard -->|"dispatches edits"| node_store
node_list -->|"renders items"| node_item
node_list -->|"shows totals"| node_summary
node_item -->|"commits changes"| node_store
node_csv -->|"imports rows"| node_store
node_store -->|"loads and updates"| node_library
node_library -->|"uses models"| node_data_types
node_store -->|"calculates weight"| node_weight
node_app -->|"mounts routes"| node_endpoints
node_app -->|"mounts routes"| node_views
node_app -->|"mounts routes"| node_moderation
node_app -->|"serves client"| node_dashboard
node_endpoints -->|"authenticates users"| node_auth
node_endpoints -->|"reads and writes"| node_mongo
node_auth -->|"reads and writes"| node_mongo
node_moderation -->|"checks moderator"| node_auth
node_adventurer -.->|"uses moderation"| node_moderation_ui
node_moderation_ui -.->|"requests actions"| node_moderation
node_image -.->|"uploads image"| node_endpoints

click node_dashboard "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/views/dashboard.vue"
click node_list "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/list.vue"
click node_item "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/item.vue"
click node_summary "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/list-summary.vue"
click node_sidebar "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/sidebar.vue"
click node_share "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/share.vue"
click node_csv "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/import-csv.vue"
click node_image "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/item-image.vue"
click node_store "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/store/store.js"
click node_library "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/lighterpack.js"
click node_data_types "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/dataTypes.js"
click node_weight "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/utils/weight.js"
click node_app "https://github.com/mikhail-ramirez/lighterpack/blob/master/app.js"
click node_endpoints "https://github.com/mikhail-ramirez/lighterpack/blob/master/server/endpoints.js"
click node_views "https://github.com/mikhail-ramirez/lighterpack/blob/master/server/views.js"
click node_auth "https://github.com/mikhail-ramirez/lighterpack/blob/master/server/auth.js"
click node_moderation "https://github.com/mikhail-ramirez/lighterpack/blob/master/server/moderation-endpoints.js"
click node_moderation_ui "https://github.com/mikhail-ramirez/lighterpack/blob/master/client/views/moderation.vue"

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_dashboard,node_list,node_item,node_summary,node_sidebar,node_share,node_csv,node_image toneBlue
class node_store,node_library,node_data_types,node_weight,node_mongo toneAmber
class node_app,node_endpoints,node_views toneMint
class node_auth,node_moderation,node_moderation_ui toneRose
class node_adventurer toneIndigo
```

## Components

### Gear planning

- [Dashboard](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/views/dashboard.vue): `client/views/dashboard.vue`
- [List editor](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/list.vue): `client/components/list.vue`
- [Gear item](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/item.vue): `client/components/item.vue`
- [Totals summary](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/list-summary.vue): `client/components/list-summary.vue`
- [Library navigation](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/sidebar.vue): `client/components/sidebar.vue`
- [List sharing](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/share.vue): `client/components/share.vue`
- [CSV import](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/import-csv.vue): `client/components/import-csv.vue`
- [Gear images](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/components/item-image.vue): `client/components/item-image.vue`

### Library model

- [Client state](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/store/store.js): `client/store/store.js`
- [Library model](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/lighterpack.js): `client/lighterpack.js`
- [Domain types](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/dataTypes.js): `client/dataTypes.js`
- [Weight calculations](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/utils/weight.js): `client/utils/weight.js`

### Web services

- [HTTP application](https://github.com/mikhail-ramirez/lighterpack/blob/master/app.js): `app.js`
- [User endpoints](https://github.com/mikhail-ramirez/lighterpack/blob/master/server/endpoints.js): `server/endpoints.js`
- [Page delivery](https://github.com/mikhail-ramirez/lighterpack/blob/master/server/views.js): `server/views.js`

### Accounts and moderation

- [Authentication](https://github.com/mikhail-ramirez/lighterpack/blob/master/server/auth.js): `server/auth.js`
- [Moderation endpoints](https://github.com/mikhail-ramirez/lighterpack/blob/master/server/moderation-endpoints.js): `server/moderation-endpoints.js`
- [Moderation UI](https://github.com/mikhail-ramirez/lighterpack/blob/master/client/views/moderation.vue): `client/views/moderation.vue`

### Other components

- **Adventurer**
- **MongoDB**

## Connections

- Adventurer → Dashboard: edits gear
- Dashboard → List editor: renders
- Dashboard → Library navigation: renders
- Dashboard → List sharing: renders
- Dashboard → Client state: dispatches edits
- List editor → Gear item: renders items
- List editor → Totals summary: shows totals
- Gear item → Client state: commits changes
- CSV import → Client state: imports rows
- Client state → Library model: loads and updates
- Library model → Domain types: uses models
- Client state → Weight calculations: calculates weight
- HTTP application → User endpoints: mounts routes
- HTTP application → Page delivery: mounts routes
- HTTP application → Moderation endpoints: mounts routes
- HTTP application → Dashboard: serves client
- User endpoints → Authentication: authenticates users
- User endpoints → MongoDB: reads and writes
- Authentication → MongoDB: reads and writes
- Moderation endpoints → Authentication: checks moderator
- Adventurer → Moderation UI: uses moderation
- Moderation UI → Moderation endpoints: requests actions
- Gear images → User endpoints: uploads image