Merge pull request #91 from xmtp-labs/ar/encrypted-storage-service

refactor: Encrypted Storage

src/context/AuthContext.tsx

@@ -7,7 +7,7 @@ import React, {
   useEffect,
   useState,
 } from 'react';
-import {getClientKeys} from '../services/encryptedStorage';
+import {encryptedStorage} from '../services/encryptedStorage';
 
 type AuthedStatus = 'LOADING' | 'AUTHED' | 'UNAUTHED';
 
@@ -31,7 +31,8 @@ export const AuthProvider: FC<PropsWithChildren> = ({children}) => {
     if (!address) {
       return setAuthStatus('UNAUTHED');
     }
-    getClientKeys(address as `0x${string}`)
+    encryptedStorage
+      .getClientKeys(address as `0x${string}`)
       .then(keys => {
         if (!keys) {
           return setAuthStatus('UNAUTHED');

src/providers/ClientProvider.tsx

@@ -3,7 +3,7 @@ import {Client} from '@xmtp/react-native-sdk';
 import React, {FC, PropsWithChildren, useEffect, useState} from 'react';
 import {SupportedContentTypes} from '../consts/ContentTypes';
 import {ClientContext} from '../context/ClientContext';
-import {clearClientKeys, getClientKeys} from '../services/encryptedStorage';
+import {encryptedStorage} from '../services/encryptedStorage';
 import {createClientOptions} from '../utils/clientOptions';
 
 export const ClientProvider: FC<PropsWithChildren> = ({children}) => {
@@ -27,7 +27,9 @@ export const ClientProvider: FC<PropsWithChildren> = ({children}) => {
     }
     const handleClientCreation = async () => {
       try {
-        const keys = await getClientKeys(address as `0x${string}`);
+        const keys = await encryptedStorage.getClientKeys(
+          address as `0x${string}`,
+        );
         if (!keys) {
           return setLoading(false);
         }
@@ -40,7 +42,7 @@ export const ClientProvider: FC<PropsWithChildren> = ({children}) => {
             );
           setClient(newClient as Client<SupportedContentTypes>);
         } catch (err) {
-          clearClientKeys(address as `0x${string}`);
+          encryptedStorage.clearClientKeys(address as `0x${string}`);
         } finally {
           setLoading(false);
         }

src/screens/AccountSettingsScreen.tsx

@@ -32,7 +32,7 @@ import {useClientContext} from '../context/ClientContext';
 import {useTypedNavigation} from '../hooks/useTypedNavigation';
 import {translate} from '../i18n';
 import {ScreenNames} from '../navigation/ScreenNames';
-import {clearClientKeys} from '../services/encryptedStorage';
+import {encryptedStorage} from '../services/encryptedStorage';
 import {mmkvStorage} from '../services/mmkvStorage';
 import {colors, greens, reds} from '../theme/colors';
 import {formatAddress} from '../utils/formatAddress';
@@ -204,7 +204,7 @@ export const AccountSettingsScreen = () => {
               if (!address) {
                 return;
               }
-              await clearClientKeys(address as `0x${string}`);
+              await encryptedStorage.clearClientKeys(address as `0x${string}`);
               setClient(null);
               disconnect()
                 .then(() => {})

src/screens/OnboardingEnableIdentityScreen.tsx

@@ -12,7 +12,7 @@ import {useClientContext} from '../context/ClientContext';
 import {useTypedNavigation} from '../hooks/useTypedNavigation';
 import {translate} from '../i18n';
 import {ScreenNames} from '../navigation/ScreenNames';
-import {saveClientKeys} from '../services/encryptedStorage';
+import {encryptedStorage} from '../services/encryptedStorage';
 import {PushNotificatons} from '../services/pushNotifications';
 import {colors} from '../theme/colors';
 import {createClientOptions} from '../utils/clientOptions';
@@ -72,7 +72,7 @@ export const OnboardingEnableIdentityScreen = () => {
         }
         const keys = await client.exportKeyBundle();
         const address = client.address;
-        saveClientKeys(address as `0x${string}`, keys);
+        encryptedStorage.saveClientKeys(address as `0x${string}`, keys);
         setClient(client);
       } catch (e: any) {
         console.log('Error creating client', e);

src/services/encryptedStorage.ts

@@ -1,20 +1,31 @@
-import EncryptedStorage from 'react-native-encrypted-storage';
+import RNEncryptedStorage from 'react-native-encrypted-storage';
 
-enum StorageKeys {
+enum EncryptedStorageKeys {
   clientKeys = 'CLIENT_KEYS',
 }
 
-export const saveClientKeys = (address: `0x${string}`, clientKeys: string) => {
-  return EncryptedStorage.setItem(
-    `${StorageKeys.clientKeys}_${address}`,
-    clientKeys,
-  );
-};
+class EncryptedStorage {
+  //#region Client Keys
+  private getClientKeysKey = (address: string) => {
+    return `${EncryptedStorageKeys.clientKeys}_${address}`;
+  };
 
-export const getClientKeys = (address: `0x${string}`) => {
-  return EncryptedStorage.getItem(`${StorageKeys.clientKeys}_${address}`);
-};
+  saveClientKeys = (address: string, clientKeys: string) => {
+    return RNEncryptedStorage.setItem(
+      this.getClientKeysKey(address),
+      clientKeys,
+    );
+  };
 
-export const clearClientKeys = (address: `0x${string}`) => {
-  return EncryptedStorage.removeItem(`${StorageKeys.clientKeys}_${address}`);
-};
+  getClientKeys = (address: string) => {
+    return RNEncryptedStorage.getItem(this.getClientKeysKey(address));
+  };
+
+  clearClientKeys = (address: string) => {
+    return RNEncryptedStorage.removeItem(this.getClientKeysKey(address));
+  };
+
+  //#endregion Client Keys
+}
+
+export const encryptedStorage = new EncryptedStorage();