# Dokumentasi Struktur Folder `app/`

## Gambaran Umum

Folder `app/` adalah direktori utama aplikasi Next.js yang menggunakan App Router. Folder ini berisi semua halaman, API routes, dan komponen utama aplikasi pelatihan kebugaran "Straps".

---

## 📁 Struktur Direktori

### 1. **`api/` - API Routes**

Folder yang berisi semua endpoint backend untuk komunikasi antara client dan server.

#### **`api/auth/[...nextauth]/`**

- **Fungsi**: Menangani autentikasi pengguna menggunakan NextAuth.js
- **Endpoint**: `/api/auth/*`
- **Fitur**: Login, logout, session management

#### **`api/clients/`**

- **Fungsi**: Endpoint untuk mengelola data klien
- **Operasi**: CRUD operations untuk client data

#### **`api/coach/link-client/`**

- **File**: `route.ts`
- **Fungsi**: Menghubungkan pelatih (coach) dengan klien mereka
- **Method**: POST untuk membuat hubungan coach-client

#### **`api/logs/`**

- **File**: `route.ts`
- **Fungsi**: Mencatat dan mengambil log aktivitas training
- **Method**: GET (mengambil logs), POST (membuat log baru)

#### **`api/menus/`**

- **File**: `route.ts`
- **Fungsi**: Mengelola menu latihan (workout programs)
- **Method**: GET (semua menu), POST (buat menu baru)

##### **`api/menus/[id]/`**

- **File**: `route.ts`
- **Fungsi**: Operasi pada menu spesifik berdasarkan ID
- **Method**: GET (detail menu), PUT (update), DELETE (hapus)

#### **`api/recap/`**

- **File**: `route.ts`
- **Fungsi**: Menyimpan dan mengambil ringkasan latihan (training recap)
- **Method**: GET (semua recap), POST (simpan recap baru)
- **Data**: Termasuk skor form, detail per-rep, dan statistik latihan

##### **`api/recap/[id]/`**

- **File**: `route.ts`
- **Fungsi**: Mengakses recap latihan spesifik
- **Method**: GET (detail recap), DELETE (hapus recap)

#### **`api/register/`**

- **File**: `route.ts`
- **Fungsi**: Registrasi pengguna baru
- **Method**: POST untuk membuat akun baru (Coach atau Client)
- **Validasi**: Email unik, password hashing

#### **`api/status/`**

- **Fungsi**: Health check endpoint untuk monitoring aplikasi
- **Method**: GET untuk cek status server

#### **`api/users/`**

- **File**: `route.ts`
- **Fungsi**: Mengelola data pengguna
- **Method**: GET (daftar users), POST (buat user)

##### **`api/users/[id]/`**

- **File**: `route.ts`
- **Fungsi**: Operasi pada user spesifik
- **Method**: GET (detail user), PUT (update), DELETE (hapus)

---

### 2. **`client/` - Halaman Klien**

Folder untuk semua halaman yang diakses oleh pengguna dengan role "Client".

#### **`client/page.tsx`**

- **Route**: `/client`
- **Fungsi**: Dashboard utama klien
- **Fitur**:
  - Menampilkan program latihan yang ditugaskan
  - Tombol navigasi ke mode Training, Free Mode, dan Monitor
  - Informasi pelatih yang ditugaskan

#### **`client/free/`**

##### **`client/free/page.tsx`**

- **Route**: `/client/free`
- **Fungsi**: Mode latihan bebas (Personal Menu)
- **Fitur**:
  - Builder untuk membuat menu latihan custom
  - Sistem berbasis "Round" (Set grouping)
  - Pilihan exercise terbatas ke 7 latihan inti
  - Penyimpanan ke localStorage
  - Duplicate round untuk efisiensi

#### **`client/monitor/`**

##### **`client/monitor/page.tsx`**

- **Route**: `/client/monitor`
- **Fungsi**: Monitor real-time untuk form exercise
- **Fitur**:
  - Live camera feed dengan pose detection
  - Visual feedback untuk form quality
  - Counter repetisi real-time
  - Tidak ada target/assignment

#### **`client/training/`**

##### **`client/training/page.tsx`**

- **Route**: `/client/training`
- **Fungsi**: Mode latihan utama dengan program assigned
- **Fitur**:
  - AI-powered form tracking per rep
  - Automatic rep counting
  - Rest timer antar set
  - **Training Recap**:
    - Summary statistik (total sets, total reps)
    - Table detail per set dengan:
      - Form score average
      - Expandable per-rep breakdown
      - Grade labels (Excellent/Good/Fair/Needs Improvement)
      - Feedback text spesifik per rep (e.g., "Knees Inward")
  - Toggle antara Assigned Program dan Personal Menu
  - Reset functionality

---

### 3. **`coach/` - Halaman Pelatih**

Folder untuk semua halaman yang diakses oleh pengguna dengan role "Coach".

#### **`coach/dashboard/`**

##### **`coach/dashboard/page.tsx`**

- **Route**: `/coach/dashboard`
- **Fungsi**: Dashboard utama pelatih
- **Fitur**:
  - Daftar klien yang terhubung
  - Link Client functionality
  - Navigasi ke menu management

#### **`coach/menu/`**

Folder untuk manajemen menu latihan.

##### **`coach/menu/[id]/`**

- **Route**: `/coach/menu/[id]`
- **Fungsi**: Edit menu latihan yang sudah ada
- **Fitur**:
  - Form editor untuk menu details
  - Exercise composer dengan round system
  - Preview menu structure
  - Update dan delete operations

##### **`coach/menu/new/`**

- **File**: `page.tsx`
- **Route**: `/coach/menu/new`
- **Fungsi**: Membuat menu latihan baru
- **Fitur**:
  - Round-based exercise builder
  - Input untuk:
    - Nama menu
    - Target reps per exercise
    - Weight (beban)
    - Rest time
  - Pilihan 7 exercise core
  - Duplicate round
  - Group sets by exercise
  - Auto-save to database

#### **`coach/recap/`**

##### **`coach/recap/[id]/`**

- **Route**: `/coach/recap/[id]`
- **Fungsi**: Melihat detail recap latihan klien
- **Fitur**:
  - Visualisasi statistik klien
  - Form quality analysis
  - Historical performance tracking

---

### 4. **`debug/`**

- **Fungsi**: Halaman untuk debugging dan testing
- **Status**: Development/testing only
- **Akses**: Biasanya disabled di production

---

### 5. **`generated/` - Prisma Client**

Folder yang di-generate otomatis oleh Prisma ORM.

#### **`generated/client/`**

- **File-file utama**:
  - `client.ts` - Prisma Client instance
  - `browser.ts` - Browser-compatible client
  - `models.ts` - Type definitions untuk database models
  - `enums.ts` - Enum definitions
  - `commonInputTypes.ts` - Input type definitions
  - `libquery_engine-*.so.node` - Native query engine binary

- **Folder `internal/`**: Internal Prisma helpers
- **Folder `models/`**: Model type definitions

**PENTING**: ❌ Jangan edit manual, akan di-regenerate saat `prisma generate`

---

### 6. **`lib/` (Symlink)**

- **Fungsi**: Symlink ke `/lib` di root project
- **Isi**: Helper functions dan utility libraries
- **Contoh isi**:
  - `pose/HARCore.ts` - Human Activity Recognition core
  - `pose/RehabCore.ts` - Exercise recognition dan rep counting
  - Form analysis algorithms

---

### 7. **`login/`**

- **File**: Kemungkinan `page.tsx` (route file)
- **Route**: `/login`
- **Fungsi**: Halaman login untuk semua pengguna
- **Fitur**:
  - Form email dan password
  - Authentication via NextAuth
  - Redirect ke dashboard sesuai role

