add snapshots and fix top cards following it

dashboard/composables/snapshots/BaseSnapshots.ts

@@ -0,0 +1,79 @@
+
+import type { TProjectSnapshot } from "@schema/project/ProjectSnapshot";
+
+import * as fns from 'date-fns';
+
+export type DefaultSnapshot = TProjectSnapshot & { default: true }
+export type GenericSnapshot = TProjectSnapshot | DefaultSnapshot;
+
+export function getDefaultSnapshots(project_id: TProjectSnapshot['project_id']) {
+
+    const today: DefaultSnapshot = {
+        project_id,
+        _id: '___today' as any,
+        name: 'Today',
+        from: fns.startOfDay(Date.now()),
+        to: fns.endOfDay(Date.now()),
+        color: '#CC11CC',
+        default: true
+    }
+
+    const lastDay: DefaultSnapshot = {
+        project_id,
+        _id: '___lastDay' as any,
+        name: 'Last Day',
+        from: fns.startOfDay(fns.subDays(Date.now(), 1)),
+        to: fns.endOfDay(fns.subDays(Date.now(), 1)),
+        color: '#CC11CC',
+        default: true
+    }
+
+    const currentWeek: DefaultSnapshot = {
+        project_id,
+        _id: '___currentWeek' as any,
+        name: 'Current Week',
+        from: fns.startOfWeek(Date.now()),
+        to: fns.endOfWeek(Date.now()),
+        color: '#CC11CC',
+        default: true
+    }
+
+    const lastWeek: DefaultSnapshot = {
+        project_id,
+        _id: '___lastWeek' as any,
+        name: 'Last Week',
+        from: fns.startOfWeek(fns.subWeeks(Date.now(), 1)),
+        to: fns.endOfWeek(fns.subWeeks(Date.now(), 1)),
+        color: '#CC11CC',
+        default: true
+    }
+
+
+    const currentMonth: DefaultSnapshot = {
+        project_id,
+        _id: '___currentMonth' as any,
+        name: 'Current Month',
+        from: fns.startOfMonth(Date.now()),
+        to: fns.endOfMonth(Date.now()),
+        color: '#CC11CC',
+        default: true
+    }
+
+    const lastMonth: DefaultSnapshot = {
+        project_id,
+        _id: '___lastMonth' as any,
+        name: 'Last Month',
+        from: fns.startOfMonth(fns.subMonths(Date.now(), 1)),
+        to: fns.endOfMonth(fns.subMonths(Date.now(), 1)),
+        color: '#CC11CC',
+        default: true
+    }
+
+
+
+
+    const snapshotList = [lastDay, today, lastMonth, currentMonth, lastWeek, currentWeek]
+
+    return snapshotList;
+
+}

dashboard/composables/useCustomFetch.ts

@@ -25,7 +25,7 @@ export function useComputedHeaders(customOptions?: CustomOptions) {
     const useActivePid = customOptions?.useActivePid || true;
 
     const headers = computed<Record<string, string>>(() => {
-
+        console.trace('Computed recalculated');
         const parsedCustom: Record<string, string> = {}
         const customKeys = Object.keys(customOptions?.custom || {});
         for (const key of customKeys) {
@@ -43,5 +43,7 @@ export function useComputedHeaders(customOptions?: CustomOptions) {
         }
     })
 
+
+
     return headers;
 }

dashboard/composables/useSnapshot.ts

@@ -1,6 +1,6 @@
 import type { TProjectSnapshot } from "@schema/project/ProjectSnapshot";
-
-import fns from 'date-fns';
+import { getDefaultSnapshots, type GenericSnapshot } from "./snapshots/BaseSnapshots";
+import * as fns from 'date-fns';
 
 const { projectId, project } = useProject();
 
@@ -10,59 +10,20 @@ const headers = computed(() => {
         'x-pid': projectId.value ?? ''
     }
 });
-const remoteSnapshots = useFetch<TProjectSnapshot[]>('/api/project/snapshots', {
-    headers
-});
+
+const remoteSnapshots = useFetch<TProjectSnapshot[]>('/api/project/snapshots', { headers });
 
 watch(project, async () => {
     await remoteSnapshots.refresh();
     snapshot.value = isLiveDemo.value ? snapshots.value[0] : snapshots.value[1];
 });
 
-const snapshots = computed(() => {
-
-    const getDefaultSnapshots: () => TProjectSnapshot[] = () => [
-        {
-            project_id: project.value?._id as any,
-            _id: 'default0' as any,
-            name: 'All',
-            from: new Date(project.value?.created_at || 0),
-            to: new Date(Date.now()),
-            color: '#CCCCCC'
-        },
-        {
-            project_id: project.value?._id as any,
-            _id: 'current_month' as any,
-            name: 'Current month',
-            from: new Date(Date.now() - 1000 * 60 * 60 * 24 * 30),
-            to: new Date(Date.now()),
-            color: '#00CC00'
-        },
-        {
-            project_id: project.value?._id as any,
-            _id: 'default2' as any,
-            name: 'Last week',
-            from: new Date(Date.now() - 1000 * 60 * 60 * 24 * 7),
-            to: new Date(Date.now()),
-            color: '#0F02D2'
-        },
-        {
-            project_id: project.value?._id as any,
-            _id: 'default3' as any,
-            name: 'Last day',
-            from: new Date(Date.now() - 1000 * 60 * 60 * 24),
-            to: new Date(Date.now()),
-            color: '#CC11CC'
-        }
-    ]
-
-    return [
-        ...getDefaultSnapshots(),
-        ...(remoteSnapshots.data.value || [])
-    ];
+const snapshots = computed<GenericSnapshot[]>(() => {
+    const defaultSnapshots: GenericSnapshot[] = project.value?._id ? getDefaultSnapshots(project.value._id as any) : [];
+    return [...defaultSnapshots, ...(remoteSnapshots.data.value || [])];
 })
 
-const snapshot = ref<TProjectSnapshot>(isLiveDemo.value ? snapshots.value[0] : snapshots.value[1]);
+const snapshot = ref<GenericSnapshot>(snapshots.value[1]);
 
 const safeSnapshotDates = computed(() => {
     const from = new Date(snapshot.value?.from || 0).toISOString();
@@ -77,7 +38,7 @@ async function updateSnapshots() {
 const snapshotDuration = computed(() => {
     const from = new Date(snapshot.value?.from || 0).getTime();
     const to = new Date(snapshot.value?.to || 0).getTime();
-    return (to - from) / (1000 * 60 * 60 * 24);
+    return fns.differenceInDays(to, from);
 });
 
 export function useSnapshot() {