# pronoy656/hircon-website architecture

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

- Interactive diagram: https://gitdiagram.com/pronoy656/hircon-website
- Repository: https://github.com/pronoy656/hircon-website

## Overview

1. This repository is a single Next.js application built with the App Router and TypeScript. The architecture is almost entirely frontend/UI-driven: `src/app` defines routes and layouts, while `src/components` holds reusable presentation and feature components.

2. The top-level route structure is split into three broad areas:
   - public/authentication flows under `src/app/auth/*`
   - the main authenticated dashboard under `src/app/dashboard/*`
   - a few standalone pages such as `/jobs`, `/network`, and `/support`
   This makes the route tree itself the primary architectural map.

3. The dashboard is the core shell of the app. `src/app/dashboard/layout.tsx` wraps the authenticated experience, and shared navigation elements live in `src/components/layout` (`Navbar`, `NavbarWrapper`, `Topbar`). This suggests a persistent shell with nested feature pages rendered inside it.

4. Feature domains are organized by business capability rather than technical layer. The biggest ones are:
   - shipping: export domestic, import, pallet, quick ship, ship manager, spot rate, saved shipments
   - tracking: tracking history, watch shipment, spot-rate history
   - quoting: quick quote, saved quotation
   - management: contacts, CSV mapping, preferences, dashboard preferences, printing/profile/roles/users tabs
   - products: product and packaging editing
   - printing/invoicing/integration: separate dashboard sections
   Each route page is thin and delegates most UI/workflow logic to a feature component.

5. The `src/components/features` tree is the main application layer. It contains composite modules such as `QuickShipForm`, `ExportDomesticForm`, `ShipManager`, `TrackingHistoryList`, `ContactTable`, and `QuickQuoteForm`. These components likely own form state, modal workflows, tables, and multi-step interactions for each business area.

6. Shared UI primitives live in `src/components/ui`. These are generic controls used across features: inputs, selects, text areas, tables, tabs, pagination, confirmation/delete/success modals, and buttons. This layer acts as the design-system boundary between business-specific features and low-level UI.

7. There is a clear modal-and-table interaction pattern across the app. Many workflows are centered on list management plus dialogs: contacts, shipment details, address books, product editing, commercial invoices, sold-to addresses, schedule collection, and success/confirmation states. That indicates the app is designed around CRUD-like operations and guided user flows rather than freeform pages.

8. Shared data and helper logic is minimal and centralized in `src/lib`. Notable files are `countries.ts`, `savedQuotes.ts`, and `utils.ts`. This implies some app data is local/static or client-managed, with reusable utility functions rather than a large server-side domain layer in this repo.

9. Styling is global plus component-scoped. `src/app/globals.css` provides the base app styling, while `src/styles/custom-shapes.css` adds extra visual primitives. The presence of `components.json` and small UI primitives suggests a component-driven styling system, likely with a strong focus on consistent reusable controls.

10. There is little evidence of a backend service boundary in this repository. No API layer, database client, or server module tree is visible, so the architectural diagram should treat this as a client-heavy Next.js frontend that assembles route pages from reusable feature modules and shared UI, with any persistence/integration likely abstracted away or mocked in local state/data files.

