← Zpět na AI Lab
Full-stack aplikace / Cursor + Next.js

KatkaAI.hub

Centrální dashboard pro správu času, úkolů a měsíčních plánů. Spojuje Freelo, manuální tracking a TODO management na jednom místě.

V PROVOZU od 3. února 2026

Co je KatkaAI.hub? Full-stack webová aplikace (Next.js + Supabase) nasazená na Vercel. Dashboard pro sledování odpracovaných hodin, správu úkolů a vizualizaci měsíčních plánů – vše s Katka.ai design systémem.

Proč vznikla? Hodiny pro Next Mind byly ve Freelo, ale ostatní oblasti (Alesio, Vzdělávání, Brand) nebyly nikde trackované. Měsíční plány zůstávaly statickými dokumenty bez real-time sledování.

Pro koho je to relevantní? Freelanceři a malé týmy hledající vlastní time-tracking. Vývojáři zajímající se o Next.js + Supabase stack. Příklad budování full-stack aplikace v Cursoru.

Statistiky projektu

3 dny
Doba vývoje MVP
8
Modulů / stránek
7
DB tabulek
3000+
Řádků kódu

Architektura systému

Třívrstvá architektura: klient (browser) → aplikační server (Vercel/Next.js) → datová vrstva (Supabase + Freelo API).

🖥️ Desktop Chrome, Safari, Edge
📱 Mobil Responsive + PWA
↓ ↓ ↓HTTPS↓ ↓ ↓
⚡ Vercel — Next.js 16 (App Router) SSR + API Routes + Auth Middleware
8 stránek 6 API routes 4 komponenty
↓ ↓ Supabase JS Client ↓ ↓
🗄️ Supabase PostgreSQL + Auth + RLS
7 tabulek • Frankfurt (eu-central-1)
🔗 Freelo API api.freelo.io
Work Reports sync

Moduly aplikace

Každý modul je samostatná stránka (Next.js App Router) s vlastním stavem. Všechny sdílejí AppLayout (sidebar + mobile header) a AuthProvider.

📊
Dashboard
/
Přehled hodin dnes/měsíc, plnění plánu, progress po oblastech, poslední záznamy.
areas, time_entries, monthly_plans
✅
Úkoly
/tasks
Správa úkolů s kalendářem (měsíc/týden), edit modal, quick date shift, priority.
tasks, areas, projects
🕐
Time Tracking
/time
Seznam záznamů, CRUD, filtrování podle období a oblasti, přidávání nových.
time_entries, areas
⏱️
Timer
/timer
Start/Stop/Pause timer, výběr oblasti. Při zastavení automaticky vytvoří time entry.
timer_sessions → time_entries
📅
Plány
/plans
Měsíční statistiky, navigace mezi měsíci, progress bary podle oblastí.
time_entries, areas, monthly_plans
📈
Reporty
/reports
Bar chart (dny), pie chart (oblasti), detail, CSV export. Recharts knihovna.
time_entries, areas
⚙️
Nastavení
/settings
Freelo sync trigger, status integrace, log synchronizace.
freelo_sync_log, areas
🔐
Login
/login
Supabase Auth (email + heslo). AuthProvider chrání všechny ostatní stránky.
Supabase Auth

Tok dat

Data vstupují do systému třemi cestami a zobrazují se napříč moduly.

👤 Manuální zápis → time_entries Stránka /time — přímé zadání hodin
⏱️ Timer → timer_sessions → time_entries Start/Stop — auto-vytvoření záznamu
🔗 Freelo API → /api/freelo-sync → time_entries Work reports → import s deduplikací
📋 TODO import → /api/import-todos → tasks Parsování markdown TODO.md
time_entries → Dashboard, Reporty, Plány Agregace, grafy, progress bary
tasks + projects → Úkoly (kalendář, filtry) CRUD, priority, kalendář

Databázové schéma

7 tabulek v Supabase PostgreSQL. Centrální tabulka areas (6 pracovních oblastí) propojuje vše dohromady.

🎯 areas
id UUID PK
name TEXT
color TEXT
icon TEXT
target_hours_monthly INT
sort_order INT
🕐 time_entries
id UUID PK
area_id FK → areas
date DATE
hours DECIMAL
description TEXT
source TEXT
✅ tasks
id UUID PK
area_id FK → areas
project_id FK → projects
title TEXT
completed BOOL
due_date DATE
priority INT (1-4)
📁 projects
id UUID PK
area_id FK → areas
code TEXT
name TEXT
is_active BOOL
⏱️ timer_sessions
id UUID PK
area_id FK → areas
started_at TIMESTAMPTZ
ended_at TIMESTAMPTZ
is_active BOOL
description TEXT
📅 monthly_plans
id UUID PK
year INT
month INT
total_hours INT
areas_allocation JSONB
🔄 freelo_sync_log
id UUID PK
synced_at TIMESTAMPTZ
records_count INT
status TEXT
error_message TEXT

