diff --git a/jbrowse/src/client/JBrowse/VariantSearch/components/FilterForm.tsx b/jbrowse/src/client/JBrowse/VariantSearch/components/FilterForm.tsx index 1752cabcf..f24b2e857 100644 --- a/jbrowse/src/client/JBrowse/VariantSearch/components/FilterForm.tsx +++ b/jbrowse/src/client/JBrowse/VariantSearch/components/FilterForm.tsx @@ -2,6 +2,7 @@ import React, { useState } from 'react'; import TextField from '@mui/material/TextField'; import Button from '@mui/material/Button'; import Select from '@mui/material/Select'; +import ReactSelect from 'react-select'; import AsyncSelect from 'react-select/async'; import MenuItem from '@mui/material/MenuItem'; import FormControl from '@mui/material/FormControl'; @@ -109,7 +110,7 @@ const FilterForm = (props: FilterFormProps ) => { updatedFilter.value = ''; } - if (value === "in set" || filter.operator === "in set") { + if (value === "equals one of" || filter.operator === "equals one of") { updatedFilter.value = ''; } } @@ -211,25 +212,33 @@ const FilterForm = (props: FilterFormProps ) => { {filters.map((filter, index) => ( - - Field - + value={ + filter.field + ? { + value: filter.field, + label: fieldTypeInfo.find(f => f.name === filter.field)?.label ?? filter.field + } + : null + } + isClearable + /> @@ -259,7 +268,7 @@ const FilterForm = (props: FilterFormProps ) => { - {filter.operator === "in set" ? ( + {filter.operator === "equals one of" ? ( Value