Skip to content

Commit 94c12c6

Browse files
KalhamaKalhama
committed
feat(gluwave): show recent entries lists
make routing more robust
1 parent 19d5524 commit 94c12c6

File tree

10 files changed

+373
-365
lines changed

10 files changed

+373
-365
lines changed

‎gluwave/src/app/(app-menu)/carbs/list/[date]/page.tsx

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { CarbsList } from '../carbs-list'
2+
3+
export default CarbsList

‎gluwave/src/app/(app-menu)/carbs/list/carbs-list.tsx

+110
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,110 @@
1+
import { deleteCarbs } from '@/actions/delete-carbs'
2+
import { validateRequest } from '@/auth'
3+
import { CarbDialog } from '@/components/carb-dialog'
4+
import { ClientDateTime } from '@/components/client-datetime'
5+
import { DeleteDialog } from '@/components/delete-dialog'
6+
import { PageDatePicker } from '@/components/page-date-picker'
7+
import { Button } from '@/components/ui/button'
8+
import { Progress } from '@/components/ui/progress'
9+
import { Separator } from '@/components/ui/separator'
10+
import { Statistics } from '@/lib/sql_utils'
11+
import { addHours, parseISO, subHours } from 'date-fns'
12+
import { Pencil } from 'lucide-react'
13+
import { redirect } from 'next/navigation'
14+
import * as React from 'react'
15+
16+
interface Props {
17+
params: {
18+
date?: string
19+
}
20+
}
21+
22+
export async function CarbsList({ params }: Props) {
23+
const date = params?.date ? new Date(Number(params.date)) : undefined
24+
25+
const { user } = await validateRequest()
26+
if (!user) {
27+
redirect('/login')
28+
}
29+
30+
const now = new Date()
31+
const start = subHours(date ?? now, date ? 0 : 24)
32+
const end = addHours(date ?? now, 24)
33+
34+
const tf = Statistics.carbs_timeframe(user.id, start, end)
35+
let carbs = await Statistics.execute(
36+
Statistics.attributed_carbs_simple(
37+
tf,
38+
user.id,
39+
user.carbohydrateRatio,
40+
user.correctionRatio
41+
)
42+
)
43+
44+
carbs = carbs
45+
.filter(
46+
(carb) =>
47+
carb.id !== -1 &&
48+
carb.timestamp.getTime() >= start.getTime() &&
49+
carb.timestamp.getTime() <= end.getTime()
50+
)
51+
.sort((a, b) => b.timestamp.getTime() - a.timestamp.getTime())
52+
53+
return (
54+
<>
55+
<PageDatePicker baseUrl="/carbs/list" date={date} />
56+
<div className="space-y-4 border bg-white max-w-5xl mx-auto rounded-md shadow p-2 mt-4">
57+
<div>
58+
{carbs.map((carb, i, arr) => {
59+
const over = carb.observedCarbs > carb.carbs
60+
61+
return (
62+
<div key={carb.id}>
63+
<div className="p-2">
64+
<div className="grid grid-cols-2 pb-2">
65+
<div>
66+
<div>{Math.round(carb.carbs)} g </div>
67+
<div>Observed: {Math.round(carb.observedCarbs)} g </div>
68+
</div>
69+
<div className="flex items-center gap-2 justify-end">
70+
<div>
71+
<ClientDateTime timestamp={carb.timestamp} /> +{' '}
72+
{(carb.decay / 60).toLocaleString([], {
73+
maximumFractionDigits: 1,
74+
})}
75+
<span> h</span>
76+
</div>
77+
<div>
78+
<CarbDialog carb={carb}>
79+
<Button variant="ghost" className="p-2">
80+
<Pencil className="cursor-pointer w-4 h-4" />
81+
</Button>
82+
</CarbDialog>
83+
<DeleteDialog id={carb.id} action={deleteCarbs} />
84+
</div>
85+
</div>
86+
</div>
87+
{over ? (
88+
<Progress
89+
className="h-2 bg-orange-400"
90+
value={(carb.carbs / carb.observedCarbs) * 100}
91+
/>
92+
) : (
93+
<Progress
94+
className="h-2 "
95+
value={(carb.observedCarbs / carb.carbs) * 100}
96+
/>
97+
)}
98+
</div>
99+
{arr.length - 1 !== i && <Separator />}
100+
</div>
101+
)
102+
})}
103+
{carbs.length === 0 && (
104+
<p className="text-center p-2 text-slate-400">No meal entries</p>
105+
)}
106+
</div>
107+
</div>
108+
</>
109+
)
110+
}

