- {/*
- {Icon && }
- {children}
-
*/}
-
-
- {title}
-
-
- {description}
-
+
+
+
+ {/*
+ {Icon && }
+ {children}
+
*/}
+
+
+ {title}
+
+
+ {description}
+
+
+ {actions && (
+
+ {actions}
+
+ )}
- {actions}
-
- )}
-
+
)
}
+
diff --git a/src/components/project-selection-section.tsx b/src/components/project-selection-section.tsx
index c9a6800..d1a58e9 100644
--- a/src/components/project-selection-section.tsx
+++ b/src/components/project-selection-section.tsx
@@ -47,7 +47,7 @@ export function ProjectSelectionSection({ onSelectionComplete }: ProjectSelectio
setLoadingProjects(true)
setError(null)
const data = await fetchProjects()
- setProjects(data)
+ setProjects(data.items)
} catch (err) {
console.error("Failed to load projects:", err)
setError("Failed to load projects. Please check if the backend is running.")
@@ -74,7 +74,7 @@ export function ProjectSelectionSection({ onSelectionComplete }: ProjectSelectio
setSelectedLocation(null)
setLocations([])
const data = await fetchPackagesByProject(selectedProject.id)
- setPackages(data)
+ setPackages(data.items)
} catch (err) {
console.error("Failed to load packages:", err)
setError("Failed to load packages for the selected project.")
@@ -99,7 +99,7 @@ export function ProjectSelectionSection({ onSelectionComplete }: ProjectSelectio
setError(null)
setSelectedLocation(null)
const data = await fetchLocationsByPackage(selectedPackage.id)
- setLocations(data)
+ setLocations(data.items)
} catch (err) {
console.error("Failed to load locations:", err)
setError("Failed to load locations for the selected package.")
diff --git a/src/components/ui/reveal.tsx b/src/components/ui/reveal.tsx
new file mode 100644
index 0000000..d159dfa
--- /dev/null
+++ b/src/components/ui/reveal.tsx
@@ -0,0 +1,122 @@
+"use client";
+
+import { motion, type HTMLMotionProps } from "motion/react";
+import React from "react";
+
+interface RevealProps extends HTMLMotionProps<"div"> {
+ children: React.ReactNode;
+ delay?: number;
+ direction?: "up" | "down" | "left" | "right" | "none";
+ duration?: number;
+ distance?: number;
+}
+
+export function Reveal({
+ children,
+ delay = 0,
+ direction = "up",
+ duration = 0.5,
+ distance = 20,
+ className,
+ ...props
+}: RevealProps) {
+ const offsets = {
+ up: { y: distance },
+ down: { y: -distance },
+ left: { x: distance },
+ right: { x: -distance },
+ none: {},
+ };
+
+ return (
+
+ {children}
+
+ );
+}
+
+interface StaggerContainerProps extends HTMLMotionProps<"div"> {
+ children: React.ReactNode;
+ staggerChildren?: number;
+ delayChildren?: number;
+}
+
+export function StaggerContainer({
+ children,
+ staggerChildren = 0.1,
+ delayChildren = 0,
+ className,
+ ...props
+}: StaggerContainerProps) {
+ return (
+
+ {children}
+
+ );
+}
+
+export function StaggerItem({
+ children,
+ direction = "up",
+ distance = 20,
+ className,
+ ...props
+}: RevealProps) {
+ const offsets = {
+ up: { y: distance },
+ down: { y: -distance },
+ left: { x: distance },
+ right: { x: -distance },
+ none: {},
+ };
+
+ return (
+
+ {children}
+
+ );
+}
diff --git a/src/lib/api.ts b/src/lib/api.ts
index 2726c93..936ff13 100644
--- a/src/lib/api.ts
+++ b/src/lib/api.ts
@@ -43,6 +43,11 @@ export interface Location {
updated_at: string
}
+export interface PaginatedResponse
{
+ items: T[]
+ totalItems: number
+}
+
export interface PaginationParams {
skip?: number;
limit?: number;
@@ -246,46 +251,46 @@ export async function deleteLocation(locationId: string): Promise<{ message: str
/**
* Fetch all projects
*/
-export async function fetchProjects(params?: PaginationParams): Promise {
+export async function fetchProjects(params?: PaginationParams): Promise> {
const skip = params?.skip ?? 0
const limit = params?.limit ?? 100
- return apiRequest(`/projects/?skip=${skip}&limit=${limit}`)
+ return apiRequest>(`/projects/?skip=${skip}&limit=${limit}`)
}
/**
* Fetch packages filtered by project ID
*/
-export async function fetchPackagesByProject(projectId: string, params?: PaginationParams): Promise {
+export async function fetchPackagesByProject(projectId: string, params?: PaginationParams): Promise> {
const skip = params?.skip ?? 0
const limit = params?.limit ?? 100
- return apiRequest(`/packages/?project_id=${projectId}&skip=${skip}&limit=${limit}`)
+ return apiRequest>(`/packages/?project_id=${projectId}&skip=${skip}&limit=${limit}`)
}
/**
* Fetch locations filtered by package ID
*/
-export async function fetchLocationsByPackage(packageId: string, params?: PaginationParams): Promise {
+export async function fetchLocationsByPackage(packageId: string, params?: PaginationParams): Promise> {
const skip = params?.skip ?? 0
const limit = params?.limit ?? 100
- return apiRequest(`/locations/?package_id=${packageId}&skip=${skip}&limit=${limit}`)
+ return apiRequest>(`/locations/?package_id=${packageId}&skip=${skip}&limit=${limit}`)
}
/**
* Fetch all packages (for dashboard)
*/
-export async function fetchAllPackages(params?: PaginationParams): Promise {
+export async function fetchAllPackages(params?: PaginationParams): Promise> {
const skip = params?.skip ?? 0
const limit = params?.limit ?? 100
- return apiRequest(`/packages/?skip=${skip}&limit=${limit}`)
+ return apiRequest>(`/packages/?skip=${skip}&limit=${limit}`)
}
/**
* Fetch all locations (for dashboard)
*/
-export async function fetchAllLocations(params?: PaginationParams): Promise {
+export async function fetchAllLocations(params?: PaginationParams): Promise> {
const skip = params?.skip ?? 0
const limit = params?.limit ?? 100
- return apiRequest(`/locations/?skip=${skip}&limit=${limit}`)
+ return apiRequest>(`/locations/?skip=${skip}&limit=${limit}`)
}
// Video type for dashboard
@@ -366,7 +371,7 @@ export interface Detection {
export async function fetchAllDetections(): Promise {
try {
// First get all projects
- const projects = await fetchProjects()
+ const projects = (await fetchProjects()).items
// Then fetch detections for each project
const allDetections: Detection[] = []