# azthanif/foldertani architecture

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

- Interactive diagram: https://gitdiagram.com/azthanif/foldertani
- Repository: https://github.com/azthanif/foldertani

## Overview

Temu Tani is a browser-based agricultural marketplace prototype. Its main workflow runs from a buyer’s request and first offer, through farmer negotiation and agreement, to transfer claims and farmer confirmation; it simulates rather than verifies payment. Farmer and buyer dashboards share browser localStorage, while farmer-only simulated price guidance is a separate capability. The sampled app.js excerpt shows form handling and dashboard initialization, but not all wiring; documented links use README evidence, and uncertain page-to-code links are omitted.

Main entry points: [`dashboard/tengkulak.html`](https://github.com/azthanif/foldertani/blob/main/dashboard/tengkulak.html) (Buyer dashboard), [`dashboard/petani.html`](https://github.com/azthanif/foldertani/blob/main/dashboard/petani.html) (Farmer dashboard), [`app.js`](https://github.com/azthanif/foldertani/blob/main/app.js) (Offers), [`dashboard/admin.html`](https://github.com/azthanif/foldertani/blob/main/dashboard/admin.html) (Admin comparison pages)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["Demo entry"]
  node_role_picker["Role selection<br/>[index.html]"]
  node_farmer_ui["Farmer dashboard<br/>[petani.html]"]
  node_buyer_ui["Buyer dashboard<br/>[tengkulak.html]"]
end

subgraph group_market["Marketplace workflow"]
  node_market_logic["Marketplace actions<br/>[app.js]"]
  node_requests["Buyer requests<br/>[app.js]"]
  node_stock["Grain listings<br/>[app.js]"]
  node_offers["Offers<br/>[app.js]"]
  node_negotiation["Negotiation<br/>[app.js]"]
  node_transactions["Agreed transactions<br/>[app.js]"]
  node_shared_state[("Shared browser state")]
end

subgraph group_support["Supporting features"]
  node_price_guidance["Farmer price guidance<br/>[app.js]"]
  node_admin_panel["Admin comparison pages<br/>[admin.html]"]
  node_news_page["News page<br/>[berita.html]"]
  node_price_page["Price page<br/>[harga.html]"]
  node_styles["Dashboard styling<br/>[styles.css]"]
end

subgraph group_chat["Chatbot simulation"]
  node_chatbot["WhatsApp chatbot demo<br/>[chatbot.html]"]
end

node_visitor(("Demo user"))

node_visitor -->|"chooses role"| node_role_picker
node_visitor -->|"uses"| node_farmer_ui
node_visitor -->|"uses"| node_buyer_ui
node_buyer_ui -->|"creates"| node_requests
node_buyer_ui -->|"browses"| node_stock
node_buyer_ui -->|"submits"| node_offers
node_farmer_ui -->|"responds to"| node_offers
node_offers -->|"enters"| node_negotiation
node_buyer_ui -->|"counters"| node_negotiation
node_negotiation -->|"creates agreement"| node_transactions
node_farmer_ui -->|"confirms funds"| node_transactions
node_buyer_ui -->|"reports transfer"| node_transactions
node_farmer_ui -->|"manages own"| node_stock
node_market_logic -->|"persists"| node_shared_state
node_farmer_ui -->|"views"| node_price_guidance
node_visitor -->|"tries demo"| node_chatbot
node_admin_panel -.->|"includes"| node_news_page
node_admin_panel -.->|"includes"| node_price_page
node_farmer_ui -.->|"styled by"| node_styles
node_buyer_ui -.->|"styled by"| node_styles

click node_role_picker "https://github.com/azthanif/foldertani/blob/main/index.html"
click node_farmer_ui "https://github.com/azthanif/foldertani/blob/main/dashboard/petani.html"
click node_buyer_ui "https://github.com/azthanif/foldertani/blob/main/dashboard/tengkulak.html"
click node_market_logic "https://github.com/azthanif/foldertani/blob/main/app.js"
click node_requests "https://github.com/azthanif/foldertani/blob/main/app.js"
click node_stock "https://github.com/azthanif/foldertani/blob/main/app.js"
click node_offers "https://github.com/azthanif/foldertani/blob/main/app.js"
click node_negotiation "https://github.com/azthanif/foldertani/blob/main/app.js"
click node_transactions "https://github.com/azthanif/foldertani/blob/main/app.js"
click node_price_guidance "https://github.com/azthanif/foldertani/blob/main/app.js"
click node_admin_panel "https://github.com/azthanif/foldertani/blob/main/dashboard/admin.html"
click node_news_page "https://github.com/azthanif/foldertani/blob/main/dashboard/berita.html"
click node_price_page "https://github.com/azthanif/foldertani/blob/main/dashboard/harga.html"
click node_styles "https://github.com/azthanif/foldertani/blob/main/assets/styles.css"
click node_chatbot "https://github.com/azthanif/foldertani/blob/main/Chatbot/chatbot.html"

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_role_picker,node_farmer_ui,node_buyer_ui,node_visitor toneBlue
class node_market_logic,node_requests,node_stock,node_offers,node_negotiation,node_transactions,node_shared_state toneAmber
class node_price_guidance,node_admin_panel,node_news_page,node_price_page,node_styles toneMint
class node_chatbot toneRose
```

## Components

### Demo entry

- [Role selection](https://github.com/azthanif/foldertani/blob/main/index.html): `index.html`
- [Farmer dashboard](https://github.com/azthanif/foldertani/blob/main/dashboard/petani.html): `dashboard/petani.html`
- [Buyer dashboard](https://github.com/azthanif/foldertani/blob/main/dashboard/tengkulak.html): `dashboard/tengkulak.html`

### Marketplace workflow

- [Marketplace actions](https://github.com/azthanif/foldertani/blob/main/app.js): `app.js`
- [Buyer requests](https://github.com/azthanif/foldertani/blob/main/app.js): `app.js`
- [Grain listings](https://github.com/azthanif/foldertani/blob/main/app.js): `app.js`
- [Offers](https://github.com/azthanif/foldertani/blob/main/app.js): `app.js`
- [Negotiation](https://github.com/azthanif/foldertani/blob/main/app.js): `app.js`
- [Agreed transactions](https://github.com/azthanif/foldertani/blob/main/app.js): `app.js`
- **Shared browser state**

### Supporting features

- [Farmer price guidance](https://github.com/azthanif/foldertani/blob/main/app.js): `app.js`
- [Admin comparison pages](https://github.com/azthanif/foldertani/blob/main/dashboard/admin.html): `dashboard/admin.html`
- [News page](https://github.com/azthanif/foldertani/blob/main/dashboard/berita.html): `dashboard/berita.html`
- [Price page](https://github.com/azthanif/foldertani/blob/main/dashboard/harga.html): `dashboard/harga.html`
- [Dashboard styling](https://github.com/azthanif/foldertani/blob/main/assets/styles.css): `assets/styles.css`

### Chatbot simulation

- [WhatsApp chatbot demo](https://github.com/azthanif/foldertani/blob/main/Chatbot/chatbot.html): `Chatbot/chatbot.html`

### Other components

- **Demo user**

## Connections

- Demo user → Role selection: chooses role (evidence: `README.md`)
- Demo user → Farmer dashboard: uses (evidence: `README.md`)
- Demo user → Buyer dashboard: uses (evidence: `README.md`)
- Buyer dashboard → Buyer requests: creates (evidence: `README.md`)
- Buyer dashboard → Grain listings: browses (evidence: `README.md`)
- Buyer dashboard → Offers: submits (evidence: `README.md`)
- Farmer dashboard → Offers: responds to (evidence: `README.md`)
- Offers → Negotiation: enters (evidence: `README.md`)
- Buyer dashboard → Negotiation: counters (evidence: `README.md`)
- Negotiation → Agreed transactions: creates agreement (evidence: `README.md`)
- Farmer dashboard → Agreed transactions: confirms funds (evidence: `README.md`)
- Buyer dashboard → Agreed transactions: reports transfer (evidence: `README.md`)
- Farmer dashboard → Grain listings: manages own (evidence: `README.md`)
- Marketplace actions → Shared browser state: persists (evidence: `README.md`)
- Farmer dashboard → Farmer price guidance: views (evidence: `README.md`)
- Demo user → WhatsApp chatbot demo: tries demo (evidence: `README.md`)
- Admin comparison pages → News page: includes
- Admin comparison pages → Price page: includes
- Farmer dashboard → Dashboard styling: styled by
- Buyer dashboard → Dashboard styling: styled by