diff --git a/package-lock.json b/package-lock.json index e936f302..998af62c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -22,6 +22,7 @@ "@turf/distance": "^7.1.0", "@turf/flatten": "^7.1.0", "axios": "^1.7.7", + "axios-retry": "^4.5.0", "core-js": "^3.38.1", "cssify": "^0.8.0", "d3": "^7.9.0", @@ -7106,6 +7107,18 @@ "proxy-from-env": "^1.1.0" } }, + "node_modules/axios-retry": { + "version": "4.5.0", + "resolved": "https://registry.npmjs.org/axios-retry/-/axios-retry-4.5.0.tgz", + "integrity": "sha512-aR99oXhpEDGo0UuAlYcn2iGRds30k366Zfa05XWScR9QaQD4JYiP3/1Qt1u7YlefUOK+cn0CcwoL1oefavQUlQ==", + "license": "Apache-2.0", + "dependencies": { + "is-retry-allowed": "^2.2.0" + }, + "peerDependencies": { + "axios": "0.x || 1.x" + } + }, "node_modules/babel-core": { "version": "5.8.38", "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-5.8.38.tgz", @@ -12790,6 +12803,18 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/is-retry-allowed": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/is-retry-allowed/-/is-retry-allowed-2.2.0.tgz", + "integrity": "sha512-XVm7LOeLpTW4jV19QSH38vkswxoLud8sQ57YwJVTPWdiaI9I8keEhGFpBlslyVsgdQy4Opg8QOLb8YRgsyZiQg==", + "license": "MIT", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/is-set": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/is-set/-/is-set-2.0.3.tgz", diff --git a/package.json b/package.json index 80f6b93b..85a2ce22 100644 --- a/package.json +++ b/package.json @@ -64,6 +64,7 @@ "@turf/distance": "^7.1.0", "@turf/flatten": "^7.1.0", "axios": "^1.7.7", + "axios-retry": "^4.5.0", "core-js": "^3.38.1", "cssify": "^0.8.0", "d3": "^7.9.0", diff --git a/src/components/dialog/observation-chart.js b/src/components/dialog/observation-chart.js index 2a92a9c4..0abaa23c 100644 --- a/src/components/dialog/observation-chart.js +++ b/src/components/dialog/observation-chart.js @@ -1,7 +1,10 @@ import React, { Fragment } from 'react'; +import { useQuery } from '@tanstack/react-query'; +import { Typography } from '@mui/material'; import axios from 'axios'; +import axiosRetry from 'axios-retry'; import { LineChart, Line, XAxis, YAxis, CartesianGrid, ResponsiveContainer, Tooltip, ReferenceLine } from 'recharts'; -import { useQuery } from '@tanstack/react-query'; + import dayjs from 'dayjs'; // install day.js for UTC visual formatting @@ -14,7 +17,7 @@ dayjs.extend(utc); * renders the observations as a chart * * @param dataUrl - * @returns {JSX.Element} + * @returns JSX.Element * @constructor */ export default function ObservationChart(chartProps) { @@ -40,6 +43,12 @@ console.error = (...args) => { * @returns { json } */ function getObsChartData(url, setLineButtonView) { + + // configure the retry count to be zero + axiosRetry(axios, { + retries: 0 + }); + // return the data to the caller return useQuery( { // specify the data key and url to use @@ -58,16 +67,19 @@ function getObsChartData(url, setLineButtonView) { }) // otherwise post the issue to the console log .catch (( error ) => { - // send the error message to the console - console.error(error.message); - // make sure we do not render anything - return error.message; + return error.response.status; }); - // return the csv data in json format - return csvToJSON(ret_val, setLineButtonView); - } + // if there was not an error + if (ret_val !== 500) { + // return the csv data in json format + return csvToJSON(ret_val, setLineButtonView); + } + else + // just return nothing and nothing will be rendered + return ''; + }, refetchOnWindowFocus: false }); } @@ -79,7 +91,7 @@ function getObsChartData(url, setLineButtonView) { */ function csvToJSON(csvData, setLineButtonView) { // ensure that there is csv data to convert - if (csvData !== "" && csvData.indexOf('Error') < 0 && csvData.indexOf('fail') < 0) { + if (csvData !== "") { // split on carriage returns const lines = csvData.split("\n"); @@ -183,9 +195,6 @@ function csvToJSON(csvData, setLineButtonView) { // return the json data representation return ret_val; } - - // return something - return ''; } /** @@ -265,31 +274,25 @@ function get_yaxis_ticks(data) { // return the new y-axis array range return ret_val; } - // else return nothing - else - return null; } /** * Creates the chart. * * @param url - * @returns {JSX.Element} + * @returns JSX.Element * @constructor */ function CreateObsChart(c) { // call to get the data. expect back some information too const { status, data } = getObsChartData(c.chartProps.url, c.chartProps.setLineButtonView); - // get the domain bounds - const maxValue = get_yaxis_ticks(data); - // render the chart return ( { - status === 'pending' ? (
Gathering chart data...
) : - status === 'error' ? (
There was a problem with collecting data for this location.
) : + status === 'pending' ? ( Gathering chart data... ) : + (status === 'error' || data === '') ? ( There was a problem collecting data for this location. ) : @@ -297,7 +300,7 @@ function CreateObsChart(c) { formatX_axis(value) }/> - formatY_axis(value) } /> + formatY_axis(value) } /> diff --git a/src/components/map/adcirc-raster-layer.js b/src/components/map/adcirc-raster-layer.js index 7c175458..9b74c343 100644 --- a/src/components/map/adcirc-raster-layer.js +++ b/src/components/map/adcirc-raster-layer.js @@ -131,7 +131,7 @@ export const AdcircRasterLayer = (layer) => { "station_name": l_props['product_name'] + " " + id, "lat": lat, "lon": lon, - "location_name": l_props['product_name'] + "s over time (lon, lat): " + id, + "location_name": layer.properties['product_name'].split(' ').slice(1).join(' ') + " at (lon, lat): " + id, "model_run_id": layer.group, "data_source": (l_props['event_type'] + '_' + l_props['grid_type']).toUpperCase(), "source_name": l_props['model'],