chore: update eslint and prettier configuration

src/hooks/use-cumulative-counts.ts

@@ -8,7 +8,9 @@ export const useCumulativeCounts = (frames: any[]) => {
     let indices: number[] = [];
 
     if (frames && Array.isArray(frames)) {
-      const sortedFrames = [...frames].sort((a, b) => (a.frame_id || 0) - (b.frame_id || 0));
+      const sortedFrames = [...frames].sort(
+        (a, b) => (a.frame_id || 0) - (b.frame_id || 0),
+      );
       sortedFrames.forEach((frameData) => {
         const frameId = frameData.frame_id;
         indices.push(frameId);

src/hooks/use-frame-detection-map.ts

@@ -1,8 +1,14 @@
 import { useMemo } from 'react';
 import { DetectionData } from '@/types';
-import { getEnabledDetectionTypes, DETECTION_TYPES } from '@/constants/detectionModeConfig';
+import {
+  getEnabledDetectionTypes,
+  DETECTION_TYPES,
+} from '@/constants/detectionModeConfig';
 
-export const useFrameDetectionMap = (data: DetectionData, detectionType: string) => {
+export const useFrameDetectionMap = (
+  data: DetectionData,
+  detectionType: string,
+) => {
   const frameDetectionMap = useMemo(() => {
     const map = new Map<number, any[]>();
     const detectionMode = data.detection_mode || detectionType;
@@ -38,7 +44,9 @@ export const useFrameDetectionMap = (data: DetectionData, detectionType: string)
             // Try common plural naming conventions for legacy support
             const possibleKeys = [
               `${type.id}s`,
-              type.id.endsWith('y') ? `${type.id.slice(0, -1)}ies` : `${type.id}s`,
+              type.id.endsWith('y')
+                ? `${type.id.slice(0, -1)}ies`
+                : `${type.id}s`,
               type.listKey.replace('_list', 's'),
               type.listKey,
             ];
@@ -73,7 +81,11 @@ export const useFrameDetectionMap = (data: DetectionData, detectionType: string)
     return Array.from(frameDetectionMap.keys()).sort((a, b) => a - b);
   }, [frameDetectionMap]);
 
-  const getNearestDetections = (frame: number, sortedIndices: number[], maxSkip = 3) => {
+  const getNearestDetections = (
+    frame: number,
+    sortedIndices: number[],
+    maxSkip = 3,
+  ) => {
     const exact = frameDetectionMap.get(frame);
     if (exact) return exact;
 

src/hooks/use-gps-map.ts

@@ -10,8 +10,14 @@ export const useGpsMap = (data: DetectionData) => {
       if (!list || !Array.isArray(list)) return;
       list.forEach((item) => {
         const id =
-          (item as any).pothole_id ?? (item as any).signboard_id ?? (item as any).detection_id;
-        if (item.lat !== undefined && item.lng !== undefined && id !== undefined) {
+          (item as any).pothole_id ??
+          (item as any).signboard_id ??
+          (item as any).detection_id;
+        if (
+          item.lat !== undefined &&
+          item.lng !== undefined &&
+          id !== undefined
+        ) {
           map.set(id, { lat: item.lat, lng: item.lng });
         }
       });

src/hooks/use-mobile.ts

@@ -3,7 +3,9 @@ import * as React from 'react';
 const MOBILE_BREAKPOINT = 768;
 
 export function useIsMobile() {
-  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined);
+  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(
+    undefined,
+  );
 
   React.useEffect(() => {
     const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);