Update dependency ol-pmtiles to v1 (#3926)

Co-authored-by: Renovate Bot <renovate@whitesourcesoftware.com>
Co-authored-by: Conor Brady <con.brad@gmail.com>

web/package.json

@@ -52,7 +52,7 @@
     "match-sorter": "^6.3.1",
     "nyc": "^17.0.0",
     "ol": "10.0.0",
-    "ol-pmtiles": "^0.5.0",
+    "ol-pmtiles": "^1.0.1",
     "prettier": "^3.3.3",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
@@ -111,4 +111,4 @@
     ]
   },
   "packageManager": "yarn@4.3.1"
-}
+}

web/src/api/fbaAPI.ts

@@ -1,7 +1,11 @@
 import axios, { raster } from 'api/axios'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
 import { DateTime } from 'luxon'
 
+export enum RunType {
+  FORECAST = 'FORECAST',
+  ACTUAL = 'ACTUAL'
+}
+
 export interface FireCenterStation {
   code: number
   name: string
@@ -30,7 +34,6 @@ export interface AdvisoryCriticalHours {
   end_time?: number
 }
 
-
 export interface FireZoneFuelStats {
   fuel_type: FuelType
   threshold: HfiThreshold
@@ -149,7 +152,6 @@ export async function getAllRunDates(run_type: RunType, for_date: string): Promi
   return data
 }
 
-
 export async function getFireCentreHFIStats(
   run_type: RunType,
   for_date: string,

web/src/features/fba/components/ActualForecastControl.tsx

@@ -1,8 +1,8 @@
 import { FormControl, FormControlLabel, FormLabel, Radio, RadioGroup } from '@mui/material'
 import React from 'react'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
 import { isNull } from 'lodash'
 import { theme } from 'app/theme'
+import { RunType } from '@/api/fbaAPI'
 
 export interface ActualForecastControlProps {
   runType: RunType

web/src/features/fba/components/actualForecastControl.test.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { render, fireEvent } from '@testing-library/react'
 import ActualForecastControl from './ActualForecastControl'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
 import { vi } from 'vitest'
+import { RunType } from '@/api/fbaAPI'
 
 describe('ActualForecastControl', () => {
   const mockSetRunType = vi.fn()

web/src/features/fba/components/map/FBAMap.tsx

@@ -1,13 +1,11 @@
-import * as ol from 'ol'
+import { PMTilesVectorSource } from 'ol-pmtiles'
+import { Map, View } from 'ol'
 import 'ol/ol.css'
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-ignore
-import * as olpmtiles from 'ol-pmtiles'
 import { defaults as defaultControls, FullScreen } from 'ol/control'
 import { fromLonLat } from 'ol/proj'
 import { boundingExtent } from 'ol/extent'
 import ScaleLine from 'ol/control/ScaleLine'
-import OLVectorLayer from 'ol/layer/Vector'
+import VectorLayer from 'ol/layer/Vector'
 import VectorTileLayer from 'ol/layer/VectorTile'
 import VectorSource from 'ol/source/Vector'
 import GeoJSON from 'ol/format/GeoJSON'
@@ -16,8 +14,8 @@ import React, { useEffect, useRef, useState } from 'react'
 import { ErrorBoundary } from 'components'
 import { selectFireWeatherStations, selectRunDates } from 'app/rootReducer'
 import { source as baseMapSource } from 'features/fireWeather/components/maps/constants'
-import Tile from 'ol/layer/Tile'
-import { FireCenter, FireShape, FireShapeArea } from 'api/fbaAPI'
+import TileLayer from 'ol/layer/Tile'
+import { FireCenter, FireShape, FireShapeArea, RunType } from 'api/fbaAPI'
 import { extentsMap } from 'features/fba/fireCentreExtents'
 import {
   fireCentreStyler,
@@ -32,14 +30,13 @@ import {
 import { BC_EXTENT, CENTER_OF_BC } from 'utils/constants'
 import { DateTime } from 'luxon'
 import { PMTILES_BUCKET } from 'utils/env'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
 import { buildPMTilesURL } from 'features/fba/pmtilesBuilder'
 import { isUndefined, cloneDeep, isNull } from 'lodash'
 import { Box } from '@mui/material'
 import Legend from 'features/fba/components/map/Legend'
 import ScalebarContainer from 'features/fba/components/map/ScaleBarContainer'
 import { fireZoneExtentsMap } from 'features/fba/fireZoneUnitExtents'
-export const MapContext = React.createContext<ol.Map | null>(null)
+export const MapContext = React.createContext<Map | null>(null)
 
 const bcExtent = boundingExtent(BC_EXTENT.map(coord => fromLonLat(coord)))
 
@@ -56,7 +53,7 @@ export interface FBAMapProps {
   setZoomSource: React.Dispatch<React.SetStateAction<'fireCenter' | 'fireShape' | undefined>>
 }
 
-const removeLayerByName = (map: ol.Map, layerName: string) => {
+const removeLayerByName = (map: Map, layerName: string) => {
   const layer = map
     .getLayers()
     .getArray()
@@ -70,21 +67,21 @@ const FBAMap = (props: FBAMapProps) => {
   const { stations } = useSelector(selectFireWeatherStations)
   const [showShapeStatus, setShowShapeStatus] = useState(true)
   const [showHFI, setShowHFI] = useState(false)
-  const [map, setMap] = useState<ol.Map | null>(null)
+  const [map, setMap] = useState<Map | null>(null)
   const mapRef = useRef<HTMLDivElement | null>(null) as React.MutableRefObject<HTMLElement>
   const scaleRef = useRef<HTMLDivElement | null>(null) as React.MutableRefObject<HTMLElement>
   const { mostRecentRunDate } = useSelector(selectRunDates)
 
-  const fireCentreVectorSource = new olpmtiles.PMTilesVectorSource({
+  const fireCentreVectorSource = new PMTilesVectorSource({
     url: `${PMTILES_BUCKET}fireCentres.pmtiles`
   })
-  const fireShapeVectorSource = new olpmtiles.PMTilesVectorSource({
+  const fireShapeVectorSource = new PMTilesVectorSource({
     url: `${PMTILES_BUCKET}fireZoneUnits.pmtiles`
   })
-  const fireCentreLabelVectorSource = new olpmtiles.PMTilesVectorSource({
+  const fireCentreLabelVectorSource = new PMTilesVectorSource({
     url: `${PMTILES_BUCKET}fireCentreLabels.pmtiles`
   })
-  const fireShapeLabelVectorSource = new olpmtiles.PMTilesVectorSource({
+  const fireShapeLabelVectorSource = new PMTilesVectorSource({
     url: `${PMTILES_BUCKET}fireZoneUnitLabels.pmtiles`
   })
 
@@ -235,7 +232,7 @@ const FBAMap = (props: FBAMapProps) => {
       // The runDate for forecasts is the mostRecentRunDate. For Actuals, our API expects the runDate to be
       // the same as the forDate.
       const runDate = props.runType === RunType.FORECAST ? DateTime.fromISO(mostRecentRunDate) : props.forDate
-      const hfiSource = new olpmtiles.PMTilesVectorSource({
+      const hfiSource = new PMTilesVectorSource({
         url: buildPMTilesURL(props.forDate, props.runType, runDate)
       })
 
@@ -261,13 +258,13 @@ const FBAMap = (props: FBAMapProps) => {
 
     // Create the map with the options above and set the target
     // To the ref above so that it is rendered in that div
-    const mapObject = new ol.Map({
-      view: new ol.View({
+    const mapObject = new Map({
+      view: new View({
         zoom: 5,
         center: fromLonLat(CENTER_OF_BC)
       }),
       layers: [
-        new Tile({
+        new TileLayer({
           source: baseMapSource
         }),
         fireCentreVTL,
@@ -307,7 +304,7 @@ const FBAMap = (props: FBAMapProps) => {
         }
       )
     })
-    const stationsLayer = new OLVectorLayer({
+    const stationsLayer = new VectorLayer({
       source: stationsSource,
       minZoom: 6,
       style: stationStyler,

web/src/features/fba/components/map/fbaMap.test.tsx

@@ -1,7 +1,7 @@
+import { RunType } from '@/api/fbaAPI'
 import { render } from '@testing-library/react'
 import store from 'app/store'
 import FBAMap from 'features/fba/components/map/FBAMap'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
 import { DateTime } from 'luxon'
 
 import { Provider } from 'react-redux'
@@ -32,7 +32,7 @@ describe('FBAMap', () => {
           setSelectedFireShape={function (): void {
             throw new Error('Function not implemented.')
           }}
-          zoomSource={undefined}
+          zoomSource={'fireCenter'}
           setZoomSource={function (): void {
             throw new Error('Function not implemented.')
           }}

web/src/features/fba/cqlBuilder.ts

@@ -1,4 +1,4 @@
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
+import { RunType } from '@/api/fbaAPI'
 import { DateTime } from 'luxon'
 
 /**

web/src/features/fba/pages/FireBehaviourAdvisoryPage.tsx

@@ -10,7 +10,7 @@ import { fetchFireCenters } from 'commonSlices/fireCentersSlice'
 import { theme } from 'app/theme'
 import { fetchWxStations } from 'features/stations/slices/stationsSlice'
 import { getStations, StationSource } from 'api/stationAPI'
-import { FireCenter, FireShape } from 'api/fbaAPI'
+import { FireCenter, FireShape, RunType } from 'api/fbaAPI'
 import { ASA_DOC_TITLE, FIRE_BEHAVIOUR_ADVISORY_NAME, PST_UTC_OFFSET } from 'utils/constants'
 import WPSDatePicker from 'components/WPSDatePicker'
 import { AppDispatch } from 'app/store'
@@ -29,11 +29,6 @@ import { fetchFireCentreHFIFuelStats } from 'features/fba/slices/fireCentreHFIFu
 
 const ADVISORY_THRESHOLD = 20
 
-export enum RunType {
-  FORECAST = 'FORECAST',
-  ACTUAL = 'ACTUAL'
-}
-
 export const FireCentreFormControl = styled(FormControl)({
   margin: theme.spacing(1),
   minWidth: 280

web/src/features/fba/pmtilesBuilder.ts

@@ -1,4 +1,4 @@
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
+import { RunType } from '@/api/fbaAPI'
 import { DateTime } from 'luxon'
 import { PMTILES_BUCKET } from 'utils/env'
 

web/src/features/fba/slices/fireCentreHFIFuelStatsSlice.ts

@@ -2,8 +2,7 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 
 import { AppThunk } from 'app/store'
 import { logError } from 'utils/error'
-import { FireCentreHFIStats, getFireCentreHFIStats } from 'api/fbaAPI'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
+import { FireCentreHFIStats, getFireCentreHFIStats, RunType } from 'api/fbaAPI'
 
 export interface FireCentreHFIFuelStatsState {
   error: string | null

web/src/features/fba/slices/fireCentreTPIStatsSlice.ts

@@ -2,8 +2,7 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 
 import { AppThunk } from 'app/store'
 import { logError } from 'utils/error'
-import { FireZoneTPIStats, getFireCentreTPIStats } from 'api/fbaAPI'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
+import { FireZoneTPIStats, getFireCentreTPIStats, RunType } from 'api/fbaAPI'
 
 export interface CentreTPIStatsState {
   error: string | null

web/src/features/fba/slices/fireZoneAreasSlice.ts

@@ -2,8 +2,7 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 
 import { AppThunk } from 'app/store'
 import { logError } from 'utils/error'
-import { FireShapeArea, FireShapeAreaListResponse, getFireShapeAreas } from 'api/fbaAPI'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
+import { FireShapeArea, FireShapeAreaListResponse, getFireShapeAreas, RunType } from 'api/fbaAPI'
 import { isNull, isUndefined } from 'lodash'
 
 export interface FireZoneAreasState {

web/src/features/fba/slices/fireZoneElevationInfoSlice.ts

@@ -2,8 +2,7 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 
 import { AppThunk } from 'app/store'
 import { logError } from 'utils/error'
-import { ElevationInfoByThreshold, FireZoneElevationInfoResponse, getFireZoneElevationInfo } from 'api/fbaAPI'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
+import { ElevationInfoByThreshold, FireZoneElevationInfoResponse, getFireZoneElevationInfo, RunType } from 'api/fbaAPI'
 
 export interface ZoneElevationInfoState {
   loading: boolean

web/src/features/fba/slices/provincialSummarySlice.ts

@@ -2,8 +2,7 @@ import { createSelector, createSlice, PayloadAction } from '@reduxjs/toolkit'
 import { AppThunk } from 'app/store'
 import { logError } from 'utils/error'
 import { groupBy, isNull, isUndefined } from 'lodash'
-import { FireShapeAreaDetail, getProvincialSummary, ProvincialSummaryResponse } from 'api/fbaAPI'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
+import { FireShapeAreaDetail, getProvincialSummary, ProvincialSummaryResponse, RunType } from 'api/fbaAPI'
 import { RootState } from 'app/rootReducer'
 
 export interface ProvincialSummaryState {

web/src/features/fba/slices/runDatesSlice.ts

@@ -2,9 +2,8 @@ import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 
 import { AppThunk } from 'app/store'
 import { logError } from 'utils/error'
-import { getAllRunDates, getMostRecentRunDate } from 'api/fbaAPI'
+import { getAllRunDates, getMostRecentRunDate, RunType } from 'api/fbaAPI'
 import { DateTime } from 'luxon'
-import { RunType } from 'features/fba/pages/FireBehaviourAdvisoryPage'
 
 export interface RunDateState {
   loading: boolean

web/yarn.lock

@@ -6984,14 +6984,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ol-pmtiles@npm:^0.5.0":
-  version: 0.5.0
-  resolution: "ol-pmtiles@npm:0.5.0"
+"ol-pmtiles@npm:^1.0.1":
+  version: 1.0.1
+  resolution: "ol-pmtiles@npm:1.0.1"
   dependencies:
-    pmtiles: "npm:^3.0.4"
+    pmtiles: "npm:^3.0.7"
   peerDependencies:
     ol: ">=9.0.0"
-  checksum: 10c0/f7b23ecd3a5f5f0fabe908c24ac99038b8d5e82b9bd221177255c77f99aaa880f6c86034be642f01da7ab6c1987298bd3a6d0098eae402c20d364f63cd3b123c
+  checksum: 10c0/8eabdc9b0e29ecf45447261aa9d3c2273aa1a63ffe401138878623fade23496b3803f74f9566a2e89e070faee3fc330a878fd98eef11a7019fb4eef4060cce9f
   languageName: node
   linkType: hard
 
@@ -7320,7 +7320,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"pmtiles@npm:^3.0.4":
+"pmtiles@npm:^3.0.7":
   version: 3.0.7
   resolution: "pmtiles@npm:3.0.7"
   dependencies:
@@ -9551,7 +9551,7 @@ __metadata:
     match-sorter: "npm:^6.3.1"
     nyc: "npm:^17.0.0"
     ol: "npm:10.0.0"
-    ol-pmtiles: "npm:^0.5.0"
+    ol-pmtiles: "npm:^1.0.1"
     prettier: "npm:^3.3.3"
     react: "npm:^18.3.1"
     react-dom: "npm:^18.3.1"