-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
24 changed files
with
798 additions
and
171 deletions.
There are no files selected for viewing
3 changes: 3 additions & 0 deletions
3
app/(account)/subjects/[subjectId]/@insights/[...catch]/page.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,3 @@ | ||
const Catch = () => null; | ||
|
||
export default Catch; |
34 changes: 34 additions & 0 deletions
34
app/(account)/subjects/[subjectId]/@insights/insights/page.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
'use client'; | ||
|
||
import Charts from '@/(account)/subjects/[subjectId]/timeline/_components/charts'; | ||
import IconButton from '@/_components/icon-button'; | ||
import { Dialog } from '@headlessui/react'; | ||
import { XMarkIcon } from '@heroicons/react/24/outline'; | ||
import { useRouter } from 'next/router'; | ||
|
||
interface PageProps { | ||
subjectId: string; | ||
} | ||
|
||
const Page = ({ subjectId }: PageProps) => { | ||
const router = useRouter(); | ||
|
||
return ( | ||
<Dialog className="relative z-10" onClose={() => router.back()} open> | ||
<div className="fixed inset-0 overflow-y-auto"> | ||
<Dialog.Panel className="min-h-full w-full space-y-24 bg-bg-1 p-8 md:p-16 lg:p-24"> | ||
<div className="flex items-center justify-between"> | ||
<h1 className="text-2xl">Insights</h1> | ||
<IconButton | ||
icon={<XMarkIcon className="relative -right-[0.16em] w-7" />} | ||
onClick={() => router.back()} | ||
/> | ||
</div> | ||
<Charts subjectId={subjectId} /> | ||
</Dialog.Panel> | ||
</div> | ||
</Dialog> | ||
); | ||
}; | ||
|
||
export default Page; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
29 changes: 0 additions & 29 deletions
29
app/(account)/subjects/[subjectId]/timeline/@events/_utilities/dots-to-parens.ts
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
49 changes: 49 additions & 0 deletions
49
app/(account)/subjects/[subjectId]/timeline/_components/charts.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
'use client'; | ||
|
||
import EventCounts from '@/(account)/subjects/[subjectId]/timeline/_components/event-counts'; | ||
import EventsByTimeOfDay from '@/(account)/subjects/[subjectId]/timeline/_components/events-by-time-of-day'; | ||
import EventsOverTime from '@/(account)/subjects/[subjectId]/timeline/_components/events-over-time'; | ||
import Spinner from '@/_components/spinner'; | ||
import { useParentSize } from '@cutting/use-get-parent-size'; | ||
import { useToggle } from '@uidotdev/usehooks'; | ||
import { useEffect, useMemo, useRef, useState } from 'react'; | ||
|
||
interface ChartsProps { | ||
subjectId: string; | ||
} | ||
|
||
const Charts = ({ subjectId }: ChartsProps) => { | ||
const [data, setData] = useState<Array<Record<string, unknown>>>(); | ||
const [isLoading, toggleIsLoading] = useToggle(true); | ||
const ref = useRef<HTMLDivElement>(null); | ||
const { width } = useParentSize(ref); | ||
|
||
useEffect(() => { | ||
(async () => { | ||
const res = await fetch(`/subjects/${subjectId}/events.json`); | ||
setData(await res.json()); | ||
toggleIsLoading(false); | ||
})(); | ||
}, [setData, subjectId, toggleIsLoading]); | ||
|
||
const events = useMemo( | ||
() => | ||
data?.filter( | ||
(d) => | ||
typeof d['Session number'] === 'undefined' || | ||
d['Module number'] === 1, | ||
), | ||
[data], | ||
); | ||
|
||
return ( | ||
<div className="smallcaps flex flex-col items-center gap-8" ref={ref}> | ||
{isLoading && <Spinner loadingText="Loading data…" />} | ||
<EventCounts events={events} width={width} /> | ||
<EventsOverTime events={events} width={width} /> | ||
<EventsByTimeOfDay events={events} width={width} /> | ||
</div> | ||
); | ||
}; | ||
|
||
export default Charts; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
41 changes: 41 additions & 0 deletions
41
app/(account)/subjects/[subjectId]/timeline/_components/event-counts.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
'use client'; | ||
|
||
import PlotFigure from '@/(account)/subjects/[subjectId]/timeline/_components/plot-figure'; | ||
import { axisY, barX, groupY } from '@observablehq/plot'; | ||
|
||
interface EventCountsProps { | ||
events?: Array<Record<string, unknown>>; | ||
width?: number; | ||
} | ||
|
||
const EventCounts = ({ events = [], width }: EventCountsProps) => { | ||
if (!events.length) return null; | ||
|
||
return ( | ||
<PlotFigure | ||
options={{ | ||
marks: [ | ||
axisY({ | ||
label: null, | ||
lineWidth: 9, | ||
textOverflow: 'ellipsis', | ||
tickSize: 0, | ||
}), | ||
barX( | ||
events, | ||
groupY( | ||
{ x: 'count' }, | ||
{ sort: { reverse: true, y: 'x' }, tip: true, y: 'Name' }, | ||
), | ||
), | ||
], | ||
title: 'Event counts', | ||
width, | ||
x: { label: 'Count', tickFormat: (d) => (d % 1 ? null : d) }, | ||
y: { padding: 0.05 }, | ||
}} | ||
/> | ||
); | ||
}; | ||
|
||
export default EventCounts; |
Oops, something went wrong.