santasri.pachhal/road-monitoring-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: remove unused files

Browse Source
This commit is contained in:
santasri.pachhal
2026-03-18 19:39:13 +05:30
parent 598098d7e8
commit 42624cae94
10 changed files with 156 additions and 1092 deletions
Download Patch File Download Diff File Expand all files Collapse all files

158
src/app/(modules)/dashboard/page.tsx
View File

@@ -1,7 +1,14 @@
"use client";
'use client';
import { useState, useEffect } from "react";
import { Card, CardContent, CardHeader, CardTitle, CardDescription, CardFooter } from "@/components/ui/card";
import { useState, useEffect } from 'react';
import {
Card,
CardContent,
CardHeader,
CardTitle,
CardDescription,
CardFooter,
} from '@/components/ui/card';
import {
AlertCircle,
Activity,
@@ -13,26 +20,21 @@ import {
PencilLine,
CheckCircle2,
Settings2,
} from "lucide-react";
import { StatsCard } from "@/components/dashboard/stats-card";
import { CompactProjectSelector } from "@/components/dashboard/compact-project-selector";
import { FilterSelector } from "@/components/dashboard/filter-selector";
import { DetectionDonutChart } from "@/components/dashboard/detection-donut-chart";
import { ChainageBarChart } from "@/components/dashboard/chainage-bar-chart"
import { DashboardMap } from "@/components/dashboard/dashboard-map";
import { PageHeader } from "@/components/page-header";
import { projectService } from "@/services/api";
import { Project } from "@/types";
import {
Popover,
PopoverContent,
PopoverTrigger,
} from "@/components/ui/popover";
import { Button } from "@/components/ui/button";
import { DashboardSkeleton } from "@/components/dashboard/dashboard-skeleton"
import { PoweredBy } from "@/components/powered-by";
import { toast } from "sonner";
import { Reveal, StaggerContainer, StaggerItem } from "@/components/ui/reveal";
} from 'lucide-react';
import { StatsCard } from '@/components/dashboard/stats-card';
import { FilterSelector } from '@/components/dashboard/filter-selector';
import { DetectionDonutChart } from '@/components/dashboard/detection-donut-chart';
import { ChainageBarChart } from '@/components/dashboard/chainage-bar-chart';
import { DashboardMap } from '@/components/dashboard/dashboard-map';
import { PageHeader } from '@/components/page-header';
import { projectService } from '@/services/api';
import { Project } from '@/types';
import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover';
import { Button } from '@/components/ui/button';
import { DashboardSkeleton } from '@/components/dashboard/dashboard-skeleton';
import { PoweredBy } from '@/components/powered-by';
import { toast } from 'sonner';
import { Reveal, StaggerContainer, StaggerItem } from '@/components/ui/reveal';
const API_URL = process.env.NEXT_PUBLIC_API_URL;
@@ -103,42 +105,41 @@ function calculateStats(summary: ProjectSummary | null): DetectionStats {
let total_damaged_road_marking = 0;
let total_good_sign_board = 0;
let total_road_damage = 0;
const chainageData: DetectionStats["chainageData"] = [];
const chainageData: DetectionStats['chainageData'] = [];
for (const pkg of Object.values(summary.packages || {})) {
for (const [chnName, chn] of Object.entries(pkg.chainages || {})) { // Changed 'locName, loc' to 'chnName, chn' and 'pkg.locations' to 'pkg.chainages'
for (const [chnName, chn] of Object.entries(pkg.chainages || {})) {
// Changed 'locName, loc' to 'chnName, chn' and 'pkg.locations' to 'pkg.chainages'
let chnDefectedSignboard = 0; // Changed 'locDefectedSignboard' to 'chnDefectedSignboard'
let chnPothole = 0; // Changed 'locPothole' to 'chnPothole'
let chnRoadCrack = 0; // Changed 'locRoadCrack' to 'chnRoadCrack'
let chnDamagedRoadMarking = 0; // Changed 'locDamagedRoadMarking' to 'chnDamagedRoadMarking'
let chnGoodSignboard = 0; // Changed 'locGoodSignboard' to 'chnGoodSignboard'
for (const detection of chn.detections || []) { // Changed 'loc.detections' to 'chn.detections'
for (const detection of chn.detections || []) {
// Changed 'loc.detections' to 'chn.detections'
const type = detection.type.toLowerCase();
if (type === "defected_sign_board") {
if (type === 'defected_sign_board') {
chnDefectedSignboard++;
total_defected_sign_board++;
} else if (type === "pothole") {
} else if (type === 'pothole') {
chnPothole++;
total_pothole++;
} else if (type === "road_crack") {
} else if (type === 'road_crack') {
chnRoadCrack++;
total_road_crack++;
} else if (type === "damaged_road_marking") {
} else if (type === 'damaged_road_marking') {
chnDamagedRoadMarking++;
total_damaged_road_marking++;
} else if (type === "good_sign_board") {
} else if (type === 'good_sign_board') {
chnGoodSignboard++;
total_good_sign_board++;
}
}
const chnTotalDamage = // Changed 'locTotalDamage' to 'chnTotalDamage'
chnDefectedSignboard +
chnPothole +
chnRoadCrack +
chnDamagedRoadMarking;
chnDefectedSignboard + chnPothole + chnRoadCrack + chnDamagedRoadMarking;
if (
chnDefectedSignboard > 0 ||
chnPothole > 0 ||
@@ -146,9 +147,9 @@ function calculateStats(summary: ProjectSummary | null): DetectionStats {
chnDamagedRoadMarking > 0 ||
chnGoodSignboard > 0
) {
const shortName =
chnName.length > 20 ? chnName.substring(0, 20) + "..." : chnName;
chainageData.push({ // Changed 'locationData.push' to 'chainageData.push'
const shortName = chnName.length > 20 ? chnName.substring(0, 20) + '...' : chnName;
chainageData.push({
// Changed 'locationData.push' to 'chainageData.push'
name: shortName,
defected_sign_board: chnDefectedSignboard,
pothole: chnPothole,
@@ -167,10 +168,7 @@ function calculateStats(summary: ProjectSummary | null): DetectionStats {
}
total_road_damage =
total_defected_sign_board +
total_pothole +
total_road_crack +
total_damaged_road_marking;
total_defected_sign_board + total_pothole + total_road_crack + total_damaged_road_marking;
return {
totalDefectedSignboard: total_defected_sign_board,
@@ -186,12 +184,8 @@ function calculateStats(summary: ProjectSummary | null): DetectionStats {
export default function DashboardPage() {
const [isLoading, setIsLoading] = useState(true);
const [projects, setProjects] = useState<Project[]>([]);
const [selectedProjectId, setSelectedProjectId] = useState<string | null>(
null,
);
const [projectSummary, setProjectSummary] = useState<ProjectSummary | null>(
null,
);
const [selectedProjectId, setSelectedProjectId] = useState<string | null>(null);
const [projectSummary, setProjectSummary] = useState<ProjectSummary | null>(null);
const [stats, setStats] = useState<DetectionStats>({
totalDefectedSignboard: 0,
totalPothole: 0,
@@ -214,9 +208,9 @@ export default function DashboardPage() {
setSelectedProjectId(projectsData.items[0].id);
}
} catch (err) {
console.error("Failed to load projects:", err);
toast.error("Failed to load projects", {
description: "Please check if the backend is running."
console.error('Failed to load projects:', err);
toast.error('Failed to load projects', {
description: 'Please check if the backend is running.',
});
} finally {
setTimeout(() => {
@@ -239,18 +233,12 @@ export default function DashboardPage() {
: [];
// Extract chainages from selected package
const [selectedPackageId, setSelectedPackageId] = useState<string | null>(
null,
);
const [selectedChainageId, setSelectedChainageId] = useState<string | null>( // Changed 'selectedLocationId' to 'selectedChainageId'
null,
);
const [selectedPackageId, setSelectedPackageId] = useState<string | null>(null);
const [selectedChainageId, setSelectedChainageId] = useState<string | null>(null); // Changed 'selectedLocationId' to 'selectedChainageId'
const chainages =
projectSummary && selectedPackageId && selectedPackageId !== "all"
? Object.keys(
projectSummary.packages[selectedPackageId]?.chainages || {},
).map((chnName) => ({
projectSummary && selectedPackageId && selectedPackageId !== 'all'
? Object.keys(projectSummary.packages[selectedPackageId]?.chainages || {}).map((chnName) => ({
id: chnName,
name: chnName,
}))
@@ -270,8 +258,8 @@ export default function DashboardPage() {
const summary: ProjectSummary = await projectService.getProjectSummary(selectedProjectId);
setProjectSummary(summary);
} catch (err) {
console.error("Failed to load project summary:", err);
toast.error("Failed to load project summary");
console.error('Failed to load project summary:', err);
toast.error('Failed to load project summary');
setProjectSummary(null);
} finally {
setTimeout(() => {
@@ -314,16 +302,16 @@ export default function DashboardPage() {
let totalRoadCrack = 0;
let totalDamagedRoadMarking = 0;
let totalGoodSignboard = 0;
const chainageData: DetectionStats["chainageData"] = [];
const chainageData: DetectionStats['chainageData'] = [];
const packagesToProcess =
selectedPackageId && selectedPackageId !== "all"
selectedPackageId && selectedPackageId !== 'all'
? { [selectedPackageId]: projectSummary.packages[selectedPackageId] }
: projectSummary.packages || {};
for (const [pkgName, pkg] of Object.entries(packagesToProcess)) {
const chainagesToProcess =
selectedChainageId && selectedChainageId !== "all"
selectedChainageId && selectedChainageId !== 'all'
? { [selectedChainageId]: pkg.chainages[selectedChainageId] }
: pkg.chainages || {};
@@ -338,19 +326,19 @@ export default function DashboardPage() {
for (const detection of chn.detections || []) {
const type = detection.type.toLowerCase();
if (type === "defected_sign_board") {
if (type === 'defected_sign_board') {
chnDefectedSignboard++;
totalDefectedSignboard++;
} else if (type === "pothole") {
} else if (type === 'pothole') {
chnPothole++;
totalPothole++;
} else if (type === "road_crack") {
} else if (type === 'road_crack') {
chnRoadCrack++;
totalRoadCrack++;
} else if (type === "damaged_road_marking") {
} else if (type === 'damaged_road_marking') {
chnDamagedRoadMarking++;
totalDamagedRoadMarking++;
} else if (type === "good_sign_board") {
} else if (type === 'good_sign_board') {
chnGoodSignboard++;
totalGoodSignboard++;
}
@@ -363,8 +351,7 @@ export default function DashboardPage() {
chnDamagedRoadMarking > 0 ||
chnGoodSignboard > 0
) {
const shortName =
chnName.length > 20 ? chnName.substring(0, 20) + "..." : chnName;
const shortName = chnName.length > 20 ? chnName.substring(0, 20) + '...' : chnName;
chainageData.push({
name: shortName,
defected_sign_board: chnDefectedSignboard,
@@ -390,10 +377,7 @@ export default function DashboardPage() {
totalDamagedRoadMarking,
totalGoodSignboard,
totalRoadDamage:
totalDefectedSignboard +
totalPothole +
totalRoadCrack +
totalDamagedRoadMarking,
totalDefectedSignboard + totalPothole + totalRoadCrack + totalDamagedRoadMarking,
chainageData,
});
}, [projectSummary, selectedPackageId, selectedChainageId]);
@@ -425,7 +409,9 @@ export default function DashboardPage() {
<Milestone className="h-4 w-4 text-primary" />
Filter Analysis
</h3>
<p className="text-xs mt-1 text-muted-foreground">Refine your view by project, package, or chainage</p>
<p className="text-xs mt-1 text-muted-foreground">
Refine your view by project, package, or chainage
</p>
</div>
<div>
<FilterSelector
@@ -446,7 +432,6 @@ export default function DashboardPage() {
</Reveal>
</div>
{isLoading && !projectSummary ? (
<DashboardSkeleton />
) : (
@@ -532,13 +517,12 @@ export default function DashboardPage() {
<Card className="flex-1 h-full">
<CardHeader className="items-center pb-0">
<CardTitle className="text-base font-bold">Severity by Chainage</CardTitle>
<CardDescription className="text-xs">Detections grouped by road segment</CardDescription>
<CardDescription className="text-xs">
Detections grouped by road segment
</CardDescription>
</CardHeader>
<CardContent className="h-[300px]">
<ChainageBarChart
data={stats.chainageData || []}
isLoading={isLoading}
/>
<ChainageBarChart data={stats.chainageData || []} isLoading={isLoading} />
</CardContent>
<CardFooter className="flex-col gap-2 text-sm">
<div className="leading-none text-muted-foreground">
@@ -552,14 +536,14 @@ export default function DashboardPage() {
{/* Map - Full Width Below Charts */}
<Reveal delay={0.4} direction="up">
<div>
<DashboardMap
<DashboardMap
selectedProjectId={selectedProjectId}
selectedPackageId={selectedPackageId}
selectedChainageId={selectedChainageId} // Changed 'selectedLocationId' to 'selectedChainageId'
projectSummary={projectSummary}
/>
</div>
</Reveal>
</Reveal>
</>
)}