From 44df8a6fc6d2b3ed818a587c1fd8be59ea786748 Mon Sep 17 00:00:00 2001 From: Joshua Coles Date: Wed, 7 Feb 2024 11:51:04 +0000 Subject: [PATCH] Add OverviewConfig to allow for additional queries, setup sem2 page --- src/app/OverviewPage.tsx | 36 ++++++++++++++++++++++++++++ src/app/a.client.tsx | 8 +++++-- src/app/calendarOverviewCard.tsx | 37 ++++++++++++++--------------- src/app/layout.tsx | 4 ++-- src/app/overviewConfig.ts | 40 ++++++++++++++++++++++++++++++++ src/app/page.tsx | 35 +++------------------------- src/app/sem2/page.tsx | 32 +++++++++++++++++++++++++ 7 files changed, 137 insertions(+), 55 deletions(-) create mode 100644 src/app/OverviewPage.tsx create mode 100644 src/app/overviewConfig.ts create mode 100644 src/app/sem2/page.tsx diff --git a/src/app/OverviewPage.tsx b/src/app/OverviewPage.tsx new file mode 100644 index 0000000..c5cb733 --- /dev/null +++ b/src/app/OverviewPage.tsx @@ -0,0 +1,36 @@ +import {SubjectComparisonCard, SubjectOverviewCard} from "@/app/a.client"; +import {CalendarOverviewCard} from "@/app/calendarOverviewCard"; +import {OverviewConfig} from "@/app/overviewConfig"; + +export default function OverviewPage({config}: { + config: OverviewConfig +}) { + const projectIds = config.subjects.map((subject) => subject.projectId); + + return ( +
+

{config.title}

+ +
+ {config.subjects.map((subject) => ( + + ))} + + + + + +
+
+ ) +} diff --git a/src/app/a.client.tsx b/src/app/a.client.tsx index 713879b..27df31a 100644 --- a/src/app/a.client.tsx +++ b/src/app/a.client.tsx @@ -8,10 +8,14 @@ import * as R from "ramda"; export function SubjectOverviewCard({ projectId, - title + title, + startTime = '2023-12-15T00:00:00.000Z', + endTime = '2024-01-25T00:00:00.000Z', }: { projectId: number, title?: string + startTime?: string, + endTime?: string, }) { const { data: _project @@ -37,7 +41,7 @@ export function SubjectOverviewCard({ data, error, isLoading, - } = useSWR(`/api/time_entry?select=raw_json&project_id=eq.${projectId}&start=gt.2023-12-15T00:00:00.000Z`, fetcher); + } = useSWR(`/api/time_entry?select=raw_json&project_id=eq.${projectId}&start=gt.${startTime}&start=lt.${endTime}`, fetcher); const [a, setA] = useState(0) useEffect(() => { diff --git a/src/app/calendarOverviewCard.tsx b/src/app/calendarOverviewCard.tsx index 1265998..3ac3fba 100644 --- a/src/app/calendarOverviewCard.tsx +++ b/src/app/calendarOverviewCard.tsx @@ -8,16 +8,7 @@ import * as dFns from 'date-fns'; import CalendarHeatmap from 'react-calendar-heatmap'; import 'react-calendar-heatmap/dist/styles.css'; import './calendar-styles.css' -import { Tooltip } from 'react-tooltip'; - -const initialDate = dFns.parseISO('2023-12-15T00:00:00.000Z') -const endDate = dFns.parseISO('2024-01-25T00:00:00.000Z') -export const projectIds = [ - 195482340, - 195519024, - 195518593, - 195754611, -]; +import {Tooltip} from 'react-tooltip'; const dailyGoal = 4; const granularity = 4; @@ -29,17 +20,15 @@ function computeCompletionShade(value: number) { return linearValue; } -function useCalendarData() { +function useCalendarData(projectIds: number[], initialDate: string, endDate: string) { const { data: timeEntries, - error, - isLoading, } = useSWR<{ raw_json: { start: string, seconds: number, } - }[]>(`/api/time_entry?select=raw_json&start=gt.${dFns.formatISO(initialDate)}&project_id=in.(${projectIds.join(',')})`, fetcher, {}); + }[]>(`/api/time_entry?select=raw_json&start=gt.${(initialDate)}&start=lt.${(endDate)}&project_id=in.(${projectIds.join(',')})`, fetcher, {}); const [data, setData] = useState<{ date: Date, @@ -60,8 +49,8 @@ function useCalendarData() { // Fill in missing days, hacky dFns.eachDayOfInterval({ - start: initialDate, - end: endDate, + start: dFns.parseISO(initialDate), + end: dFns.parseISO(endDate), }).forEach((date) => { const key = dFns.formatISO(date); if (summed[key] == undefined) { @@ -79,8 +68,18 @@ function useCalendarData() { return data } -export function CalendarOverviewCard() { - const data = useCalendarData(); +export function CalendarOverviewCard({ + projectIds, + startTime, + endTime + }: { + projectIds: number[], + startTime: string, + endTime: string, +}) { + const initialDate = dFns.parseISO(startTime); + const endDate = dFns.parseISO(endTime); + const data = useCalendarData(projectIds, startTime, endTime); return @@ -94,7 +93,7 @@ export function CalendarOverviewCard() { tooltipDataAttrs={(value: any) => { return value.date ? { 'data-tooltip-id': `calendar-tooltip`, - 'data-tooltip-content': value.count ?`${dFns.format(value.date, 'EEE do')}: ${value.count.toFixed(2)} hours` : `${dFns.format(value.date, 'EEE do')}` + 'data-tooltip-content': value.count ? `${dFns.format(value.date, 'EEE do')}: ${value.count.toFixed(2)} hours` : `${dFns.format(value.date, 'EEE do')}` } : undefined }} /> diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 40e027f..91848c5 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -5,8 +5,8 @@ import './globals.css' const inter = Inter({ subsets: ['latin'] }) export const metadata: Metadata = { - title: 'Create Next App', - description: 'Generated by create next app', + title: 'Work Tracker', + description: 'Track time spent on different subjects', } export default function RootLayout({ diff --git a/src/app/overviewConfig.ts b/src/app/overviewConfig.ts new file mode 100644 index 0000000..4f24dd0 --- /dev/null +++ b/src/app/overviewConfig.ts @@ -0,0 +1,40 @@ +export interface OverviewConfig { + title: string, + + subjects: { + title?: string, + projectId: number, + }[], + + goalHours: number, + + timePeriod: { + start: string, + end: string + }, +} + +export const semester1Revision: OverviewConfig = { + title: 'Semester 1 Revision', + goalHours: 4, + subjects: [ + { + projectId: 195482340, + }, + { + title: 'Measure Theory', + projectId: 195519024, + }, + { + title: 'Quantum Mechanics', + projectId: 195518593, + }, + { + projectId: 195754611, + } + ], + timePeriod: { + start: "2023-12-15T00:00:00.000Z", + end: "2024-01-25T00:00:00.000Z" + } +} diff --git a/src/app/page.tsx b/src/app/page.tsx index d0a4c60..9edbe6e 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,35 +1,6 @@ -import {SubjectComparisonCard, SubjectOverviewCard} from "@/app/a.client"; -import {CalendarOverviewCard, projectIds} from "@/app/calendarOverviewCard"; +import OverviewPage from "@/app/OverviewPage"; +import {semester1Revision} from "@/app/overviewConfig"; export default function Home() { - return ( -
-

Revision Tracker

- -
- - - - - - - - - - - -
-
- - ) + return } diff --git a/src/app/sem2/page.tsx b/src/app/sem2/page.tsx new file mode 100644 index 0000000..3de8a71 --- /dev/null +++ b/src/app/sem2/page.tsx @@ -0,0 +1,32 @@ +import OverviewPage from "@/app/OverviewPage"; +import {OverviewConfig} from "@/app/overviewConfig"; + +const semester2: OverviewConfig = { + title: 'Semester 2', + goalHours: 4, + subjects: [ + { + projectId: 195754611, + }, + { + projectId: 199383703, + }, + { + projectId: 199383691, + }, + { + projectId: 198859760, + }, + { + projectId: 199383698, + }, + ], + timePeriod: { + start: "2024-02-03T00:00:00.000Z", + end: "2024-05-10T00:00:00.000Z" + } +} + +export default function Home() { + return +}