# sanobarsyed/token-counter architecture

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

- Interactive diagram: https://gitdiagram.com/sanobarsyed/token-counter
- Repository: https://github.com/sanobarsyed/token-counter

## Overview

This Streamlit app takes a system prompt, conversation history, and new message, then runs token counting and system-prompt compression when the user clicks “Count + Compress.” It reports per-input and total token usage, context-window percentage, and the compressed prompt’s token savings. The single sampled source file owns the UI, tokenization, Groq request, and comparison; the graph separates these responsibilities without implying they are separate modules. The README documents the model used, which the source confirms in the API request. No distinct persistent store is evident.

Main entry points: [`app.py`](https://github.com/sanobarsyed/token-counter/blob/main/app.py) (Streamlit UI)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_workflow["App workflow"]
  node_ui["Streamlit UI<br/>[app.py]"]
  node_token_count["Token counting<br/>[app.py]"]
  node_compression["Prompt compression<br/>[app.py]"]
  node_comparison["Token comparison<br/>[app.py]"]
end

subgraph group_integration["LLM integration"]
  node_groq["Groq API"]
end

node_user(("User"))

node_user -->|"enters prompts"| node_ui
node_user -->|"clicks to run"| node_ui
node_ui -->|"counts inputs"| node_token_count
node_ui -->|"requests compression"| node_compression
node_compression -->|"sends prompt"| node_groq
node_groq -->|"returns completion"| node_compression
node_ui -->|"provides counts"| node_comparison
node_compression -->|"provides compressed text"| node_comparison
node_token_count -->|"provides token counts"| node_comparison
node_comparison -->|"displays savings"| node_ui

click node_ui "https://github.com/sanobarsyed/token-counter/blob/main/app.py"
click node_token_count "https://github.com/sanobarsyed/token-counter/blob/main/app.py"
click node_compression "https://github.com/sanobarsyed/token-counter/blob/main/app.py"
click node_comparison "https://github.com/sanobarsyed/token-counter/blob/main/app.py"

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_ui,node_token_count,node_compression,node_comparison,node_user toneBlue
class node_groq toneAmber
```

## Components

### App workflow

- [Streamlit UI](https://github.com/sanobarsyed/token-counter/blob/main/app.py): `app.py`
- [Token counting](https://github.com/sanobarsyed/token-counter/blob/main/app.py): `app.py`
- [Prompt compression](https://github.com/sanobarsyed/token-counter/blob/main/app.py): `app.py`
- [Token comparison](https://github.com/sanobarsyed/token-counter/blob/main/app.py): `app.py`

### LLM integration

- **Groq API**

### Other components

- **User**

## Connections

- User → Streamlit UI: enters prompts
- User → Streamlit UI: clicks to run
- Streamlit UI → Token counting: counts inputs
- Streamlit UI → Prompt compression: requests compression
- Prompt compression → Groq API: sends prompt
- Groq API → Prompt compression: returns completion
- Streamlit UI → Token comparison: provides counts
- Prompt compression → Token comparison: provides compressed text
- Token counting → Token comparison: provides token counts
- Token comparison → Streamlit UI: displays savings