add alert-level-changes widget with working time range selector
This commit is contained in:
@@ -2,7 +2,8 @@ import { useMemo } from 'react';
|
||||
import { Box, Flex, Spinner, Text } from '@chakra-ui/react';
|
||||
import { useColorMode } from "@/components/ui/color-mode.jsx";
|
||||
import Plot from 'react-plotly.js';
|
||||
import VdapApi from '../../hooks/useVdapApi.js'; // Adjust path as needed
|
||||
import VdapApi from '../../hooks/useVdapApi.js';
|
||||
import useBuildUrl from "@/hooks/useBuildUrl.js";
|
||||
|
||||
export default function ExplosionEvents({ settings, widgetID }) {
|
||||
// Plotly expects 'linear' for normal axes
|
||||
@@ -12,22 +13,8 @@ export default function ExplosionEvents({ settings, widgetID }) {
|
||||
const { colorMode } = useColorMode();
|
||||
const isDark = colorMode === 'dark';
|
||||
|
||||
// Generate url with input dates are default to 7 day range
|
||||
const url = useMemo(() =>{
|
||||
if (settings?.startDate && settings?.endDate)
|
||||
return '/api/v2/explosion_events?start_date=' + settings?.startDate + '&end_date=' + settings?.endDate;
|
||||
else {
|
||||
const base_url = '/api/v2/explosion_events';
|
||||
let today = new Date();
|
||||
let sevenDaysAgo = new Date(today);
|
||||
sevenDaysAgo.setDate(sevenDaysAgo.getDate() - 7);
|
||||
|
||||
sevenDaysAgo = sevenDaysAgo.toLocaleDateString('en-CA');
|
||||
today = today.toLocaleDateString('en-CA');
|
||||
|
||||
return base_url + '?start_date=' + sevenDaysAgo + '&end_date=' + today;
|
||||
}
|
||||
}, [settings?.startDate, settings?.endDate]);
|
||||
// Generate url with input dates, default to 7 day range
|
||||
const url = useBuildUrl('/api/v2/explosion_events', settings?.startDate, settings?.endDate);
|
||||
|
||||
// Clean, single-line data fetching
|
||||
const { data: apiData, isLoading, error } = VdapApi(url);
|
||||
|
||||
Reference in New Issue
Block a user