From 9d0dd72a9450b0c7456c084d7dad1075a7757802 Mon Sep 17 00:00:00 2001
From: yomybaby <621215+yomybaby@users.noreply.github.com>
Date: Tue, 10 Sep 2024 03:00:52 +0000
Subject: [PATCH] fix: object merging with mutation in VFolderTable, hooks, and
 SessionLauncherPage (#2699)

### TL;DR

Modified `_.merge()` calls to include an empty object as the first argument.

This PR fixed a bug where the user could not turn on the "Use automatic OpenMP optimization" option after turning it off in the Neo Session Launcher.

![image.png](https://graphite-user-uploaded-assets-prod.s3.amazonaws.com/XqC2uNFuj0wg8I60sMUh/935c7236-ab00-49a2-a83a-469048b0c31d.png)

### What changed?

Updated three instances of `_.merge()` function calls in different files:
1. In `VFolderTable.tsx`, added an empty object as the first argument to `mergedVFolderPermissions`.
2. In `backendai.tsx`, added an empty object as the first argument when merging `deviceMetadata` and `resourceSlots`.
3. In `SessionLauncherPage.tsx`, added an empty object as the first argument when merging `INITIAL_FORM_VALUES` and `formValuesFromQueryParams`.

### Why make this change?

The addition of an empty object as the first argument in `_.merge()` calls ensures that the original objects are not modified during the merge operation. This prevents potential side effects and maintains the immutability of the source objects, leading to more predictable and safer code behavior.
---
 react/src/components/VFolderTable.tsx   | 1 +
 react/src/hooks/backendai.tsx           | 2 +-
 react/src/pages/SessionLauncherPage.tsx | 2 +-
 3 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/react/src/components/VFolderTable.tsx b/react/src/components/VFolderTable.tsx
index e5e4d21bbb..6658a2ad41 100644
--- a/react/src/components/VFolderTable.tsx
+++ b/react/src/components/VFolderTable.tsx
@@ -192,6 +192,7 @@ const VFolderTable: React.FC<VFolderTableProps> = ({
     );
 
     const mergedVFolderPermissions = _.merge(
+      {}, // start with empty object
       allowedVFolderHostsByDomain,
       allowedVFolderHostsByGroup,
       allowedVFolderHostsByKeypairResourcePolicy,
diff --git a/react/src/hooks/backendai.tsx b/react/src/hooks/backendai.tsx
index 63eb9bf381..e502378e32 100644
--- a/react/src/hooks/backendai.tsx
+++ b/react/src/hooks/backendai.tsx
@@ -119,7 +119,7 @@ export const useResourceSlotsDetails = (resourceGroupName?: string) => {
   });
 
   return [
-    _.merge(deviceMetadata, resourceSlots),
+    _.merge({}, deviceMetadata, resourceSlots),
     {
       refresh: () => checkUpdate(),
     },
diff --git a/react/src/pages/SessionLauncherPage.tsx b/react/src/pages/SessionLauncherPage.tsx
index ede39a13a0..651873a141 100644
--- a/react/src/pages/SessionLauncherPage.tsx
+++ b/react/src/pages/SessionLauncherPage.tsx
@@ -274,7 +274,7 @@ const SessionLauncherPage = () => {
   }, []);
 
   const mergedInitialValues = useMemo(() => {
-    return _.merge(INITIAL_FORM_VALUES, formValuesFromQueryParams);
+    return _.merge({}, INITIAL_FORM_VALUES, formValuesFromQueryParams);
   }, [INITIAL_FORM_VALUES, formValuesFromQueryParams]);
 
   // ScrollTo top when step is changed