add: volcano drop down filter w/ multiselect capabilities in widget settings. UI only! No functionality has been built yet
This commit is contained in:
@@ -155,6 +155,16 @@ export default function AlertChanges({ settings, widgetID }) {
|
||||
Green: "alertGreen",
|
||||
};
|
||||
|
||||
const options = {
|
||||
year: "numeric",
|
||||
month: "short",
|
||||
day: "numeric",
|
||||
hour: "numeric",
|
||||
minute: "2-digit",
|
||||
second: "2-digit",
|
||||
timeZoneName: "short"
|
||||
};
|
||||
|
||||
if (isLoading)
|
||||
return (
|
||||
<Flex w="100%" h="100%" align="center" justify="center" bg="transparent">
|
||||
@@ -195,172 +205,174 @@ export default function AlertChanges({ settings, widgetID }) {
|
||||
<Collapsible.Root key={index} w="100%">
|
||||
<Collapsible.Context>
|
||||
{(collapsible) => (
|
||||
<>
|
||||
<Collapsible.Trigger w="100%">
|
||||
<Collapsible.Trigger w="100%">
|
||||
<Flex
|
||||
direction="row"
|
||||
w="100%"
|
||||
justify="space-between"
|
||||
align="center"
|
||||
p={1}
|
||||
pl={3}
|
||||
pr={3}
|
||||
borderTopRadius="lg"
|
||||
borderBottomRadius={collapsible.open ? "0" : "lg"}
|
||||
bg="widgetItemBg"
|
||||
>
|
||||
<Flex
|
||||
direction="row"
|
||||
direction="column"
|
||||
w="100%"
|
||||
justify="space-between"
|
||||
align="center"
|
||||
p={1}
|
||||
pl={3}
|
||||
pr={3}
|
||||
borderTopRadius="lg"
|
||||
borderBottomRadius={collapsible.open ? "0" : "lg"}
|
||||
bg="widgetItemBg"
|
||||
minW={0}
|
||||
textAlign="left"
|
||||
>
|
||||
<Flex
|
||||
direction="column"
|
||||
w="100%"
|
||||
minW={0}
|
||||
textAlign="left"
|
||||
<Text truncate color="text" fontWeight="medium">
|
||||
{volcano[0]}
|
||||
</Text>
|
||||
<Text truncate fontSize="xs" color="widgetTextMuted">
|
||||
{new Date(volcano[1][0]?.alert_start_date_local)
|
||||
.toLocaleString('en-US', options)
|
||||
}
|
||||
</Text>
|
||||
</Flex>
|
||||
<Flex w="100%" minW={0} justify="right" gap={2}>
|
||||
<Text
|
||||
truncate
|
||||
pl={2}
|
||||
pr={2}
|
||||
borderRadius="lg"
|
||||
bg="widgetBadgeBg"
|
||||
color="text"
|
||||
fontWeight="semibold"
|
||||
>
|
||||
<Text truncate color="text" fontWeight="medium">
|
||||
{volcano[0]}
|
||||
</Text>
|
||||
<Text truncate fontSize="xs" color="widgetTextMuted">
|
||||
{volcano[1][0]?.alert_start_date_local}
|
||||
</Text>
|
||||
</Flex>
|
||||
<Flex w="100%" minW={0} justify="right" gap={2}>
|
||||
<Flex w="fit">
|
||||
{volcano[1][0]?.change_type === "increase" ? (
|
||||
<TrendingUp />
|
||||
) : (
|
||||
<TrendingDown />
|
||||
)}
|
||||
</Flex>
|
||||
<Text
|
||||
truncate
|
||||
pl={2}
|
||||
pr={2}
|
||||
borderRadius="lg"
|
||||
bg="widgetBadgeBg"
|
||||
color="text"
|
||||
fontWeight="semibold"
|
||||
>
|
||||
{volcano[1][0]?.alert_level_name}
|
||||
</Text>
|
||||
{volcano[1][0]?.alert_level_name}
|
||||
</Text>
|
||||
<Flex w="fit">
|
||||
{volcano[1][0]?.change_type === "increase" ? (
|
||||
<TrendingUp />
|
||||
) : (
|
||||
<TrendingDown />
|
||||
)}
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Collapsible.Trigger>
|
||||
|
||||
<Collapsible.Content
|
||||
w="100%"
|
||||
p={3}
|
||||
borderBottomRadius="lg"
|
||||
bg="widgetItemExpandedBg"
|
||||
>
|
||||
<Timeline.Root size="md" variant="subtle">
|
||||
{volcano[1]?.map((object, index) => (
|
||||
<Timeline.Item key={index} w="100%" h="100%">
|
||||
<Timeline.Connector>
|
||||
<Timeline.Indicator
|
||||
outline="none"
|
||||
bg="widgetBadgeBg"
|
||||
color="iconColor"
|
||||
size="lg"
|
||||
>
|
||||
{object?.alert_scheme_domain ===
|
||||
"terrestrial" && <Footprints size={15} />}
|
||||
{object?.alert_scheme_domain === "aviation" && (
|
||||
<Plane size={15} />
|
||||
)}
|
||||
{object?.alert_scheme_domain === "maritime" && (
|
||||
<Sailboat size={15} />
|
||||
)}
|
||||
</Timeline.Indicator>
|
||||
<Timeline.Indicator
|
||||
h="50%"
|
||||
outline="none"
|
||||
bg="transparent"
|
||||
color="iconColor"
|
||||
size="lg"
|
||||
>
|
||||
{object?.change_type === "increase" ? (
|
||||
<TrendingUp />
|
||||
) : (
|
||||
<TrendingDown />
|
||||
)}
|
||||
</Timeline.Indicator>
|
||||
</Timeline.Connector>
|
||||
<Timeline.Content w="100%" h="100%">
|
||||
<Timeline.Description w="100%" h="100%" gap={1}>
|
||||
<Flex direction="column" gap={1}>
|
||||
<Text
|
||||
w="100%"
|
||||
h="100%"
|
||||
color="widgetTextMuted"
|
||||
>
|
||||
{object?.alert_start_date_local}
|
||||
</Text>
|
||||
<Text
|
||||
w="100%"
|
||||
h="100%"
|
||||
color={
|
||||
alertColors[object?.alert_level_name] ||
|
||||
"text"
|
||||
}
|
||||
fontSize="md"
|
||||
fontWeight="semibold"
|
||||
>
|
||||
{object?.alert_level_name}
|
||||
</Text>
|
||||
<Flex
|
||||
w="100%"
|
||||
h="20px"
|
||||
direction="row"
|
||||
justify="left"
|
||||
align="center"
|
||||
>
|
||||
<Text color="widgetTextMuted">
|
||||
Alert Scale:{" "}
|
||||
</Text>
|
||||
{Array.from(
|
||||
{
|
||||
length:
|
||||
Number(object?.alert_scheme_highest) -
|
||||
Number(object?.alert_scheme_lowest) +
|
||||
1,
|
||||
},
|
||||
(v, i) =>
|
||||
Number(object?.alert_scheme_lowest) + i,
|
||||
).map((num) => (
|
||||
<Center
|
||||
key={num}
|
||||
w="20px"
|
||||
h="100%"
|
||||
color="text"
|
||||
bg={
|
||||
num ===
|
||||
Number(object?.alert_level_rank)
|
||||
? "widgetBadgeBg"
|
||||
: "transparent"
|
||||
}
|
||||
borderRadius={
|
||||
num ===
|
||||
Number(object?.alert_level_rank)
|
||||
? "xl"
|
||||
: "none"
|
||||
}
|
||||
textAlign="center"
|
||||
fontSize="sm"
|
||||
fontWeight="bold"
|
||||
>
|
||||
{num}
|
||||
</Center>
|
||||
))}
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Timeline.Description>
|
||||
</Timeline.Content>
|
||||
</Timeline.Item>
|
||||
))}
|
||||
</Timeline.Root>
|
||||
</Collapsible.Content>
|
||||
</>
|
||||
</Flex>
|
||||
</Collapsible.Trigger>
|
||||
)}
|
||||
</Collapsible.Context>
|
||||
|
||||
<Collapsible.Content
|
||||
w="100%"
|
||||
p={3}
|
||||
borderBottomRadius="lg"
|
||||
bg="widgetItemExpandedBg"
|
||||
>
|
||||
<Timeline.Root size="md" variant="subtle">
|
||||
{volcano[1]?.map((object, index) => (
|
||||
<Timeline.Item key={index} w="100%" h="100%">
|
||||
<Timeline.Connector>
|
||||
<Timeline.Indicator
|
||||
outline="none"
|
||||
bg="widgetBadgeBg"
|
||||
color="iconColor"
|
||||
size="lg"
|
||||
>
|
||||
{object?.alert_scheme_domain ===
|
||||
"terrestrial" && <Footprints size={15} />}
|
||||
{object?.alert_scheme_domain === "aviation" && (
|
||||
<Plane size={15} />
|
||||
)}
|
||||
{object?.alert_scheme_domain === "maritime" && (
|
||||
<Sailboat size={15} />
|
||||
)}
|
||||
</Timeline.Indicator>
|
||||
<Timeline.Indicator
|
||||
h="50%"
|
||||
outline="none"
|
||||
bg="transparent"
|
||||
color="iconColor"
|
||||
size="lg"
|
||||
>
|
||||
{object?.change_type === "increase" ? (
|
||||
<TrendingUp />
|
||||
) : (
|
||||
<TrendingDown />
|
||||
)}
|
||||
</Timeline.Indicator>
|
||||
</Timeline.Connector>
|
||||
<Timeline.Content w="100%" h="100%">
|
||||
<Timeline.Description w="100%" h="100%" gap={1}>
|
||||
<Flex direction="column" gap={1}>
|
||||
<Text
|
||||
w="100%"
|
||||
h="100%"
|
||||
color="widgetTextMuted"
|
||||
>
|
||||
{new Date(object?.alert_start_date_local)
|
||||
.toLocaleString('en-US', {...options, timeZone: 'UTC'})
|
||||
}
|
||||
</Text>
|
||||
<Text
|
||||
w="100%"
|
||||
h="100%"
|
||||
color={
|
||||
alertColors[object?.alert_level_name] ||
|
||||
"text"
|
||||
}
|
||||
fontSize="md"
|
||||
fontWeight="semibold"
|
||||
>
|
||||
{object?.alert_level_name}
|
||||
</Text>
|
||||
<Flex
|
||||
w="100%"
|
||||
h="20px"
|
||||
direction="row"
|
||||
justify="left"
|
||||
align="center"
|
||||
>
|
||||
<Text color="widgetTextMuted">
|
||||
Alert Scale:{" "}
|
||||
</Text>
|
||||
{Array.from(
|
||||
{
|
||||
length:
|
||||
Number(object?.alert_scheme_highest) -
|
||||
Number(object?.alert_scheme_lowest) +
|
||||
1,
|
||||
},
|
||||
(v, i) =>
|
||||
Number(object?.alert_scheme_lowest) + i,
|
||||
).map((num) => (
|
||||
<Center
|
||||
key={num}
|
||||
w="20px"
|
||||
h="100%"
|
||||
color="text"
|
||||
bg={
|
||||
num ===
|
||||
Number(object?.alert_level_rank)
|
||||
? "widgetBadgeBg"
|
||||
: "transparent"
|
||||
}
|
||||
borderRadius={
|
||||
num ===
|
||||
Number(object?.alert_level_rank)
|
||||
? "xl"
|
||||
: "none"
|
||||
}
|
||||
textAlign="center"
|
||||
fontSize="sm"
|
||||
fontWeight="bold"
|
||||
>
|
||||
{num}
|
||||
</Center>
|
||||
))}
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Timeline.Description>
|
||||
</Timeline.Content>
|
||||
</Timeline.Item>
|
||||
))}
|
||||
</Timeline.Root>
|
||||
</Collapsible.Content>
|
||||
</Collapsible.Root>
|
||||
);
|
||||
else if (thisWidget?.size === "small")
|
||||
|
||||
@@ -1,63 +1,130 @@
|
||||
import {Flex, Slider, Switch, Text, Field, Fieldset, Input, CheckboxCard, CheckboxGroup} from "@chakra-ui/react";
|
||||
import {useDashboardStore} from "@/store/useDashboardStore.jsx";
|
||||
import { useState } from "react";
|
||||
import {
|
||||
Flex,
|
||||
Slider,
|
||||
Switch,
|
||||
Text,
|
||||
Field,
|
||||
Fieldset,
|
||||
Input,
|
||||
CheckboxCard,
|
||||
CheckboxGroup,
|
||||
Combobox,
|
||||
Portal,
|
||||
useFilter,
|
||||
useListCollection,
|
||||
Wrap,
|
||||
Badge
|
||||
} from "@chakra-ui/react";
|
||||
import { useDashboardStore } from "@/store/useDashboardStore.jsx";
|
||||
import { useState, useMemo } from "react";
|
||||
|
||||
export default function IvansAlertsSettings({ widgetId, currentSettings }) {
|
||||
const updateSettings = useDashboardStore(state => state.updateWidgetSettings);
|
||||
export default function AlertChangeSettings({ widgetId, currentSettings }) {
|
||||
const updateSettings = useDashboardStore(
|
||||
(state) => state.updateWidgetSettings,
|
||||
);
|
||||
const [startError, setStartError] = useState(null);
|
||||
const [endError, setEndError] = useState(null);
|
||||
|
||||
console.log("currentSettings:", currentSettings);
|
||||
|
||||
const [selectedVolcanoes, setSelectedVolcanoes] = useState([]);
|
||||
const { startsWith } = useFilter({ sensitivity: "base" });
|
||||
|
||||
const { collection, filter, reset } = useListCollection({
|
||||
initialItems: volcanoes,
|
||||
filter: startsWith,
|
||||
limit: 10,
|
||||
});
|
||||
|
||||
const handleValueChange = (details) => {
|
||||
setSelectedVolcanoes(details.value)
|
||||
}
|
||||
|
||||
return (
|
||||
<Flex direction="column" gap={4} pb={2}>
|
||||
<Flex direction="column" gap={4} pb={2} overflowY="auto">
|
||||
<Fieldset.Root>
|
||||
<Fieldset.Content>
|
||||
{/* SELECTING DATE RANGE */}
|
||||
<Flex direction="column" w="100%" h="100%" justify="center" gap="2">
|
||||
<Flex direction="column">
|
||||
<Text w="100%" fontWeight="bold">Date Range Selection</Text>
|
||||
<Text w="100%" fontWeight="bold">
|
||||
Date Range Selection
|
||||
</Text>
|
||||
<hr /> {/*line seperator*/}
|
||||
</Flex>
|
||||
|
||||
{/* start date */}
|
||||
<Field.Root invalid={!!startError}>
|
||||
<Flex direction="row" w="100%" h="100%" align="center" justify="center">
|
||||
<Text w="50%" align="center" justify="center" color="gray.700">Start Date</Text>
|
||||
<Flex
|
||||
direction="row"
|
||||
w="100%"
|
||||
h="100%"
|
||||
align="center"
|
||||
justify="center"
|
||||
>
|
||||
<Text w="50%" align="center" justify="center" color="gray.700">
|
||||
Start Date
|
||||
</Text>
|
||||
<Flex direction="column" w="100%">
|
||||
<Input type="date" w="100%" borderRadius="lg" value={currentSettings?.startDate || ""}
|
||||
<Input
|
||||
type="date"
|
||||
w="100%"
|
||||
borderRadius="lg"
|
||||
value={currentSettings?.startDate || ""}
|
||||
onChange={(e) => {
|
||||
const value = e.target.value;
|
||||
updateSettings(widgetId, {...currentSettings, startDate: value});
|
||||
updateSettings(widgetId, {
|
||||
...currentSettings,
|
||||
startDate: value,
|
||||
});
|
||||
|
||||
const dateSelected = new Date(value);
|
||||
const today = new Date();
|
||||
today.setHours(0, 0, 0, 0);
|
||||
|
||||
if (value && (dateSelected > today)) setStartError("Can't Choose a Future Date");
|
||||
if (value && dateSelected > today)
|
||||
setStartError("Can't Choose a Future Date");
|
||||
else setStartError("");
|
||||
}}
|
||||
/>
|
||||
{startError && <Field.ErrorText>{startError}</Field.ErrorText>}
|
||||
{startError && (
|
||||
<Field.ErrorText>{startError}</Field.ErrorText>
|
||||
)}
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Field.Root>
|
||||
|
||||
{/* end date */}
|
||||
<Field.Root invalid={!!endError}>
|
||||
<Flex direction="row" w="100%" h="100%" align="center" justify="center">
|
||||
<Text w="50%" align="center" justify="center" color="gray.700">End Date</Text>
|
||||
<Flex
|
||||
direction="row"
|
||||
w="100%"
|
||||
h="100%"
|
||||
align="center"
|
||||
justify="center"
|
||||
>
|
||||
<Text w="50%" align="center" justify="center" color="gray.700">
|
||||
End Date
|
||||
</Text>
|
||||
<Flex direction="column" w="100%">
|
||||
<Input type="date" w="100%" borderRadius="lg" value={currentSettings?.endDate || ""}
|
||||
<Input
|
||||
type="date"
|
||||
w="100%"
|
||||
borderRadius="lg"
|
||||
value={currentSettings?.endDate || ""}
|
||||
onChange={(e) => {
|
||||
const value = e.target.value;
|
||||
updateSettings(widgetId, {...currentSettings, endDate: value});
|
||||
updateSettings(widgetId, {
|
||||
...currentSettings,
|
||||
endDate: value,
|
||||
});
|
||||
|
||||
const dateSelected = new Date(value);
|
||||
const today = new Date();
|
||||
today.setHours(0, 0, 0, 0);
|
||||
|
||||
if (value && (dateSelected > today)) setEndError("Can't Choose a Future Date");
|
||||
if (value && dateSelected > today)
|
||||
setEndError("Can't Choose a Future Date");
|
||||
else setEndError("");
|
||||
}}
|
||||
/>
|
||||
@@ -67,61 +134,156 @@ export default function IvansAlertsSettings({ widgetId, currentSettings }) {
|
||||
</Field.Root>
|
||||
</Flex>
|
||||
|
||||
{/* FILTER ON CHANGE TYPE */}
|
||||
{/* FILTERS */}
|
||||
<CheckboxGroup w="100%">
|
||||
<Flex direction="column" w="100%" gap={2}>
|
||||
<Flex direction="column" w="100%">
|
||||
<Text w="fit" fontWeight="bold">Filters</Text>
|
||||
<Text w="fit" fontWeight="bold">
|
||||
Filters
|
||||
</Text>
|
||||
<hr /> {/*line seperator*/}
|
||||
</Flex>
|
||||
<CheckboxCard.Root size="sm" variant="surface" borderRadius="lg"
|
||||
|
||||
{/* level increases */}
|
||||
<CheckboxCard.Root
|
||||
size="sm"
|
||||
variant="surface"
|
||||
borderRadius="lg"
|
||||
defaultChecked={currentSettings?.filters?.levelIncreases}
|
||||
onCheckedChange={e => {
|
||||
updateSettings(widgetId, {...currentSettings, filters: {...currentSettings.filters, levelIncreases: e.checked}})
|
||||
onCheckedChange={(e) => {
|
||||
updateSettings(widgetId, {
|
||||
...currentSettings,
|
||||
filters: {
|
||||
...currentSettings.filters,
|
||||
levelIncreases: e.checked,
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
<CheckboxCard.HiddenInput /> {/* when removed can't check/uncheck box */}
|
||||
<CheckboxCard.Control>
|
||||
<CheckboxCard.Content>
|
||||
<CheckboxCard.Label fontWeight={400}>Level Increases</CheckboxCard.Label>
|
||||
<CheckboxCard.Label fontWeight={400}>
|
||||
Level Increases
|
||||
</CheckboxCard.Label>
|
||||
</CheckboxCard.Content>
|
||||
<CheckboxCard.Indicator />
|
||||
</CheckboxCard.Control>
|
||||
</CheckboxCard.Root>
|
||||
|
||||
<CheckboxCard.Root size="sm" variant="surface" borderRadius="lg"
|
||||
{/* level decreases */}
|
||||
<CheckboxCard.Root
|
||||
size="sm"
|
||||
variant="surface"
|
||||
borderRadius="lg"
|
||||
defaultChecked={currentSettings?.filters?.levelDecreases}
|
||||
onCheckedChange={e => {
|
||||
updateSettings(widgetId, {...currentSettings, filters: {...currentSettings.filters, levelDecreases: e.checked}})
|
||||
onCheckedChange={(e) => {
|
||||
updateSettings(widgetId, {
|
||||
...currentSettings,
|
||||
filters: {
|
||||
...currentSettings.filters,
|
||||
levelDecreases: e.checked,
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
<CheckboxCard.HiddenInput />
|
||||
<CheckboxCard.Control>
|
||||
<CheckboxCard.Content>
|
||||
<CheckboxCard.Label fontWeight={400}>Level Decreases</CheckboxCard.Label>
|
||||
<CheckboxCard.Label fontWeight={400}>
|
||||
Level Decreases
|
||||
</CheckboxCard.Label>
|
||||
</CheckboxCard.Content>
|
||||
<CheckboxCard.Indicator />
|
||||
</CheckboxCard.Control>
|
||||
</CheckboxCard.Root>
|
||||
|
||||
<CheckboxCard.Root size="sm" variant="surface" borderRadius="lg"
|
||||
{/* elevated levels */}
|
||||
<CheckboxCard.Root
|
||||
size="sm"
|
||||
variant="surface"
|
||||
borderRadius="lg"
|
||||
defaultChecked={currentSettings?.filters?.elevatedLevels}
|
||||
onCheckedChange={e => {
|
||||
updateSettings(widgetId, {...currentSettings, filters: {...currentSettings.filters, elevatedLevels: e.checked}})
|
||||
onCheckedChange={(e) => {
|
||||
updateSettings(widgetId, {
|
||||
...currentSettings,
|
||||
filters: {
|
||||
...currentSettings.filters,
|
||||
elevatedLevels: e.checked,
|
||||
},
|
||||
});
|
||||
}}
|
||||
>
|
||||
<CheckboxCard.HiddenInput />
|
||||
<CheckboxCard.Control>
|
||||
<CheckboxCard.Content>
|
||||
<CheckboxCard.Label fontWeight={400}>Only Elevated Levels</CheckboxCard.Label>
|
||||
<CheckboxCard.Label fontWeight={400}>
|
||||
Only Elevated Levels
|
||||
</CheckboxCard.Label>
|
||||
</CheckboxCard.Content>
|
||||
<CheckboxCard.Indicator />
|
||||
</CheckboxCard.Control>
|
||||
</CheckboxCard.Root>
|
||||
</Flex>
|
||||
</CheckboxGroup>
|
||||
|
||||
{/* select volcano to filter on */}
|
||||
<Combobox.Root
|
||||
mt={1}
|
||||
variant="subtle"
|
||||
multiple
|
||||
openOnClick
|
||||
collection={collection}
|
||||
onValueChange={handleValueChange}
|
||||
onInputValueChange={(e) => filter(e.inputValue)}
|
||||
>
|
||||
|
||||
<Wrap gap="2">
|
||||
{selectedVolcanoes.map((volcano) => (
|
||||
<Badge key={volcano}>{volcano}</Badge>
|
||||
))}
|
||||
</Wrap>
|
||||
|
||||
<Combobox.Label fontSize="xs" >Select Volcano (s)</Combobox.Label>
|
||||
|
||||
<Combobox.Control>
|
||||
<Combobox.Input placeholder="Type to search" borderRadius="lg"/>
|
||||
<Combobox.IndicatorGroup>
|
||||
<Combobox.ClearTrigger />
|
||||
<Combobox.Trigger onClick={reset} />
|
||||
</Combobox.IndicatorGroup>
|
||||
</Combobox.Control>
|
||||
<Portal>
|
||||
<Combobox.Positioner>
|
||||
<Combobox.Content>
|
||||
{volcanoes.map((item) => (
|
||||
<Combobox.Item item={item} key={item.value}>
|
||||
{item.label}
|
||||
<Combobox.ItemIndicator />
|
||||
</Combobox.Item>
|
||||
))}
|
||||
<Combobox.Empty>No items found</Combobox.Empty>
|
||||
</Combobox.Content>
|
||||
</Combobox.Positioner>
|
||||
</Portal>
|
||||
</Combobox.Root>
|
||||
</Fieldset.Content>
|
||||
</Fieldset.Root>
|
||||
</Flex>
|
||||
)
|
||||
}
|
||||
</Flex>
|
||||
);
|
||||
}
|
||||
|
||||
const volcanoes = [
|
||||
{ label: "Mt. St. Helens", value: "helens" },
|
||||
{ label: "Mt. Adams", value: "adams" },
|
||||
{ label: "Rainier", value: "rainier" },
|
||||
{ label: "The Three Sisters", value: "three sisters" },
|
||||
{ label: "Fuego", value: "fuego" },
|
||||
{ label: "Laki Laki", value: "lakilaki" },
|
||||
{ label: "Lewotobi", value: "lewotobi" },
|
||||
{ label: "Karangatang", value: "karangatang" },
|
||||
{ label: "Cotopaxi", value: "cotopaxi" },
|
||||
{ label: "Merapi", value: "merapi" },
|
||||
{ label: "Marapi", value: "marapi" },
|
||||
{ label: "Kick 'Em Jenny", value: "kick em jenny"}
|
||||
]
|
||||
@@ -102,7 +102,8 @@ export const WIDGET_REGISTRY = {
|
||||
filters: {
|
||||
levelIncreases: true,
|
||||
levelDecreases: true,
|
||||
elevatedLevels: false, // will filter to show only volcanoes in their 2nd highest to highest al
|
||||
elevatedLevels: false, // will filter to show only volcanoes in their top 2 highest alert levels
|
||||
volcanoes: 'all', // filter on what volcanoes to display, defaults to 'all' instead of listing every volc
|
||||
},
|
||||
},
|
||||
allowedSizes: {
|
||||
|
||||
Reference in New Issue
Block a user