‎gluwave/src/app/(app-menu)/carbs/list/page.tsx

+2-122
Original file line numberDiff line numberDiff line change
@@ -1,123 +1,3 @@
1-
import { deleteCarbs } from '@/actions/delete-carbs'
2-
import { validateRequest } from '@/auth'
3-
import { CarbDialog } from '@/components/carb-dialog'
4-
import { ClientDateTime } from '@/components/client-datetime'
5-
import { DeleteDialog } from '@/components/delete-dialog'
6-
import { PageDatePicker } from '@/components/page-date-picker'
7-
import { Button } from '@/components/ui/button'
8-
import { Progress } from '@/components/ui/progress'
9-
import { Separator } from '@/components/ui/separator'
10-
import { Statistics } from '@/lib/sql_utils'
11-
import { addHours, endOfDay, isValid, parseISO, startOfDay } from 'date-fns'
12-
import { Pencil } from 'lucide-react'
13-
import { notFound, redirect } from 'next/navigation'
14-
import * as React from 'react'
1+
import { CarbsList } from './carbs-list'
152

16-
interface Props {
17-
date: Date
18-
}
19-
20-
async function ListCarbTable({ date }: Props) {
21-
const { user } = await validateRequest()
22-
if (!user) {
23-
redirect('/login')
24-
}
25-
26-
if (!user) redirect('/login')
27-
const now = new Date()
28-
29-
const start = date
30-
const end = addHours(date, 24)
31-
32-
const tf = Statistics.carbs_timeframe(user.id, start, end)
33-
let carbs = await Statistics.execute(
34-
Statistics.attributed_carbs_simple(
35-
tf,
36-
user.id,
37-
user.carbohydrateRatio,
38-
user.correctionRatio
39-
)
40-
)
41-
42-
carbs = carbs
43-
.filter(
44-
(carb) =>
45-
carb.id !== -1 &&
46-
carb.timestamp.getTime() >= start.getTime() &&
47-
carb.timestamp.getTime() <= end.getTime()
48-
)
49-
.sort((a, b) => b.timestamp.getTime() - a.timestamp.getTime())
50-
51-
return (
52-
<div>
53-
{carbs.map((carb, i, arr) => {
54-
const over = carb.observedCarbs > carb.carbs
55-
56-
return (
57-
<div key={carb.id}>
58-
<div className="p-2">
59-
<div className="grid grid-cols-2 pb-2">
60-
<div>
61-
<div>{Math.round(carb.carbs)} g </div>
62-
<div>Observed: {Math.round(carb.observedCarbs)} g </div>
63-
</div>
64-
<div className="flex items-center gap-2 justify-end">
65-
<div>
66-
<ClientDateTime timestamp={carb.timestamp} /> +{' '}
67-
{(carb.decay / 60).toLocaleString([], {
68-
maximumFractionDigits: 1,
69-
})}
70-
<span> h</span>
71-
</div>
72-
<div>
73-
<CarbDialog carb={carb}>
74-
<Button variant="ghost" className="p-2">
75-
<Pencil className="cursor-pointer w-4 h-4" />
76-
</Button>
77-
</CarbDialog>
78-
<DeleteDialog id={carb.id} action={deleteCarbs} />
79-
</div>
80-
</div>
81-
</div>
82-
{over ? (
83-
<Progress
84-
className="h-2 bg-orange-400"
85-
value={(carb.carbs / carb.observedCarbs) * 100}
86-
/>
87-
) : (
88-
<Progress
89-
className="h-2 "
90-
value={(carb.observedCarbs / carb.carbs) * 100}
91-
/>
92-
)}
93-
</div>
94-
{arr.length - 1 !== i && <Separator />}
95-
</div>
96-
)
97-
})}
98-
{carbs.length === 0 && (
99-
<p className="text-center p-2 text-slate-400">No entries</p>
100-
)}
101-
</div>
102-
)
103-
}
104-
105-
export default async function InsulinListByDate({
106-
searchParams,
107-
}: {
108-
searchParams: { date: string }
109-
}) {
110-
const date = searchParams.date ? parseISO(searchParams.date) : new Date()
111-
if (!isValid(date)) {
112-
notFound()
113-
}
114-
115-
return (
116-
<>
117-
<PageDatePicker date={date} />
118-
<div className="space-y-4 border bg-white max-w-5xl mx-auto rounded-md shadow p-2 mt-4">
119-
<ListCarbTable date={date} />
120-
</div>
121-
</>
122-
)
123-
}
3+
export default CarbsList

