Skip to content
Snippets Groups Projects
Commit 1565e280 authored by Alexander Polyankin's avatar Alexander Polyankin
Browse files

Revert "Unify FilterPickerForm" 

This reverts commit 8f002b87.
parent 8fd59443
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
Showing
with 54 additions and 60 deletions
frontend/src/metabase/querying/filters/components/FilterPicker/BooleanFilterPicker/BooleanFilterPicker.tsx
+ 6
− 4
View file @ 1565e280
......@@ -3,12 +3,12 @@ import { useMemo } from "react";
import { t } from "ttag";
import { useBooleanOptionFilter } from "metabase/querying/filters/hooks/use-boolean-option-filter";
import { Button, Icon, Radio, Stack } from "metabase/ui";
import { Box, Button, Icon, Radio, Stack } from "metabase/ui";
import * as Lib from "metabase-lib";
import { FilterPickerFooter } from "../FilterPickerFooter";
import { FilterPickerForm } from "../FilterPickerForm";
import { FilterPickerHeader } from "../FilterPickerHeader";
import { MIN_WIDTH } from "../constants";
import type { FilterPickerWidgetProps } from "../types";
export function BooleanFilterPicker({
......@@ -52,7 +52,9 @@ export function BooleanFilterPicker({
};
return (
<FilterPickerForm
<Box
component="form"
miw={MIN_WIDTH}
data-testid="boolean-filter-picker"
onSubmit={handleSubmit}
>
......@@ -87,6 +89,6 @@ export function BooleanFilterPicker({
)}
<FilterPickerFooter isNew={isNew} canSubmit />
</div>
</FilterPickerForm>
</Box>
);
}
frontend/src/metabase/querying/filters/components/FilterPicker/CoordinateFilterPicker/CoordinateFilterPicker.tsx
+ 11
− 8
View file @ 1565e280
......@@ -13,8 +13,8 @@ import * as Lib from "metabase-lib";
import { NumberFilterValuePicker } from "../../FilterValuePicker";
import { FilterOperatorPicker } from "../FilterOperatorPicker";
import { FilterPickerFooter } from "../FilterPickerFooter";
import { FilterPickerForm } from "../FilterPickerForm";
import { FilterPickerHeader } from "../FilterPickerHeader";
import { MAX_WIDTH, MIN_WIDTH } from "../constants";
import type { FilterPickerWidgetProps } from "../types";
import { CoordinateColumnPicker } from "./CoordinateColumnPicker";
......@@ -72,7 +72,10 @@ export function CoordinateFilterPicker({
};
return (
<FilterPickerForm
<Box
component="form"
miw={MIN_WIDTH}
maw={MAX_WIDTH}
data-testid="coordinate-filter-picker"
onSubmit={handleSubmit}
>
......@@ -86,7 +89,7 @@ export function CoordinateFilterPicker({
onChange={handleOperatorChange}
/>
</FilterPickerHeader>
<Flex direction="column" mih={0}>
<Box>
{canPickColumns && (
<CoordinateColumnPicker
query={query}
......@@ -107,8 +110,8 @@ export function CoordinateFilterPicker({
onChange={setValues}
/>
<FilterPickerFooter isNew={isNew} canSubmit={isValid} />
</Flex>
</FilterPickerForm>
</Box>
</Box>
);
}
......@@ -133,7 +136,7 @@ function CoordinateValueInput({
}: CoordinateValueInputProps) {
if (hasMultipleValues) {
return (
<Box p="md" style={{ overflow: "auto" }}>
<Box p="md" mah="25vh" style={{ overflow: "auto" }}>
<NumberFilterValuePicker
query={query}
stageIndex={stageIndex}
......@@ -148,7 +151,7 @@ function CoordinateValueInput({
if (valueCount === 1) {
return (
<Box p="md">
<Flex p="md">
<NumberInput
value={values[0]}
placeholder={t`Enter a number`}
......@@ -157,7 +160,7 @@ function CoordinateValueInput({
aria-label={t`Filter value`}
onChange={(newValue: number) => onChange([newValue])}
/>
</Box>
</Flex>
);
}
......
frontend/src/metabase/querying/filters/components/FilterPicker/DefaultFilterPicker/DefaultFilterPicker.tsx
+ 6
− 4
View file @ 1565e280
......@@ -2,12 +2,12 @@ import type { FormEvent } from "react";
import { useMemo } from "react";
import { useDefaultFilter } from "metabase/querying/filters/hooks/use-default-filter";
import { Radio, Stack } from "metabase/ui";
import { Box, Radio, Stack } from "metabase/ui";
import * as Lib from "metabase-lib";
import { FilterPickerFooter } from "../FilterPickerFooter";
import { FilterPickerForm } from "../FilterPickerForm";
import { FilterPickerHeader } from "../FilterPickerHeader";
import { MIN_WIDTH } from "../constants";
import type { FilterPickerWidgetProps } from "../types";
export function DefaultFilterPicker({
......@@ -52,7 +52,9 @@ export function DefaultFilterPicker({
};
return (
<FilterPickerForm
<Box
component="form"
miw={MIN_WIDTH}
data-testid="default-filter-picker"
onSubmit={handleSubmit}
>
......@@ -76,6 +78,6 @@ export function DefaultFilterPicker({
</Radio.Group>
<FilterPickerFooter isNew={isNew} canSubmit />
</div>
</FilterPickerForm>
</Box>
);
}
frontend/src/metabase/querying/filters/components/FilterPicker/FilterPickerForm/FilterPickerForm.tsx deleted 100644 → 0
+ 0
− 24
View file @ 8fd59443
import { type HTMLAttributes, type Ref, forwardRef } from "react";
import { Box } from "metabase/ui";
import { MAX_WIDTH, MIN_WIDTH } from "../constants";
export const FilterPickerForm = forwardRef(function FilterPickerForm(
props: HTMLAttributes<HTMLFormElement>,
ref: Ref<HTMLFormElement>,
) {
return (
<Box
ref={ref}
{...props}
component="form"
display="flex"
miw={MIN_WIDTH}
maw={MAX_WIDTH}
mih={0}
mah="inherit"
style={{ flexDirection: "column" }}
/>
);
});
frontend/src/metabase/querying/filters/components/FilterPicker/FilterPickerForm/index.ts deleted 100644 → 0
+ 0
− 1
View file @ 8fd59443
export * from "./FilterPickerForm";
frontend/src/metabase/querying/filters/components/FilterPicker/NumberFilterPicker/NumberFilterPicker.tsx
+ 11
− 8
View file @ 1565e280
......@@ -13,8 +13,8 @@ import * as Lib from "metabase-lib";
import { NumberFilterValuePicker } from "../../FilterValuePicker";
import { FilterOperatorPicker } from "../FilterOperatorPicker";
import { FilterPickerFooter } from "../FilterPickerFooter";
import { FilterPickerForm } from "../FilterPickerForm";
import { FilterPickerHeader } from "../FilterPickerHeader";
import { MAX_WIDTH, MIN_WIDTH } from "../constants";
import type { FilterPickerWidgetProps } from "../types";
export function NumberFilterPicker({
......@@ -64,7 +64,10 @@ export function NumberFilterPicker({
};
return (
<FilterPickerForm
<Box
component="form"
miw={MIN_WIDTH}
maw={MAX_WIDTH}
data-testid="number-filter-picker"
onSubmit={handleSubmit}
>
......@@ -78,7 +81,7 @@ export function NumberFilterPicker({
onChange={handleOperatorChange}
/>
</FilterPickerHeader>
<Flex direction="column" mih={0}>
<div>
<NumberValueInput
query={query}
stageIndex={stageIndex}
......@@ -89,8 +92,8 @@ export function NumberFilterPicker({
onChange={setValues}
/>
<FilterPickerFooter isNew={isNew} canSubmit={isValid} />
</Flex>
</FilterPickerForm>
</div>
</Box>
);
}
......@@ -115,7 +118,7 @@ function NumberValueInput({
}: NumberValueInputProps) {
if (hasMultipleValues) {
return (
<Box p="md" style={{ overflow: "auto" }}>
<Box p="md" mah="25vh" style={{ overflow: "auto" }}>
<NumberFilterValuePicker
query={query}
stageIndex={stageIndex}
......@@ -130,7 +133,7 @@ function NumberValueInput({
if (valueCount === 1) {
return (
<Box p="md">
<Flex p="md">
<NumberInput
value={values[0]}
placeholder={t`Enter a number`}
......@@ -139,7 +142,7 @@ function NumberValueInput({
aria-label={t`Filter value`}
onChange={newValue => onChange([newValue])}
/>
</Box>
</Flex>
);
}
......
frontend/src/metabase/querying/filters/components/FilterPicker/StringFilterPicker/StringFilterPicker.tsx
+ 11
− 8
View file @ 1565e280
......@@ -12,8 +12,8 @@ import * as Lib from "metabase-lib";
import { StringFilterValuePicker } from "../../FilterValuePicker";
import { FilterOperatorPicker } from "../FilterOperatorPicker";
import { FilterPickerFooter } from "../FilterPickerFooter";
import { FilterPickerForm } from "../FilterPickerForm";
import { FilterPickerHeader } from "../FilterPickerHeader";
import { MAX_WIDTH, MIN_WIDTH } from "../constants";
import type { FilterPickerWidgetProps } from "../types";
export function StringFilterPicker({
......@@ -64,7 +64,10 @@ export function StringFilterPicker({
};
return (
<FilterPickerForm
<Box
component="form"
miw={MIN_WIDTH}
maw={MAX_WIDTH}
data-testid="string-filter-picker"
onSubmit={handleSubmit}
>
......@@ -78,7 +81,7 @@ export function StringFilterPicker({
onChange={handleOperatorChange}
/>
</FilterPickerHeader>
<Flex direction="column" mih={0}>
<div>
<StringValueInput
query={query}
stageIndex={stageIndex}
......@@ -95,8 +98,8 @@ export function StringFilterPicker({
/>
)}
</FilterPickerFooter>
</Flex>
</FilterPickerForm>
</div>
</Box>
);
}
......@@ -119,7 +122,7 @@ function StringValueInput({
}: StringValueInputProps) {
if (type === "exact") {
return (
<Box p="md" style={{ overflow: "auto" }}>
<Box p="md" mah="25vh" style={{ overflow: "auto" }}>
<StringFilterValuePicker
query={query}
stageIndex={stageIndex}
......@@ -134,7 +137,7 @@ function StringValueInput({
if (type === "partial") {
return (
<Box p="md">
<Flex p="md">
<MultiAutocomplete
value={values}
data={[]}
......@@ -144,7 +147,7 @@ function StringValueInput({
aria-label={t`Filter value`}
onChange={onChange}
/>
</Box>
</Flex>
);
}
......
frontend/src/metabase/querying/filters/components/FilterPicker/TimeFilterPicker/TimeFilterPicker.tsx
+ 9
− 3
View file @ 1565e280
......@@ -11,8 +11,8 @@ import * as Lib from "metabase-lib";
import { FilterOperatorPicker } from "../FilterOperatorPicker";
import { FilterPickerFooter } from "../FilterPickerFooter";
import { FilterPickerForm } from "../FilterPickerForm";
import { FilterPickerHeader } from "../FilterPickerHeader";
import { MAX_WIDTH, MIN_WIDTH } from "../constants";
import type { FilterPickerWidgetProps } from "../types";
export function TimeFilterPicker({
......@@ -60,7 +60,13 @@ export function TimeFilterPicker({
};
return (
<FilterPickerForm data-testid="time-filter-picker" onSubmit={handleSubmit}>
<Box
component="form"
miw={MIN_WIDTH}
maw={MAX_WIDTH}
data-testid="time-filter-picker"
onSubmit={handleSubmit}
>
<FilterPickerHeader
columnName={columnInfo.longDisplayName}
onBack={onBack}
......@@ -83,7 +89,7 @@ export function TimeFilterPicker({
)}
<FilterPickerFooter isNew={isNew} canSubmit />
</Box>
</FilterPickerForm>
</Box>
);
}
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment