LINE MINI App Planning Overview

PLAN.md

LINE MINI App Planning Overview

Sportclub CNX Court Booking Platform

Document Version: 1.0 Date: January 2026 Status: Planning Document

---

Table of Contents

1. Executive Summary
2. App Overview
3. Target Audience
4. Core Features
5. Screen Flow Diagram
6. Technical Architecture
7. User Journey
8. Stakeholder Relationships
9. LINE Integration
10. QR Code System
11. Revenue Model
12. Implementation Timeline
13. Success Metrics

---

Executive Summary

Sportclub CNX is a sports facility booking platform specializing in tennis and badminton courts in Chiang Mai. This document outlines the planning for a LINE MINI App that will provide seamless booking, wallet management, and loyalty programs through LINE's ecosystem.

Key Objectives:

• Increase booking convenience via LINE
• Reduce no-shows through LINE notifications
• Build customer loyalty with points system
• Enable cashless payments via LINE Pay integration

---

App Overview

App Name

Sportclub CNX (LINE MINI App)

Platform

• LINE MINI App (Mobile web wrapper)
• LINE LIFF (Line Front-end Framework)
• Progressive Web App (PWA)

Primary Functions

1. Court booking and scheduling
2. Digital wallet (District Credits)
3. Payment via PromptPay/QR Code
4. Booking confirmation via LINE
5. Loyalty points system
6. Admin management dashboard

---

Target Audience

Primary Users

Segment	Description	Age Range	Tech Proficiency
Tennis Players	Regular court users	25-55	Intermediate
Badminton Players	Casual and league players	20-50	Intermediate
Sports Enthusiasts	Multi-sport users	20-60	Basic-Intermediate

User Demographics

