# bipproduction/hipmi architecture

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

- Interactive diagram: https://gitdiagram.com/bipproduction/hipmi
- Repository: https://github.com/bipproduction/hipmi

## Overview

1. **System shape**
   - This is a **Next.js + TypeScript monorepo-style application** centered on a single web app, but organized as multiple product domains inside one codebase.
   - The product is a **multi-role platform** with user, admin, and super-admin experiences, covering auth, home, katalog/profile, donasi, event, forum, investasi, job, map, voting, collaboration, notifications, and logs.

2. **Presentation layer**
   - The primary UI lives under **`src/app`** using the Next.js App Router.
   - Route groups such as **`(auth)`**, **`(admin)`**, **`(not-user)`**, and **`dev/(user|admin)`** separate user journeys and privileged layouts.
   - Most screens are thin route entrypoints that render feature views from **`src/app_modules`**, which acts as the real presentation/component layer.

3. **Feature-module boundary**
   - The codebase is split by domain under **`src/app_modules/<domain>`**.
   - Each domain usually contains:
     - UI components
     - view/layout wrappers
     - feature-specific “fun” functions for CRUD and status transitions
     - local API client wrappers
     - state modules
     - domain interfaces/types
   - This is the main architectural boundary: **routes call feature views; views call domain functions; domain functions call API routes or server utilities**.

4. **Backend API layer**
   - Business operations are exposed through a large set of **Next.js route handlers** in **`src/app/api/**/route.ts`**.
   - The API surface is domain-aligned and includes both public and admin endpoints, for example:
     - auth: login, register, logout, validation, OTP
     - donasi/event/forum/investasi/job/vote CRUD and status flows
     - admin dashboards and moderation endpoints
     - uploads, image serving, PDF/image conversion, logs, cookies, version
   - This API layer is the bridge between browser UI and persistence.

5. **Data model and persistence**
   - The system uses **PostgreSQL** with **Prisma** as the ORM.
   - Database structure is defined in **`prisma/schema.prisma`**, with many migrations showing the schema has evolved over time.
   - **`prisma/seed.ts`** plus JSON seed data in **`src/bin/seeder`** initialize master data like status lists, categories, banks, emotions, business fields, and app metadata.
   - A **`backup.sql`** file suggests database snapshots/backups are part of operational practice.

6. **Auth, session, and access control**
   - Authentication flows are implemented in **`src/app/(auth)`** and **`src/app_modules/auth`**.
   - There are dedicated routes for login, registration, OTP validation/resend, logout, and “invalid/waiting/validasi” states.
   - Session handling and token/cookie logic live in shared libs and auth helpers.
   - **`src/middleware.ts`** and the router helpers in **`src/lib/router_*`** are important for guarding routes and steering users into the correct role-specific experience.

7. **Role-based application surfaces**
   - The app has clearly separated experiences for:
     - **regular users**: home, dashboards, creation/edit/detail flows
     - **admins**: moderation dashboards, status management, master data, user access, logs
     - **super admin / developer**: app information, user access, main dashboard, system-level admin screens
   - The `dev` route tree mirrors many production domains and suggests a **QA/staging-like UI path** for testing user/admin flows.

8. **Domain workflows and shared patterns**
   - Most business domains follow the same lifecycle pattern:
     - draft → review → publish → reject → archive/riwayat
   - This pattern appears across **donasi, event, forum, investasi, job, vote**, and is reinforced by dedicated status endpoints and admin moderation screens.
   - Each domain also has “detail”, “main”, “create”, “edit”, and “status” views, which makes the architecture highly repeatable.

9. **Media and file handling**
   - The platform stores and serves many kinds of assets: avatars, banners, posters, PDFs, dokumen, prospektus, bukti transfer, images.
   - File operations are handled through API routes like **`/api/image/upload`**, **`/api/image/delete`**, and domain-specific image/file endpoints.
   - There are helpers for upload validation, storage upload, and PDF-to-image conversion, indicating media processing is a first-class subsystem.

10. **Notifications and user alerts**
   - Notifications are a shared cross-cutting subsystem under **`src/app/api/notifikasi`**, **`src/app/api/notifications`**, and **`src/app_modules/notifikasi`**.
   - Notifications are categorized by domain: collaboration, donasi, event, forum, investasi, job, voting.
   - Admin notification helpers also perform status checks on domain objects, which means notification generation is tied to workflow transitions.

11. **External services and operational dependencies**
   - **Midtrans** integration is present for payment/transaction flows, especially in investasi and likely donasi-related payment/invoice handling.
   - There are utilities for **realtime/messaging** and a collaboration/chat subsystem, suggesting some live interaction beyond simple request/response.
   - Deployment notes in the README mention **Debian 11**, **PM2**, and a production setup around Next.js + Postgres.

