CivicTechTO · Zen-cronic · Nov 30, 2024
diff --git a/tracket-react/src/components/api/base.ts b/tracket-react/src/components/api/base.ts
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 
-import { HTTP_METHODS, NoiseRequestParams } from "../../types/api";
+import { HTTP_METHODS, NoiseRequestParams } from '../../types/api';
 
 /**
  * Data loader from WebCOMAND API v1.
@@ -24,22 +24,22 @@ export const makeTracketApiRequest = async (
       // @ts-expect-error { page: <number> } incompatible with Record<string, string>
       // But it's implicitly cast to a string
       const queryParams = new URLSearchParams(data.params);
-      fullUrl = fullUrl.concat("?", queryParams.toString());
+      fullUrl = fullUrl.concat('?', queryParams.toString());
     }
 
     const requestOptions: RequestInit = {
       method,
       headers: {
-        Accept: "application/json",
+        Accept: 'application/json',
       },
     };
 
-    if (data && data.payload && method !== "GET") {
+    if (data && data.payload && method !== 'GET') {
       requestOptions.body = JSON.stringify(data.payload);
 
       requestOptions.headers = {
         ...requestOptions.headers,
-        "Content-Type": "application/json",
+        'Content-Type': 'application/json',
       };
     }
     const response = await fetch(fullUrl, requestOptions);

diff --git a/tracket-react/src/components/api/locations.ts b/tracket-react/src/components/api/locations.ts
@@ -6,9 +6,9 @@ import {
   LocationsData,
   NoiseRequestParams,
   TimedLocationNoiseData,
-} from "../../types/api";
-import { getActiveTimeLimit } from "../../utils";
-import { makeTracketApiRequest } from "./base";
+} from '../../types/api';
+import { getActiveTimeLimit } from '../../utils';
+import { makeTracketApiRequest } from './base';
 
 /**
  * Get locations from the API.
@@ -20,9 +20,9 @@ export const getLocations = async (
 ): Promise<LocationsData> => {
   const endpoint = locationID
     ? `/locations/${String(locationID)}`
-    : "/locations";
+    : '/locations';
 
-  const json = await makeTracketApiRequest("GET", endpoint);
+  const json = await makeTracketApiRequest('GET', endpoint);
 
   const result = json as LocationsData;
   const locationsData: LocationsData = { locations: [] };
@@ -53,10 +53,10 @@ export const getLocationNoiseData = async (
   locationID: number,
   params?: NoiseRequestParams
 ): Promise<AggregateLocationNoiseData | TimedLocationNoiseData> => {
-  const MEASUREMENTS_KEY = "measurements";
+  const MEASUREMENTS_KEY = 'measurements';
   const endpoint = `/locations/${String(locationID)}/noise`;
 
-  let noiseData = await makeTracketApiRequest("GET", endpoint, { params });
+  let noiseData = await makeTracketApiRequest('GET', endpoint, { params });
 
   const collectedNoiseData:
     | AggregateLocationNoiseData
@@ -74,7 +74,7 @@ export const getLocationNoiseData = async (
       paginateParams.page++;
     }
 
-    noiseData = await makeTracketApiRequest("GET", endpoint, {
+    noiseData = await makeTracketApiRequest('GET', endpoint, {
       params: paginateParams,
     });
 

diff --git a/tracket-react/src/components/map/CustomMarkerClusterGroup.tsx b/tracket-react/src/components/map/CustomMarkerClusterGroup.tsx
@@ -1,14 +1,14 @@
-import MarkerClusterGroup from "react-leaflet-cluster";
-import { LocationFormatted } from "../../types/api";
-import { divIcon, LatLngTuple, type MarkerCluster, point } from "leaflet";
+import MarkerClusterGroup from 'react-leaflet-cluster';
+import { LocationFormatted } from '../../types/api';
+import { divIcon, LatLngTuple, type MarkerCluster, point } from 'leaflet';
 import {
   MARKER_BORDER_COLOR,
   MARKER_COLOR_HIGHLIGHT,
   MARKER_COLOR_INACTIVE,
   RADIUS_PIXEL,
-} from "../../config";
-import { CircleMarker } from "react-leaflet";
-import CustomTooltip from "./CustomTooltip";
+} from '../../config';
+import { CircleMarker } from 'react-leaflet';
+import CustomTooltip from './CustomTooltip';
 
 const CustomMarkerClusterGroup = ({
   locations,
@@ -20,7 +20,7 @@ const CustomMarkerClusterGroup = ({
 
     return divIcon({
       html: `<div style="background-color:white;"><span>${count}</span></div>`,
-      className: "marker-cluster",
+      className: 'marker-cluster',
       iconSize: point(40, 40),
     });
   }
@@ -30,9 +30,9 @@ const CustomMarkerClusterGroup = ({
       {locations.map((l) => {
         const position: LatLngTuple = [l.latitude, l.longitude];
         const activeStatus = l.isSendingData
-          ? "Active Location"
-          : "Inactive Location";
-        const locationLabel = l.label || "";
+          ? 'Active Location'
+          : 'Inactive Location';
+        const locationLabel = l.label || '';
 
         const markerColor = l.isSendingData
           ? MARKER_COLOR_HIGHLIGHT

diff --git a/tracket-react/src/components/map/CustomTooltip.tsx b/tracket-react/src/components/map/CustomTooltip.tsx
@@ -1,5 +1,5 @@
-import { Tooltip } from "react-leaflet";
-import { CustomTooltipProps } from "../../types/components";
+import { Tooltip } from 'react-leaflet';
+import { CustomTooltipProps } from '../../types/components';
 
 const CustomTooltip = ({ activeStatus, locationLabel }: CustomTooltipProps) => {
   return (

diff --git a/tracket-react/src/components/map/Map.tsx b/tracket-react/src/components/map/Map.tsx
@@ -1,16 +1,16 @@
-import { MapContainer, TileLayer } from "react-leaflet";
-import "leaflet/dist/leaflet.css";
+import { MapContainer, TileLayer } from 'react-leaflet';
+import 'leaflet/dist/leaflet.css';
 import {
   LAYER_ATTRIBUTION,
   LAYER_URL,
   MAP_CENTER_LAT,
   MAP_CENTER_LON,
   ZOOM,
-} from "../../config";
-import { useEffect, useState } from "react";
-import { formatLocations, getLocations } from "../api/locations";
-import { type LocationFormatted } from "../../types/api";
-import CustomMarkerClusterGroup from "./CustomMarkerClusterGroup";
+} from '../../config';
+import { useEffect, useState } from 'react';
+import { formatLocations, getLocations } from '../api/locations';
+import { type LocationFormatted } from '../../types/api';
+import CustomMarkerClusterGroup from './CustomMarkerClusterGroup';
 
 const Map = () => {
   const [locations, setLocations] = useState<LocationFormatted[]>([]);

diff --git a/tracket-react/src/config.ts b/tracket-react/src/config.ts
@@ -1,5 +1,5 @@
 export const LAYER_URL =
-  "https://tiles.stadiamaps.com/tiles/alidade_smooth/{z}/{x}/{y}{r}.png";
+  'https://tiles.stadiamaps.com/tiles/alidade_smooth/{z}/{x}/{y}{r}.png';
 export const LAYER_ATTRIBUTION =
   '&copy; <a href="https://stadiamaps.com/">Stadia Maps</a>';
 
@@ -9,11 +9,11 @@ export const ZOOM = 11;
 
 export const RADIUS_METER = 25;
 export const RADIUS_PIXEL = 10;
-export const MARKER_COLOR = "#2C7BB2";
-export const MARKER_COLOR_HIGHLIGHT = "#FB9500";
-export const MARKER_COLOR_INACTIVE = "#545454";
-export const MARKER_BORDER_COLOR = "#222";
-export const CLUSTER_COLOR = "#B6D4E7";
+export const MARKER_COLOR = '#2C7BB2';
+export const MARKER_COLOR_HIGHLIGHT = '#FB9500';
+export const MARKER_COLOR_INACTIVE = '#545454';
+export const MARKER_BORDER_COLOR = '#222';
+export const CLUSTER_COLOR = '#B6D4E7';
 
 export const FILTER_ACTIVE = false;
 export const DEDUPLICATE = false;
diff --git a/tracket-react/src/types/api.ts b/tracket-react/src/types/api.ts
@@ -1,9 +1,9 @@
-export type HTTP_METHODS = "GET" | "POST" | "PUT" | "PATCH" | "DELETE";
+export type HTTP_METHODS = 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
 
 export enum Granularity {
-  Raw = "raw",
-  Hourly = "hourly",
-  LifeTime = "life-time",
+  Raw = 'raw',
+  Hourly = 'hourly',
+  LifeTime = 'life-time',
 }
 
 /**

diff --git a/tracket-react/src/types/components.ts b/tracket-react/src/types/components.ts
@@ -1,4 +1,4 @@
 export interface CustomTooltipProps {
-  activeStatus: "Active Location" | "Inactive Location";
+  activeStatus: 'Active Location' | 'Inactive Location';
   locationLabel: string;
 }
diff --git a/tracket-react/tests/dataLoading.test.ts b/tracket-react/tests/dataLoading.test.ts
@@ -1,16 +1,16 @@
-import { describe, expect, test } from "vitest";
+import { describe, expect, test } from 'vitest';
 import {
   getLocationNoiseData,
   getLocations,
-} from "../src/components/api/locations";
-import { makeTracketApiRequest } from "../src/components/api/base";
-import { Granularity, NoiseTimed } from "../src/types/api";
+} from '../src/components/api/locations';
+import { makeTracketApiRequest } from '../src/components/api/base';
+import { Granularity, NoiseTimed } from '../src/types/api';
 
-describe("data loading operations", () => {
+describe('data loading operations', () => {
   const V1_API_TEST_ID = 572250;
 
-  describe("locations api", () => {
-    test("/locations ", async () => {
+  describe('locations api', () => {
+    test('/locations ', async () => {
       const result = await getLocations();
 
       const expected = {
@@ -30,7 +30,7 @@ describe("data loading operations", () => {
       expect(result).toEqual(expected);
     });
 
-    test("/locations/:location-id", async () => {
+    test('/locations/:location-id', async () => {
       const result = await getLocations(V1_API_TEST_ID);
 
       const expected = {
@@ -52,11 +52,11 @@ describe("data loading operations", () => {
     });
   });
 
-  describe("/locations/:location-id/noise with plain request", () => {
+  describe('/locations/:location-id/noise with plain request', () => {
     const endpoint = `/locations/${V1_API_TEST_ID}/noise`;
 
-    test("should return TimedLocationNoiseData for default params", async () => {
-      const result = await makeTracketApiRequest("GET", endpoint);
+    test('should return TimedLocationNoiseData for default params', async () => {
+      const result = await makeTracketApiRequest('GET', endpoint);
 
       expect(result.measurements?.length).toBeGreaterThan(0);
 
@@ -70,8 +70,8 @@ describe("data loading operations", () => {
       });
     });
 
-    test("should return AggregateLocationNoiseData for life-time granularity", async () => {
-      const result = await makeTracketApiRequest("GET", endpoint, {
+    test('should return AggregateLocationNoiseData for life-time granularity', async () => {
+      const result = await makeTracketApiRequest('GET', endpoint, {
         params: {
           granularity: Granularity.LifeTime,
         },
@@ -92,8 +92,8 @@ describe("data loading operations", () => {
     });
   });
 
-  describe("/locations/:location-id/noise with noise api", () => {
-    test("should return TimedLocationNoiseData with pagination", async () => {
+  describe('/locations/:location-id/noise with noise api', () => {
+    test('should return TimedLocationNoiseData with pagination', async () => {
       const result = await getLocationNoiseData(V1_API_TEST_ID, {
         page: 1,
       });
@@ -109,7 +109,7 @@ describe("data loading operations", () => {
         });
       });
     });
-    test("should return TimedLocationNoiseData for hourly granularity with pagination", async () => {
+    test('should return TimedLocationNoiseData for hourly granularity with pagination', async () => {
       const result = await getLocationNoiseData(V1_API_TEST_ID, {
         granularity: Granularity.Hourly,
         page: 1,
@@ -127,7 +127,7 @@ describe("data loading operations", () => {
       });
     });
 
-    test("should return AggregateLocationNoiseData for life-time granularity", async () => {
+    test('should return AggregateLocationNoiseData for life-time granularity', async () => {
       const result = await getLocationNoiseData(V1_API_TEST_ID, {
         granularity: Granularity.LifeTime,
       });

diff --git a/tracket-react/tests/utils.test.ts b/tracket-react/tests/utils.test.ts
@@ -1,14 +1,14 @@
-import { getCurrentDate, getActiveTimeLimit } from "../src/utils";
-import { describe, expect, test } from "vitest";
+import { getCurrentDate } from '../src/utils';
+import { describe, expect, test } from 'vitest';
 
-describe("util functions", () => {
-  describe("getCurrentDate", () => {
+describe('util functions', () => {
+  describe('getCurrentDate', () => {
     test.each([
-      { tzOffset: -5, description: "Negative offset" },
-      { tzOffset: 0, description: "Zero offset" },
-      { tzOffset: 4, description: "Positive offset" },
+      { tzOffset: -5, description: 'Negative offset' },
+      { tzOffset: 0, description: 'Zero offset' },
+      { tzOffset: 4, description: 'Positive offset' },
     ])(
-      "should return the current date with the specified timezone offset ($description)",
+      'should return the current date with the specified timezone offset ($description)',
       ({ tzOffset }) => {
         const result = getCurrentDate(tzOffset);