style: enhance README diagrams with improved subgraph labels and node styling for clarity

This commit is contained in:
Firman Ramdhani
2026-05-28 12:33:40 +07:00
parent c510feadbb
commit b4af762baa
4 changed files with 96 additions and 26 deletions
+38 -12
View File
@@ -40,8 +40,21 @@ graph TD
FACTORY -.->|reports via| FARO
FACTORY -.->|throws| API_ERR
style Core fill:#f8f9fa,stroke:#ced4da
style Apps fill:#e9ecef,stroke:#adb5bd
%% Styling Subgraphs (Backgrounds)
style Apps fill:#e7f5ff,stroke:#74c0fc,stroke-width:2px,color:#1864ab
style Core fill:#f8f9fa,stroke:#ced4da,stroke-width:2px,color:#495057
%% Styling Nodes (Apps - Blue)
style WEB fill:#339af0,stroke:#1864ab,color:#fff
style LAND fill:#339af0,stroke:#1864ab,color:#fff
style DESK fill:#339af0,stroke:#1864ab,color:#fff
%% Styling Nodes (Core Modules)
style FACTORY fill:#845ef7,stroke:#5f3dc4,color:#fff
style FARO fill:#fd7e14,stroke:#d9480f,color:#fff
style BASE fill:#20c997,stroke:#089981,color:#fff
style COMMON fill:#20c997,stroke:#089981,color:#fff
style API_ERR fill:#fa5252,stroke:#c92a2a,color:#fff
```
### Data Flow Lifecycle
@@ -50,12 +63,25 @@ Every HTTP request flows through this precise interceptor pipeline:
```mermaid
sequenceDiagram
participant C as UI Component
participant S as Data Service
participant H as HTTP Client
participant F as Faro Adapter
participant A as App Hooks (IoC)
participant N as Network
autonumber
box #e7f5ff App Layer (Consumers)
participant C as UI Component
end
box #f8f9fa Core Engine (@repo/core-api)
participant S as Data Service
participant H as HTTP Client
participant F as Faro Adapter
end
box #e7f5ff App Logic (IoC)
participant A as App Hooks
end
box #fff5f5 External
participant N as Network
end
C->>S: getMany()
S->>H: request()
@@ -63,13 +89,13 @@ sequenceDiagram
H->>A: hooks.onRequest() (Inject Token)
A->>N: fetch/XHR
alt Success
N-->>A: 200 OK
alt Success (2xx)
N-->>A: return Response
A->>F: onRequestEnd() (Close Span)
F->>A: hooks.onResponse()
A-->>S: return data
else Error
N-->>A: 401 / 500
else Error (4xx / 5xx)
N-->>A: return Rejection
A->>F: onRequestError() (Log Error)
F->>A: hooks.onResponseError() (Redirect/Refresh)
A-->>S: throw ApiError