Refactor: Move useContextSelector to common package (#497)

* Move useContextSelector to common package * perf: improve conditional check for array of objects * ref: import useContextSelector from common package * Squashed commit of the following: commit bc7ce7d Merge: 4e510b2 59622d0 Author: Amoghavarsha Kudaligi <kgamoghavarsha@gmail.com> Date: Tue Feb 20 20:19:35 2024 +0530 Merge branch 'develop' of github.com:GoogleChromeLabs/ps-analysis-tool into develop commit 4e510b2 Author: Amoghavarsha Kudaligi <kgamoghavarsha@gmail.com> Date: Tue Feb 20 20:19:13 2024 +0530 Fix the reload button staying on the popup. commit 59622d0 Author: nirwalayush <coding.carrots@gmail.com> Date: Tue Feb 20 20:14:51 2024 +0530 fix: fix details panel showing unknown reason message commit 809bc38 Author: Amoghavarsha Kudaligi <kgamoghavarsha@gmail.com> Date: Tue Feb 20 18:27:30 2024 +0530 Add <br/> for uniformity. Remove top padding from blocking direction. commit 27242be Author: Mayank Rana <mayankranax1@gmail.com> Date: Tue Feb 20 17:50:11 2024 +0530 fix: add flags to not highlight rows commit 3847489 Author: sayedtaqui <sayedwp@gmail.com> Date: Tue Feb 20 16:04:36 2024 +0530 Run audit fix commit 35af0b4 Author: sayedtaqui <sayedwp@gmail.com> Date: Tue Feb 20 16:04:06 2024 +0530 Bump version commit 7c74c6a Author: sayedtaqui <sayedwp@gmail.com> Date: Tue Feb 20 16:02:07 2024 +0530 Update rws data commit 89378d6 Author: sayedtaqui <sayedwp@gmail.com> Date: Tue Feb 20 16:01:45 2024 +0530 Update cookie database commit 595f1a7 Author: sayedtaqui <sayedwp@gmail.com> Date: Tue Feb 20 16:00:14 2024 +0530 Update changelog commit ed0823d Author: Ayush Nirwal <53055971+ayushnirwal@users.noreply.github.com> Date: Tue Feb 20 15:48:21 2024 +0530 style-fix: scale up prefix icons in table (#514) commit 0ad08a3 Author: Mohammad Taqui Sayed <6297436+mohdsayed@users.noreply.github.com> Date: Tue Feb 20 15:42:20 2024 +0530 Add UTM params to outgoing links (#512) * Add utility function and its test case adding utm params * Move util function to common * Make util function to handle # URLs and use for latest news and quick links * Add UTM links to faciliated testing * Update test for dev doc * Update link to file issue * Remove param from github.com * Add utm params to more links * Add utm params to all help urls * Add utm params to youtube as well * Fix tests commit 9fad900 Author: Kudaligi Amoghavarsha <kgamoghavarsha@gmail.com> Date: Tue Feb 20 15:41:44 2024 +0530 Fix: keep service worker alive (#513) * Keep service worker alive once it is profile is started. * Add peroidic intervals to send data to devtools and popup for old profile. * Remove addition of interval on windows creation. * Keep setInverval in the chrome.windows.onCreated. commit bd1624b Author: Kudaligi Amoghavarsha <kgamoghavarsha@gmail.com> Date: Tue Feb 20 13:23:02 2024 +0530 Remove relative property. (#511) Change messageing for toast message. commit 7794a22 Author: sayedtaqui <sayedwp@gmail.com> Date: Tue Feb 20 10:01:04 2024 +0530 Chore: Remove logs used for debugging empty cookies commit 789a40a Author: sayedtaqui <sayedwp@gmail.com> Date: Tue Feb 20 09:58:10 2024 +0530 Fix popup ui issue commit dd1b286 Author: Mayank Rana <58820001+mayan-000@users.noreply.github.com> Date: Mon Feb 19 20:28:19 2024 +0530 Enhancement: Update cookie's blocking status enum and UI (#507) * ref: add enums for blocking status * fix: update deriveBlocking utils * feat: add icons and the extractors * feat: conditionally render icons * test-fix: update deriveBlockingStatus test * fix: don't hightlight rows when not using CDP * ref: update comment * fix: decrease padding * fix:manage expiring cookies --------- Co-authored-by: nirwalayush <coding.carrots@gmail.com> Co-authored-by: sayedtaqui <sayedwp@gmail.com> commit 4fea486 Author: Kudaligi Amoghavarsha <kgamoghavarsha@gmail.com> Date: Mon Feb 19 18:20:30 2024 +0530 Two-step process for toggling CDP state (#494) * Add a toast message component in design-system. Add mechanism in place to reload all the tabs. Add mechanism to show the reload button in the devtools. * Add toast message in the popup. * Persist toastmessage on reload of extension * Add styling to toast message * Add a button to match the chrome://flags toast-message. * Add a button to the popup. * Fix the order of firing of events. * Reduce Padding. * Reduce vertical padding. * Fix the text and add toast message in popup. * Add fullstop to the popup messaging. * Shorten the devtools message. * Remove persistence of the toastMessage * use sessionStorage instead of localStorage from web api * Fix refresh of the cookies. * revert changes. * Fix component showing analyse this tab on newtab open. * Fix service worker popup connection. * Fix the messaging. * Fix value being set add new state for display. * Fix 0 cookies landing page on multitab debugging issue. * Fix padding and the design. * Add breakpoints for the button. Add breakpoints for text. * Fix the fontsize * Fix breakpoints * Fix text for button. * Fix message not showing up in popup. * Add comment to listener. Add default case to switch block. * ref: use absolute to spread toast message * Fix the toastmessage while scrolling. --------- Co-authored-by: Mayank Rana <mayankranax1@gmail.com> commit f7c4774 Author: Mayank Rana <58820001+mayan-000@users.noreply.github.com> Date: Mon Feb 19 17:48:22 2024 +0530 Refactor: Restructure `Facilitated Testing` landing page UI (#493) * add timeline icon * ref: restructure UI replicating infocard one * ref: update landing page width * styles: add breakpoints for bigger screens * ref: update the order commit f7757ad Author: Mohammad Taqui Sayed <6297436+mohdsayed@users.noreply.github.com> Date: Mon Feb 19 17:45:02 2024 +0530 Fix: Library detection miscellaneous QA issues (#495) * Add GIS_EXCEPTIONS and GSIv2_EXCEPTIONS which remove the given feature from UI * Review comments address - Developer Testing Pending * Add Testcases for filterMatchesBasedOnExceptions * Update load delay to 2 sec and show page loading text when page is loading * Fix issue where when all signatures are filtered empty state wasnt showing properly --------- Co-authored-by: Manoj Mohan <jesuismanoj@gmail.com> commit 84d62ac Merge: c0ba3b5 88761db Author: sayedtaqui <sayedwp@gmail.com> Date: Fri Feb 16 21:31:14 2024 +0530 Merge branch 'develop' of github.com:GoogleChromeLabs/ps-analysis-tool into develop commit c0ba3b5 Author: sayedtaqui <sayedwp@gmail.com> Date: Fri Feb 16 21:29:26 2024 +0530 Add one more log commit 88761db Author: Ayush Nirwal <53055971+ayushnirwal@users.noreply.github.com> Date: Fri Feb 16 13:26:08 2024 +0530 Fix: add conditional rendering in technology details panel (#499) * feat:add conditional rendering in technology details panel * fix: add message for no description available. commit 1f93d3a Author: sayedtaqui <sayedwp@gmail.com> Date: Thu Feb 15 19:34:41 2024 +0530 Temp: Add logs for debugging * Override createContext inside common package and import from there * Test: Add test for shallowEqual
GoogleChromeLabs · Feb 25, 2024 · 2eb6715 · 2eb6715
1 parent d7f2ac3
commit 2eb6715
Show file tree

Hide file tree

Showing 12 changed files with 157 additions and 9 deletions.
diff --git a/packages/cli-dashboard/src/components/siteReport/stateProviders/contentStore/index.tsx b/packages/cli-dashboard/src/components/siteReport/stateProviders/contentStore/index.tsx
@@ -17,12 +17,13 @@
  * External dependencies.
  */
 import React, { type PropsWithChildren, useMemo } from 'react';
-import { useContextSelector, createContext } from 'use-context-selector';
 import {
   type CompleteJson,
   type CookieJsonDataType,
   type CookieTableData,
   type TechnologyData,
+  useContextSelector,
+  createContext,
 } from '@ps-analysis-tool/common';
 
 /**

diff --git a/packages/common/src/index.ts b/packages/common/src/index.ts
@@ -35,6 +35,7 @@ export { default as noop } from './utils/noop';
 export { default as getDevToolWorker } from './worker/devToolWorker';
 export { default as executeTaskInDevToolWorker } from './worker/executeTaskInDevToolWorker';
 export { default as getValueByKey } from './utils/getValueByKey';
+export * from './utils/contextSelector';
 export { default as addUTMParams } from './utils/addUTMParams';
 export * from './worker/enums';
 export * from './utils/generateReports';

diff --git a/packages/common/src/utils/contextSelector/createContext.ts b/packages/common/src/utils/contextSelector/createContext.ts
@@ -0,0 +1,26 @@
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * External dependencies
+ */
+import { createContext as createContextOrig } from 'use-context-selector';
+
+const createContext = <T>(defaultValue: T) => {
+  return createContextOrig(defaultValue);
+};
+
+export default createContext;
diff --git a/packages/common/src/utils/contextSelector/index.ts b/packages/common/src/utils/contextSelector/index.ts
@@ -0,0 +1,18 @@
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export { default as useContextSelector } from './useContextSelector';
+export { default as createContext } from './createContext';
diff --git a/packages/extension/src/utils/shallowEqual.ts → ...src/utils/contextSelector/shallowEqual.ts b/packages/extension/src/utils/shallowEqual.ts → ...src/utils/contextSelector/shallowEqual.ts
@@ -24,6 +24,14 @@ export const shallowEqual = (a: unknown, b: unknown): boolean => {
   }
 
   if (Array.isArray(a) && Array.isArray(b)) {
+    if (
+      typeof a[0] === 'object' &&
+      typeof b[0] === 'object' &&
+      a.length === b.length
+    ) {
+      return a.every((item, index) => shallowEqualObjects(item, b[index]));
+    }
+
     return shallowEqualArrays(a, b);
   }
 

diff --git a/packages/common/src/utils/contextSelector/tests/shallowEqual.ts b/packages/common/src/utils/contextSelector/tests/shallowEqual.ts
@@ -0,0 +1,86 @@
+/*
+ * Copyright 2023 Google LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * External dependencies
+ */
+
+/**
+ * Internal dependencies
+ */
+import { shallowEqual } from '../shallowEqual';
+
+describe('shallowEqual', () => {
+  it('should return true if the objects are equal', () => {
+    const a = { a: 1, b: 2 };
+    const b = { a: 1, b: 2 };
+    expect(shallowEqual(a, b)).toBe(true);
+  });
+
+  it('should return false if the objects are not equal', () => {
+    const a = { a: 1, b: 2 };
+    const b = { a: 1, b: 3 };
+    expect(shallowEqual(a, b)).toBe(false);
+  });
+
+  it('should return true if the arrays are equal', () => {
+    const a = [1, 2, 3];
+    const b = [1, 2, 3];
+    expect(shallowEqual(a, b)).toBe(true);
+  });
+
+  it('should return false if the arrays are not equal', () => {
+    const a = [1, 2, 3];
+    const b = [1, 2, 4];
+    expect(shallowEqual(a, b)).toBe(false);
+  });
+
+  it('should return true if the arrays of objects are equal', () => {
+    const a = [
+      { a: 1, b: 2 },
+      { a: 3, b: 4 },
+    ];
+    const b = [
+      { a: 1, b: 2 },
+      { a: 3, b: 4 },
+    ];
+    expect(shallowEqual(a, b)).toBe(true);
+  });
+
+  it('should return false if the arrays of objects are not equal', () => {
+    const a = [
+      { a: 1, b: 2 },
+      { a: 3, b: 4 },
+    ];
+    const b = [
+      { a: 1, b: 2 },
+      { a: 3, b: 5 },
+    ];
+    expect(shallowEqual(a, b)).toBe(false);
+  });
+
+  it('should return false if the arrays of objects are not equal', () => {
+    const a = [
+      { a: 1, b: 2 },
+      { a: 3, b: 4 },
+    ];
+    const b = [
+      { a: 1, b: 2 },
+      { a: 3, b: 5 },
+    ];
+    expect(shallowEqual(a, b)).toBe(false);
+  });
+});
diff --git a/...extension/src/utils/useContextSelector.ts → ...ils/contextSelector/useContextSelector.ts b/...extension/src/utils/useContextSelector.ts → ...ils/contextSelector/useContextSelector.ts
diff --git a/packages/design-system/src/components/table/persistentSettingsStore/index.tsx b/packages/design-system/src/components/table/persistentSettingsStore/index.tsx
@@ -24,8 +24,8 @@ import React, {
   useMemo,
   useRef,
 } from 'react';
-import { useContextSelector, createContext } from 'use-context-selector';
 import PQueue from 'p-queue';
+import { useContextSelector, createContext } from '@ps-analysis-tool/common';
 
 /**
  * Internal dependencies

diff --git a/packages/extension/src/view/devtools/stateProviders/syncCookieStore/index.tsx b/packages/extension/src/view/devtools/stateProviders/syncCookieStore/index.tsx
@@ -16,7 +16,6 @@
 /**
  * External dependencies.
  */
-import { createContext } from 'use-context-selector';
 import React, {
   type PropsWithChildren,
   useEffect,
@@ -30,12 +29,13 @@ import {
   type TabCookies,
   type TabFrames,
   UNKNOWN_FRAME_KEY,
+  useContextSelector,
+  createContext,
 } from '@ps-analysis-tool/common';
 
 /**
  * Internal dependencies.
  */
-import useContextSelector from '../../../../utils/useContextSelector';
 import { ALLOWED_NUMBER_OF_TABS } from '../../../../constants';
 import setDocumentCookies from '../../../../utils/setDocumentCookies';
 import isOnRWS from '../../../../contentScript/utils/isOnRWS';

diff --git a/packages/extension/src/view/devtools/stateProviders/syncSettingsStore/index.tsx b/packages/extension/src/view/devtools/stateProviders/syncSettingsStore/index.tsx
@@ -16,14 +16,14 @@
 /**
  * External dependencies.
  */
-import { useContextSelector, createContext } from 'use-context-selector';
 import React, {
   type PropsWithChildren,
   useEffect,
   useState,
   useCallback,
 } from 'react';
 import { noop } from '@ps-analysis-tool/design-system';
+import { useContextSelector, createContext } from '@ps-analysis-tool/common';
 
 enum PLATFORM_OS_MAP {
   mac = 'MacOS',

diff --git a/packages/extension/src/view/popup/stateProviders/syncCookieStore/index.tsx b/packages/extension/src/view/popup/stateProviders/syncCookieStore/index.tsx
@@ -16,7 +16,6 @@
 /**
  * External dependencies.
  */
-import { useContextSelector, createContext } from 'use-context-selector';
 import React, {
   type PropsWithChildren,
   useEffect,
@@ -26,7 +25,12 @@ import React, {
 } from 'react';
 import { useDebouncedCallback } from 'use-debounce';
 import { noop, prepareCookiesCount } from '@ps-analysis-tool/design-system';
-import { type CookieData, type CookiesCount } from '@ps-analysis-tool/common';
+import {
+  type CookieData,
+  type CookiesCount,
+  useContextSelector,
+  createContext,
+} from '@ps-analysis-tool/common';
 
 /**
  * Internal dependencies.

diff --git a/packages/library-detection/src/core/stateProvider/index.tsx b/packages/library-detection/src/core/stateProvider/index.tsx
@@ -16,15 +16,19 @@
 /**
  * External dependencies.
  */
-import { createContext, useContextSelector } from 'use-context-selector';
 import React, {
   type PropsWithChildren,
   useState,
   useCallback,
   useEffect,
   useRef,
 } from 'react';
-import { getDomainFromUrl, noop } from '@ps-analysis-tool/common';
+import {
+  getDomainFromUrl,
+  noop,
+  useContextSelector,
+  createContext,
+} from '@ps-analysis-tool/common';
 
 /**
  * Internal dependencies.