Remember session checkbox state on login

packages/extension/cypress/e2e/NFT.cy.ts

@@ -331,6 +331,15 @@ describe('Mint', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });

packages/extension/cypress/e2e/networks.cy.ts

@@ -29,6 +29,15 @@ describe('Switch networks', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });

packages/extension/cypress/e2e/offers.cy.ts

@@ -235,6 +235,15 @@ describe('Offers', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });

packages/extension/cypress/e2e/payments.cy.ts

@@ -34,6 +34,15 @@ describe('Make payment - XRP', () => {
             sendMessage(message, cb) {}
           };
 
+          (win as any).chrome.storage = {
+            local: {
+              get(key, cb) {},
+              set(obj, cb) {
+                if (cb) cb();
+              }
+            }
+          };
+
           cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
         }
       }
@@ -127,6 +136,15 @@ describe('Make payment - ETH', () => {
             sendMessage(message, cb) {}
           };
 
+          (win as any).chrome.storage = {
+            local: {
+              get(key, cb) {},
+              set(obj, cb) {
+                if (cb) cb();
+              }
+            }
+          };
+
           cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
         }
       }
@@ -218,6 +236,15 @@ describe('Make payment - SOLO', () => {
           (win as any).chrome.runtime = {
             sendMessage(message, cb) {}
           };
+
+          (win as any).chrome.storage = {
+            local: {
+              get(key, cb) {},
+              set(obj, cb) {
+                if (cb) cb();
+              }
+            }
+          };
         }
       }
     );
@@ -256,6 +283,15 @@ describe('Make payment - SOLO', () => {
           (win as any).chrome.runtime = {
             sendMessage(message, cb) {}
           };
+
+          (win as any).chrome.storage = {
+            local: {
+              get(key, cb) {},
+              set(obj, cb) {
+                if (cb) cb();
+              }
+            }
+          };
         }
       }
     );

packages/extension/cypress/e2e/send_token.cy.ts

@@ -30,6 +30,15 @@ describe('Send Token', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });

packages/extension/cypress/e2e/set_account.cy.ts

@@ -30,6 +30,15 @@ describe('Set Account', () => {
             sendMessage(message, cb) {}
           };
 
+          (win as any).chrome.storage = {
+            local: {
+              get(key, cb) {},
+              set(obj, cb) {
+                if (cb) cb();
+              }
+            }
+          };
+
           cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
         }
       }

packages/extension/cypress/e2e/submit_transaction.cy.ts

@@ -107,6 +107,15 @@ describe('Submit Transaction', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });

packages/extension/cypress/e2e/trustlines.cy.ts

@@ -238,6 +238,15 @@ const navigate = (url: string, password: string) => {
         sendMessage(message, cb) {}
       };
 
+      (win as any).chrome.storage = {
+        local: {
+          get(key, cb) {},
+          set(obj, cb) {
+            if (cb) cb();
+          }
+        }
+      };
+
       cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
     }
   });

packages/extension/cypress/e2e/wallet_management.cy.ts

@@ -16,6 +16,15 @@ describe('Setup the initial wallet (no previous wallet)', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });
@@ -239,6 +248,15 @@ describe('Add an additional wallet (with previous wallet)', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });
@@ -400,6 +418,15 @@ describe('Edit wallet', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });
@@ -539,6 +566,15 @@ describe('Switch wallet', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });
@@ -595,6 +631,15 @@ describe('Reset password', () => {
           sendMessage(message, cb) {}
         };
 
+        (win as any).chrome.storage = {
+          local: {
+            get(key, cb) {},
+            set(obj, cb) {
+              if (cb) cb();
+            }
+          }
+        };
+
         cy.stub((win as any).chrome.runtime, 'sendMessage').resolves({});
       }
     });