Main entry points: [`src/app/dashboard`](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard) (Dashboard shell), [`src/app`](https://github.com/pronoy656/hircon-website/tree/main/src/app) (App), [`src/components/ui`](https://github.com/pronoy656/hircon-website/tree/main/src/components/ui) (UI primitives), [`src/app/dashboard/ship`](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/ship) (Shipping routes)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["Next app"]
  node_root["App"]
  node_app_layout["Root layout<br/>app shell<br/>[layout.tsx]"]
  node_app_home["Landing<br/>public page<br/>[page.tsx]"]
  node_app_auth["Auth area<br/>auth routes"]
  node_app_dashboard["Dashboard shell<br/>protected area"]
  node_app_ship["Shipping routes<br/>route section"]
  node_app_track["Tracking routes<br/>route section"]
  node_app_quote["Quote routes<br/>route section"]
  node_app_manage["Manage routes<br/>route section"]
  node_app_products["Products routes<br/>route section"]
  node_app_print["Print routes<br/>route section"]
  node_app_invoice["Invoicing<br/>route page<br/>[page.tsx]"]
  node_app_integration["Integration<br/>route page<br/>[page.tsx]"]
  node_app_jobs["Jobs<br/>standalone page<br/>[page.tsx]"]
  node_app_network["Network<br/>standalone page<br/>[page.tsx]"]
  node_app_support["Support<br/>standalone page<br/>[page.tsx]"]
  node_dash_layout["Dashboard layout<br/>shell layout<br/>[layout.tsx]"]
end

subgraph group_features["Feature modules"]
  node_layout_nav["Nav chrome<br/>layout components"]
  node_ship_forms["Shipment forms<br/>shipment workflow"]
  node_ship_manager["Ship manager<br/>shipment management"]
  node_track_history["Tracking history<br/>tracking workflow"]
  node_quote_quick["Quick quote<br/>quote workflow"]
  node_manage_contact["Contacts<br/>management module"]
  node_manage_tabs["Preference tabs<br/>management module"]
  node_products_table["Product table<br/>products module<br/>[ProductTable.tsx]"]
end

subgraph group_ui["Shared UI"]
  node_ui_core["UI primitives<br/>design system"]
end

subgraph group_lib["Shared logic"]
  node_lib_data["Local data<br/>shared data"]
end

subgraph group_styles["Styles"]
  node_styles_main["Global styles<br/>[globals.css]"]
end

node_root -->|"wraps"| node_app_layout
node_root -->|"serves"| node_app_home
node_root -->|"routes"| node_app_auth
node_root -->|"routes"| node_app_dashboard
node_root -->|"serves"| node_app_jobs
node_root -->|"serves"| node_app_network
node_root -->|"serves"| node_app_support
node_app_dashboard -->|"wraps"| node_dash_layout
node_dash_layout -->|"contains"| node_layout_nav
node_app_dashboard -->|"contains"| node_app_ship
node_app_dashboard -->|"contains"| node_app_track
node_app_dashboard -->|"contains"| node_app_quote
node_app_dashboard -->|"contains"| node_app_manage
node_app_dashboard -->|"contains"| node_app_products
node_app_dashboard -->|"contains"| node_app_print
node_app_dashboard -->|"contains"| node_app_invoice
node_app_dashboard -->|"contains"| node_app_integration
node_app_ship -->|"delegates to"| node_ship_forms
node_app_ship -->|"delegates to"| node_ship_manager
node_app_track -->|"delegates to"| node_track_history
node_app_quote -->|"delegates to"| node_quote_quick
node_app_manage -->|"delegates to"| node_manage_contact
node_app_manage -->|"delegates to"| node_manage_tabs
node_app_products -->|"delegates to"| node_products_table
node_ship_forms -->|"uses"| node_ui_core
node_ship_manager -->|"uses"| node_ui_core
node_track_history -->|"uses"| node_ui_core
node_quote_quick -->|"uses"| node_ui_core
node_manage_contact -->|"uses"| node_ui_core
node_manage_tabs -->|"uses"| node_ui_core
node_products_table -->|"uses"| node_ui_core
node_app_layout -->|"loads"| node_styles_main
node_ship_forms -->|"reads"| node_lib_data
node_quote_quick -->|"reads"| node_lib_data
node_track_history -->|"reads"| node_lib_data

click node_root "https://github.com/pronoy656/hircon-website/tree/main/src/app"
click node_app_layout "https://github.com/pronoy656/hircon-website/blob/main/src/app/layout.tsx"
click node_app_home "https://github.com/pronoy656/hircon-website/blob/main/src/app/page.tsx"
click node_app_auth "https://github.com/pronoy656/hircon-website/tree/main/src/app/auth"
click node_app_dashboard "https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard"
click node_app_ship "https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/ship"
click node_app_track "https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/track"
click node_app_quote "https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/quote"
click node_app_manage "https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/manage"
click node_app_products "https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/products"
click node_app_print "https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/print"
click node_app_invoice "https://github.com/pronoy656/hircon-website/blob/main/src/app/dashboard/invoice/page.tsx"
click node_app_integration "https://github.com/pronoy656/hircon-website/blob/main/src/app/dashboard/integration/page.tsx"
click node_app_jobs "https://github.com/pronoy656/hircon-website/blob/main/src/app/jobs/page.tsx"
click node_app_network "https://github.com/pronoy656/hircon-website/blob/main/src/app/network/page.tsx"
click node_app_support "https://github.com/pronoy656/hircon-website/blob/main/src/app/support/page.tsx"
click node_dash_layout "https://github.com/pronoy656/hircon-website/blob/main/src/app/dashboard/layout.tsx"
click node_layout_nav "https://github.com/pronoy656/hircon-website/tree/main/src/components/layout"
click node_ship_forms "https://github.com/pronoy656/hircon-website/tree/main/src/components/features/shipment"
click node_ship_manager "https://github.com/pronoy656/hircon-website/tree/main/src/components/features/shipment/ship-manager"
click node_track_history "https://github.com/pronoy656/hircon-website/tree/main/src/components/features/tracking/tracking-history"
click node_quote_quick "https://github.com/pronoy656/hircon-website/tree/main/src/components/features/quote/quick-quote"
click node_manage_contact "https://github.com/pronoy656/hircon-website/tree/main/src/components/features/manage/contact"
click node_manage_tabs "https://github.com/pronoy656/hircon-website/tree/main/src/components/features/manage/preference-tabs"
click node_products_table "https://github.com/pronoy656/hircon-website/blob/main/src/components/features/products/ProductTable.tsx"
click node_ui_core "https://github.com/pronoy656/hircon-website/tree/main/src/components/ui"
click node_lib_data "https://github.com/pronoy656/hircon-website/tree/main/src/lib"
click node_styles_main "https://github.com/pronoy656/hircon-website/blob/main/src/app/globals.css"

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_root,node_app_layout,node_app_home,node_app_auth,node_app_dashboard,node_app_ship,node_app_track,node_app_quote,node_app_manage,node_app_products,node_app_print,node_app_invoice,node_app_integration,node_app_jobs,node_app_network,node_app_support,node_dash_layout toneBlue
class node_layout_nav,node_ship_forms,node_ship_manager,node_track_history,node_quote_quick,node_manage_contact,node_manage_tabs,node_products_table toneAmber
class node_ui_core toneMint
class node_lib_data toneRose
class node_styles_main toneIndigo
```

## Components

### Next app

Route tree and application shells

- [App](https://github.com/pronoy656/hircon-website/tree/main/src/app): Next.js app · Single App Router frontend · `src/app`
- [Root layout](https://github.com/pronoy656/hircon-website/blob/main/src/app/layout.tsx): app shell · Global HTML/body wrapper for the app · `src/app/layout.tsx`
- [Landing](https://github.com/pronoy656/hircon-website/blob/main/src/app/page.tsx): public page · Top-level entry page · `src/app/page.tsx`
- [Auth area](https://github.com/pronoy656/hircon-website/tree/main/src/app/auth): auth routes · Login, register, verification, and password recovery · `src/app/auth`
- [Dashboard shell](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard): protected area · Authenticated workspace with nested business pages · `src/app/dashboard`
- [Shipping routes](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/ship): route section · Export, import, pallet, quick ship, manager, spot rate, saved shipments · `src/app/dashboard/ship`
- [Tracking routes](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/track): route section · Tracking history, watch shipment, spot-rate history · `src/app/dashboard/track`
- [Quote routes](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/quote): route section · Quick quote and saved quotations · `src/app/dashboard/quote`
- [Manage routes](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/manage): route section · Contacts, CSV mapping, preferences, dashboard preferences · `src/app/dashboard/manage`
- [Products routes](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/products): route section · Edit products and packaging · `src/app/dashboard/products`
- [Print routes](https://github.com/pronoy656/hircon-website/tree/main/src/app/dashboard/print): route section · Bulk print and manifest printing · `src/app/dashboard/print`
- [Invoicing](https://github.com/pronoy656/hircon-website/blob/main/src/app/dashboard/invoice/page.tsx): route page · Dashboard invoice page · `src/app/dashboard/invoice/page.tsx`
- [Integration](https://github.com/pronoy656/hircon-website/blob/main/src/app/dashboard/integration/page.tsx): route page · Dashboard integration page · `src/app/dashboard/integration/page.tsx`
- [Jobs](https://github.com/pronoy656/hircon-website/blob/main/src/app/jobs/page.tsx): standalone page · Independent page outside the dashboard · `src/app/jobs/page.tsx`
- [Network](https://github.com/pronoy656/hircon-website/blob/main/src/app/network/page.tsx): standalone page · Independent page outside the dashboard · `src/app/network/page.tsx`
- [Support](https://github.com/pronoy656/hircon-website/blob/main/src/app/support/page.tsx): standalone page · Independent page outside the dashboard · `src/app/support/page.tsx`
- [Dashboard layout](https://github.com/pronoy656/hircon-website/blob/main/src/app/dashboard/layout.tsx): shell layout · Wraps authenticated dashboard pages · `src/app/dashboard/layout.tsx`

### Feature modules

Business-capability components used by routes

- [Nav chrome](https://github.com/pronoy656/hircon-website/tree/main/src/components/layout): layout components · Persistent navbar, wrapper, and topbar · `src/components/layout`
- [Shipment forms](https://github.com/pronoy656/hircon-website/tree/main/src/components/features/shipment): shipment workflow · Core shipping forms and shipment detail subpanels · `src/components/features/shipment`
- [Ship manager](https://github.com/pronoy656/hircon-website/tree/main/src/components/features/shipment/ship-manager): shipment management · Shipment listing and related edit/invoice modals · `src/components/features/shipment/ship-manager`
- [Tracking history](https://github.com/pronoy656/hircon-website/tree/main/src/components/features/tracking/tracking-history): tracking workflow · Filters, cards, detail modal, and history list · `src/components/features/tracking/tracking-history`
- [Quick quote](https://github.com/pronoy656/hircon-website/tree/main/src/components/features/quote/quick-quote): quote workflow · Quote form and results view · `src/components/features/quote/quick-quote`
- [Contacts](https://github.com/pronoy656/hircon-website/tree/main/src/components/features/manage/contact): management module · Contact table, toolbar, and add-contact modal · `src/components/features/manage/contact`
- [Preference tabs](https://github.com/pronoy656/hircon-website/tree/main/src/components/features/manage/preference-tabs): management module · Address, printing, profile, roles, and users tabs · `src/components/features/manage/preference-tabs`
- [Product table](https://github.com/pronoy656/hircon-website/blob/main/src/components/features/products/ProductTable.tsx): products module · Product and packaging editing surface · `src/components/features/products/ProductTable.tsx`

### Shared UI

Reusable presentation primitives

- [UI primitives](https://github.com/pronoy656/hircon-website/tree/main/src/components/ui): design system · Buttons, inputs, selects, tables, tabs, modals, pagination · `src/components/ui`

### Shared logic

Small local data and utility helpers

- [Local data](https://github.com/pronoy656/hircon-website/tree/main/src/lib): shared data · Countries, saved quotes, and utility helpers · `src/lib`

### Styles

Global and supplemental styling

- [Global styles](https://github.com/pronoy656/hircon-website/blob/main/src/app/globals.css): styles · Base app styling and custom shapes · `src/app/globals.css`

## Connections

- App → Root layout: wraps · Root app uses the global layout shell
- App → Landing: serves · Top-level entry page
- App → Auth area: routes · Authentication flow area
- App → Dashboard shell: routes · Authenticated application area
- App → Jobs: serves · Standalone page
- App → Network: serves · Standalone page
- App → Support: serves · Standalone page
- Dashboard shell → Dashboard layout: wraps · Dashboard shell around nested pages
- Dashboard layout → Nav chrome: contains · Persistent navigation chrome in dashboard
- Dashboard shell → Shipping routes: contains · Shipping section routes
- Dashboard shell → Tracking routes: contains · Tracking section routes
- Dashboard shell → Quote routes: contains · Quote section routes
- Dashboard shell → Manage routes: contains · Management section routes
- Dashboard shell → Products routes: contains · Product management routes
- Dashboard shell → Print routes: contains · Printing routes
- Dashboard shell → Invoicing: contains · Invoice page
- Dashboard shell → Integration: contains · Integration page
- Shipping routes → Shipment forms: delegates to · Route pages mostly render feature forms
- Shipping routes → Ship manager: delegates to · Ship manager page uses management workflow
- Tracking routes → Tracking history: delegates to · Tracking pages use history/watch components
- Quote routes → Quick quote: delegates to · Quote routes render quote workflow components
- Manage routes → Contacts: delegates to · Contacts page uses table/modal workflow
- Manage routes → Preference tabs: delegates to · Preference pages use tabbed modules
- Products routes → Product table: delegates to · Product routes center on editable tables
- Shipment forms → UI primitives: uses · Forms rely on shared controls and dialogs
- Ship manager → UI primitives: uses · Uses tables, modals, and base controls
- Tracking history → UI primitives: uses · Uses filter bars, cards, modals, and tables
- Quick quote → UI primitives: uses · Uses form fields and result presentation
- Contacts → UI primitives: uses · Uses table and modal primitives
- Preference tabs → UI primitives: uses · Uses tabs and form controls
- Product table → UI primitives: uses · Uses shared CRUD UI primitives
- Root layout → Global styles: loads · Global styling applied at the app root
- Shipment forms → Local data: reads · Uses local data and helpers where needed
- Quick quote → Local data: reads · Likely uses saved quotes and utility helpers
- Tracking history → Local data: reads · May use small shared helpers/data