• Location: Chiang Mai and surrounding areas
• Income: Middle to upper-middle class
• LINE Usage: Heavy LINE users (Thailand's dominant messaging platform)
• Payment Preference: Increasingly cashless, mobile-first

---

Core Features

User Features (Customer)

Feature	Description	Priority
Browse Courts	View available courts at each branch	Must Have
Real-time Booking	Check availability and book slots	Must Have
Digital Wallet	Load credits, view balance	Must Have
Payment via QR	Scan PromptPay QR to pay	Must Have
Booking History	View past and upcoming bookings	Must Have
Cancel/Reschedule	Modify bookings	Should Have
Loyalty Points	Earn points per booking	Should Have
LINE Notifications	Receive booking reminders	Should Have
Calendar Integration	Add bookings to phone calendar	Nice to Have

Admin Features (Owner/Staff)

Feature	Description	Priority
Dashboard	Overview of bookings and revenue	Must Have
Court Management	Add/Edit courts and pricing	Must Have
Booking Management	Approve/Cancel bookings	Must Have
User Management	View user activity	Must Have
Payment Verification	Confirm manual payments	Must Have
Reports	Revenue and usage reports	Should Have
Promotion Management	Create discounts/offers	Should Have

---

Screen Flow Diagram

┌─────────────────────────────────────────────────────────────────────────────┐
│                          SPORTRLUB CNX - SCREEN FLOW                         │
└─────────────────────────────────────────────────────────────────────────────┘

                                    ┌──────────────┐
                                    │   START      │
                                    │  (Landing)   │
                                    └──────┬───────┘
                                           │
                                           ▼
                              ┌────────────────────┐
                              │   Home / Branches  │
                              │   /liff/book       │
                              └──────┬─────────────┘
                                     │
              ┌──────────────────────┼──────────────────────┐
              │                      │                      │
              ▼                      ▼                      ▼
     ┌─────────────────┐   ┌─────────────────┐   ┌─────────────────┐
     │   Select Date   │   │   My Bookings   │   │    Top Up       │
     │   /liff/book    │   │  /liff/book?    │   │   /liff/topup   │
     │   (Step 1)      │   │   tab=bookings  │   │                 │
     └────────┬────────┘   └─────────────────┘   └────────┬────────┘
              │                                              │
              │      ┌─────────────────────────────────────┘
              │      │
              ▼      ▼
     ┌─────────────────────┐
     │   Select Time Slot  │
     │   (Step 2)          │
     └──────────┬──────────┘
                │
                ▼
     ┌─────────────────────┐
     │   Confirm Booking   │
     │   (Step 3)          │
     └──────────┬──────────┘
                │
                ▼
     ┌─────────────────────┐
     │   Payment Screen    │
     │   (Credits/QR)      │
     └──────────┬──────────┘
                │
                ▼
     ┌─────────────────────┐         ┌─────────────────────┐
     │   Booking Success   │         │   Payment History   │
     │   /liff/book/       │         │   /wallet           │
     │   success           │         │                     │
     └─────────────────────┘         └─────────────────────┘
                │
                ▼
     ┌─────────────────────┐
     │   Booking Details   │
     │   (View Receipt)    │
     └─────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                         ADMIN DASHBOARD FLOW                                │
└─────────────────────────────────────────────────────────────────────────────┘

     ┌─────────────────────┐
     │   Admin Login       │
     │   /admin/login      │
     └──────────┬──────────┘
                │
                ▼
     ┌─────────────────────┐
     │   Admin Dashboard   │
     │   /admin            │
     └──────────┬──────────┘
                │
    ┌───────────┼───────────┬───────────┬───────────┐
    │           │           │           │           │
    ▼           ▼           ▼           ▼           ▼
┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐ ┌────────┐
│Bookings│ │ Courts │ │ Users  │ │ Wallet │ │ Reports│
└────────┘ └────────┘ └────────┘ └────────┘ └────────┘

Screen Transitions (Detailed)

┌─────────────────────────────────────────────────────────────────────────────┐
│                         DETAILED SCREEN TRANSITIONS                         │
└─────────────────────────────────────────────────────────────────────────────┘

┌──────────┐     ┌──────────┐     ┌──────────┐     ┌──────────┐     ┌──────────┐
│  HOME    │────▶│ BRANCHES │────▶│  COURTS  │────▶│  TIME    │────▶│ CONFIRM  │
│          │     │ SELECT   │     │ SELECT   │     │ SELECT   │     │          │
└──────────┘     └──────────┘     └──────────┘     └──────────┘     └──────────┘
     │                │                 │                │                │
     │                │                 │                │                │
     ▼                ▼                 ▼                ▼                ▼
┌──────────┐     ┌──────────┐     ┌──────────┐     ┌──────────┐     ┌──────────┐
│ MY BOOK  │     │ DETAILS  │     │  PRICE   │     │  SLOTS   │     │  USER    │
│  (Tab)   │     │  VIEW    │     │  VIEW    │     │  GRID    │     │  INFO    │
└──────────┘     └──────────┘     └──────────┘     └──────────┘     └──────────┘
     │                                                                     │
     │                                                                     │
     ▼                                                                     ▼
┌──────────┐                                                       ┌──────────┐
│ BOOKING  │                                                       │ PAYMENT  │
│ DETAIL   │◀──────────────────────────────────────────────────────│  SCREEN  │
└──────────┘                                                       └──────────┘
     │                                                                     │
     │                                                                     ▼
     │                                                             ┌──────────┐
     │                                                             │ SUCCESS  │
     │                                                             │  PAGE    │
     │                                                             └──────────┘
     │                                                                     │
     │                                                                     ▼
     │                                                             ┌──────────┐
     └─────────────────────────────────────────────────────────────│   ICS    │
                                                                 │ CALENDAR │
                                                                 └──────────┘

---

Technical Architecture

┌─────────────────────────────────────────────────────────────────────────────┐
│                        SYSTEM ARCHITECTURE DIAGRAM                          │
└─────────────────────────────────────────────────────────────────────────────┘

                              ┌─────────────────┐
                              │   LINE Platform │
                              │                 │
                              │  ┌───────────┐  │
                              │  │ LINE OA   │  │  ← Official Account
                              │  └───────────┘  │
                              │  ┌───────────┐  │
                              │  │ LINE Pay  │  │  ← Payment Integration
                              │  └───────────┘  │
                              │  ┌───────────┐  │
                              │  │ LINE LIFF │  │  ← App Framework
                              │  └───────────┘  │
                              └────────┬────────┘
                                       │
                    ┌──────────────────┼──────────────────┐
                    │                  │                  │
                    ▼                  ▼                  ▼
           ┌────────────────┐ ┌────────────────┐ ┌────────────────┐
           │   Frontend     │ │   Backend      │ │   Database     │
           │                │ │                │ │                │
           │  Next.js 16    │ │  Next.js API   │ │  PostgreSQL    │
           │  React 19      │ │  Routes        │ │  (Prisma ORM)  │
           │  Tailwind CSS  │ │                │ │                │
           │  Lucide Icons  │ │                │ │                │
           └────────────────┘ └────────┬─────────┘ └────────────────┘
                                       │
                    ┌──────────────────┼──────────────────┐
                    │                  │                  │
                    ▼                  ▼                  ▼
           ┌────────────────┐ ┌────────────────┐ ┌────────────────┐
           │   External     │ │   File         │ │   Email/       │
           │   Services     │ │   Storage      │ │   Notifications│
           │                │ │                │ │                │
           │  • PromptPay   │ │  • Vercel      │ │  • LINE Bot    │
           │  • QR Server   │ │    Storage     │ │    (ElysiaJS)  │
           │  • Calendar    │ │  • CDN         │ │                │
           └────────────────┘ └────────────────┘ └────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                         DATA FLOW DIAGRAM                                   │
└─────────────────────────────────────────────────────────────────────────────┘

    ┌─────────────┐         ┌─────────────┐         ┌─────────────┐
    │    USER     │         │    LINE     │         │  BACKEND    │
    │             │         │   LIFF SDK  │         │   SERVER    │
    └──────┬──────┘         └──────┬──────┘         └──────┬──────┘
           │                      │                      │
           │  1. Open App         │                      │
           │────────────────────▶│                      │
           │                     │  2. Get User Info    │
           │                     │◀─────────────────────│
           │                     │                      │
           │  3. Login           │                      │
           │◀────────────────────│                      │
           │                     │                      │
           │  4. Select Court    │                      │
           │────────────────────▶│────────────────────▶│
           │                     │                      │
           │                     │                      │  5. Check
           │                     │                      │     Availability
           │                     │                      │◀─────────────▶
           │                     │                      │     Database
           │                     │                      │
           │  6. Confirm Booking │                      │
           │────────────────────▶│────────────────────▶│
           │                     │                      │
           │                     │                      │  7. Create
           │                     │                      │     Booking Record
           │                     │                      │◀─────────────▶
           │                     │                      │
           │  8. Payment         │                      │
           │  (Credits/QR)       │                      │
           │────────────────────▶│────────────────────▶│
           │                     │                      │
           │                     │                      │  9. Update
           │                     │                      │     Wallet Balance
           │                     │                      │◀─────────────▶
           │                     │                      │
           │  10. Success        │                      │
           │◀────────────────────│                      │

---

User Journey

User Journey: First-Time User

┌─────────────────────────────────────────────────────────────────────────────┐
│                      FIRST-TIME USER JOURNEY MAP                            │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│ STAGE 1: DISCOVERY                                                          │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│  ┌─────────────┐    ┌─────────────┐    ┌─────────────┐    ┌─────────────┐  │
│  │  LINE OA    │    │  LINE MINI  │    │  FRIEND     │    │  SEARCH     │  │
│  │  PROMOTION  │───▶│  APP LINK   │───▶│  REFERRAL   │───▶│  (Google)   │  │
│  └─────────────┘    └─────────────┘    └─────────────┘    └─────────────┘  │
│                                                                             │
│  TOUCHPOINT: LINE OA Message / Chat Menu / LIFF Button                      │
│  EMOTION: Curious / Interested                                              │
│  GOAL: Learn about the service                                              │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘
                                    │
                                    ▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ STAGE 2: ONBOARDING                                                         │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│  ┌─────────────────────────────────────────────────────────────────────┐   │
│  │                    LINE LIFF LOGIN FLOW                             │   │
│  ├─────────────────────────────────────────────────────────────────────┤   │
│  │                                                                     │   │
│  │   [Open App] ──▶ [LINE Login Auto] ──▶ [Profile Setup] ──▶ [OK]   │   │
│  │                                                                     │   │
│  │   Step 1: User opens LINE MINI App                                  │   │
│  │   Step 2: LINE SDK auto-authenticates user                          │   │
│  │   Step 3: App displays welcome message with user name               │   │
│  │   Step 4: User is ready to book                                     │   │
│  │                                                                     │   │
│  └─────────────────────────────────────────────────────────────────────┘   │
│                                                                             │
│  TOUCHPOINT: LINE LIFF Login Screen                                         │
│  EMOTION: Excited / Optimistic                                              │
│  GOAL: Quick and easy access                                                │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘
                                    │
                                    ▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ STAGE 3: FIRST BOOKING                                                      │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│  ┌─────────────┐    ┌─────────────┐    ┌─────────────┐    ┌─────────────┐  │
│  │  SELECT     │───▶│  SELECT     │───▶│  SELECT     │───▶│  CONFIRM    │  │
│  │  BRANCH     │    │  DATE       │    │  TIME       │    │  BOOKING    │  │
│  └─────────────┘    └─────────────┘    └─────────────┘    └─────────────┘  │
│       │                  │                  │                  │            │
│       │                  │                  │                  │            │
│       ▼                  ▼                  ▼                  ▼            │
│  ┌─────────────┐    ┌─────────────┐    ┌─────────────┐    ┌─────────────┐  │
│  │  Show all   │    │  Calendar   │    │  Available  │    │  Review     │  │
│  │  locations  │    │  picker     │    │  time slots │    │  details    │  │
│  └─────────────┘    └─────────────┘    └─────────────┘    └─────────────┘  │
│                                                                             │
│  TOUCHPOINT: Booking Flow Screens                                            │
│  EMOTION: Confident / Satisfied                                             │
│  GOAL: Complete first booking successfully                                  │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘
                                    │
                                    ▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ STAGE 4: PAYMENT                                                            │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│  ┌─────────────────────────────────────────────────────────────────────┐   │
│  │                    PAYMENT OPTIONS                                   │   │
│  ├─────────────────────────────────────────────────────────────────────┤   │
│  │                                                                     │   │
│  │    ┌──────────────┐              ┌──────────────┐                   │   │
│  │    │ DISTRICT     │              │  PROMPTPAY   │                   │   │
│  │    │ CREDITS      │              │     QR       │                   │   │
│  │    │              │              │              │                   │   │
│  │    │ • Pre-paid   │              │ • Scan to    │                   │   │
│  │    │ • Instant    │              │   pay        │                   │   │
│  │    │ • Rewards    │              │ • 30-min     │                   │   │
│  │    │   included   │              │   expiry     │                   │   │
│  │    └──────────────┘              └──────────────┘                   │   │
│  │                                                                     │   │
│  └─────────────────────────────────────────────────────────────────────┘   │
│                                                                             │
│  TOUCHPOINT: Payment Screen                                                 │
│  EMOTION: Trust / Security                                                  │
│  GOAL: Complete payment securely                                            │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘
                                    │
                                    ▼
┌─────────────────────────────────────────────────────────────────────────────┐
│ STAGE 5: CONFIRMATION & LOYALTY                                             │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│  ┌─────────────┐    ┌─────────────┐    ┌─────────────┐    ┌─────────────┐  │
│  │  BOOKING    │───▶│  ADD TO     │───▶│  LOYALTY    │───▶│  RATE       │  │
│  │  CONFIRMED  │    │  CALENDAR   │    │  POINTS     │    │  EXPERIENCE │  │
│  └─────────────┘    └─────────────┘    └─────────────┘    └─────────────┘  │
│       │                  │                  │                  │            │
│       ▼                  ▼                  ▼                  ▼            │
│  ┌─────────────┐    ┌─────────────┐    ┌─────────────┐    ┌─────────────┐  │
│  │  • Booking  │    │  • .ics     │    │  • Earn 1   │    │  • Feedback │  │
│  │    ID       │    │  file       │    │    point/    │    │    form     │  │
│  │  • Receipt  │    │  • Auto     │    │    hour      │    │  • Review   │  │
│  │  • QR Code  │    │    add      │    │  • Redeem    │    │    request  │  │
│  │  • LINE     │    │    to       │    │    for       │    │  • Share    │  │
│  │    Notify   │    │    phone    │    │    discount  │    │             │  │
│  └─────────────┘    └─────────────┘    └─────────────┘    └─────────────┘  │
│                                                                             │
│  TOUCHPOINT: Success Screen + LINE Notification                             │
│  EMOTION: Delighted / Rewarded                                              │
│  GOAL: Feel valued and encourage return visit                               │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘

---

Stakeholder Relationships

┌─────────────────────────────────────────────────────────────────────────────┐
│                      STAKEHOLDER RELATIONSHIP DIAGRAM                       │
└─────────────────────────────────────────────────────────────────────────────┘

                              ┌─────────────────┐
                              │   SPORTRLUB CNX │
                              │   SERVICE OWNER │
                              │                 │
                              │  • Provides     │
                              │    facilities   │
                              │  • Sets pricing │
                              │  • Manages      │
                              │    operations   │
                              └────────┬────────┘
                                       │
                    ┌──────────────────┼──────────────────┐
                    │                  │                  │
                    ▼                  ▼                  ▼
           ┌────────────────┐ ┌────────────────┐ ┌────────────────┐
           │    CUSTOMERS   │ │   EMPLOYEES    │ │    PARTNERS    │
           │                │ │                │ │                │
           │  • Book courts │ │  • Manage      │ │  • LINE        │
           │  • Pay via app │ │    bookings    │ │    (Platform)  │
           │  • Earn points │ │  • Handle      │ │  • Payment     │
           │  • Get notify  │ │    payments    │ │    Gateways    │
           └────────────────┘ │  • Support     │ │  • Maintenance │
                             │    users       │ │  • Supplies    │
                             └────────────────┘ └────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                    SERVICE RELATIONSHIP MAP                                 │
└─────────────────────────────────────────────────────────────────────────────┘

      ┌─────────────────────────────────────────────────────────────────┐
      │                     SERVICE FLOW MAP                             │
      ├─────────────────────────────────────────────────────────────────┤
      │                                                                 │
      │   ┌──────────┐       ┌──────────┐       ┌──────────┐           │
      │   │ Customer │──────▶│   App    │──────▶│ Backend  │           │
      │   │          │       │  (LINE   │       │  Server  │           │
      │   │ • Makes  │       │   LIFF)  │       │          │           │
      │   │   booking│       │          │       │ • Process│           │
      │   │ • Pays   │       │ • UI/UX  │       │   booking│           │
      │   │ • Reviews│       │ • Forms  │       │ • Store  │           │
      │   └──────────┘       └────┬─────┘       │   data   │           │
      │                           │             └────┬─────┘           │
      │                           │                  │                 │
      │                           │                  │                 │
      │   ┌──────────┐            │                  ▼                 │
      │   │ Customer │◀───────────┤         ┌──────────┐             │
      │   │          │            │         │ Database │             │
      │   │ • Receive│            │         │ (Postgre │             │
      │   │   booking│            │         │   SQL)   │             │
      │   │   info   │            │         │          │             │
      │   │ • Get QR │            │         │ • Users  │             │
      │   │ • Points │            │         │ • Courts │             │
      │   └──────────┘            │         │ • Bookings           │
      │                           │         │ • Wallet  │             │
      │                           │         └──────────┘             │
      │                           │                  │                 │
      │                           │                  │                 │
      │                           ▼                  ▼                 │
      │                    ┌──────────┐       ┌──────────┐             │
      │                    │ LINE OA  │       │ External │             │
      │                    │  (BOT)   │       │ Services │             │
      │                    │          │       │          │             │
      │                    │ • Notify │       │ • Prompt │             │
      │                    │ • Reply  │       │   Pay    │             │
      │                    │ • Menu   │       │ • QR Gen │             │
      │                    └──────────┘       └──────────┘             │
      │                                                                 │
      └─────────────────────────────────────────────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                    RESPONSIBILITY MATRIX                                    │
└─────────────────────────────────────────────────────────────────────────────┘

┌────────────────┬────────────────┬────────────────┬────────────────┐
│    Function    │   Service Owner│    Customers   │   Employees    │
│                │   (Sportclub)  │                │                │
├────────────────┼────────────────┼────────────────┼────────────────┤
│ Court          │      ★★★       │       -        │       -        │
│ Maintenance    │                │                │                │
├────────────────┼────────────────┼────────────────┼────────────────┤
│ App            │      ★★        │       -        │      ★★        │
│ Development    │                │                │                │
├────────────────┼────────────────┼────────────────┼────────────────┤
│ User           │      ★★        │       -        │      ★★★       │
│ Support        │                │                │                │
├────────────────┼────────────────┼────────────────┼────────────────┤
│ Booking        │      ★★        │       -        │      ★★★       │
│ Management     │                │                │                │
├────────────────┼────────────────┼────────────────┼────────────────┤
│ Payment        │      ★★★       │       ★★       │       ★        │
│ Processing     │                │                │                │
├────────────────┼────────────────┼────────────────┼────────────────┤
│ Marketing &   │      ★★★       │       -        │       ★        │
│ Promotions     │                │                │                │
├────────────────┼────────────────┼────────────────┼────────────────┤
│ Customer       │      ★★        │       ★★       │      ★★★       │
│ Feedback       │                │                │                │
└────────────────┴────────────────┴────────────────┴────────────────┘

Legend: ★★★ = Primary Responsibility | ★★ = Secondary | ★ = Support

---

LINE Integration

LINE Official Account Setup

┌─────────────────────────────────────────────────────────────────────────────┐
│                    LINE OFFICIAL ACCOUNT INTEGRATION                        │
└─────────────────────────────────────────────────────────────────────────────┘

┌────────────────────────────────────────┐
│         LINE DEVELOPER CONSOLE         │
│                                        │
│  ┌──────────────────────────────────┐  │
│  │  Channel Settings                │  │
│  │  ─────────────────────────────   │  │
│  │  Channel ID: 2007xxxxxxxx        │  │
│  │  Channel Secret: xxxxxxxxxx      │  │
│  │  LIFF ID: 2007xxxxxxxx-xxxxxxxx  │  │
│  └──────────────────────────────────┘  │
│                                        │
│  ┌──────────────────────────────────┐  │
│  │  LIFF Apps                       │  │
│  │  ─────────────────────────────   │  │
│  │  • Booking App (External)        │  │
│  │    - Endpoint: /liff/book        │  │
│  │    - Size: Full                  │  │
│  │    - Options: scanQR, chain      │  │
│  │                                  │  │
│  │  • Top-up App (External)         │  │
│  │    - Endpoint: /liff/topup       │  │
│  │    - Size: Full                  │  │
│  │                                  │  │
│  │  • Wallet App (External)         │  │
│  │    - Endpoint: /liff/wallet      │  │
│  │    - Size: Full                  │  │
│  └──────────────────────────────────┘  │
│                                        │
│  ┌──────────────────────────────────┐  │
│  │  Messaging API                   │  │
│  │  ─────────────────────────────   │  │
│  │  • Push Message: Enabled         │  │
│  │  • Reply Message: Enabled        │  │
│  │  • Webhook: Enabled              │  │
│  │  • Bot PUsh: Enabled             │  │
│  └──────────────────────────────────┘  │
└────────────────────────────────────────┘

LINE Bot Features

Feature	Description	Use Case
Rich Menu	Quick access to actions	Navigation to booking, wallet
Push Notifications	Send messages to users	Booking reminders, promotions
Webhook	Receive user messages	Chat commands, quick actions
LINE Login	Authentication	Seamless app access
LIFF	Mini app framework	Full booking experience

Messaging Flow

┌─────────────────────────────────────────────────────────────────────────────┐
│                         LINE MESSAGING FLOW                                 │
└─────────────────────────────────────────────────────────────────────────────┘

   USER                      LINE PLATFORM                     SERVER
    │                              │                              │
    │  ┌─────────────┐             │                              │
    │  │ User sends  │             │                              │
    │  │ message to  │────────────▶│                              │
    │  │ OA          │  Webhook    │                              │
    │  └─────────────┘             │                              │
    │                              │                              │
    │                              │  POST /webhook/line          │
    │                              │─────────────────────────────▶│
    │                              │                              │
    │                              │                              │  Process
    │                              │                              │  Message
    │                              │                              │◀─────────
    │                              │                              │
    │                              │  Reply Message               │
    │  ┌─────────────┐◀────────────│─────────────────────────────│
    │  │ Bot reply   │             │                              │
    │  │ (Rich menu/ │             │                              │
    │  │  text/flex) │             │                              │
    │  └─────────────┘             │                              │
    │                              │                              │
    │                              │                              │
    │  ┌─────────────┐             │                              │
    │  │ User clicks │             │                              │
    │  │ Rich Menu   │────────────▶│                              │
    │  └─────────────┘             │                              │
    │                              │                              │
    │                              │  LIFF App URL Redirect       │
    │  ┌─────────────┐◀────────────│─────────────────────────────│
    │  │ Open LIFF   │             │                              │
    │  │ App         │             │                              │
    │  └─────────────┘             │                              │
    │                              │                              │

┌─────────────────────────────────────────────────────────────────────────────┐
│                      RICH MENU CONFIGURATION                                │
└─────────────────────────────────────────────────────────────────────────────┘

      ┌─────────────────────────────┐
      │    📅 จองสนาม    │  💰 เติมเงิน │
      │    (Book)        │  (Top Up)   │
      ├─────────────────────────────┤
      │    📋 การจองของฉัน │  🎁 คะแนนสะสม │
      │    (My Bookings) │  (Points)   │
      ├─────────────────────────────┤
      │         🏠 หน้าหลัก            │
      │         (Home)               │
      └─────────────────────────────┘

      Tappable Areas:
      • "จองสนาม" → Opens /liff/book
      • "เติมเงิน" → Opens /liff/topup
      • "การจองของฉัน" → Opens /liff/book?tab=mybookings
      • "คะแนนสะสม" → Opens /liff/points
      • "หน้าหลัก" → Opens /liff/book

---

QR Code System

PromptPay QR Code Generation

┌─────────────────────────────────────────────────────────────────────────────┐
│                         PROMPTPAY QR SYSTEM                                 │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│                    QR CODE PAYMENT WORKFLOW                                 │
└─────────────────────────────────────────────────────────────────────────────┘

   ┌─────────────┐         ┌─────────────┐         ┌─────────────┐
   │   CUSTOMER  │         │     APP     │         │  PROMPTPAY  │
   │             │         │             │         │   SYSTEM    │
   └──────┬──────┘         └──────┬──────┘         └──────┬──────┘
          │                        │                      │
          │  1. Select Amount      │                      │
          │──────────────────────▶│                      │
          │                        │                      │
          │                        │  2. Generate QR     │
          │                        │  Payload             │
          │                        │─────────────────────▶│
          │                        │                      │
          │                        │  3. QR Image URL     │
          │  4. Show QR Code       │◀─────────────────────│
          │◀──────────────────────│                      │
          │                        │                      │
          │  5. Scan with          │                      │
          │  Banking App           │                      │
          │────────────────────────┼─────────────────────▶│
          │                        │                      │
          │                        │  6. Payment Complete │
          │  7. Payment Confirmed  │◀─────────────────────│
          │◀──────────────────────│                      │
          │                        │                      │
          │  8. Upload Slip        │                      │
          │──────────────────────▶│                      │
          │                        │                      │
          │                        │  9. Verify Payment   │
          │                        │─────────────────────▶│
          │                        │                      │
          │  10. Success           │                      │
          │◀──────────────────────│                      │


┌─────────────────────────────────────────────────────────────────────────────┐
│                    QR CODE FORMAT (EMVCO PROMPTPAY)                         │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│                                                                             │
│   QR Code Payload Format (EMVCo Standard):                                  │
│                                                                             │
│   ┌─────────────────────────────────────────────────────────────────────┐   │
│   │  00020101021229330016A00000067701011211660826539264                 │   │
│   │  52040000530376454050.005802TH5913Sportclub CNX                      │   │
│   │  6010Chiang Mai6304ABCD                                              │   │
│   └─────────────────────────────────────────────────────────────────────┘   │
│                                                                             │
│   Payload Breakdown:                                                        │
│   ─────────────────                                                        │
│   • 00: Payload Format Indicator (EMV QRC)                                 │
│   • 01: Point of Initiation Method (Static)                                │
│   • 29: Merchant Account Information - PromptPay                           │
│   • 52: Merchant Category Code (7999 - Sports)                             │
│   • 53: Transaction Currency (THB - 764)                                   │
│   • 54: Transaction Amount                                                 │
│   • 58: Country Code (TH)                                                  │
│   • 59: Merchant Name                                                      │
│   • 60: Merchant City                                                      │
│   • 63: CRC (Cyclic Redundancy Check)                                      │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                    QR CODE FOR POINT GRANT (SCAN QR)                        │
└─────────────────────────────────────────────────────────────────────────────┘

   ┌─────────────────────────────────────────────────────────────────────────┐
   │                                                                         │
   │                    🏆 SCAN TO EARN POINTS 🏆                           │
   │                                                                         │
   │   ┌─────────────────────────────────────────────────────────────────┐   │
   │   │                                                                 │   │
   │   │              ┌─────────────────────────────────┐                 │   │
   │   │              │                                 │                 │   │
   │   │              │      [QR CODE]                  │                 │   │
   │   │              │      Displayed Here             │                 │   │
   │   │              │                                 │                 │   │
   │   │              │   Scan with LINE Camera         │                 │   │
   │   │              │                                 │                 │   │
   │   │              └─────────────────────────────────┘                 │   │
   │   │                                                                 │   │
   │   │                   📱 LINE Scan QR                               │   │
   │   │                   Scan to earn 10 points!                       │   │
   │   │                   Limited time offer                             │   │
   │   │                                                                 │   │
   │   └─────────────────────────────────────────────────────────────────┘   │
   │                                                                         │
   │   Point Grant QR Flow:                                                  │
   │   ─────────────────                                                     │
   │   1. Customer scans QR code at front desk/court                        │
   │   2. LINE Camera opens LIFF app                                        │
   │   3. System validates QR (court ID, timestamp)                         │
   │   4. Points automatically credited to user wallet                      │
   │   5. User receives LINE notification with confirmation                 │
   │                                                                         │
   └─────────────────────────────────────────────────────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                    QR CODE TYPES AND PURPOSES                               │
└─────────────────────────────────────────────────────────────────────────────┘

┌────────────────┬────────────────────────┬───────────────────────────────┐
│    QR Type     │      Purpose           │        Usage                  │
├────────────────┼────────────────────────┼───────────────────────────────┤
│ Payment QR     │ Receive payments       │ Customer scans to pay         │
│ (PromptPay)    │ for top-up            │ for wallet credits            │
├────────────────┼────────────────────────┼───────────────────────────────┤
│ Check-in QR    │ Court check-in         │ Scan at court to verify       │
│                │                        │ booking, start timer          │
├────────────────┼────────────────────────┼───────────────────────────────┤
│ Point Grant QR │ Award loyalty points   │ Staff scans to give points    │
│                │                        │ to customers at counter       │
├────────────────┼────────────────────────┼───────────────────────────────┤
│ Promotion QR   │ Special offers         │ Campaign-specific QR codes    │
│                │                        │ for limited-time offers       │
├────────────────┼────────────────────────┼───────────────────────────────┤
│ Feedback QR    │ Collect feedback       │ After game, scan to rate     │
│                │                        │ service, earn bonus points    │
└────────────────┴────────────────────────┴───────────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                    QR CODE GENERATION FLOW                                  │
└─────────────────────────────────────────────────────────────────────────────┘

   Start
     │
     ▼
   ┌─────────────┐
   │ Generate    │◀──── Input: amount, paymentRef, phone
   │ QR Payload  │
   └──────┬──────┘
          │
          ▼
   ┌─────────────┐
   │ Create EMVCo│
   │ Format      │
   └──────┬──────┘
          │
          ▼
   ┌─────────────┐
   │ Generate    │─────▶ QR Image (PNG/SVG)
   │ Image URL   │       via QR Server API
   └──────┬──────┘
          │
          ▼
   ┌─────────────┐
   │ Display in  │
   │ App / Print │
   └─────────────┘

---

Revenue Model

┌─────────────────────────────────────────────────────────────────────────────┐
│                         REVENUE MODEL                                       │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│                         REVENUE STREAMS                                     │
└─────────────────────────────────────────────────────────────────────────────┘

┌────────────────┬────────────────┬────────────────┬────────────────────────┐
│   Revenue      │   Source       │   Amount       │   Frequency            │
│   Stream       │                │                │                        │
├────────────────┼────────────────┼────────────────┼────────────────────────┤
│ Court          │ Customer       │ Price per      │ Per booking            │
│ Booking        │ bookings       │ hour (e.g.,    │                        │
│ Revenue        │                │ ฿300-500)      │                        │
├────────────────┼────────────────┼────────────────┼────────────────────────┤
│ Wallet         │ Customer       │ 2-5% of        │ Per top-up             │
│ Load Fees      │ top-ups        │ top-up amount  │                        │
├────────────────┼────────────────┼────────────────┼────────────────────────┤
│ Premium        │ Members        │ ฿99-199/month  │ Monthly                │
│ Membership     │                │                │                        │
├────────────────┼────────────────┼────────────────┼────────────────────────┤
│ Advertising    │ Local sports   │ Variable       │ Monthly/Event          │
│                │ brands         │                │                        │
├────────────────┼────────────────┼────────────────┼────────────────────────┤
│ Event          │ Tournament     │ Entry fees     │ Per event              │
│ Hosting        │ organizers     │ (e.g., ฿300)   │                        │
└────────────────┴────────────────┴────────────────┴────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                      PRICING STRUCTURE                                      │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│                       COURT PRICING (Example)                               │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│   Court Type         │ Weekday (9:00-17:00) │ Weekday (17:00-22:00) │      │
│                      │   / Weekend          │   / Holiday          │      │
│   ───────────────────────────────────────────────────────────────────────  │
│                                                                             │
│   Tennis Court       │      ฿300/hour       │      ฿450/hour       │      │
│   (Standard)         │                     │                      │      │
│                                                                             │
│   Tennis Court       │      ฿400/hour       │      ฿550/hour       │      │
│   (Premium)          │                     │                      │      │
│                                                                             │
│   Badminton Court    │      ฿200/hour       │      ฿300/hour       │      │
│   (Standard)         │                     │                      │      │
│                                                                             │
│   Badminton Court    │      ฿250/hour       │      ฿400/hour       │      │
│   (Premium)          │                     │                      │      │
│                                                                             │
├─────────────────────────────────────────────────────────────────────────────┤
│                       ADDITIONAL FEES                                       │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│   Equipment Rental   │  Shuttlecock: ฿50/ea  │  Racket: ฿100/day   │      │
│   Coaching           │  Group: ฿400/hr       │  Private: ฿800/hr   │      │
│   Late Fee           │  ฿100 per 15 min late│                     │      │
│   Cancellation       │  <24hr notice: 50%   │  <2hr notice: 100%  │      │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                      LOYALTY PROGRAM STRUCTURE                              │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│                       POINT EARNING                                         │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│   Activity                    │  Points Earned      │  Notes               │
│   ───────────────────────────────────────────────────────────────────────  │
│                                                                             │
│   Court Booking               │  1 point/hour       │  Base earning        │
│   Weekend Booking             │  1.5 points/hour    │  Bonus               │
│   Holiday Booking             │  2 points/hour      │  Bonus               │
│   First Booking of Day        │  +10 points         │  Daily bonus         │
│   Check-in via QR             │  +5 points          │  At venue            │
│   Leave Review (5★)           │  +20 points         │  Per review          │
│   Refer New User              │  +100 points        │  On their first      │
│                               │                     │  booking             │
│   Complete Profile            │  +50 points         │  One-time            │
│                                                                             │
├─────────────────────────────────────────────────────────────────────────────┤
│                       POINT REDEMPTION                                      │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│   Redemption                          │  Points Required  │  Value          │
│   ───────────────────────────────────────────────────────────────────────  │
│                                                                             │
│   ฿50 Discount                         │  500 points       │  ฿50            │
│   ฿100 Discount                        │  900 points       │  ฿100           │
│   Free 1-Hour Court                   │  2,500 points     │  ฿300-500       │
│   Free Equipment Rental               │  500 points       │  ฿50-100        │
│   Priority Booking (Skip Queue)       │  1,000 points     │  Convenience    │
│   VIP Membership (1 Month)            │  5,000 points     │  ฿99-199 value  │
│                                                                             │
├─────────────────────────────────────────────────────────────────────────────┤
│                       MEMBERSHIP TIERS                                      │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│   Tier           │  Points/Month  │  Benefits                              │
│   ───────────────────────────────────────────────────────────────────────  │
│                                                                             │
│   Bronze         │  0-499         │  • Standard pricing                    │
│   (Default)      │                │  • Basic point earning                 │
│                                                                             │
│   Silver         │  500-1,499     │  • 10% discount on bookings            │
│                  │                │  • 1.2x point earning                  │
│                  │                │  • Priority support                    │
│                                                                             │
│   Gold           │  1,500-2,999   │  • 15% discount on bookings            │
│                  │                │  • 1.5x point earning                  │
│                  │                │  • Free equipment rental (2x/month)    │
│                  │                │  • Advance booking (24hr)              │
│                                                                             │
│   Platinum       │  3,000+        │  • 20% discount on bookings            │
│                  │                │  • 2x point earning                    │
│                  │                │  • Free equipment rental (unlimited)   │
│                  │                │  • Advance booking (48hr)              │
│                  │                │  • Dedicated phone support             │
│                  │                │  • Free guest pass (1x/month)          │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘

---

Implementation Timeline

┌─────────────────────────────────────────────────────────────────────────────┐
│                      IMPLEMENTATION TIMELINE                                │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│                         PHASE 1: FOUNDATION                                 │
│                         (Weeks 1-4)                                         │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│   Week 1  │ [██████] Setup development environment                         │
│           │ [██████] Configure LINE Developer Console                       │
│           │ [██████] Initialize Next.js project with TypeScript            │
│                                                                             │
│   Week 2  │ [██████] Set up database schema (Prisma/PostgreSQL)            │
│           │ [██████] Create basic authentication (LINE Login)              │
│           │ [██████] Build core UI components                              │
│                                                                             │
│   Week 3  │ [██████] Implement court browsing and selection                │
│           │ [██████] Build booking flow (date/time selection)              │
│           │ [██████] Create booking confirmation                           │
│                                                                             │
│   Week 4  │ [██████] Integrate PromptPay QR payment                        │
│           │ [██████] Build wallet top-up functionality                     │
│           │ [██████] Testing and bug fixes                                 │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘
                                    │
                                    ▼
┌─────────────────────────────────────────────────────────────────────────────┐
│                         PHASE 2: ENHANCEMENT                                │
│                         (Weeks 5-8)                                         │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│   Week 5  │ [██████] Implement LINE Bot notifications                      │
│           │ [██████] Add booking reminders (1hr before)                    │
│           │ [██████] Build user profile and history                        │
│                                                                             │
│   Week 6  │ [██████] Create loyalty points system                          │
│           │ [██████] Implement point earning and redemption                │
│           │ [██████] Add check-in QR code feature                          │
│                                                                             │
│   Week 7  │ [██████] Build admin dashboard                                 │
│           │ [██████] Create booking management for staff                   │
│           │ [██████] Implement payment verification                        │
│                                                                             │
│   Week 8  │ [██████] Performance optimization                              │
│           │ [██████] Security audit and fixes                              │
│           │ [██████] User acceptance testing                               │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘
                                    │
                                    ▼
┌─────────────────────────────────────────────────────────────────────────────┐
│                         PHASE 3: LAUNCH                                     │
│                         (Weeks 9-12)                                        │
├─────────────────────────────────────────────────────────────────────────────┤
│                                                                             │
│   Week 9  │ [██████] Soft launch with beta users                           │
│           │ [██████] Collect feedback and iterate                          │
│           │ [██████] Bug fixes and improvements                            │
│                                                                             │
│   Week 10 │ [██████] Marketing campaign launch                             │
│           │ [██████] LINE OA promotional messages                          │
│           │ [██████] Social media promotion                                │
│                                                                             │
│   Week 11 │ [██████] Full public launch                                    │
│           │ [██████] Monitor system performance                            │
│           │ [██████] Customer support setup                                │
│                                                                             │
│   Week 12 │ [██████] Analyze metrics and KPIs                              │
│           │ [██████] Plan Phase 2 features                                │
│           │ [██████] Documentation and training                            │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                         MILESTONE TRACKER                                   │
└─────────────────────────────────────────────────────────────────────────────┘

Milestone              │ Target Date   │ Status     │ Completion
───────────────────────┼───────────────┼────────────┼─────────────
Development Setup      │ Week 1        │ □ Pending  │ 0%
LINE Integration       │ Week 2        │ □ Pending  │ 0%
Core Booking Flow      │ Week 4        │ □ Pending  │ 0%
Payment Integration    │ Week 5        │ □ Pending  │ 0%
Beta Launch            │ Week 9        │ □ Pending  │ 0%
Public Launch          │ Week 11       │ □ Pending  │ 0%
Post-Launch Review     │ Week 12       │ □ Pending  │ 0%

---

Success Metrics

┌─────────────────────────────────────────────────────────────────────────────┐
│                         SUCCESS METRICS (KPIs)                              │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│                         KEY PERFORMANCE INDICATORS                          │
└─────────────────────────────────────────────────────────────────────────────┘

┌──────────────────────────────┬─────────────────┬───────────────────────────┐
│           Metric             │  Target (3 mo)  │       Target (6 mo)       │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ USERS                        │                 │                           │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ Active Users (MAU)           │     500         │         2,000             │
│ New User Registrations       │     200/month   │         500/month         │
│ User Retention (Day 30)      │     40%         │          50%              │
│ LINE OA Followers            │   1,000         │         3,000             │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ ENGAGEMENT                   │                 │                           │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ Daily Active Users (DAU)     │     100         │         400               │
│ DAU/MAU Ratio                │     20%         │          25%              │
│ Avg. Session Duration        │     3 min       │          5 min            │
│ Bookings per User            │   2/month       │        4/month            │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ BOOKINGS                     │                 │                           │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ Total Bookings               │     1,000       │         5,000             │
│ Booking Conversion Rate      │     35%         │          45%              │
│ No-Show Rate                 │     <10%        │           <5%             │
│ Repeat Booking Rate          │     50%         │          65%              │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ REVENUE                      │                 │                           │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ Gross Transaction Value      │   ฿300,000      │      ฿1,500,000           │
│ Wallet Top-up Volume         │   ฿200,000      │      ฿1,000,000           │
│ Avg. Revenue per Booking     │     ฿350        │          ฿400             │
│ Customer Lifetime Value      │     ฿1,500      │          ฿2,500           │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ LOYALTY                      │                 │                           │
├──────────────────────────────┼─────────────────┼───────────────────────────┤
│ Points Redeemed              │   50,000 pts    │        200,000 pts        │
│ Members in Loyalty Program   │     300         │         1,200             │
│ Tier Upgrade Rate            │     15%         │           25%             │
└──────────────────────────────┴─────────────────┴───────────────────────────┘


┌─────────────────────────────────────────────────────────────────────────────┐
│                      SUCCESS METRICS DASHBOARD                              │
└─────────────────────────────────────────────────────────────────────────────┘

┌─────────────────────────────────────────────────────────────────────────────┐
│                                                                             │
│   ┌─────────────────────────────────────────────────────────────────────┐   │
│   │                    📊 SUCCESS METRICS DASHBOARD                     │   │
│   ├─────────────────────────────────────────────────────────────────────┤   │
│   │                                                                     │   │
│   │   ┌─────────────┐  ┌─────────────┐  ┌─────────────┐  ┌─────────┐  │   │
│   │   │   ACTIVE    │  │  BOOKINGS   │  │   REVENUE   │  │  NPS    │  │   │
│   │   │   USERS     │  │   THIS MO   │  │   THIS MO   │  │  SCORE  │  │   │
│   │   │             │  │             │  │             │  │         │  │   │
│   │   │     0       │  │      0      │  │      ฿0     │  │    0    │  │   │
│   │   │   / 500     │  │   / 1000    │  │  / ฿300K    │  │  / 50   │  │   │
│   │   │             │  │             │  │             │  │         │  │   │
│   │   │   ░░░░░░░   │  │   ░░░░░░░   │  │   ░░░░░░░   │  │  ░░░░░░  │  │   │
│   │   │   0%        │  │    0%       │  │    0%       │  │   0%    │  │   │
│   │   └─────────────┘  └─────────────┘  └─────────────┘  └─────────┘  │   │
│   │                                                                     │   │
│   │   ┌───────────────────────────────────────────────────────────┐   │   │
│   │   │  Bookings Trend (Last 7 Days)                             │   │   │
│   │   │                                                           │   │   │
│   │   │  50 ┤                                                    │   │   │
│   │   │  40 ┤    ██                                              │   │   │
│   │   │  30 ┤    ██  ██                                          │   │   │
│   │   │  20 ┤    ██  ██  ██  ██                                │   │   │
│   │   │  10 ┤    ██  ██  ██  ██  ██  ██  ██                    │   │   │
│   │   │   0 ┼────██──██──██──██──██──██──██── Mon               │   │   │
│   │   └───────────────────────────────────────────────────────────┘   │   │
│   │                                                                     │   │
│   │   ┌───────────────────────────────────────────────────────────┐   │   │
│   │   │  Top Courts                                               │   │   │
│   │   │                                                           │   │   │
│   │   │  Tennis Court 1     ████████████████████  120 bookings    │   │   │
│   │   │  Tennis Court 2     ██████████████████    100 bookings    │   │   │
│   │   │  Badminton A        ████████████████       80 bookings    │   │   │
│   │   └───────────────────────────────────────────────────────────┘   │   │
│   │                                                                     │   │
│   └─────────────────────────────────────────────────────────────────────┘   │
│                                                                             │
└─────────────────────────────────────────────────────────────────────────────┘

---

Appendix

A. Technology Stack

Category	Technology	Version
Frontend	Next.js	16.1.1
Frontend	React	19.2.3
Styling	Tailwind CSS	Latest
Database	PostgreSQL	Latest
ORM	Prisma	Latest
LINE SDK	@line/liff	2.21.0
Payment	PromptPay	EMVCo
Icons	Lucide React	Latest
Calendar	date-fns	Latest

B. API Endpoints

Endpoint	Method	Description
/api/auth/user	POST	LINE user authentication
/api/branches	GET	List all branches
/api/courts/:id	GET	Court details & availability
/api/bookings	POST	Create new booking
/api/bookings	GET	List user's bookings
/api/bookings/:id	GET	Booking details
/api/bookings/:id	DELETE	Cancel booking
/api/wallet/topup	POST	Generate payment QR
/api/wallet/slip	POST	Upload payment slip
/api/wallet/balance	GET	Get user balance
/api/wallet/transactions	GET	Transaction history
/api/points	GET	Get points balance
/api/points/history	GET	Points transactions
/webhook/line	POST	LINE Bot webhook

C. Database Schema (Key Tables)

Users
├── id (PK)
├── lineUserId (unique)
├── name
├── email
├── phone
├── credits (Decimal)
├── totalPoints (Int)
├── currentTier (Enum: Bronze/Silver/Gold/Platinum)
└── createdAt

Branches
├── id (PK)
├── name
├── address
├── phone
└── isActive

Courts
├── id (PK)
├── branchId (FK)
├── name
├── type (Enum: tennis/badminton)
├── pricePerHour (Decimal)
└── isActive

Bookings
├── id (PK)
├── userId (FK)
├── courtId (FK)
├── date
├── startTime
├── endTime
├── totalPrice (Decimal)
├── status (Enum: pending/confirmed/cancelled/completed)
├── paymentStatus (Enum: pending/paid/failed)
└── createdAt

Transactions
├── id (PK)
├── userId (FK)
├── type (Enum: topup/booking/refund/bonus)
├── amount (Decimal)
├── status (Enum: pending/completed/failed)
└── createdAt

PaymentSlips
├── id (PK)
├── userId (FK)
├── amount (Decimal)
├── paymentRef (unique)
├── status (Enum: pending/verified/rejected)
└── createdAt

---

Document Information

Item	Details
Document Title	LINE MINI App Planning Overview
Version	1.0
Author	Sportclub CNX Development Team
Created	January 2026
Last Updated	January 2026
Status	Draft / Planning

---

© 2026 Sportclub CNX. All rights reserved.

This document is confidential and intended for internal use only.