packages/extension/src/components/pages/Login/Login.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect, FC, useCallback, useRef } from 'react';
+import { useState, useEffect, FC, useCallback, useRef, ChangeEvent } from 'react';
 
 import {
   Button,
@@ -52,6 +52,7 @@ import {
 import { useWallet } from '../../../contexts';
 import { useKeyUp } from '../../../hooks/useKeyUp';
 import { loadData } from '../../../utils';
+import { loadRememberSessionState, saveRememberSessionState } from '../../../utils/login';
 import { Logo } from '../../atoms/Logo';
 
 export const Login: FC = () => {
@@ -108,9 +109,18 @@ export const Login: FC = () => {
     }
   }, [navigate, navigateToPath, search, selectedWallet, wallets]);
 
+  useEffect(() => {
+    const loadRememberSession = async () => {
+      const loadedState = await loadRememberSessionState();
+      setRememberSession(loadedState);
+    };
+    loadRememberSession();
+  }, []);
+
   const handleUnlock = useCallback(() => {
     const passwordValue = passwordRef.current?.value;
     if (passwordValue && signIn(passwordValue, rememberSession)) {
+      saveRememberSessionState(rememberSession);
       navigateToPath();
 
       if (process.env.NODE_ENV === 'production') {
@@ -146,6 +156,11 @@ export const Login: FC = () => {
     navigate(RESET_PASSWORD_PATH);
   }, [navigate]);
 
+  const handleRememberSessionChange = (e: ChangeEvent<HTMLInputElement>) => {
+    const checked = e.target.checked;
+    setRememberSession(checked);
+  };
+
   return (
     <Container
       component="main"
@@ -191,7 +206,7 @@ export const Login: FC = () => {
           control={
             <Checkbox
               checked={rememberSession}
-              onChange={(e) => setRememberSession(e.target.checked)}
+              onChange={handleRememberSessionChange}
               name="rememberSession"
               color="primary"
               style={{ transform: 'scale(0.9)' }}

packages/extension/src/constants/index.ts

@@ -1,7 +1,7 @@
 export * from './apiErrors';
 export * from './colors';
 export * from './links';
-export * from './localStorage';
+export * from './storage';
 export * from './navigation';
 export * from './parameters';
 export * from './routes';

packages/extension/src/constants/localStorage.ts → packages/extension/src/constants/storage.ts

@@ -4,3 +4,4 @@ export const STORAGE_SEED = 'seed';
 export const STORAGE_TRUSTED_APPS = 'trustedApps';
 export const STORAGE_WALLETS = 'wallets';
 export const STORAGE_SELECTED_WALLET = 'selectedWallet';
+export const STORAGE_REMEMBER_SESSION = 'rememberSession';

packages/extension/src/utils/index.ts

@@ -8,7 +8,8 @@ export * from './link';
 export * from './network';
 export * from './numbersToSeed';
 export * from './parseFromString';
-export * from './storage';
+export * from './storageChrome';
+export * from './storageLocal';
 export * from './transaction';
 export * from './truncateAddress';
 export * from './truncateWalletName';

packages/extension/src/utils/login.test.ts

@@ -0,0 +1,55 @@
+import { STORAGE_REMEMBER_SESSION } from '../constants';
+import { loadRememberSessionState, saveRememberSessionState } from './login';
+import { saveInChromeStorage, loadFromChromeStorage } from './storageChrome';
+
+jest.mock('./storageChrome', () => ({
+  saveInChromeStorage: jest.fn(),
+  loadFromChromeStorage: jest.fn()
+}));
+
+describe('saveRememberSessionState', () => {
+  beforeEach(() => {
+    saveInChromeStorage.mockClear();
+  });
+
+  test('should save the remember session state to chrome storage', async () => {
+    const state = true;
+    saveRememberSessionState(state);
+    expect(saveInChromeStorage).toHaveBeenCalledWith(
+      STORAGE_REMEMBER_SESSION,
+      JSON.stringify(state)
+    );
+  });
+});
+
+describe('loadRememberSessionState', () => {
+  beforeEach(() => {
+    loadFromChromeStorage.mockClear();
+  });
+
+  test('should load the remember session state from chrome storage', async () => {
+    const state = true;
+    (loadFromChromeStorage as jest.Mock).mockResolvedValue({
+      [STORAGE_REMEMBER_SESSION]: JSON.stringify(state)
+    });
+
+    const loadedState = await loadRememberSessionState();
+    expect(loadedState).toEqual(state);
+  });
+
+  test('should return false if no state is found in chrome storage', async () => {
+    (loadFromChromeStorage as jest.Mock).mockResolvedValue({});
+
+    const loadedState = await loadRememberSessionState();
+    expect(loadedState).toEqual(false);
+  });
+
+  test('should return false if an error occurs while loading the state', async () => {
+    (loadFromChromeStorage as jest.Mock).mockRejectedValue(
+      new Error('Error loading state from chrome storage')
+    );
+
+    const loadedState = await loadRememberSessionState();
+    expect(loadedState).toEqual(false);
+  });
+});