From 68d64c6c7e0cdde700cd01366af36c2a32b935c3 Mon Sep 17 00:00:00 2001 From: sickelap Date: Sat, 4 Nov 2023 13:49:38 +0000 Subject: [PATCH] enable no-restricted-syntax rule --- .eslintrc.js | 1 - src/components/AlbumLocationMap.tsx | 15 +++++---------- src/components/ChunkedUploadButton.tsx | 7 +++---- src/components/LocationMap.tsx | 20 ++++---------------- src/components/utils.ts | 0 src/util/util.test.ts | 16 ++++++++++++++-- src/util/util.ts | 19 +++++++++++++++++++ 7 files changed, 45 insertions(+), 33 deletions(-) create mode 100644 src/components/utils.ts diff --git a/.eslintrc.js b/.eslintrc.js index 7cbed1ee..ef123534 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -8,7 +8,6 @@ module.exports = { plugins: ["prettier"], rules: { "no-await-in-loop": "warn", - "no-restricted-syntax": "warn", "no-param-reassign": "warn", "no-underscore-dangle": "warn", "import/prefer-default-export": "off", diff --git a/src/components/AlbumLocationMap.tsx b/src/components/AlbumLocationMap.tsx index dcd849ab..f55a3390 100644 --- a/src/components/AlbumLocationMap.tsx +++ b/src/components/AlbumLocationMap.tsx @@ -1,20 +1,15 @@ import React from "react"; import { Map, Marker, TileLayer } from "react-leaflet"; +import { PartialPhotoWithLocation, getAveragedCoordinates } from "../util/util"; + type Props = { - photos: any[]; + photos: PartialPhotoWithLocation[]; }; export function AlbumLocationMap({ photos }: Readonly) { - const photosWithGPS = photos.filter(photo => photo.exif_gps_lon !== null && photo.exif_gps_lon); - let sumLat = 0; - let sumLon = 0; - for (const element of photosWithGPS) { - sumLat += parseFloat(element.exif_gps_lat); - sumLon += parseFloat(element.exif_gps_lon); - } - const avgLat = sumLat / photosWithGPS.length; - const avgLon = sumLon / photosWithGPS.length; + const photosWithGPS = photos.filter(photo => photo.exif_gps_lon !== null && photo.exif_gps_lat !== null); + const { avgLat, avgLon } = getAveragedCoordinates(photosWithGPS); const markers = photosWithGPS.map(photo => ( diff --git a/src/components/ChunkedUploadButton.tsx b/src/components/ChunkedUploadButton.tsx index 95b273bd..3d2691d7 100644 --- a/src/components/ChunkedUploadButton.tsx +++ b/src/components/ChunkedUploadButton.tsx @@ -73,8 +73,7 @@ export function ChunkedUploadButton() { reader.onload = () => { const buffer = reader.result; // @ts-ignore - const md5 = MD5(buffer).toString(); - return md5; + return MD5(buffer).toString(); }; return ""; }; @@ -123,7 +122,7 @@ export function ChunkedUploadButton() { total += fileSize; }); setTotalSize(total); - for (const file of acceptedFiles) { + acceptedFiles.forEach(async file => { const currentUploadedFileSizeStartValue = currentUploadedFileSize; // Check if the upload already exists via the hash of the file const hash = (await calculateMD5(file)) + userSelfDetails.id; @@ -152,7 +151,7 @@ export function ChunkedUploadButton() { currentUploadedFileSize += file.size; setCurrentSize(currentUploadedFileSize); } - } + }); }, }); diff --git a/src/components/LocationMap.tsx b/src/components/LocationMap.tsx index cbc045cd..2ad554c5 100644 --- a/src/components/LocationMap.tsx +++ b/src/components/LocationMap.tsx @@ -2,34 +2,22 @@ import { Box, Image, Loader } from "@mantine/core"; import React, { useEffect, useRef } from "react"; import { Map, Marker, Popup, TileLayer } from "react-leaflet"; +import { getAveragedCoordinates } from "../util/util"; + type Props = { photos: any[]; }; export function LocationMap({ photos }: Props) { const mapRef = useRef(null); - const height = "200px"; useEffect(() => { mapRef.current?.leafletElement.invalidateSize(); }, [height, photos]); - const photosWithGPS = photos.filter(photo => { - if (photo.exif_gps_lon !== null && photo.exif_gps_lon) { - return true; - } - return false; - }); - - let sumLat = 0; - let sumLon = 0; - for (const element of photosWithGPS) { - sumLat += parseFloat(element.exif_gps_lat); - sumLon += parseFloat(element.exif_gps_lon); - } - const avgLat = sumLat / photosWithGPS.length; - const avgLon = sumLon / photosWithGPS.length; + const photosWithGPS = photos.filter(photo => photo.exif_gps_lon !== null && photo.exif_gps_lon); + const { avgLat, avgLon } = getAveragedCoordinates(photosWithGPS); const markers = photosWithGPS.map(photo => ( diff --git a/src/components/utils.ts b/src/components/utils.ts new file mode 100644 index 00000000..e69de29b diff --git a/src/util/util.test.ts b/src/util/util.test.ts index b1761591..598a7b89 100644 --- a/src/util/util.test.ts +++ b/src/util/util.test.ts @@ -1,7 +1,7 @@ import type { DatePhotosGroup } from "../actions/photosActions.types"; import type { DirTree } from "../api_client/dir-tree"; import i18n from "../i18n"; -import { EMAIL_REGEX, formatDateForPhotoGroups, fuzzyMatch, mergeDirTree } from "./util"; +import { EMAIL_REGEX, formatDateForPhotoGroups, fuzzyMatch, getAveragedCoordinates, mergeDirTree } from "./util"; describe("email regex test", () => { test("good samples should match", () => { @@ -228,6 +228,18 @@ describe("adjust date for photo list group", () => { }, ]; const actual = formatDateForPhotoGroups(photoGroups); - expect(actual[0].date).toEqual(i18n.t("sidemenu.withouttimestamp")); + expect(actual[0].date).toEqual(i18n.t("sidemenu.withouttimestamp")); + }); +}); + +describe("getAveragedCoordinates", () => { + test("should return average coordinates", () => { + const actual = getAveragedCoordinates([ + { id: "1", exif_gps_lat: 1, exif_gps_lon: 2 }, + { id: "2", exif_gps_lat: 3, exif_gps_lon: 4 }, + { id: "3", exif_gps_lat: -3, exif_gps_lon: 6 }, + { id: "4", exif_gps_lat: 2, exif_gps_lon: 1 }, + ]); + expect(actual).toEqual({ avgLat: 0.75, avgLon: 3.25 }); }); }); diff --git a/src/util/util.ts b/src/util/util.ts index 870b0ab2..8b924283 100644 --- a/src/util/util.ts +++ b/src/util/util.ts @@ -102,3 +102,22 @@ export function mergeDirTree(tree: DirTree[], branch: DirTree): DirTree[] { return folder; }); } + +export type PartialPhotoWithLocation = { + id: string; + exif_gps_lat: number; + exif_gps_lon: number; + [key: string]: any; +}; + +export function getAveragedCoordinates(photos: PartialPhotoWithLocation[]) { + const { lat, lon } = photos.reduce( + (acc, photo) => { + acc.lat += parseFloat(`${photo.exif_gps_lat}`); + acc.lon += parseFloat(`${photo.exif_gps_lon}`); + return acc; + }, + { lat: 0, lon: 0 } + ); + return { avgLat: lat / photos.length, avgLon: lon / photos.length }; +}