# tuan03/ffp_tool architecture

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

- Interactive diagram: https://gitdiagram.com/tuan03/ffp_tool
- Repository: https://github.com/tuan03/ffp_tool

## Overview

FFP Tool is a React single-page app that demonstrates a modular business workflow. The user starts the sample workflow on the home page; the app selects real or mock module runners, then the orchestrator runs Module A before running Modules B and C concurrently and returns their outputs for display. The README also documents routing, environment-based mock mode, and module contracts. Service behavior is sampled; mock selection and several routing details are documented but their implementation was not sampled.

Main entry points: [`src/app/runtime/workflow.ts`](https://github.com/tuan03/ffp_tool/blob/main/src/app/runtime/workflow.ts) (Workflow wiring), [`src/modules/orchestrator/service.ts`](https://github.com/tuan03/ffp_tool/blob/main/src/modules/orchestrator/service.ts) (Workflow orchestrator), [`src/pages/home/HomePage.tsx`](https://github.com/tuan03/ffp_tool/blob/main/src/pages/home/HomePage.tsx) (Home page), [`src/app/App.tsx`](https://github.com/tuan03/ffp_tool/blob/main/src/app/App.tsx) (App composition)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["Application"]
  node_entry["Application entry<br/>[main.tsx]"]
  node_app["App composition<br/>[App.tsx]"]
  node_routes["Routes<br/>[AppRoutes.tsx]"]
  node_layout["App layout<br/>[AppLayout.tsx]"]
  node_home["Home page<br/>[HomePage.tsx]"]
  node_environment["Environment config<br/>[environment.ts]"]
end

subgraph group_workflow["Workflow"]
  node_runtime["Workflow wiring<br/>[workflow.ts]"]
  node_orchestrator["Workflow orchestrator<br/>[service.ts]"]
end

subgraph group_modules["Business modules"]
  node_modulea["Module A<br/>[service.ts]"]
  node_runtimea["Module A runner<br/>[runtime.ts]"]
  node_mocka["Module A mock<br/>[runner.ts]"]
  node_moduleb["Module B<br/>[service.ts]"]
  node_runtimeb["Module B runner<br/>[runtime.ts]"]
  node_mockb["Module B mock<br/>[runner.ts]"]
  node_modulec["Module C<br/>[service.ts]"]
  node_runtimec["Module C runner<br/>[runtime.ts]"]
  node_mockc["Module C mock<br/>[runner.ts]"]
end

subgraph group_shared["Shared contracts"]
  node_errors["App errors<br/>[app-error.ts]"]
end

node_user(("User"))

node_user -->|"starts workflow"| node_home
node_entry -->|"renders"| node_app
node_app -->|"renders"| node_routes
node_app -->|"provides runner"| node_runtime
node_routes -->|"uses layout"| node_layout
node_routes -->|"renders"| node_home
node_layout -->|"reads environment"| node_environment
node_home -->|"runs workflow"| node_runtime
node_runtime -->|"reads environment"| node_environment
node_runtime -->|"selects runner"| node_runtimea
node_runtime -->|"selects runner"| node_runtimeb
node_runtime -->|"selects runner"| node_runtimec
node_runtime -->|"creates runner"| node_orchestrator
node_runtimea -->|"selects real runner"| node_modulea
node_runtimea -.->|"selects mock runner"| node_mocka
node_runtimeb -->|"selects real runner"| node_moduleb
node_runtimeb -.->|"selects mock runner"| node_mockb
node_runtimec -->|"selects real runner"| node_modulec
node_runtimec -.->|"selects mock runner"| node_mockc
node_orchestrator -->|"runs first"| node_modulea
node_orchestrator -->|"runs concurrently"| node_moduleb
node_orchestrator -->|"runs concurrently"| node_modulec
node_orchestrator -->|"wraps failures"| node_errors
node_orchestrator -->|"returns outputs"| node_runtime
node_runtime -->|"returns result"| node_home

click node_entry "https://github.com/tuan03/ffp_tool/blob/main/src/main.tsx"
click node_app "https://github.com/tuan03/ffp_tool/blob/main/src/app/App.tsx"
click node_routes "https://github.com/tuan03/ffp_tool/blob/main/src/app/routes/AppRoutes.tsx"
click node_layout "https://github.com/tuan03/ffp_tool/blob/main/src/layouts/AppLayout.tsx"
click node_home "https://github.com/tuan03/ffp_tool/blob/main/src/pages/home/HomePage.tsx"
click node_environment "https://github.com/tuan03/ffp_tool/blob/main/src/config/environment.ts"
click node_runtime "https://github.com/tuan03/ffp_tool/blob/main/src/app/runtime/workflow.ts"
click node_orchestrator "https://github.com/tuan03/ffp_tool/blob/main/src/modules/orchestrator/service.ts"
click node_modulea "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-a/service.ts"
click node_runtimea "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-a/runtime.ts"
click node_mocka "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-a/mocks/runner.ts"
click node_moduleb "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-b/service.ts"
click node_runtimeb "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-b/runtime.ts"
click node_mockb "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-b/mocks/runner.ts"
click node_modulec "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-c/service.ts"
click node_runtimec "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-c/runtime.ts"
click node_mockc "https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-c/mocks/runner.ts"
click node_errors "https://github.com/tuan03/ffp_tool/blob/main/src/shared/errors/app-error.ts"

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_entry,node_app,node_routes,node_layout,node_home,node_environment,node_user toneBlue
class node_runtime,node_orchestrator toneAmber
class node_modulea,node_runtimea,node_mocka,node_moduleb,node_runtimeb,node_mockb,node_modulec,node_runtimec,node_mockc toneMint
class node_errors toneRose
```

## Components

### Application

- [Application entry](https://github.com/tuan03/ffp_tool/blob/main/src/main.tsx): `src/main.tsx`
- [App composition](https://github.com/tuan03/ffp_tool/blob/main/src/app/App.tsx): `src/app/App.tsx`
- [Routes](https://github.com/tuan03/ffp_tool/blob/main/src/app/routes/AppRoutes.tsx): `src/app/routes/AppRoutes.tsx`
- [App layout](https://github.com/tuan03/ffp_tool/blob/main/src/layouts/AppLayout.tsx): `src/layouts/AppLayout.tsx`
- [Home page](https://github.com/tuan03/ffp_tool/blob/main/src/pages/home/HomePage.tsx): `src/pages/home/HomePage.tsx`
- [Environment config](https://github.com/tuan03/ffp_tool/blob/main/src/config/environment.ts): `src/config/environment.ts`

### Workflow

- [Workflow wiring](https://github.com/tuan03/ffp_tool/blob/main/src/app/runtime/workflow.ts): `src/app/runtime/workflow.ts`
- [Workflow orchestrator](https://github.com/tuan03/ffp_tool/blob/main/src/modules/orchestrator/service.ts): `src/modules/orchestrator/service.ts`

### Business modules

- [Module A](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-a/service.ts): `src/modules/module-a/service.ts`
- [Module A runner](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-a/runtime.ts): `src/modules/module-a/runtime.ts`
- [Module A mock](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-a/mocks/runner.ts): `src/modules/module-a/mocks/runner.ts`
- [Module B](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-b/service.ts): `src/modules/module-b/service.ts`
- [Module B runner](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-b/runtime.ts): `src/modules/module-b/runtime.ts`
- [Module B mock](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-b/mocks/runner.ts): `src/modules/module-b/mocks/runner.ts`
- [Module C](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-c/service.ts): `src/modules/module-c/service.ts`
- [Module C runner](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-c/runtime.ts): `src/modules/module-c/runtime.ts`
- [Module C mock](https://github.com/tuan03/ffp_tool/blob/main/src/modules/module-c/mocks/runner.ts): `src/modules/module-c/mocks/runner.ts`

### Shared contracts

- [App errors](https://github.com/tuan03/ffp_tool/blob/main/src/shared/errors/app-error.ts): `src/shared/errors/app-error.ts`

### Other components

- **User**

## Connections

- User → Home page: starts workflow
- Application entry → App composition: renders
- App composition → Routes: renders
- App composition → Workflow wiring: provides runner
- Routes → App layout: uses layout
- Routes → Home page: renders
- App layout → Environment config: reads environment
- Home page → Workflow wiring: runs workflow
- Workflow wiring → Environment config: reads environment
- Workflow wiring → Module A runner: selects runner
- Workflow wiring → Module B runner: selects runner
- Workflow wiring → Module C runner: selects runner
- Workflow wiring → Workflow orchestrator: creates runner
- Module A runner → Module A: selects real runner
- Module A runner → Module A mock: selects mock runner
- Module B runner → Module B: selects real runner
- Module B runner → Module B mock: selects mock runner
- Module C runner → Module C: selects real runner
- Module C runner → Module C mock: selects mock runner
- Workflow orchestrator → Module A: runs first
- Workflow orchestrator → Module B: runs concurrently
- Workflow orchestrator → Module C: runs concurrently
- Workflow orchestrator → App errors: wraps failures
- Workflow orchestrator → Workflow wiring: returns outputs
- Workflow wiring → Home page: returns result