Суть проєкту: веб-додаток, де лікарі можуть вести інтерактивні стоматологічні карти пацієнтів (котів та собак)
Дизайн інтерфейсу та всі елементи щелеп уже повністю готові у Figma (векторні SVG з розділенням по окремих зубах)
Необхідний функціонал:
Авторизація та кабінет користувача: Реєстрація лікарів, збереження профілю та історії створених ними карток
Інтерактивна дентальна карта (головний модуль): Рендеринг SVG-щелепи, клікабельність кожного зуба, вибір патологій із меню, динамічна зміна кольору зуба на схемі та генерація текстового звіту
Експорт даних: Генерація заповненої карти та звіту в PDF для друку або відправки клієнту
Монетизація та білінг:
Підготовка до інтеграції платіжної системи
Модель підписки (щомісячна/щорічна оплата) та лічильник днів, що залишилися до кінця дії доступу
Маркетинг: система промокодів на знижку при оплаті та проста реферальна програма (бонуси за запрошеного колегу)
В figma make є "референс" того, що приблизно потрібно створити, всі деталі розповім в повідомленнях
Загальна архітектура
Стек: React 18 + TypeScript + Vite 6, Tailwind CSS v4, Supabase (PostgreSQL + Edge Functions), Hono (Deno сервер), Radix UI / ShadCN компоненти.
Патерн: Centralized state у useAppInitialization → prop drilling через App.tsx → AppContent (роутер) → сторінки/компоненти.
Навігація: Hash-based routing (section state machine, без react-router для основних розділів).
Демо-режим: Повноцінний fallback без бекенду — demo-api.tsx з мок-даними та симуляцією затримок.
Ключовий функціонал:
Пацієнти
- створення/видалення пацієнта
- редагування
- Вибір активного пацієнта через PatientSelector у хедері
- Перегляд у вигляді таблиці та карток
- Вкладки: огляд, нотатки, візити, стоматологія
Нагадування
- Створення/редагування/видалення
- Drag & drop переупорядкування (react-dnd)
- Пріоритети та статуси
- Щоденний віджет на dashboard
Стоматологічні карти
- Собаки — стандартна система нумерації
- Коти — система Triadan з анатомічно відсутніми зубами
- Редагування статусу зуба за 1-2 кліки
- ToothEditor — нотатки та процедури по кожному зубу
- MassEditor — масове редагування
- PerioModule — пародонтологічний модуль
- Автозбереження
- Zoom/pan контроли (ZoomControls)
- Генерація PDF-звітів
- Пошук
- Глобальний пошук (useGlobalSearch) з модальним вікном
- Збереження історії пошуку
- Гарячі клавіші
3 тем: light, dark, pastel
2 мови: UA / EN
3 розміри інтерфейсу: compact, normal, large
Адаптивність під всі види пристроїв (ПК/Мобайл/Планшет)
Не проти використання готових рішень, бібліотек, open-source шаблонів та AI-інструментів (Cursor, v0, вайбкодинг тощо)
