diff --git a/src/app/(app)/meds/[id]/edit/page.tsx b/src/app/(app)/meds/[id]/edit/page.tsx new file mode 100644 index 0000000..cf27c90 --- /dev/null +++ b/src/app/(app)/meds/[id]/edit/page.tsx @@ -0,0 +1,46 @@ +'use client' + +import { useEffect, useState } from 'react' +import { useRouter } from 'next/navigation' +import { useLiveQuery } from 'dexie-react-hooks' +import { db } from '@/lib/sync' +import { Header, PageContainer } from '@/components/layout/header' +import { MedicationForm } from '@/components/medications/MedicationForm' +import { LoadingState } from '@/components/ui' + +export default function EditMedicationPage({ params }: { params: { id: string } | Promise<{ id: string }> }) { + const [medicationId, setMedicationId] = useState('') + + useEffect(() => { + if (params instanceof Promise) { + params.then((p) => setMedicationId(p.id)) + } else { + setMedicationId(params.id) + } + }, [params]) + + const medication = useLiveQuery( + () => (medicationId ? db.medications.get(medicationId) : undefined), + [medicationId] + ) + + if (!medicationId || !medication) { + return ( + <> +
+ + + + + ) + } + + return ( + <> +
+ + + + + ) +} diff --git a/src/app/(app)/meds/[id]/page.tsx b/src/app/(app)/meds/[id]/page.tsx index 5ccf30c..63838fd 100644 --- a/src/app/(app)/meds/[id]/page.tsx +++ b/src/app/(app)/meds/[id]/page.tsx @@ -3,7 +3,7 @@ import { useEffect, useState, useCallback } from 'react' import { useRouter } from 'next/navigation' import { format } from 'date-fns' -import { Pill, Clock, Trash2, History, X } from 'lucide-react' +import { Pill, Clock, Trash2, History, X, Edit2 } from 'lucide-react' import { useLiveQuery } from 'dexie-react-hooks' import { db, logDose, undoDose } from '@/lib/sync' @@ -153,9 +153,9 @@ export default function MedicationDetailPage({ params }: { params: { id: string rightAction={ currentWorkspace.role !== 'VIEWER' ? { - icon: , - label: 'Delete', - onClick: () => setShowDeleteModal(true), + icon: , + label: 'Edit', + onClick: () => router.push(`/meds/${medication.id}/edit`), } : undefined } @@ -257,6 +257,20 @@ export default function MedicationDetailPage({ params }: { params: { id: string )} + + {/* Delete Action */} + {currentWorkspace.role !== 'VIEWER' && ( +
+ +
+ )} {/* Delete Confirmation Modal */} diff --git a/src/app/(app)/meds/new/page.tsx b/src/app/(app)/meds/new/page.tsx index bd00b91..a9a86ef 100644 --- a/src/app/(app)/meds/new/page.tsx +++ b/src/app/(app)/meds/new/page.tsx @@ -1,334 +1,15 @@ 'use client' -import { useState } from 'react' -import { useRouter } from 'next/navigation' -import { Button, Input, Textarea, Select, Card, showToast } from '@/components/ui' import { Header, PageContainer } from '@/components/layout/header' -import { useApp } from '../../provider' - -type ScheduleType = 'FIXED_TIMES' | 'INTERVAL' | 'WEEKDAYS' | 'PRN' - -const scheduleTypeOptions = [ - { value: 'FIXED_TIMES', label: 'Fixed times daily' }, - { value: 'INTERVAL', label: 'Every X hours' }, - { value: 'WEEKDAYS', label: 'Specific days of week' }, - { value: 'PRN', label: 'As needed (PRN)' }, -] - -const weekdays = [ - { value: 0, label: 'Sun' }, - { value: 1, label: 'Mon' }, - { value: 2, label: 'Tue' }, - { value: 3, label: 'Wed' }, - { value: 4, label: 'Thu' }, - { value: 5, label: 'Fri' }, - { value: 6, label: 'Sat' }, -] +import { MedicationForm } from '@/components/medications/MedicationForm' export default function NewMedicationPage() { - const router = useRouter() - const { currentWorkspace, refreshData } = useApp() - - const [name, setName] = useState('') - const [instructions, setInstructions] = useState('') - const [scheduleType, setScheduleType] = useState('FIXED_TIMES') - - // Fixed times - const [times, setTimes] = useState(['08:00']) - - // Interval - const [intervalHours, setIntervalHours] = useState(8) - const [startTime, setStartTime] = useState('08:00') - - // Weekdays - const [selectedDays, setSelectedDays] = useState([1, 3, 5]) - const [weekdayTime, setWeekdayTime] = useState('09:00') - - // PRN - const [minHoursBetween, setMinHoursBetween] = useState(4) - - // Refill tracking (optional) - const [trackRefills, setTrackRefills] = useState(false) - const [pillCount, setPillCount] = useState('') - const [pillsPerDose, setPillsPerDose] = useState(1) - const [refillThreshold, setRefillThreshold] = useState(7) - - const [loading, setLoading] = useState(false) - const [error, setError] = useState('') - - const addTime = () => { - setTimes([...times, '12:00']) - } - - const removeTime = (index: number) => { - setTimes(times.filter((_, i) => i !== index)) - } - - const updateTime = (index: number, value: string) => { - const newTimes = [...times] - newTimes[index] = value - setTimes(newTimes) - } - - const toggleDay = (day: number) => { - if (selectedDays.includes(day)) { - setSelectedDays(selectedDays.filter((d) => d !== day)) - } else { - setSelectedDays([...selectedDays, day].sort()) - } - } - - const buildScheduleData = () => { - switch (scheduleType) { - case 'FIXED_TIMES': - return { type: 'FIXED_TIMES', times } - case 'INTERVAL': - return { type: 'INTERVAL', hours: intervalHours, startTime } - case 'WEEKDAYS': - return { type: 'WEEKDAYS', days: selectedDays, time: weekdayTime } - case 'PRN': - return { type: 'PRN', minHoursBetween } - } - } - - const handleSubmit = async (e: React.FormEvent) => { - e.preventDefault() - setError('') - setLoading(true) - - try { - const response = await fetch( - `/api/workspaces/${currentWorkspace.id}/medications`, - { - method: 'POST', - headers: { 'Content-Type': 'application/json' }, - body: JSON.stringify({ - name, - instructions: instructions || null, - scheduleType, - scheduleData: buildScheduleData(), - active: true, - // Refill tracking (optional) - ...(trackRefills && pillCount !== '' && { - pillCount: Number(pillCount), - pillsPerDose, - refillThreshold, - }), - }), - } - ) - - if (!response.ok) { - const data = await response.json() - throw new Error(data.error || 'Failed to add medication') - } - - await refreshData() - showToast('Medication added', 'success') - router.push('/meds') - } catch (err) { - setError(err instanceof Error ? err.message : 'Something went wrong') - } finally { - setLoading(false) - } - } - return ( <>
- -
- setName(e.target.value)} - placeholder="e.g., Paracetamol 500mg" - required - /> - -