# mujahidinnn/mojepict architecture

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

- Interactive diagram: https://gitdiagram.com/mujahidinnn/mojepict
- Repository: https://github.com/mujahidinnn/mojepict

## Overview

Mojepict is a free, bilingual web toolbox: users discover a tool, provide inputs, process them mostly in-browser, and view or export results. Its tools span image, PDF, text, color, developer, conversion, and calculator workflows; some also support diagrams, schedules, audio, and other creative tasks. The shared tool interface and catalog support these distinct tools, while two image tools can optionally use server-side third-party APIs. The tree and excerpts support the product boundaries, but not every tool’s internal wiring, so uncertain links are omitted.

Main entry points: [`app/(tools)`](https://github.com/mujahidinnn/mojepict/tree/main/app/(tools)) (Tool pages), [`app/page.tsx`](https://github.com/mujahidinnn/mojepict/blob/main/app/page.tsx) (Tool homepage), [`app/api/compress/route.ts`](https://github.com/mujahidinnn/mojepict/blob/main/app/api/compress/route.ts) (Compression API), [`app/api/remove-bg/route.ts`](https://github.com/mujahidinnn/mojepict/blob/main/app/api/remove-bg/route.ts) (Background API)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_discovery["Discovery and navigation"]
  node_homepage["Tool homepage<br/>[page.tsx]"]
  node_navigation["Navigation and search<br/>[CommandPalette.tsx]"]
  node_catalog["Tool catalog<br/>[tools.ts]"]
end

subgraph group_tooling["Tool experiences"]
  node_tool_routes["Tool pages"]
  node_tool_modes["Tool implementations"]
  node_pdf_editor["PDF editor<br/>[pdf-editor.tsx]"]
  node_photobooth["Web photobooth<br/>[page.tsx]"]
  node_schedule["Schedule maker<br/>[page.tsx]"]
end

subgraph group_image_processing["Image processing"]
  node_image_tools["Image tools"]
  node_image_compressor["Image compressor"]
  node_background_removal["Background removal<br/>[page.tsx]"]
  node_compress_api["Compression API<br/>[route.ts]"]
  node_remove_bg_api["Background API<br/>[route.ts]"]
end

subgraph group_platform["Shared platform"]
  node_shared_tool_ui["Tool interface<br/>[ToolShell.tsx]"]
  node_key_rotation["API key rotation<br/>[api-key-pool.ts]"]
  node_i18n["English and Indonesian<br/>[context.tsx]"]
  node_export["Image and PDF export<br/>[export-node.ts]"]
end

node_visitor(("Visitor"))
node_tinify{{"Tinify service"}}
node_remove_bg_service{{"remove.bg service"}}
node_browser{{"Browser"}}

node_visitor -->|"opens"| node_homepage
node_homepage -->|"reads tools"| node_catalog
node_homepage -->|"opens search"| node_navigation
node_visitor -->|"selects tool"| node_tool_routes
node_tool_routes -->|"uses interface"| node_shared_tool_ui
node_tool_routes -->|"hosts tools"| node_tool_modes
node_tool_routes -->|"lists tools"| node_catalog
node_pdf_editor -->|"uses interface"| node_shared_tool_ui
node_photobooth -->|"uses interface"| node_shared_tool_ui
node_schedule -->|"exports output"| node_export
node_schedule -->|"downloads file"| node_browser
node_image_tools -->|"processes locally"| node_browser
node_image_compressor -.->|"requests enhancement"| node_compress_api
node_background_removal -.->|"requests enhancement"| node_remove_bg_api
node_compress_api -->|"rotates keys"| node_key_rotation
node_remove_bg_api -->|"rotates keys"| node_key_rotation
node_compress_api -.->|"compresses image"| node_tinify
node_remove_bg_api -.->|"removes background"| node_remove_bg_service
node_tool_routes -->|"uses translations"| node_i18n

click node_homepage "https://github.com/mujahidinnn/mojepict/blob/main/app/page.tsx"
click node_navigation "https://github.com/mujahidinnn/mojepict/blob/main/components/layout/CommandPalette.tsx"
click node_catalog "https://github.com/mujahidinnn/mojepict/blob/main/lib/tools.ts"
click node_tool_routes "https://github.com/mujahidinnn/mojepict/tree/main/app/(tools)"
click node_tool_modes "https://github.com/mujahidinnn/mojepict/tree/main/components/modes"
click node_pdf_editor "https://github.com/mujahidinnn/mojepict/blob/main/components/modes/pdf-editor.tsx"
click node_photobooth "https://github.com/mujahidinnn/mojepict/blob/main/app/(tools)/photobooth/page.tsx"
click node_schedule "https://github.com/mujahidinnn/mojepict/blob/main/app/(tools)/schedule-maker/page.tsx"
click node_shared_tool_ui "https://github.com/mujahidinnn/mojepict/blob/main/components/tools/ToolShell.tsx"
click node_image_tools "https://github.com/mujahidinnn/mojepict/tree/main/components/modes"
click node_image_compressor "https://github.com/mujahidinnn/mojepict/blob/main/components/modes/image-compressor.tsx"
click node_background_removal "https://github.com/mujahidinnn/mojepict/blob/main/app/(tools)/remove-bg/page.tsx"
click node_compress_api "https://github.com/mujahidinnn/mojepict/blob/main/app/api/compress/route.ts"
click node_remove_bg_api "https://github.com/mujahidinnn/mojepict/blob/main/app/api/remove-bg/route.ts"
click node_key_rotation "https://github.com/mujahidinnn/mojepict/blob/main/lib/api-key-pool.ts"
click node_i18n "https://github.com/mujahidinnn/mojepict/blob/main/lib/i18n/context.tsx"
click node_export "https://github.com/mujahidinnn/mojepict/blob/main/lib/export-node.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_homepage,node_navigation,node_catalog,node_browser toneBlue
class node_tool_routes,node_tool_modes,node_pdf_editor,node_photobooth,node_schedule toneAmber
class node_image_tools,node_image_compressor,node_background_removal,node_compress_api,node_remove_bg_api toneMint
class node_shared_tool_ui,node_key_rotation,node_i18n,node_export toneRose
class node_visitor,node_tinify,node_remove_bg_service toneIndigo
```

## Components

### Discovery and navigation

- [Tool homepage](https://github.com/mujahidinnn/mojepict/blob/main/app/page.tsx): `app/page.tsx`
- [Navigation and search](https://github.com/mujahidinnn/mojepict/blob/main/components/layout/CommandPalette.tsx): `components/layout/CommandPalette.tsx`
- [Tool catalog](https://github.com/mujahidinnn/mojepict/blob/main/lib/tools.ts): `lib/tools.ts`

### Tool experiences

- [Tool pages](https://github.com/mujahidinnn/mojepict/tree/main/app/(tools)): `app/(tools)`
- [Tool implementations](https://github.com/mujahidinnn/mojepict/tree/main/components/modes): `components/modes`
- [PDF editor](https://github.com/mujahidinnn/mojepict/blob/main/components/modes/pdf-editor.tsx): `components/modes/pdf-editor.tsx`
- [Web photobooth](https://github.com/mujahidinnn/mojepict/blob/main/app/(tools)/photobooth/page.tsx): `app/(tools)/photobooth/page.tsx`
- [Schedule maker](https://github.com/mujahidinnn/mojepict/blob/main/app/(tools)/schedule-maker/page.tsx): `app/(tools)/schedule-maker/page.tsx`

### Image processing

- [Image tools](https://github.com/mujahidinnn/mojepict/tree/main/components/modes): `components/modes`
- [Image compressor](https://github.com/mujahidinnn/mojepict/blob/main/components/modes/image-compressor.tsx): `components/modes/image-compressor.tsx`
- [Background removal](https://github.com/mujahidinnn/mojepict/blob/main/app/(tools)/remove-bg/page.tsx): `app/(tools)/remove-bg/page.tsx`
- [Compression API](https://github.com/mujahidinnn/mojepict/blob/main/app/api/compress/route.ts): `app/api/compress/route.ts`
- [Background API](https://github.com/mujahidinnn/mojepict/blob/main/app/api/remove-bg/route.ts): `app/api/remove-bg/route.ts`

### Shared platform

- [Tool interface](https://github.com/mujahidinnn/mojepict/blob/main/components/tools/ToolShell.tsx): `components/tools/ToolShell.tsx`
- [API key rotation](https://github.com/mujahidinnn/mojepict/blob/main/lib/api-key-pool.ts): `lib/api-key-pool.ts`
- [English and Indonesian](https://github.com/mujahidinnn/mojepict/blob/main/lib/i18n/context.tsx): `lib/i18n/context.tsx`
- [Image and PDF export](https://github.com/mujahidinnn/mojepict/blob/main/lib/export-node.ts): `lib/export-node.ts`

### Other components

- **Visitor**
- **Tinify service**
- **remove.bg service**
- **Browser**

## Connections

- Visitor → Tool homepage: opens
- Tool homepage → Tool catalog: reads tools
- Tool homepage → Navigation and search: opens search
- Visitor → Tool pages: selects tool
- Tool pages → Tool interface: uses interface
- Tool pages → Tool implementations: hosts tools
- Tool pages → Tool catalog: lists tools
- PDF editor → Tool interface: uses interface
- Web photobooth → Tool interface: uses interface
- Schedule maker → Image and PDF export: exports output
- Schedule maker → Browser: downloads file
- Image tools → Browser: processes locally
- Image compressor → Compression API: requests enhancement
- Background removal → Background API: requests enhancement
- Compression API → API key rotation: rotates keys
- Background API → API key rotation: rotates keys
- Compression API → Tinify service: compresses image
- Background API → remove.bg service: removes background
- Tool pages → English and Indonesian: uses translations