From 4cb015f0ff7b5c42248c64b6aa892e2f7242bc97 Mon Sep 17 00:00:00 2001 From: Matt Fisher Date: Thu, 8 Feb 2024 17:01:53 -0700 Subject: [PATCH] Fixup linting errors --- src/components/ControlPanel/SweSelector.tsx | 6 +++-- src/components/MainWindow/LinePlot.tsx | 27 +++++-------------- src/components/MainWindow/SlippyMap/index.tsx | 17 ++---------- src/components/MainWindow/Tile.tsx | 22 ++++++++++----- .../client/derived/availableVariables.ts | 2 +- src/state/client/derived/defaultVariableId.ts | 8 +++--- src/state/client/derived/mapView.ts | 2 +- .../client/derived/selectedSweVariable.ts | 4 +-- src/util/sideEffects/slippyMap.ts | 24 +++++++---------- 9 files changed, 45 insertions(+), 67 deletions(-) diff --git a/src/components/ControlPanel/SweSelector.tsx b/src/components/ControlPanel/SweSelector.tsx index 4b6d39f..236b919 100644 --- a/src/components/ControlPanel/SweSelector.tsx +++ b/src/components/ControlPanel/SweSelector.tsx @@ -25,10 +25,12 @@ const BasemapSelector: React.FC = () => { setSelectedSweVariableId(eventKey); }; + // TODO: This isn't how we handle errors! Let's catch it with an error + // boundary instead? Do we need a wrapper component for that? Ugh. if (sweVariablesIndexQuery.isError) { - console.debug(`Error!: ${sweVariablesIndexQuery.error}`); + console.debug(`Error!: ${sweVariablesIndexQuery.error.message}`); return ( - {`Error: ${sweVariablesIndexQuery.error}`} + {`Error: ${sweVariablesIndexQuery.error.message}`} ); } diff --git a/src/components/MainWindow/LinePlot.tsx b/src/components/MainWindow/LinePlot.tsx index f845c4d..3ed9f9d 100644 --- a/src/components/MainWindow/LinePlot.tsx +++ b/src/components/MainWindow/LinePlot.tsx @@ -8,19 +8,19 @@ import HighchartsReact from 'highcharts-react-official'; import '@src/style/LinePlot.css'; import '@src/style/card.css'; -import {selectedRegionAtom} from '@src/state/client/derived/selectedRegion'; import {plotDataQueryAtomFamily} from '@src/state/server/plotData'; import {IPlotData} from '@src/types/query/plotData'; import {IRichSuperRegionVariable} from '@src/types/query/variables'; -import LoadingIcon from '@src/components/common/LoadingIcon'; +import {IGenericRegion} from '@src/types/query/regions'; HighchartsAccessibility(Highcharts); HighchartsMore(Highcharts); interface ILinePlotProps { - selectedSatelliteVariableId: string | undefined; - selectedSatelliteVariable: IRichSuperRegionVariable | undefined; + selectedSatelliteVariableId: string; + selectedSatelliteVariable: IRichSuperRegionVariable; + selectedRegion: IGenericRegion; } @@ -28,28 +28,13 @@ interface ILinePlotProps { const LinePlot: React.FC = (props) => { const chartRef = useRef(null); - const selectedRegion = useAtomValue(selectedRegionAtom); - - if ( - props.selectedSatelliteVariable === undefined - || props.selectedSatelliteVariableId === undefined - || selectedRegion === undefined - ) { - return ( -
-
- -
-
- ); - } const plotDataQuery = useAtomValue(plotDataQueryAtomFamily({ - regionId: selectedRegion.id, + regionId: props.selectedRegion.id, variableId: props.selectedSatelliteVariableId, })); const varLongname = props.selectedSatelliteVariable.longNamePlot; - const regionLongname = selectedRegion.longName; + const regionLongname = props.selectedRegion.longName; if (plotDataQuery.isError) { console.debug(`Error!: ${String(plotDataQuery.error)}`); return ( diff --git a/src/components/MainWindow/SlippyMap/index.tsx b/src/components/MainWindow/SlippyMap/index.tsx index 29b6882..c01060c 100644 --- a/src/components/MainWindow/SlippyMap/index.tsx +++ b/src/components/MainWindow/SlippyMap/index.tsx @@ -52,8 +52,8 @@ import SlippyMapTooltip from './Tooltip'; interface ISlippyMapProps { - selectedSatelliteVariableId: string | undefined; - selectedSatelliteVariable: IRichSuperRegionVariable | undefined; + selectedSatelliteVariableId: string; + selectedSatelliteVariable: IRichSuperRegionVariable; } @@ -183,19 +183,6 @@ const SlippyMap: React.FC = (props) => { slippyMapRef.current = openLayersMap || null; const divId = `map-container-${slippyMapUid}` - if ( - props.selectedSatelliteVariable === undefined - || props.selectedSatelliteVariableId === undefined - ) { - return ( -
-
- ); - } - return ( <>
diff --git a/src/components/MainWindow/Tile.tsx b/src/components/MainWindow/Tile.tsx index 7417568..aa84296 100644 --- a/src/components/MainWindow/Tile.tsx +++ b/src/components/MainWindow/Tile.tsx @@ -7,10 +7,10 @@ import '@src/style/Tile.css'; import {CITATION} from '@src/constants/citation'; import {ErrorFallbackTileComponent} from '@src/components/common/ErrorFallback'; import {ITileIdentifier} from '@src/types/layout'; -import {selectedRegionIdAtom} from '@src/state/client/selectedRegionId'; import {selectedSatelliteVariableIdAtomFamily} from '@src/state/client/selectedSatelliteVariableId'; -import {selectedSatelliteVariableAtomFamily} from '@src/state/client/derived/selectedSatelliteVariable'; import {selectedTileTypeAtomFamily} from '@src/state/client/selectedTileType'; +import {selectedSatelliteVariableAtomFamily} from '@src/state/client/derived/selectedSatelliteVariable'; +import {selectedRegionAtom} from '@src/state/client/derived/selectedRegion'; import LoadingIcon from '@src/components/common/LoadingIcon'; import LinePlot from './LinePlot'; import SlippyMap from './SlippyMap'; @@ -29,11 +29,18 @@ const Tile: React.FC = (props) => { const selectedTileType = useAtomValue( selectedTileTypeAtomFamily(tileIdentifier) ); - const selectedRegionId = useAtomValue(selectedRegionIdAtom); - console.debug(selectedRegionId); + const selectedRegion = useAtomValue(selectedRegionAtom); + + // NOTE: Hoisted these checks out of the visualization components so they + // don't have to worry about undefined. + if ( + selectedRegion === undefined + || selectedSatelliteVariableId === undefined + || selectedSatelliteVariable === undefined + ) { + return (); + } - // TODO: Pass in selected variable as props? Or pass in row and column as - // props and let the tiles themselves access state? let content: JSX.Element; if (selectedTileType === 'plot') { @@ -41,6 +48,7 @@ const Tile: React.FC = (props) => { ); } else if (selectedTileType === 'map') { @@ -58,7 +66,7 @@ const Tile: React.FC = (props) => {
}> {content} diff --git a/src/state/client/derived/availableVariables.ts b/src/state/client/derived/availableVariables.ts index 8301a1b..20c5216 100644 --- a/src/state/client/derived/availableVariables.ts +++ b/src/state/client/derived/availableVariables.ts @@ -16,8 +16,8 @@ export interface IAvailableVariablesIndex { export const availableVariablesAtom = atom>( async (get) => { - const variablesIndex = await get(sspRichVariablesIndexAtom); const selectedSuperRegion = await get(selectedSuperRegionAtom); + const variablesIndex = get(sspRichVariablesIndexAtom); if ( selectedSuperRegion === undefined diff --git a/src/state/client/derived/defaultVariableId.ts b/src/state/client/derived/defaultVariableId.ts index 25cdb75..7a9e918 100644 --- a/src/state/client/derived/defaultVariableId.ts +++ b/src/state/client/derived/defaultVariableId.ts @@ -15,18 +15,20 @@ export const defaultVariableIdAtom = atom>( const vars = Object.entries(availableVariables); const defaults = vars.filter(([k, v]) => !!v.default); - if (defaults.length == 1) { + if (defaults.length === 1) { return defaults[0][0]; } else if (defaults.length > 1) { console.warn( 'Expected exactly 1 default variable.' - + ` Got ${defaults.length}, defaulting to first:\n${defaults}` + + ` Got ${defaults.length}. Defaulting to first element of:\n` + + `${JSON.stringify(defaults)}` ); return vars[0][0]; } throw new Error( - `Expected exactly 1 default variable. Got 0. Variables:\n${availableVariables}` + 'Expected exactly 1 default variable. Got 0. Variables:\n' + + `${JSON.stringify(availableVariables)}` ); }, ); diff --git a/src/state/client/derived/mapView.ts b/src/state/client/derived/mapView.ts index 5ee4516..3a5f5c1 100644 --- a/src/state/client/derived/mapView.ts +++ b/src/state/client/derived/mapView.ts @@ -25,7 +25,7 @@ export const mapViewAtomFamily = atomFamily( // if (geoJsonGeometryFeatures.length !== 1) { // throw new Error('GeoJSON should only include 1 feature.'); // } - if (geoJsonGeometryFeatures.length == 0) { + if (geoJsonGeometryFeatures.length === 0) { throw new Error('GeoJSON should include >=1 features; found 0.'); } const superRegionExtent = geoJsonGeometryFeatures[0].getGeometry()!.getExtent(); diff --git a/src/state/client/derived/selectedSweVariable.ts b/src/state/client/derived/selectedSweVariable.ts index 2c08495..b4ef7fc 100644 --- a/src/state/client/derived/selectedSweVariable.ts +++ b/src/state/client/derived/selectedSweVariable.ts @@ -10,8 +10,8 @@ import {sweRichVariablesIndexAtom} from '@src/state/client/derived/richVariables type AtomValue = ISweRichVariable | undefined; -export const selectedSweVariableAtom = atom>( - async (get) => { +export const selectedSweVariableAtom = atom( + (get) => { // TODO: Should change rich index query to async and await it? const variablesIndex = get(sweRichVariablesIndexAtom); const selectedVariable = get(selectedSweVariableIdAtom); diff --git a/src/util/sideEffects/slippyMap.ts b/src/util/sideEffects/slippyMap.ts index 5f578cb..769b9d3 100644 --- a/src/util/sideEffects/slippyMap.ts +++ b/src/util/sideEffects/slippyMap.ts @@ -145,30 +145,27 @@ export const useMapView = ( export const useNotProcessedLayerToggle = ( slippyMapUid: string, notProcessedLayerEnabled: boolean, - selectedSatelliteVariableObject: ISspRichVariable | undefined, - // FIXME: no any... + selectedSatelliteVariableObject: ISspRichVariable, availableVariables: IAvailableVariablesIndex | undefined, ): void => { useEffect(() => { - if ( - selectedSatelliteVariableObject === undefined - || availableVariables === undefined - ) { + if (availableVariables === undefined) { return; } const notProcessedVariables = Object.entries(availableVariables).filter( ([key, params]) => ( params.layerType === 'raster_notprocessed' - && params.sensor == selectedSatelliteVariableObject.sensor - && params.platform == selectedSatelliteVariableObject.platform - && params.algorithm == selectedSatelliteVariableObject.algorithm + && params.sensor === selectedSatelliteVariableObject.sensor + && params.platform === selectedSatelliteVariableObject.platform + && params.algorithm === selectedSatelliteVariableObject.algorithm ) ); if (notProcessedVariables.length !== 1) { throw new Error( - `Exactly one matching notprocessed variable is expected. Got ${notProcessedVariables}.` + 'Exactly one matching notprocessed variable is expected.' + + `Got: ${JSON.stringify(notProcessedVariables)}.` ); } const notProcessedVariableParams = notProcessedVariables[0][1]; @@ -214,14 +211,11 @@ export const useSelectedRegionShape = ( export const useSelectedRasterVariable = ( slippyMapUid: string, - selectedSatelliteVariableObject: IRichSuperRegionVariable | undefined, + selectedSatelliteVariableObject: IRichSuperRegionVariable, openLayersMap: OptionalOpenLayersMap, ): void => { useEffect(() => { - if ( - openLayersMap === undefined - || selectedSatelliteVariableObject === undefined - ) { + if (openLayersMap === undefined) { return; }