From bedfddab8d8ca618942ee736548fd6ffd26108c2 Mon Sep 17 00:00:00 2001 From: Kira Miller Date: Tue, 21 Jan 2025 23:05:34 +0000 Subject: [PATCH 1/3] fix: adding typing delay to associated users table --- .../Customers/data/hooks/useCustomerUsersTableData.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js b/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js index ab673e938..8f23e214e 100644 --- a/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js +++ b/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js @@ -56,8 +56,13 @@ const useCustomerUsersTableData = (enterpriseUuid) => { setIsLoading(false); } }; + if (enterpriseUuid) { - fetch(); + if (args.filters.length && args.filters[0].value.length > 2) { + fetch(); + } else if (!args.filters.length) { + fetch(); + } } }, [enterpriseUuid]); From 7a9423d2db62b3f32e9a3cd1d85d4ca1afcfdc97 Mon Sep 17 00:00:00 2001 From: Kira Miller Date: Wed, 22 Jan 2025 18:55:25 +0000 Subject: [PATCH 2/3] fix: PR request --- .../Customers/data/hooks/useCustomerUsersTableData.js | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js b/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js index 8f23e214e..5605a9acd 100644 --- a/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js +++ b/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js @@ -58,9 +58,7 @@ const useCustomerUsersTableData = (enterpriseUuid) => { }; if (enterpriseUuid) { - if (args.filters.length && args.filters[0].value.length > 2) { - fetch(); - } else if (!args.filters.length) { + if (!args.filters.length || args.filters[0].value.length > 2) { fetch(); } } From f06d55b534bced514522409dce83f5ca80a9ee1a Mon Sep 17 00:00:00 2001 From: Kira Miller Date: Thu, 23 Jan 2025 23:41:14 +0000 Subject: [PATCH 3/3] fix: adding test --- package-lock.json | 62 +++++++++++++++++-- package.json | 1 + .../EnterpriseCustomerUserDetail.jsx | 2 +- .../tests/useCustomerUsersTableData.test.js | 38 ++++++++++++ .../data/hooks/useCustomerUsersTableData.js | 1 - 5 files changed, 97 insertions(+), 7 deletions(-) create mode 100644 src/Configuration/Customers/data/hooks/tests/useCustomerUsersTableData.test.js diff --git a/package-lock.json b/package-lock.json index 7a87682c8..7c0cf810e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,6 +19,7 @@ "@fortawesome/free-solid-svg-icons": "5.15.1", "@fortawesome/react-fontawesome": "^0.1.14", "@openedx/paragon": "21.13.1", + "@testing-library/react-hooks": "^8.0.1", "axios": "^1.7.7", "babel-polyfill": "6.26.0", "classnames": "2.2.6", @@ -3866,6 +3867,35 @@ "react-dom": "*" } }, + "node_modules/@testing-library/react-hooks": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/@testing-library/react-hooks/-/react-hooks-8.0.1.tgz", + "integrity": "sha512-Aqhl2IVmLt8IovEVarNDFuJDVWVvhnr9/GCU6UUnrYXwgDFF9h2L2o2P9KBni1AST5sT6riAyoukFLyjQUgD/g==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "react-error-boundary": "^3.1.0" + }, + "engines": { + "node": ">=12" + }, + "peerDependencies": { + "@types/react": "^16.9.0 || ^17.0.0", + "react": "^16.9.0 || ^17.0.0", + "react-dom": "^16.9.0 || ^17.0.0", + "react-test-renderer": "^16.9.0 || ^17.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "react-dom": { + "optional": true + }, + "react-test-renderer": { + "optional": true + } + } + }, "node_modules/@testing-library/react/node_modules/@testing-library/dom": { "version": "8.20.1", "license": "MIT", @@ -4185,10 +4215,12 @@ "license": "MIT" }, "node_modules/@types/react": { - "version": "18.3.3", - "license": "MIT", + "version": "17.0.83", + "resolved": "https://registry.npmjs.org/@types/react/-/react-17.0.83.tgz", + "integrity": "sha512-l0m4ArKJvmFtR4e8UmKrj1pB4tUgOhJITf+mADyF/p69Ts1YAR/E+G9XEM0mHXKVRa1dQNHseyyDNzeuAXfXQw==", "dependencies": { "@types/prop-types": "*", + "@types/scheduler": "^0.16", "csstype": "^3.0.2" } }, @@ -4228,6 +4260,11 @@ "version": "0.12.0", "license": "MIT" }, + "node_modules/@types/scheduler": { + "version": "0.16.8", + "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.8.tgz", + "integrity": "sha512-WZLiwShhwLRmeV6zH+GkbOFT6Z6VklCItrDioxUnv+u4Ll+8vKeFySoFyK/0ctcRpOmwAicELfmys1sDc/Rw+A==" + }, "node_modules/@types/semver": { "version": "7.5.8", "license": "MIT" @@ -13306,6 +13343,21 @@ "version": "16.13.1", "license": "MIT" }, + "node_modules/react-error-boundary": { + "version": "3.1.4", + "resolved": "https://registry.npmjs.org/react-error-boundary/-/react-error-boundary-3.1.4.tgz", + "integrity": "sha512-uM9uPzZJTF6wRQORmSrvOIgt4lJ9MC1sNgEOj2XGsDTRE4kmpWxg7ENK9EWNKJRMAOY9z0MuF4yIfl6gp4sotA==", + "dependencies": { + "@babel/runtime": "^7.12.5" + }, + "engines": { + "node": ">=10", + "npm": ">=6" + }, + "peerDependencies": { + "react": ">=16.13.1" + } + }, "node_modules/react-error-overlay": { "version": "6.0.11", "license": "MIT" @@ -13611,7 +13663,7 @@ }, "node_modules/react-shallow-renderer": { "version": "16.15.0", - "dev": true, + "devOptional": true, "license": "MIT", "dependencies": { "object-assign": "^4.1.1", @@ -13662,7 +13714,7 @@ }, "node_modules/react-test-renderer": { "version": "17.0.2", - "dev": true, + "devOptional": true, "license": "MIT", "dependencies": { "object-assign": "^4.1.1", @@ -13676,7 +13728,7 @@ }, "node_modules/react-test-renderer/node_modules/scheduler": { "version": "0.20.2", - "dev": true, + "devOptional": true, "license": "MIT", "dependencies": { "loose-envify": "^1.1.0", diff --git a/package.json b/package.json index 8f3852572..f89db253c 100644 --- a/package.json +++ b/package.json @@ -68,6 +68,7 @@ "@testing-library/dom": "^9.3.4", "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "12.1.4", + "@testing-library/react-hooks": "^8.0.1", "@testing-library/user-event": "^14.5.2", "@types/react-table": "^7.7.2", "@wojtekmaj/enzyme-adapter-react-17": "^0.8.0", diff --git a/src/Configuration/Customers/CustomerDetailView/EnterpriseCustomerUserDetail.jsx b/src/Configuration/Customers/CustomerDetailView/EnterpriseCustomerUserDetail.jsx index 942a5e962..8215c9d1e 100644 --- a/src/Configuration/Customers/CustomerDetailView/EnterpriseCustomerUserDetail.jsx +++ b/src/Configuration/Customers/CustomerDetailView/EnterpriseCustomerUserDetail.jsx @@ -18,7 +18,7 @@ export const EnterpriseCustomerUserDetail = ({ diff --git a/src/Configuration/Customers/data/hooks/tests/useCustomerUsersTableData.test.js b/src/Configuration/Customers/data/hooks/tests/useCustomerUsersTableData.test.js new file mode 100644 index 000000000..b21c07543 --- /dev/null +++ b/src/Configuration/Customers/data/hooks/tests/useCustomerUsersTableData.test.js @@ -0,0 +1,38 @@ +import { renderHook } from '@testing-library/react-hooks'; +import { waitFor } from '@testing-library/react'; + +import LmsApiService from '../../../../../data/services/EnterpriseApiService'; +import useCustomerUsersTableData from '../useCustomerUsersTableData'; + +jest.mock('../../../../../data/services/EnterpriseApiService'); +const TEST_ENTERPRISE_UUID = 'test-enterprise-uuid'; + +describe('useCustomerUsersTableData', () => { + it('should only search if user input is more than 3 characters', async () => { + const args = { + enterpriseUuid: TEST_ENTERPRISE_UUID, + }; + const { result } = renderHook(() => useCustomerUsersTableData(args)); + const { enterpriseUsersTableData } = result.current; + expect(enterpriseUsersTableData).toEqual({ itemCount: 0, pageCount: 0, results: [] }); + + // shouldn't fetch because its only 2 characters + const searchArgs1 = { + filters: [{ id: 'details', value: 'vi' }], + sortBy: [{}], + }; + result.current.fetchEnterpriseUsersData(searchArgs1); + await waitFor(() => { + expect(LmsApiService.fetchEnterpriseCustomerUsers).not.toHaveBeenCalled(); + }); + + const searchArgs2 = { + filters: [{ id: 'details', value: 'jinx' }], + sortBy: [{}], + }; + result.current.fetchEnterpriseUsersData(searchArgs2); + await waitFor(() => { + expect(LmsApiService.fetchEnterpriseCustomerUsers).toHaveBeenCalled(); + }); + }); +}); diff --git a/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js b/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js index 5605a9acd..20e40482e 100644 --- a/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js +++ b/src/Configuration/Customers/data/hooks/useCustomerUsersTableData.js @@ -19,7 +19,6 @@ const useCustomerUsersTableData = (enterpriseUuid) => { try { setIsLoading(true); const options = {}; - args.sortBy.filter((sort) => { const { id, desc } = sort; if (id === 'administrator') {