# mergen601/depo-teklif-program- architecture

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

- Interactive diagram: https://gitdiagram.com/mergen601/depo-teklif-program-
- Repository: https://github.com/mergen601/depo-teklif-program-

## Overview

This is a React app for estimating modular water-tank costs and preparing commercial proposals. Users configure tank dimensions, type, quantities, material and labor costs, then request a calculation; the app sends structured inputs to Gemini and displays the returned cost breakdown and, when proposal parameters are supplied, a quote. The main UI, calculation request, and proposal presentation are concentrated in App.tsx. The graph follows the shown imports and calls; unsampled UI details are not separated into speculative subsystems.

Main entry points: [`App.tsx`](https://github.com/mergen601/depo-teklif-program-/blob/main/App.tsx) (Calculator UI), [`geminiService.ts`](https://github.com/mergen601/depo-teklif-program-/blob/main/geminiService.ts) (Calculation service), [`constants.ts`](https://github.com/mergen601/depo-teklif-program-/blob/main/constants.ts) (Rules and constants), [`types.ts`](https://github.com/mergen601/depo-teklif-program-/blob/main/types.ts) (Calculation contracts)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_experience["User experience"]
  node_app["Calculator UI<br/>[App.tsx]"]
  node_input["Numeric inputs<br/>[InputGroup.tsx]"]
  node_quote["Quote presentation<br/>[App.tsx]"]
end

subgraph group_calculation["Cost calculation"]
  node_service["Calculation service<br/>[geminiService.ts]"]
  node_gemini{{"Gemini API"}}
end

subgraph group_domain["Shared domain"]
  node_constants["Rules and constants<br/>[constants.ts]"]
  node_types["Calculation contracts<br/>[types.ts]"]
end

node_user(("Estimator"))

node_user -->|"configures"| node_app
node_app -->|"renders"| node_input
node_app -->|"requests calculation"| node_service
node_service -->|"sends inputs"| node_gemini
node_service -->|"uses instructions"| node_constants
node_app -->|"uses module size"| node_constants
node_app -->|"uses input and result types"| node_types
node_service -->|"uses input and result types"| node_types
node_service -->|"returns result"| node_app

click node_app "https://github.com/mergen601/depo-teklif-program-/blob/main/App.tsx"
click node_input "https://github.com/mergen601/depo-teklif-program-/blob/main/components/InputGroup.tsx"
click node_quote "https://github.com/mergen601/depo-teklif-program-/blob/main/App.tsx"
click node_service "https://github.com/mergen601/depo-teklif-program-/blob/main/geminiService.ts"
click node_constants "https://github.com/mergen601/depo-teklif-program-/blob/main/constants.ts"
click node_types "https://github.com/mergen601/depo-teklif-program-/blob/main/types.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_app,node_input,node_quote toneBlue
class node_service,node_gemini toneAmber
class node_constants,node_types toneMint
class node_user toneIndigo
```

## Components

### User experience

- [Calculator UI](https://github.com/mergen601/depo-teklif-program-/blob/main/App.tsx): `App.tsx`
- [Numeric inputs](https://github.com/mergen601/depo-teklif-program-/blob/main/components/InputGroup.tsx): `components/InputGroup.tsx`
- [Quote presentation](https://github.com/mergen601/depo-teklif-program-/blob/main/App.tsx): `App.tsx`

### Cost calculation

- [Calculation service](https://github.com/mergen601/depo-teklif-program-/blob/main/geminiService.ts): `geminiService.ts`
- **Gemini API**

### Shared domain

- [Rules and constants](https://github.com/mergen601/depo-teklif-program-/blob/main/constants.ts): `constants.ts`
- [Calculation contracts](https://github.com/mergen601/depo-teklif-program-/blob/main/types.ts): `types.ts`

### Other components

- **Estimator**

## Connections

- Estimator → Calculator UI: configures (evidence: `App.tsx`)
- Calculator UI → Numeric inputs: renders (evidence: `App.tsx`)
- Calculator UI → Calculation service: requests calculation (evidence: `App.tsx`)
- Calculation service → Gemini API: sends inputs (evidence: `geminiService.ts`)
- Calculation service → Rules and constants: uses instructions (evidence: `geminiService.ts`)
- Calculator UI → Rules and constants: uses module size (evidence: `App.tsx`)
- Calculator UI → Calculation contracts: uses input and result types (evidence: `App.tsx`)
- Calculation service → Calculation contracts: uses input and result types (evidence: `geminiService.ts`)
- Calculation service → Calculator UI: returns result (evidence: `App.tsx`)