Pass start and end dates to filter component. Closes #2646.

This commit is contained in:
Mike Cao 2024-04-10 12:26:09 -07:00 committed by Mike Cao
parent 09a75ec720
commit 6973b2b760
3 changed files with 10 additions and 3 deletions

View File

@ -55,6 +55,8 @@ export function FilterParameters() {
<FilterSelectForm
websiteId={websiteId}
fields={fields.filter(({ name }) => !filters.find(f => f.name === name))}
startDate={dateRange?.startDate}
endDate={dateRange?.endDate}
onChange={handleAdd}
/>
</PopupForm>

View File

@ -1,11 +1,12 @@
import { useState } from 'react';
import FieldSelectForm from './FieldSelectForm';
import FieldFilterEditForm from './FieldFilterEditForm';
import { useDateRange } from 'components/hooks';
export interface FilterSelectFormProps {
websiteId?: string;
fields: any[];
startDate?: Date;
endDate?: Date;
onChange?: (filter: { name: string; type: string; operator: string; value: string }) => void;
allowFilterSelect?: boolean;
}
@ -13,11 +14,12 @@ export interface FilterSelectFormProps {
export default function FilterSelectForm({
websiteId,
fields,
startDate,
endDate,
onChange,
allowFilterSelect,
}: FilterSelectFormProps) {
const [field, setField] = useState<{ name: string; label: string; type: string }>();
const [{ startDate, endDate }] = useDateRange(websiteId);
if (!field) {
return <FieldSelectForm fields={fields} onSelect={setField} showType={false} />;

View File

@ -2,7 +2,7 @@ import classNames from 'classnames';
import { Button, Icon, Icons, Popup, PopupTrigger, Text } from 'react-basics';
import PopupForm from 'app/(main)/reports/[reportId]/PopupForm';
import FilterSelectForm from 'app/(main)/reports/[reportId]/FilterSelectForm';
import { useFields, useMessages, useNavigation } from 'components/hooks';
import { useFields, useMessages, useNavigation, useDateRange } from 'components/hooks';
import { OPERATOR_PREFIXES } from 'lib/constants';
import styles from './WebsiteFilterButton.module.css';
@ -16,6 +16,7 @@ export function WebsiteFilterButton({
const { formatMessage, labels } = useMessages();
const { renderUrl, router } = useNavigation();
const { fields } = useFields();
const [{ startDate, endDate }] = useDateRange(websiteId);
const handleAddFilter = ({ name, operator, value }) => {
const prefix = OPERATOR_PREFIXES[operator];
@ -38,6 +39,8 @@ export function WebsiteFilterButton({
<FilterSelectForm
websiteId={websiteId}
fields={fields}
startDate={startDate}
endDate={endDate}
onChange={value => {
handleAddFilter(value);
close();