‎gluwave/src/app/(app-menu)/glucose/list/[date]/page.tsx

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { GlucoseList } from '../glucose-list'
2+
3+
export default GlucoseList

‎gluwave/src/app/(app-menu)/glucose/list/glucose-list.tsx

+102
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
import { deleteGlucose } from '@/actions/delete-glucose'
2+
import { validateRequest } from '@/auth'
3+
import { BloodGlucoseDialog } from '@/components/bloodglucose-dialog'
4+
import { ClientDateTime } from '@/components/client-datetime'
5+
import { DeleteDialog } from '@/components/delete-dialog'
6+
import { PageDatePicker } from '@/components/page-date-picker'
7+
import { Button } from '@/components/ui/button'
8+
import {
9+
Table,
10+
TableBody,
11+
TableCell,
12+
TableHead,
13+
TableHeader,
14+
TableRow,
15+
} from '@/components/ui/table'
16+
import { db } from '@/db'
17+
import { glucose } from '@/schema'
18+
import { addHours, parseISO, subHours } from 'date-fns'
19+
import { and, asc, eq, gte, lt } from 'drizzle-orm'
20+
import { Pencil } from 'lucide-react'
21+
import { redirect } from 'next/navigation'
22+
import * as React from 'react'
23+
24+
interface Props {
25+
params: {
26+
date?: string
27+
}
28+
}
29+
30+
export const GlucoseList = async ({ params }: Props) => {
31+
const date = params?.date ? new Date(Number(params.date)) : undefined
32+
33+
const { user } = await validateRequest()
34+
if (!user) {
35+
redirect('/login')
36+
}
37+
38+
const now = new Date()
39+
const start = subHours(date ?? now, date ? 0 : 24)
40+
const end = addHours(date ?? now, 24)
41+
42+
const results = await db
43+
.select()
44+
.from(glucose)
45+
.where(
46+
and(
47+
gte(glucose.timestamp, start),
48+
lt(glucose.timestamp, end),
49+
eq(glucose.userId, user.id)
50+
)
51+
)
52+
.orderBy(asc(glucose.timestamp))
53+
54+
return (
55+
<>
56+
<PageDatePicker baseUrl="/glucose/list" date={date} />
57+
<div className="space-y-4 border bg-white max-w-5xl mx-auto rounded-md shadow p-2 mt-4">
58+
<div>
59+
<Table>
60+
<TableHeader>
61+
<TableRow>
62+
<TableHead>Timestamp</TableHead>
63+
<TableHead>Amount</TableHead>
64+
<TableHead className="text-right"></TableHead>
65+
</TableRow>
66+
</TableHeader>
67+
<TableBody>
68+
{results.map((glucose) => (
69+
<TableRow key={glucose.id}>
70+
<TableCell className="font-medium">
71+
<ClientDateTime timestamp={glucose.timestamp} />
72+
</TableCell>
73+
<TableCell>{glucose.value} mmol/l</TableCell>
74+
<TableCell className="text-right flex justify-end">
75+
<BloodGlucoseDialog
76+
glucose={{
77+
...glucose,
78+
glucose: glucose.value,
79+
}}
80+
>
81+
<Button variant="ghost" className="p-2">
82+
<Pencil className="cursor-pointer w-4 h-4" />
83+
</Button>
84+
</BloodGlucoseDialog>
85+
<DeleteDialog action={deleteGlucose} id={glucose.id} />
86+
</TableCell>
87+
</TableRow>
88+
))}
89+
{results.length === 0 && (
90+
<TableRow>
91+
<TableCell colSpan={3} className="text-slate-400">
92+
No entries
93+
</TableCell>
94+
</TableRow>
95+
)}
96+
</TableBody>
97+
</Table>
98+
</div>
99+
</div>
100+
</>
101+
)
102+
}

0 commit comments

Comments
 (0)