# dongkun8130/mohaengreact architecture

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

- Interactive diagram: https://gitdiagram.com/dongkun8130/mohaengreact
- Repository: https://github.com/dongkun8130/mohaengreact

## Overview

Mohaeng Admin is a React administration console for a travel-services platform. An administrator enters through the routed app, authenticates, and uses the protected dashboard to manage members, travel products and schedules, reservations, payments, and customer support; analytics and operational tools provide additional oversight. The sampled code shows authentication persistence and API-backed actions for accommodations, reviews, and schedules. Other listed modules are represented by their tree paths and routing, but their internal behavior and wiring were not inspected.

Main entry points: [`src/App.jsx`](https://github.com/dongkun8130/mohaengreact/blob/main/src/App.jsx) (Routes And Guards), [`src/api/api.js`](https://github.com/dongkun8130/mohaengreact/blob/main/src/api/api.js) (API Client), [`src/contexts/AuthContext.jsx`](https://github.com/dongkun8130/mohaengreact/blob/main/src/contexts/AuthContext.jsx) (Authentication), [`src/pages/products/Accommodations.jsx`](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/products/Accommodations.jsx) (Travel Products)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_platform["App Platform"]
  node_app["Routes And Guards<br/>[App.jsx]"]
  node_auth["Authentication<br/>[AuthContext.jsx]"]
  node_login["Login<br/>[Login.jsx]"]
  node_layout["Admin Layout<br/>[Layout.jsx]"]
  node_api["API Client<br/>[api.js]"]
  node_dashboard["Dashboard<br/>[Dashboard.jsx]"]
end

subgraph group_members["Member Management"]
  node_general_members["General Members<br/>[GeneralMembers.jsx]"]
  node_business_members["Business Members"]
end

subgraph group_travel["Travel Operations"]
  node_products["Travel Products<br/>[Accommodations.jsx]"]
  node_schedules["Schedules<br/>[Schedules.jsx]"]
  node_content["Travel Content<br/>[Products.jsx]"]
  node_files["File Manager<br/>[FileManager.jsx]"]
end

subgraph group_commerce["Commerce"]
  node_reservations["Reservations<br/>[Reservations.jsx]"]
  node_reviews["Product Reviews<br/>[ProductReviews.jsx]"]
  node_payments["Payments<br/>[Payments.jsx]"]
  node_settlements["Settlements<br/>[Settlements.jsx]"]
end

subgraph group_oversight["Support And Insights"]
  node_support["Customer Support<br/>[Inquiries.jsx]"]
  node_notifications["Notifications<br/>[Notifications.jsx]"]
  node_statistics["Statistics<br/>[ServiceStats.jsx]"]
end

node_admin(("Administrator"))
node_backend{{"Admin Backend"}}

node_admin -->|"opens"| node_app
node_app -->|"provides auth"| node_auth
node_app -->|"routes public"| node_login
node_app -->|"guards routes"| node_layout
node_app -->|"routes"| node_dashboard
node_app -->|"routes"| node_general_members
node_app -->|"routes"| node_business_members
node_app -->|"routes"| node_products
node_app -->|"routes"| node_schedules
node_app -->|"routes"| node_content
node_app -->|"routes"| node_files
node_app -->|"routes"| node_reservations
node_app -->|"routes"| node_reviews
node_app -->|"routes"| node_payments
node_app -->|"routes"| node_settlements
node_app -->|"routes"| node_support
node_app -->|"routes"| node_notifications
node_app -->|"routes"| node_statistics
node_admin -->|"submits credentials"| node_login
node_auth -->|"requests login"| node_api
node_auth -->|"authenticates"| node_backend
node_products -->|"loads and updates"| node_api
node_schedules -->|"deletes schedule"| node_api
node_reviews -->|"updates reviews"| node_api
node_api -->|"sends requests"| node_backend

click node_app "https://github.com/dongkun8130/mohaengreact/blob/main/src/App.jsx"
click node_auth "https://github.com/dongkun8130/mohaengreact/blob/main/src/contexts/AuthContext.jsx"
click node_login "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/auth/Login.jsx"
click node_layout "https://github.com/dongkun8130/mohaengreact/blob/main/src/components/layout/Layout.jsx"
click node_api "https://github.com/dongkun8130/mohaengreact/blob/main/src/api/api.js"
click node_dashboard "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/Dashboard.jsx"
click node_general_members "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/members/GeneralMembers.jsx"
click node_business_members "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/members/BusinessMembers.jsx"
click node_products "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/products/Accommodations.jsx"
click node_schedules "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/schedules/Schedules.jsx"
click node_content "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/contents/Products.jsx"
click node_files "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/contents/FileManager.jsx"
click node_reservations "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/products/Reservations.jsx"
click node_reviews "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/contents/ProductReviews.jsx"
click node_payments "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/transactions/Payments.jsx"
click node_settlements "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/transactions/Settlements.jsx"
click node_support "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/support/Inquiries.jsx"
click node_notifications "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/notifications/Notifications.jsx"
click node_statistics "https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/statistics/ServiceStats.jsx"

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,node_auth,node_login,node_layout,node_api,node_dashboard toneBlue
class node_general_members,node_business_members toneAmber
class node_products,node_schedules,node_content,node_files toneMint
class node_reservations,node_reviews,node_payments,node_settlements toneRose
class node_support,node_notifications,node_statistics,node_admin,node_backend toneIndigo
```

## Components

### App Platform

- [Routes And Guards](https://github.com/dongkun8130/mohaengreact/blob/main/src/App.jsx): `src/App.jsx`
- [Authentication](https://github.com/dongkun8130/mohaengreact/blob/main/src/contexts/AuthContext.jsx): `src/contexts/AuthContext.jsx`
- [Login](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/auth/Login.jsx): `src/pages/auth/Login.jsx`
- [Admin Layout](https://github.com/dongkun8130/mohaengreact/blob/main/src/components/layout/Layout.jsx): `src/components/layout/Layout.jsx`
- [API Client](https://github.com/dongkun8130/mohaengreact/blob/main/src/api/api.js): `src/api/api.js`
- [Dashboard](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/Dashboard.jsx): `src/pages/Dashboard.jsx`

### Member Management

- [General Members](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/members/GeneralMembers.jsx): `src/pages/members/GeneralMembers.jsx`
- [Business Members](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/members/BusinessMembers.jsx): `src/pages/members/BusinessMembers.jsx`

### Travel Operations

- [Travel Products](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/products/Accommodations.jsx): `src/pages/products/Accommodations.jsx`
- [Schedules](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/schedules/Schedules.jsx): `src/pages/schedules/Schedules.jsx`
- [Travel Content](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/contents/Products.jsx): `src/pages/contents/Products.jsx`
- [File Manager](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/contents/FileManager.jsx): `src/pages/contents/FileManager.jsx`

### Commerce

- [Reservations](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/products/Reservations.jsx): `src/pages/products/Reservations.jsx`
- [Product Reviews](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/contents/ProductReviews.jsx): `src/pages/contents/ProductReviews.jsx`
- [Payments](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/transactions/Payments.jsx): `src/pages/transactions/Payments.jsx`
- [Settlements](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/transactions/Settlements.jsx): `src/pages/transactions/Settlements.jsx`

### Support And Insights

- [Customer Support](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/support/Inquiries.jsx): `src/pages/support/Inquiries.jsx`
- [Notifications](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/notifications/Notifications.jsx): `src/pages/notifications/Notifications.jsx`
- [Statistics](https://github.com/dongkun8130/mohaengreact/blob/main/src/pages/statistics/ServiceStats.jsx): `src/pages/statistics/ServiceStats.jsx`

### Other components

- **Administrator**
- **Admin Backend**

## Connections

- Administrator → Routes And Guards: opens
- Routes And Guards → Authentication: provides auth
- Routes And Guards → Login: routes public
- Routes And Guards → Admin Layout: guards routes
- Routes And Guards → Dashboard: routes
- Routes And Guards → General Members: routes
- Routes And Guards → Business Members: routes
- Routes And Guards → Travel Products: routes
- Routes And Guards → Schedules: routes
- Routes And Guards → Travel Content: routes
- Routes And Guards → File Manager: routes
- Routes And Guards → Reservations: routes
- Routes And Guards → Product Reviews: routes
- Routes And Guards → Payments: routes
- Routes And Guards → Settlements: routes
- Routes And Guards → Customer Support: routes
- Routes And Guards → Notifications: routes
- Routes And Guards → Statistics: routes
- Administrator → Login: submits credentials
- Authentication → API Client: requests login
- Authentication → Admin Backend: authenticates
- Travel Products → API Client: loads and updates
- Schedules → API Client: deletes schedule
- Product Reviews → API Client: updates reviews
- API Client → Admin Backend: sends requests