Merge pull request #1030 from devtron-labs/fix/user-preferences-types

chore: add user preferences migration logic

Author: arunjaindev

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.23.4-beta-2",
+    "version": "1.23.4-beta-3",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -156,12 +156,12 @@ const InternalTable = <
         data: getRowsResult,
         error: getRowsError,
         refetch: reloadGetRows,
+        // eslint-disable-next-line @tanstack/query/exhaustive-deps
     } = useQuery<unknown, RowsResultType<RowData>, unknown[], false>({
         queryFn: async ({ signal }) => {
             const { rows: newRows, totalRows } = await getRows(filterData, signal)
             return { filteredRows: newRows, totalRows }
         },
-        // eslint-disable-next-line @tanstack/query/exhaustive-deps
         queryKey: [
             searchKey,
             sortBy,

src/Shared/Components/Table/InternalTable.tsx

@@ -15,6 +15,6 @@
  */
 
 export * from './constants'
-export { getUserPreferences, updateAndPersistUserPreferences, updateUserPreferences } from './service'
+export { getUserPreferences, updateUserPreferences } from './service'
 export * from './types'
 export { useUserPreferences } from './useUserPrefrences'

src/Shared/Hooks/useUserPreferences/index.ts

@@ -16,6 +16,7 @@
 
 import { ROUTES } from '@Common/Constants'
 import { get, getUrlWithSearchParams, patch, showError } from '@Common/index'
+import { ResourceKindType } from '@Shared/index'
 import { THEME_PREFERENCE_MAP } from '@Shared/Providers/ThemeProvider/types'
 
 import { USER_PREFERENCES_ATTRIBUTE_KEY } from './constants'
@@ -177,27 +178,56 @@ export const updateUserPreferences = async ({
     }
 }
 
+const migrateUserPreferences = async () => {
+    try {
+        const userPreferences: UserPreferencesType = await JSON.parse(
+            localStorage.getItem(USER_PREFERENCES_ATTRIBUTE_KEY),
+        )
+        if (userPreferences && userPreferences.version !== 'v1') {
+            const migratedPreferences: UserPreferencesType = {
+                ...userPreferences,
+                resources: {
+                    ...userPreferences.resources,
+                    [ResourceKindType.devtronApplication]: {
+                        [UserPreferenceResourceActions.RECENTLY_VISITED]: (
+                            userPreferences.resources?.[ResourceKindType.devtronApplication]?.[
+                                UserPreferenceResourceActions.RECENTLY_VISITED
+                            ] || []
+                        ).map(({ id, name }) => ({ id: +id, name })),
+                    },
+                },
+                version: 'v1',
+            }
+            localStorage.setItem(USER_PREFERENCES_ATTRIBUTE_KEY, JSON.stringify(migratedPreferences))
+        }
+    } catch {
+        // do nothing
+    }
+}
+
 /**
  * Optimized function to get updated user preferences with resource filtering
  * Can work with provided userPreferences or fetch from server/localStorage
  * Centralizes all resource updating logic
  */
-export const getUpdatedUserPreferences = async ({
+const getUpdatedUserPreferences = async ({
     id,
     name,
     resourceKind,
     userPreferencesResponse,
 }: UserPreferenceFilteredListTypes & {
     userPreferencesResponse?: UserPreferencesType
 }): Promise<UserPreferencesType> => {
+    await migrateUserPreferences()
+
     // Get base user preferences from multiple sources (priority: provided > localStorage > server)
     let baseUserPreferences: UserPreferencesType
 
     if (userPreferencesResponse) {
         baseUserPreferences = userPreferencesResponse
     } else {
         try {
-            const localStorageData = localStorage.getItem('userPreferences')
+            const localStorageData = localStorage.getItem(USER_PREFERENCES_ATTRIBUTE_KEY)
             if (localStorageData) {
                 baseUserPreferences = JSON.parse(localStorageData)
             } else {
@@ -257,7 +287,7 @@ export const updateAndPersistUserPreferences = async ({
 
     // Update localStorage if requested
     if (updateLocalStorage) {
-        localStorage.setItem('userPreferences', JSON.stringify(updatedPreferences))
+        localStorage.setItem(USER_PREFERENCES_ATTRIBUTE_KEY, JSON.stringify(updatedPreferences))
     }
 
     // Update server with the new resource list if resourceKind is provided

src/Shared/Hooks/useUserPreferences/service.ts

@@ -102,6 +102,10 @@ export interface UserPreferencesType extends Pick<GetUserPreferencesParsedDTO, '
      * @description resources object
      */
     resources?: GetUserPreferencesParsedDTO['resources']
+    /**
+     * @description version of the user preferences, to be used for migration purposes
+     */
+    version?: string
 }
 
 export interface UpdatedUserPreferencesType extends UserPreferencesType, Pick<ThemeConfigType, 'appTheme'> {}