---

### 8. **`register/`**

- **File**: `page.tsx`
- **Route**: `/register`
- **Fungsi**: Halaman registrasi pengguna baru
- **Fitur**:
  - Form input: nama, email, password
  - Pilihan role (Coach/Client)
  - Validasi input
  - Submit ke `/api/register`

---

## 📄 File Konfigurasi Root

### **`favicon.ico`**

- **Fungsi**: Icon aplikasi yang muncul di browser tab
- **Format**: ICO file
- **Size**: 25.9 KB

### **`globals.css`**

- **Fungsi**: Global stylesheet untuk seluruh aplikasi
- **Isi**:
  - Reset CSS
  - Tailwind CSS directives (@tailwind base, components, utilities)
  - Custom color variables
  - Global typography styles
- **Size**: ~773 bytes

### **`layout.tsx`**

- **Fungsi**: Root layout component (App-wide wrapper)
- **Fitur**:
  - HTML structure (`<html>`, `<body>`)
  - Metadata configuration
  - Font loading (biasanya)
  - Global providers (Session, Theme, etc.)
- **Applies to**: Semua route di aplikasi
- **Size**: ~757 bytes

### **`page.tsx`**

- **Route**: `/` (Homepage)
- **Fungsi**: Landing page aplikasi
- **Fitur**:
  - Welcome screen
  - Login/Register CTA
  - Informasi aplikasi
  - Redirect logic berdasarkan auth status
- **Size**: ~15 KB

---

## 🔑 Poin Penting untuk Dokumentasi

### **Routing Convention (Next.js App Router)**

- `page.tsx` → Halaman yang dapat diakses
- `route.ts` → API endpoint
- `layout.tsx` → Layout wrapper
- `[id]/` → Dynamic route parameter
- `[...slug]/` → Catch-all route

### **Role-Based Access**

- `/client/*` → Hanya untuk role "Client"
- `/coach/*` → Hanya untuk role "Coach"
- `/api/*` → Backend endpoints (internal)

### **Key Features**

1. **AI Form Analysis**: Real-time pose detection dan rep counting
2. **Per-Rep Tracking**: Detail skor form untuk setiap repetisi
3. **Round System**: Exercise grouping untuk efisiensi workout builder
4. **Training Recap**: Dashboard komprehensif pasca-latihan

### **Tech Stack**

- **Framework**: Next.js 16 (App Router)
- **Database**: PostgreSQL via Prisma ORM
- **Auth**: NextAuth.js
- **UI**: TailwindCSS
- **AI**: MediaPipe Pose Landmarker
- **Language**: TypeScript

---

## 📊 Diagram Struktur

```
app/
├── api/                    # Backend Endpoints
│   ├── auth/
│   ├── coach/
│   ├── logs/
│   ├── menus/
│   ├── recap/
│   ├── register/
│   └── users/
├── client/                 # Client Dashboard & Features
│   ├── free/              # Personal Menu Builder
│   ├── monitor/           # Live Form Monitor
│   ├── training/          # Assigned Training Mode
│   └── page.tsx           # Client Dashboard
├── coach/                  # Coach Dashboard & Tools
│   ├── dashboard/
│   ├── menu/
│   └── recap/
├── generated/             # Prisma Auto-Generated (DO NOT EDIT)
├── lib/                   # Utilities (Symlink)
├── login/                 # Login Page
├── register/              # Registration Page
├── favicon.ico
├── globals.css            # Global Styles
├── layout.tsx             # Root Layout
└── page.tsx               # Homepage
```

---

## 💡 Tips Maintenance

1. **Jangan edit** folder `generated/` secara manual
2. **Run** `prisma generate` setelah schema change
3. **API routes** mengikuti REST convention
4. **Per-rep data** disimpan dalam struktur nested di recap
5. **Feedback text** di-capture frame-by-frame lalu dianalisa untuk dominan message