From 82a7fe2d6293d6ac4dbb10bbe1572221fb5f718b Mon Sep 17 00:00:00 2001 From: akintomiwa Date: Fri, 9 Aug 2024 10:46:41 +0000 Subject: [PATCH 1/4] increase TextFilter debounce timer to 500ms --- .../src/table/columnFilters/textColumnFilter.component.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx index 672ad6c75..23d2d7665 100644 --- a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx +++ b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx @@ -30,7 +30,7 @@ const TextColumnFilter = (props: { () => debounce((value: string) => { onChange(value === '' ? null : { value: value, type: type }); - }, 250), + }, 500), [onChange, type] ); From 44ac2b39fdb8c077f962756d1029125785222611 Mon Sep 17 00:00:00 2001 From: akintomiwa Date: Mon, 12 Aug 2024 11:28:01 +0000 Subject: [PATCH 2/4] update tests, comment --- .../src/table/columnFilters/textColumnFilter.component.test.tsx | 2 +- .../src/table/columnFilters/textColumnFilter.component.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.test.tsx b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.test.tsx index 638181b12..aab432bf7 100644 --- a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.test.tsx +++ b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.test.tsx @@ -12,7 +12,7 @@ import userEvent from '@testing-library/user-event'; jest.mock('../../api'); jest.useFakeTimers('modern'); -const DEBOUNCE_DELAY = 250; +const DEBOUNCE_DELAY = 500; describe('Text filter component', () => { let user: UserEvent; diff --git a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx index 23d2d7665..2fb1f7043 100644 --- a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx +++ b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx @@ -25,7 +25,7 @@ const TextColumnFilter = (props: { ); const [type, setType] = React.useState(propType ? propType : 'include'); - // Debounce the updating of the column filter by 250 milliseconds. + // Debounce the updating of the column filter by 500 milliseconds. const updateValue = React.useMemo( () => debounce((value: string) => { From f2a86e37e3dcf373b87a6316f1f55801f7d343bc Mon Sep 17 00:00:00 2001 From: akintomiwa Date: Thu, 15 Aug 2024 15:39:21 +0000 Subject: [PATCH 3/4] update COMPONENT, test to select debounce value from component 1/2 --- .../src/table/columnFilters/textColumnFilter.component.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx index 2fb1f7043..ef931afd8 100644 --- a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx +++ b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.tsx @@ -24,13 +24,12 @@ const TextColumnFilter = (props: { propValue ? propValue : '' ); const [type, setType] = React.useState(propType ? propType : 'include'); - // Debounce the updating of the column filter by 500 milliseconds. const updateValue = React.useMemo( () => debounce((value: string) => { onChange(value === '' ? null : { value: value, type: type }); - }, 500), + }, DEBOUNCE_DELAY), [onChange, type] ); @@ -129,6 +128,8 @@ const TextColumnFilter = (props: { ); }; +export const DEBOUNCE_DELAY = 500; + export default TextColumnFilter; export const useTextFilter = ( From 51fe1e8eb2cd224a25d57107b0bc1e59248a6417 Mon Sep 17 00:00:00 2001 From: akintomiwa Date: Thu, 15 Aug 2024 15:39:44 +0000 Subject: [PATCH 4/4] update component, TEST to select debounce value from component 2/2 --- .../src/table/columnFilters/textColumnFilter.component.test.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.test.tsx b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.test.tsx index aab432bf7..25fcda5bb 100644 --- a/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.test.tsx +++ b/packages/datagateway-common/src/table/columnFilters/textColumnFilter.component.test.tsx @@ -2,6 +2,7 @@ import React from 'react'; import TextColumnFilter, { usePrincipalExperimenterFilter, useTextFilter, + DEBOUNCE_DELAY, } from './textColumnFilter.component'; import { act } from 'react-dom/test-utils'; import { usePushFilter, usePushFilters } from '../../api'; @@ -12,7 +13,6 @@ import userEvent from '@testing-library/user-event'; jest.mock('../../api'); jest.useFakeTimers('modern'); -const DEBOUNCE_DELAY = 500; describe('Text filter component', () => { let user: UserEvent;