Tech Stack

Technologie Verze Účel
Next.js 16.1.6 App Router, SSR, API routes
React 19.2.3 UI framework
Supabase 2.94.0 PostgreSQL, Auth, RLS
Tailwind CSS 4.x Utility CSS (config v globals.css)
Recharts 3.7.0 Bar/Pie/Line grafy v Reportech
Lucide React 0.563 Ikony v celé aplikaci
Vercel — Hosting, auto-deploy z GitHub
Cursor IDE — AI-powered vývoj celé aplikace

Průběh vývoje

3.2. odp. MVP
→
3.2. večer Deploy
→
3.2. – 4.2. Freelo sync
→
4.2. Tasks + Projects
→
5.2. Mobile + Auth

Timeline

Datum Milestone Klíčové
3.2. odp. Kompletní MVP 5 stránek, 4 komponenty, 2 API endpointy, ~3000 řádků
3.2. večer Vercel deploy + Supabase LIVE na katkaai-hub.vercel.app, 6 DB tabulek
3.2. noc Freelo API doména Zjištění: api.freelo.io, ne .cz
4.2. ráno Freelo sync funguje 39 záznamů, 27.65h importováno
4.2. odp. Tasks + Projects Edit modal, quick date, 26 projektů, kalendář
5.2. Mobile + Auth + PWA Hamburger menu, login page, Supabase Auth

Struktura projektu

03_KatkaAI_Hub/
├── PROJECT_BRIEF.md
├── Pracovni_denik/
│   └── pracovni_denik.md
├── docs/
│   ├── ARCHITECTURE.md
│   ├── SUPABASE_SETUP.md
│   ├── VERCEL_DEPLOY.md
│   └── *.sql
└── app/                          # Next.js root
    ├── src/
    │   ├── app/
    │   │   ├── layout.tsx        # Root layout + Providers
    │   │   ├── page.tsx          # Dashboard
    │   │   ├── globals.css       # Tailwind v4 + design tokens
    │   │   ├── tasks/page.tsx
    │   │   ├── time/page.tsx
    │   │   ├── timer/page.tsx
    │   │   ├── plans/page.tsx
    │   │   ├── reports/page.tsx
    │   │   ├── settings/page.tsx
    │   │   ├── login/page.tsx
    │   │   └── api/
    │   │       ├── freelo-sync/route.ts
    │   │       ├── freelo-debug/route.ts
    │   │       ├── debug-sync/route.ts
    │   │       ├── debug-tasks/route.ts
    │   │       ├── import-todos/route.ts
    │   │       └── init-projects/route.ts
    │   ├── components/
    │   │   ├── AppLayout.tsx     # Mobile header + sidebar wrapper
    │   │   ├── Sidebar.tsx       # Navigace + auth check
    │   │   ├── AuthGuard.tsx
    │   │   ├── Providers.tsx     # AuthProvider wrapper
    │   │   ├── StatsCard.tsx
    │   │   ├── ProgressBar.tsx
    │   │   └── AreaBadge.tsx
    │   ├── lib/
    │   │   ├── supabase.ts       # DB client + CRUD helpers
    │   │   ├── freelo.ts         # Freelo API client
    │   │   └── auth.tsx          # AuthProvider + useAuth hook
    │   └── types/
    │       └── database.ts
    └── package.json

Pracovní oblasti

6 oblastí s barevným kódováním – používají se napříč celou aplikací.

🧠
Next Mind
80h / měsíc
🏛️
Xantipa
20h / měsíc
📚
Vzdělávání
25h / měsíc
☕
Alesio
20h / měsíc
✨
Brand Katka.ai
10h / měsíc
🤝
Cofis
5h / měsíc

Stav projektu

Hotovo

  • Dashboard s real-time daty
  • Time Tracking (CRUD)
  • Timer (Start/Stop)
  • Tasks + kalendář + edit
  • Projects systém (26 projektů)
  • Freelo sync (39+ záznamů)
  • Reporty s grafy + CSV export
  • Měsíční plány
  • Supabase Auth + Login
  • Mobilní responzivita
  • Vercel deployment

V plánu

  • PWA plná podpora (offline, SW)
  • Notifikace (deadlines, reminders)
  • AI agent pro návrhy rozdělení času
  • Automatický Freelo sync (cron)
  • Chatbot analytics dashboard
  • Fakturace integrace
Otevřít aplikaci → ← Zpět na AI Lab