12. **Global/shared infrastructure**
   - Shared libraries in **`src/lib`** centralize environment config, token handling, route maps, constants, Prisma client access, and global state.
   - Shared utilities in **`src/util`** handle backend/frontend logging and messaging clients.
   - Global UI and component libraries in **`src/app_modules/_global`** provide reusable layout templates, loading states, notifications, button/input primitives, and common formatting helpers.

13. **Logs, diagnostics, and admin observability**
   - There is a dedicated **logs** area in the app and filesystem, including frontend/backend log directories.
   - API routes for logs and log viewing indicate the admin side can inspect runtime activity directly from the app.

14. **What the architecture diagram should emphasize**
   - Put **Next.js App Router** at the center, split into **route groups** for auth/user/admin/dev.
   - Show **`src/app_modules`** as the domain UI/application logic layer beneath routes.
   - Show **`src/app/api`** as the backend boundary for all CRUD, status workflows, uploads, and admin operations.
   - Show **Prisma/Postgres** as the persistence layer.
   - Add **Midtrans**, **file/image storage**, **notifications**, and **realtime/chat** as supporting integrations that cut across multiple domains.

Main entry points: [`src/app/api`](https://github.com/bipproduction/hipmi/tree/main/src/app/api) (API routes), [`src/app`](https://github.com/bipproduction/hipmi/tree/main/src/app) (App Router), [`src/lib`](https://github.com/bipproduction/hipmi/tree/main/src/lib) (Shared libs), [`src/app/(admin)`](https://github.com/bipproduction/hipmi/tree/main/src/app/(admin)) (Admin)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_presentation["Presentation"]
  node_app_router["App Router<br/>nextjs app"]
  node_auth_routes["Auth<br/>route group"]
  node_admin_routes["Admin<br/>route group"]
  node_not_user_routes["Public views<br/>route group"]
  node_dev_routes["Dev routes<br/>route tree"]
end

subgraph group_backend["Backend API"]
  node_api_routes["API routes<br/>route handlers"]
  node_public_api["Public API<br/>domain endpoints"]
  node_admin_api["Admin API<br/>moderation endpoints"]
end

subgraph group_domains["Domain Modules"]
  node_app_modules["Feature modules<br/>domain UI"]
  node_user_domains["User domains<br/>feature set"]
  node_admin_domains["Admin domains<br/>ops modules"]
end

subgraph group_data["Data"]
  node_prisma[("Prisma schema<br/>orm schema<br/>[schema.prisma]")]
  node_seed["Seed data<br/>bootstrap data<br/>[seed.ts]"]
  node_backup["DB backup<br/>sql snapshot<br/>[backup.sql]"]
end

subgraph group_shared["Shared Infra"]
  node_shared_libs["Shared libs<br/>platform lib"]
  node_middleware["Middleware<br/>route guard<br/>[middleware.ts]"]
  node_util["Utilities<br/>logging/messaging"]
end

subgraph group_integrations["Integrations"]
  node_notifications["Notifications<br/>cross-cutting subsystem"]
  node_storage_media["Media storage<br/>file handling"]
  node_payments["Midtrans<br/>payment gateway"]
  node_realtime_chat["Realtime chat<br/>messaging subsystem"]
  node_logs[("Logs<br/>observability")]
end

node_app_router -->|"routes"| node_auth_routes
node_app_router -->|"routes"| node_admin_routes
node_app_router -->|"routes"| node_not_user_routes
node_app_router -->|"routes"| node_dev_routes
node_app_router -->|"renders"| node_app_modules
node_auth_routes -->|"uses auth module"| node_app_modules
node_admin_routes -->|"uses admin modules"| node_admin_domains
node_not_user_routes -->|"uses features"| node_user_domains
node_dev_routes -->|"mirrors"| node_user_domains
node_dev_routes -->|"mirrors"| node_admin_domains
node_app_modules -->|"calls"| node_api_routes
node_api_routes -->|"contains"| node_public_api
node_api_routes -->|"contains"| node_admin_api
node_public_api -->|"uses"| node_shared_libs
node_admin_api -->|"uses"| node_shared_libs
node_shared_libs -->|"supports"| node_middleware
node_shared_libs -->|"connects"| node_prisma
node_seed -->|"seeds"| node_prisma
node_backup -.->|"snapshot"| node_prisma
node_notifications -->|"events via api"| node_api_routes
node_notifications -->|"admin UI"| node_admin_domains
node_storage_media -->|"uploads"| node_api_routes
node_payments -->|"payment flow"| node_api_routes
node_realtime_chat -->|"chat features"| node_app_modules
node_logs -->|"viewed in admin"| node_admin_routes
node_middleware -->|"guards"| node_auth_routes
node_middleware -->|"guards"| node_admin_routes

click node_app_router "https://github.com/bipproduction/hipmi/tree/main/src/app"
click node_auth_routes "https://github.com/bipproduction/hipmi/tree/main/src/app/(auth)"
click node_admin_routes "https://github.com/bipproduction/hipmi/tree/main/src/app/(admin)"
click node_not_user_routes "https://github.com/bipproduction/hipmi/tree/main/src/app/(not-user)"
click node_dev_routes "https://github.com/bipproduction/hipmi/tree/main/src/app/dev"
click node_app_modules "https://github.com/bipproduction/hipmi/tree/main/src/app_modules"
click node_user_domains "https://github.com/bipproduction/hipmi/tree/main/src/app_modules"
click node_admin_domains "https://github.com/bipproduction/hipmi/tree/main/src/app_modules/admin"
click node_api_routes "https://github.com/bipproduction/hipmi/tree/main/src/app/api"
click node_public_api "https://github.com/bipproduction/hipmi/tree/main/src/app/api"
click node_admin_api "https://github.com/bipproduction/hipmi/tree/main/src/app/api/admin"
click node_shared_libs "https://github.com/bipproduction/hipmi/tree/main/src/lib"
click node_middleware "https://github.com/bipproduction/hipmi/blob/main/src/middleware.ts"
click node_util "https://github.com/bipproduction/hipmi/tree/main/src/util"
click node_prisma "https://github.com/bipproduction/hipmi/blob/main/prisma/schema.prisma"
click node_seed "https://github.com/bipproduction/hipmi/blob/main/prisma/seed.ts"
click node_backup "https://github.com/bipproduction/hipmi/blob/main/backup.sql"
click node_notifications "https://github.com/bipproduction/hipmi/tree/main/src/app_modules/notifikasi"
click node_storage_media "https://github.com/bipproduction/hipmi/tree/main/src/app/api/image"
click node_payments "https://github.com/bipproduction/hipmi/tree/main/src/app/api/investasi/midtrans"
click node_realtime_chat "https://github.com/bipproduction/hipmi/tree/main/src/app_modules/colab/fun/chat"
click node_logs "https://github.com/bipproduction/hipmi/tree/main/logs"

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_app_router,node_auth_routes,node_admin_routes,node_not_user_routes,node_dev_routes toneBlue
class node_api_routes,node_public_api,node_admin_api toneAmber
class node_app_modules,node_user_domains,node_admin_domains toneMint
class node_prisma,node_seed,node_backup toneRose
class node_shared_libs,node_middleware,node_util toneIndigo
class node_notifications,node_storage_media,node_payments,node_realtime_chat,node_logs toneTeal
```

## Components

### Presentation

Next.js routing and feature UI surfaces

- [App Router](https://github.com/bipproduction/hipmi/tree/main/src/app): nextjs app · Primary Next.js App Router entrypoint under src/app · `src/app`
- [Auth](https://github.com/bipproduction/hipmi/tree/main/src/app/(auth)): route group · Authentication journey with login, register, OTP, and validation states · `src/app/(auth)`
- [Admin](https://github.com/bipproduction/hipmi/tree/main/src/app/(admin)): route group · Administrative experience for moderation, dashboards, and logs · `src/app/(admin)`
- [Public views](https://github.com/bipproduction/hipmi/tree/main/src/app/(not-user)): route group · Unauthenticated or non-user entrypoints such as previews and job vacancy · `src/app/(not-user)`
- [Dev routes](https://github.com/bipproduction/hipmi/tree/main/src/app/dev): route tree · Developer and QA-facing user/admin mirrors of the production journeys · `src/app/dev`

### Backend API

Route handlers and server-side operations

- [API routes](https://github.com/bipproduction/hipmi/tree/main/src/app/api): route handlers · Next.js route handlers exposing domain CRUD, status transitions, uploads, and admin operations · `src/app/api`
- [Public API](https://github.com/bipproduction/hipmi/tree/main/src/app/api): domain endpoints · Browser-facing APIs for auth, content, uploads, notifications, and user flows · `src/app/api`
- [Admin API](https://github.com/bipproduction/hipmi/tree/main/src/app/api/admin): moderation endpoints · Administrative APIs for dashboards, moderation, counts, and master data · `src/app/api/admin`

### Domain Modules

Feature modules organized by business domain

- [Feature modules](https://github.com/bipproduction/hipmi/tree/main/src/app_modules): domain UI · Primary presentation and application-logic layer organized by domain · `src/app_modules`
- [User domains](https://github.com/bipproduction/hipmi/tree/main/src/app_modules): feature set · User-facing product domains such as home, katalog, profile, donasi, event, forum, investasi, job, map, voting, collaboration, and notifications · `src/app_modules`
- [Admin domains](https://github.com/bipproduction/hipmi/tree/main/src/app_modules/admin): ops modules · Admin-specific modules for moderation, dashboards, app information, user access, logs, and notifications · `src/app_modules/admin`

### Data

Database schema, seeds, and backups

- [Prisma schema](https://github.com/bipproduction/hipmi/blob/main/prisma/schema.prisma): orm schema · Database schema and migration history for PostgreSQL persistence · `prisma/schema.prisma`
- [Seed data](https://github.com/bipproduction/hipmi/blob/main/prisma/seed.ts): bootstrap data · Prisma seed and JSON master data for app defaults and lookup tables · `prisma/seed.ts`
- [DB backup](https://github.com/bipproduction/hipmi/blob/main/backup.sql): sql snapshot · Operational database snapshot/backups · `backup.sql`

### Shared Infra

Cross-cutting libraries, middleware, and utilities

- [Shared libs](https://github.com/bipproduction/hipmi/tree/main/src/lib): platform lib · Environment, routing, token, prisma, route maps, and other shared server/browser helpers · `src/lib`
- [Middleware](https://github.com/bipproduction/hipmi/blob/main/src/middleware.ts): route guard · Request-time access control and role steering · `src/middleware.ts`
- [Utilities](https://github.com/bipproduction/hipmi/tree/main/src/util): logging/messaging · Frontend and backend logging plus realtime/messaging utilities · `src/util`

### Integrations

External services and platform-wide subsystems

- [Notifications](https://github.com/bipproduction/hipmi/tree/main/src/app_modules/notifikasi): cross-cutting subsystem · App-wide notification generation, routing, counting, and per-domain categories · `src/app_modules/notifikasi`
- [Media storage](https://github.com/bipproduction/hipmi/tree/main/src/app/api/image): file handling · Image upload/delete, PDF conversion, and domain asset serving · `src/app/api/image`
- [Midtrans](https://github.com/bipproduction/hipmi/tree/main/src/app/api/investasi/midtrans): payment gateway · Transaction and invoice integration for monetized flows · `src/app/api/investasi/midtrans`
- [Realtime chat](https://github.com/bipproduction/hipmi/tree/main/src/app_modules/colab/fun/chat): messaging subsystem · Live collaboration and messaging support for collaboration workflows · `src/app_modules/colab/fun/chat`
- [Logs](https://github.com/bipproduction/hipmi/tree/main/logs): observability · Dedicated log storage and viewer surface for runtime diagnostics · `logs`

## Connections

- App Router → Auth: routes · App Router mounts auth journey
- App Router → Admin: routes · App Router mounts admin journey
- App Router → Public views: routes · App Router mounts public entrypoints
- App Router → Dev routes: routes · App Router mounts development mirrors
- App Router → Feature modules: renders · Route entrypoints mostly render feature views
- Auth → Feature modules: uses auth module · Auth pages delegate to auth feature views
- Admin → Admin domains: uses admin modules · Admin pages render admin feature surfaces
- Public views → User domains: uses features · Public pages render domain feature views
- Dev routes → User domains: mirrors · Developer user routes mirror production domains
- Dev routes → Admin domains: mirrors · Developer admin routes mirror production admin domains
- Feature modules → API routes: calls · Feature modules call route handlers for data operations
- API routes → Public API: contains · Public and user-facing endpoints live here
- API routes → Admin API: contains · Admin and moderation endpoints live here
- Public API → Shared libs: uses · Handlers rely on shared route, token, and Prisma helpers
- Admin API → Shared libs: uses · Admin handlers rely on shared route, token, and Prisma helpers
- Shared libs → Middleware: supports · Shared router helpers and middleware cooperate on access control
- Shared libs → Prisma schema: connects · Prisma client and server utilities back the data layer
- Seed data → Prisma schema: seeds · Seed scripts initialize schema-backed master data
- DB backup → Prisma schema: snapshot · Backup reflects persisted database state
- Notifications → API routes: events via api · Notification creation and checks are triggered through APIs and status transitions
- Notifications → Admin domains: admin UI · Admin notification screens and helpers are central to moderation workflows
- Media storage → API routes: uploads · Upload and conversion endpoints support domain assets
- Midtrans → API routes: payment flow · Payment gateway backs invoice and transaction routes
- Realtime chat → Feature modules: chat features · Collaboration module contains realtime messaging helpers
- Logs → Admin: viewed in admin · Logs are surfaced through the admin experience
- Middleware → Auth: guards · Middleware helps steer authentication and access control
- Middleware → Admin: guards · Middleware protects role-specific admin surfaces