Fishing map/fixes (#2938)

apps/fishing-map/features/i18n/utils.datasets.ts

@@ -10,5 +10,12 @@ export const getDatasetDescriptionTranslated = (dataset: {
   id: string
   description?: string
 }): string => {
-  return t(`datasets:${removeDatasetVersion(dataset?.id)}.description`, dataset?.description || '')
+  return (
+    t(`datasets:${removeDatasetVersion(dataset?.id)}.description`, {
+      defaultValue: dataset?.description || '',
+    })
+      // can't understand why i18next introduces an space in the url
+      // TODO remove  this ugly fix to remove it
+      .replace('https://globalfishingwatch. org/', 'https://globalfishingwatch.org/')
+  )
 }

apps/fishing-map/features/layer-library/LayerLibraryItem.tsx

@@ -1,5 +1,6 @@
 import { useTranslation } from 'react-i18next'
 import { useSelector } from 'react-redux'
+import { uniq } from 'es-toolkit'
 import {
   Button,
   FillColorBarOptions,
@@ -51,9 +52,13 @@ const LayerLibraryItem = (props: LayerLibraryItemProps) => {
     const palette = FILL_DATAVIEWS.includes(dataview.config?.type)
       ? FillColorBarOptions
       : LineColorBarOptions
-    const usedColors = dataviews.flatMap((dataview) => dataview.config?.color || [])
+
+    const usedColors = uniq(dataviews.flatMap((dataview) => dataview.config?.color || []))
     const isDefaultColorUnused = !usedColors.includes(config?.color as string)
-    const firstUnusedcolor = palette.find((c) => !usedColors.includes(c.value))
+    const firstUnusedcolor =
+      palette.length <= usedColors.length
+        ? palette.find((c) => !usedColors.includes(c.value))
+        : palette[Math.floor(Math.random() * palette.length + 1)]
     const supportsColorChange = !LAYER_LIBRARY_EVENTS_IDS.includes(id)
     upsertDataviewInstance({
       id: `${id}${LAYER_LIBRARY_ID_SEPARATOR}${Date.now()}`,

apps/fishing-map/features/map/overlays/draw/DrawDialog.tsx

@@ -231,6 +231,11 @@ function MapDraw() {
       />
       <IconButton
         icon={mapDrawingMode === 'points' ? 'add-point' : 'add-polygon'}
+        tooltip={
+          mapDrawingMode === 'points'
+            ? t('layer.drawAddPoint', 'Add another point')
+            : t('layer.drawAddPolygon', 'Add another geometry')
+        }
         onClick={onAddPolygonClick}
       />
       <IconButton
@@ -240,7 +245,7 @@ function MapDraw() {
         tooltip={
           !drawFeaturesIndexes.length
             ? t('layer.selectPolygonToRemove', 'Select the polygon to remove')
-            : ''
+            : t('layer.drawDelete', 'Delete selection')
         }
         onClick={drawLayer?.deleteSelectedFeature}
       />

apps/fishing-map/features/reports/areas/area-reports.selectors.ts

@@ -147,7 +147,7 @@ export const selectShowTimeComparison = createSelector(
 export const selectTimeComparisonValues = createSelector(
   [selectReportTimeComparison],
   (timeComparison): ReportTimeComparisonValues | undefined => {
-    if (!timeComparison) return
+    if (!timeComparison?.start || !timeComparison.compareStart) return
 
     const end = getUTCDateTime(timeComparison.start)
       .plus({ [timeComparison.durationType]: timeComparison.duration })

apps/fishing-map/public/locales/source/translations.json

@@ -621,6 +621,9 @@
     },
     "areasOnScreen": "Areas on screen",
     "color_change": "Change color",
+    "drawAddPoint": "Add another point",
+    "drawAddPolygon": "Add another geometry",
+    "drawDelete": "Delete selection",
     "drawPoints": "Draw points",
     "drawPolygon": "Draw a layer",
     "drawPolygonLogin": "Register and login to draw a layer (free, 2 minutes)",

libs/deck-layer-composer/src/resolvers/user.ts

@@ -162,7 +162,7 @@ export const resolveDeckUserLayerProps: DeckResolverFunction<BaseUserLayerProps>
   }
 
   const layer: ContextLayerConfig<string> = {
-    id: dataset.id,
+    id: `${dataview.id}-${dataset.id}`,
     datasetId: dataset.id,
     tilesUrl,
   }