Remove IDEA config, add types for things

.gitignore

@@ -1,5 +1,8 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
+# IDEA
+/.idea
+
 # dependencies
 /node_modules
 /.pnp

.idea/.gitignore

@@ -1,5 +0,0 @@
-# Default ignored files
-/shelf/
-/workspace.xml
-# Editor-based HTTP Client requests
-/httpRequests/

.idea/inspectionProfiles/Project_Default.xml

@@ -1,6 +0,0 @@
-<component name="InspectionProjectProfileManager">
-  <profile version="1.0">
-    <option name="myName" value="Project Default" />
-    <inspection_tool class="Eslint" enabled="true" level="WARNING" enabled_by_default="true" />
-  </profile>
-</component>

.idea/modules.xml

@@ -1,8 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="ProjectModuleManager">
-    <modules>
-      <module fileurl="file://$PROJECT_DIR$/.idea/tremor-dashboard.iml" filepath="$PROJECT_DIR$/.idea/tremor-dashboard.iml" />
-    </modules>
-  </component>
-</project>

.idea/tremor-dashboard.iml

@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<module type="WEB_MODULE" version="4">
-  <component name="NewModuleRootManager">
-    <content url="file://$MODULE_DIR$">
-      <excludeFolder url="file://$MODULE_DIR$/.tmp" />
-      <excludeFolder url="file://$MODULE_DIR$/temp" />
-      <excludeFolder url="file://$MODULE_DIR$/tmp" />
-    </content>
-    <orderEntry type="inheritedJdk" />
-    <orderEntry type="sourceFolder" forTests="false" />
-  </component>
-</module>

.idea/vcs.xml

@@ -1,6 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<project version="4">
-  <component name="VcsDirectoryMappings">
-    <mapping directory="$PROJECT_DIR$" vcs="Git" />
-  </component>
-</project>

src/app/a.client.tsx

@@ -15,7 +15,13 @@ export function SubjectOverviewCard({
 }) {
     const {
         data: _project
-    } = useSWR<any>(`/api/project?select=raw_json&toggl_id=eq.${projectId}`, fetcher);
+    } = useSWR<{
+        raw_json: {
+            name: string,
+            color: string,
+        }
+    }[]>(`/api/project?select=raw_json&toggl_id=eq.${projectId}`, fetcher);
+
     const [project, setProject] = useState({
         name: '',
         color: '',
@@ -43,7 +49,7 @@ export function SubjectOverviewCard({
     }, [data]);
 
     return (
-        <Card style={{ borderColor: project?.color }} decoration={'left'}>
+        <Card style={{borderColor: project?.color}} decoration={'left'}>
             <Title>{title ?? project?.name}</Title>
             <Text>Total</Text>
             <Metric>{(a / (60 * 60)).toFixed(2)} hours</Metric>
@@ -55,26 +61,37 @@ export function SubjectComparisonCard({projectIds}: {
     projectIds: number[]
 }) {
     const {
-        data,
+        data: rawData,
         error,
         isLoading,
-    } = useSWR<any[]>(`/api/time_entry?select=raw_json,project:project_id(name,raw_json)&project_id=in.(${projectIds.join(',')})`, fetcher, {});
+    } = useSWR<{
+        raw_json: {
+            seconds: number,
+        },
+        project: {
+            name: string,
+            raw_json: any
+        }
+    }[]>(`/api/time_entry?select=raw_json,project:project_id(name,raw_json)&project_id=in.(${projectIds.join(',')})`, fetcher, {});
 
-    const [a, setA] = useState<{ name: string, value: number }[]>([]);
+    const [breakdownData, setBreakdownData] = useState<{
+        name: string,
+        value: number
+    }[]>([]);
     const [colours, setColours] = useState<string[]>([]);
 
     useEffect(() => {
-        const a = R.toPairs(R.groupBy((entry) => entry.project.name, data ?? []))
+        const breakdownData = R.toPairs(R.groupBy((entry) => entry.project.name, rawData ?? []))
             .map(([name, entries]) => ({
                 name,
                 value: (entries ?? []).map((entry) => entry.raw_json.seconds).reduce((a, b) => a + b, 0),
                 colour: entries?.[0].project.raw_json.color
             }))
 
-        setA(a);
+        setBreakdownData(breakdownData);
 
-        setColours(a.map((entry) => entry.colour));
-    }, [data]);
+        setColours(breakdownData.map((entry) => entry.colour));
+    }, [rawData]);
 
     const valueFormatter = (number: number) => `${(number / (60 * 60)).toFixed(2)} hours`;
 
@@ -83,7 +100,7 @@ export function SubjectComparisonCard({projectIds}: {
             <Title>Relative Breakdown</Title>
             <DonutChart
                 className="mt-6"
-                data={a ?? []}
+                data={breakdownData ?? []}
                 category="value"
                 index="name"
                 valueFormatter={valueFormatter}

src/app/calendarOverviewCard.tsx

@@ -12,7 +12,7 @@ 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')
-const projectIds = [
+export const projectIds = [
     195482340,
     195519024,
     195518593,

src/app/page.tsx

@@ -1,5 +1,5 @@
 import {SubjectComparisonCard, SubjectOverviewCard} from "@/app/a.client";
-import {CalendarOverviewCard} from "@/app/calendarOverviewCard";
+import {CalendarOverviewCard, projectIds} from "@/app/calendarOverviewCard";
 
 export default function Home() {
     return (
@@ -26,6 +26,8 @@ export default function Home() {
                 />
 
                 <CalendarOverviewCard/>
+
+                <SubjectComparisonCard projectIds={projectIds}/>
             </div>
         </main>