feat: add getUpdatedPluginStore util to abstract traversal of new plugin store response to append to data store

Author: AbhishekA1509

src/Shared/Components/Plugin/PluginListContainer.tsx

@@ -16,6 +16,7 @@ import {
 } from './types'
 import { DEFAULT_PLUGIN_LIST_FILTERS } from './constants'
 import './pluginListContainer.scss'
+import { getUpdatedPluginStore } from './utils'
 
 const PluginListContainer = ({
     availableTags,
@@ -98,25 +99,12 @@ const PluginListContainer = ({
         pluginResponse,
         appendResponse = false,
     ) => {
-        const clonedPluginDataStore = structuredClone(pluginDataStore)
         const {
             pluginStore: { parentPluginStore, pluginVersionStore },
             totalCount: responseTotalCount,
         } = pluginResponse
 
-        Object.keys(parentPluginStore).forEach((key) => {
-            if (!clonedPluginDataStore.parentPluginStore[key]) {
-                clonedPluginDataStore.parentPluginStore[key] = parentPluginStore[key]
-            }
-        })
-
-        Object.keys(pluginVersionStore).forEach((key) => {
-            if (!clonedPluginDataStore.pluginVersionStore[key]) {
-                clonedPluginDataStore.pluginVersionStore[key] = pluginVersionStore[key]
-            }
-        })
-
-        handlePluginDataStoreUpdate(clonedPluginDataStore)
+        handlePluginDataStoreUpdate(getUpdatedPluginStore(pluginDataStore, parentPluginStore, pluginVersionStore))
         handleUpdateTotalCount(responseTotalCount)
 
         const newPluginList: typeof pluginList = appendResponse ? structuredClone(pluginList) : []
@@ -142,7 +130,6 @@ const PluginListContainer = ({
 
     useEffect(() => {
         const isLoading = isLoadingPluginData || getIsRequestAborted(pluginDataError)
-        // This will be reusable for load more so convert it to a function
         if (!isLoading && !pluginDataError && pluginData) {
             handleDataUpdateForPluginResponse(pluginData)
         }

src/Shared/Components/Plugin/utils.tsx

@@ -97,3 +97,28 @@ export const pluginTagSelectStyles = {
         },
     }),
 }
+
+/**
+ * @description This method takes the initial plugin data store and updates only keys that are not present in the initial store with the values from the target store.
+ */
+export const getUpdatedPluginStore = (
+    initialPluginDataStore: PluginDataStoreType,
+    targetParentPluginStore: PluginDataStoreType['parentPluginStore'],
+    targetPluginVersionStore: PluginDataStoreType['pluginVersionStore'],
+): PluginDataStoreType => {
+    const clonedPluginDataStore = structuredClone(initialPluginDataStore)
+
+    Object.keys(targetParentPluginStore).forEach((key) => {
+        if (!clonedPluginDataStore.parentPluginStore[key]) {
+            clonedPluginDataStore.parentPluginStore[key] = targetParentPluginStore[key]
+        }
+    })
+
+    Object.keys(targetPluginVersionStore).forEach((key) => {
+        if (!clonedPluginDataStore.pluginVersionStore[key]) {
+            clonedPluginDataStore.pluginVersionStore[key] = targetPluginVersionStore[key]
+        }
+    })
+
+    return clonedPluginDataStore
+}