diff --git a/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png b/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png index 5b73d1c03..a1588ca51 100644 Binary files a/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png and b/.storybook/image-snapshots/expected/components_Datatable_internalComponents_Datatable_With Open And Applied Filtering.png differ diff --git a/.storybook/image-snapshots/expected/components_Filters_Fetching Results.png b/.storybook/image-snapshots/expected/components_Filters_Fetching Results.png index 6216b0bac..57c41432f 100644 Binary files a/.storybook/image-snapshots/expected/components_Filters_Fetching Results.png and b/.storybook/image-snapshots/expected/components_Filters_Fetching Results.png differ diff --git a/.storybook/image-snapshots/expected/components_Filters_Unapplied Filters.png b/.storybook/image-snapshots/expected/components_Filters_Unapplied Filters.png index 439382d26..e424efd3e 100644 Binary files a/.storybook/image-snapshots/expected/components_Filters_Unapplied Filters.png and b/.storybook/image-snapshots/expected/components_Filters_Unapplied Filters.png differ diff --git a/.storybook/image-snapshots/expected/components_Filters_With Close Button.png b/.storybook/image-snapshots/expected/components_Filters_With Close Button.png index be038bc32..e6af13511 100644 Binary files a/.storybook/image-snapshots/expected/components_Filters_With Close Button.png and b/.storybook/image-snapshots/expected/components_Filters_With Close Button.png differ diff --git a/.storybook/image-snapshots/expected/components_Filters_With Fixed Operator.png b/.storybook/image-snapshots/expected/components_Filters_With Fixed Operator.png index 48e99996d..c8904b12d 100644 Binary files a/.storybook/image-snapshots/expected/components_Filters_With Fixed Operator.png and b/.storybook/image-snapshots/expected/components_Filters_With Fixed Operator.png differ diff --git a/.storybook/image-snapshots/expected/components_Filters_With State.png b/.storybook/image-snapshots/expected/components_Filters_With State.png index f485986c4..e924e3153 100644 Binary files a/.storybook/image-snapshots/expected/components_Filters_With State.png and b/.storybook/image-snapshots/expected/components_Filters_With State.png differ diff --git a/.storybook/image-snapshots/expected/components_Filters_Without Apply Button.png b/.storybook/image-snapshots/expected/components_Filters_Without Apply Button.png index b574f5862..965d9ab77 100644 Binary files a/.storybook/image-snapshots/expected/components_Filters_Without Apply Button.png and b/.storybook/image-snapshots/expected/components_Filters_Without Apply Button.png differ diff --git a/src/components/Filters/Filters.types.ts b/src/components/Filters/Filters.types.ts index 4fab833f8..837582feb 100644 --- a/src/components/Filters/Filters.types.ts +++ b/src/components/Filters/Filters.types.ts @@ -52,7 +52,7 @@ export interface Filter { isApplied: boolean; isLoading: boolean; isCanceled: boolean; - value?: string | string[] | Date | BaseDateRange; + value?: string | string[] | Date | BaseDateRange | Record; } export interface FiltersProps { diff --git a/src/components/Filters/mocks/MockObjectFilter.tsx b/src/components/Filters/mocks/MockObjectFilter.tsx new file mode 100644 index 000000000..6c348b0d7 --- /dev/null +++ b/src/components/Filters/mocks/MockObjectFilter.tsx @@ -0,0 +1,54 @@ +import React, { useState } from 'react'; +import { always } from 'ramda'; + +import { SpaceSizes } from '../../../theme'; +import { Inline, Padbox } from '../../layout'; +import { InputFilter, SelectFilter } from '../components'; + +type MockObject = { + inputValue: string; + includeAssets: string[]; +}; + +interface MockObjectFilterProps { + value: MockObject; +} + +const MockObjectFilter: React.FC = ({ value }) => { + const [ipValue, setIpValue] = useState(value?.inputValue); + const options = [ + { + label: 'Include associated subdomains', + value: 'include_domains', + }, + { + label: 'Include associated IPs', + value: 'include_ips', + }, + ]; + + const handleOnChange = (event) => { + const { target } = event; + setIpValue(target.value); + }; + const validate = always(false); + const handleOnError = () => { + // do nothing + }; + + return ( + + + + + + + ); +}; +export default MockObjectFilter; diff --git a/src/components/Filters/mocks/options.ts b/src/components/Filters/mocks/options.ts index d9956a0c9..ba5f0a2fe 100644 --- a/src/components/Filters/mocks/options.ts +++ b/src/components/Filters/mocks/options.ts @@ -11,6 +11,7 @@ import { import { Field, Filter } from '../Filters.types'; import { Operators } from '../Filters.enums'; import { patterns, validateDomains, validateIPs } from './validations'; +import MockObjectFilter from './MockObjectFilter'; export const mockTestFields: Field[] = [ { @@ -324,6 +325,18 @@ export const fields: Field[] = [ value: 'detection method', label: 'Detection Method', }, + { + conditions: [ + { component: MockObjectFilter, value: 'is', label: 'is' }, + { + component: MockObjectFilter, + value: 'is not', + label: 'is not', + }, + ], + value: 'ip and assets', + label: 'IP and Assets', + }, ]; export const state: Filter[] = [ @@ -404,6 +417,15 @@ export const state: Filter[] = [ isLoading: false, isCanceled: false, }, + { + operator: Operators.and, + field: 'ip and assets', + condition: 'is', + value: { inputValue: '1.1.1.1', includeAsset: ['include_domains'] }, + isApplied: true, + isLoading: false, + isCanceled: false, + }, ]; export const stateWithUnappliedFilters: Filter[] = [