diff --git a/hyperglass/ui/components/buttons/reset.tsx b/hyperglass/ui/components/buttons/reset.tsx index 306ec6d..b2bc661 100644 --- a/hyperglass/ui/components/buttons/reset.tsx +++ b/hyperglass/ui/components/buttons/reset.tsx @@ -19,7 +19,7 @@ export const ResetButton = forwardRef((props, re aria-label="Reset Form" opacity={isSubmitting.value ? 1 : 0} {...props}> - + ); }); diff --git a/hyperglass/ui/components/form/queryLocation.tsx b/hyperglass/ui/components/form/queryLocation.tsx index 5c64a4d..cfd60df 100644 --- a/hyperglass/ui/components/form/queryLocation.tsx +++ b/hyperglass/ui/components/form/queryLocation.tsx @@ -2,7 +2,7 @@ import { useMemo } from 'react'; import { Select } from '~/components'; import { useConfig } from '~/context'; -import type { TNetwork, TSelectOption } from '~/types'; +import type { TNetwork, TSelectOptionMulti } from '~/types'; import type { TQuerySelectField } from './types'; function buildOptions(networks: TNetwork[]) { @@ -23,11 +23,12 @@ export const QueryLocation = (props: TQuerySelectField) => { const { networks } = useConfig(); const options = useMemo(() => buildOptions(networks), [networks.length]); - function handleChange(e: TSelectOption): void { - if (Array.isArray(e?.value) && e !== null) { - const value = e.value.map(sel => sel); - onChange({ field: 'query_location', value }); + function handleChange(e: TSelectOptionMulti): void { + if (e === null) { + e = []; } + const value = e.map(sel => sel.value); + onChange({ field: 'query_location', value }); } return ( diff --git a/hyperglass/ui/components/layout/frame.tsx b/hyperglass/ui/components/layout/frame.tsx index 9e4dad9..cda345b 100644 --- a/hyperglass/ui/components/layout/frame.tsx +++ b/hyperglass/ui/components/layout/frame.tsx @@ -42,9 +42,9 @@ export const Frame = (props: TFrame) => { {...props} />