[DOP-22569] Add filter by Dataset.location_type

Author: dolfinus

src/components/dataset/DatasetRaList.tsx

@@ -1,37 +1,20 @@
 import { ReactElement } from "react";
-import {
-    List,
-    TextField,
-    DatagridConfigurable,
-    SearchInput,
-    minLength,
-    useTranslate,
-} from "react-admin";
+import { List, TextField, DatagridConfigurable } from "react-admin";
 import { ListActions } from "@/components/base";
 import {
     LocationRaNameWithLinkField,
     LocationRaTypeWithIconField,
 } from "@/components/location";
+import DatasetRaListFilters from "./DatasetRaListFilters";
 
 const DatasetRaList = (): ReactElement => {
-    const translate = useTranslate();
-
-    const datasetFilters = [
-        <SearchInput
-            key="search_query"
-            source="search_query"
-            alwaysOn
-            validate={minLength(3)}
-            placeholder={translate(
-                "resources.datasets.filters.search_query.placeholder",
-            )}
-        />,
-    ];
-
     return (
         <List
-            actions={<ListActions />}
-            filters={datasetFilters}
+            actions={
+                <ListActions>
+                    <DatasetRaListFilters />
+                </ListActions>
+            }
             resource="datasets"
             storeKey={false}
         >

src/components/dataset/DatasetRaListFilters.tsx

@@ -0,0 +1,37 @@
+import { FilterLiveForm, minLength } from "react-admin";
+
+import { Box, InputAdornment } from "@mui/material";
+import SearchIcon from "@mui/icons-material/Search";
+import { TextInput } from "react-admin";
+import { LocationRaTypeFilter } from "@/components/location";
+
+const DatasetRaListFilters = () => {
+    return (
+        <FilterLiveForm>
+            <Box display="flex" alignItems="flex-end">
+                <Box component="span" mr={2} sx={{ flex: "0.2" }}>
+                    <LocationRaTypeFilter />
+                </Box>
+
+                <Box component="span" mr={2} sx={{ flex: "0.3 1 1" }}>
+                    {/* Not using SearchInput here because it doesn't match styles with other filters */}
+                    <TextInput
+                        source="search_query"
+                        InputProps={{
+                            endAdornment: (
+                                <InputAdornment position="end">
+                                    <SearchIcon color="disabled" />
+                                </InputAdornment>
+                            ),
+                        }}
+                        validate={minLength(3)}
+                        label="resources.datasets.filters.search_query.label"
+                        helperText="resources.datasets.filters.search_query.helperText"
+                    />
+                </Box>
+            </Box>
+        </FilterLiveForm>
+    );
+};
+
+export default DatasetRaListFilters;

src/i18n/en.ts

@@ -99,9 +99,13 @@ const customEnglishMessages: TranslationMessages = {
                 lineage: "Lineage",
             },
             filters: {
+                location_type: {
+                    label: "Location Type",
+                    helperText: "Only selected",
+                },
                 search_query: {
                     label: "Search",
-                    placeholder: "Filter by name or address",
+                    helperText: "Filter by name or address",
                 },
             },
         },

src/i18n/ru.ts

@@ -99,9 +99,13 @@ const customRussianMessages: TranslationMessages = {
                 lineage: "Линедж",
             },
             filters: {
+                location_type: {
+                    label: "Тип расположения",
+                    helperText: "Только выбранные",
+                },
                 search_query: {
                     label: "Поиск",
-                    placeholder: "Фильтр по имени или адресу",
+                    helperText: "Фильтр по имени или адресу",
                 },
             },
         },