Merge pull request #27 from DIMO-Network/moiz/data-cleanup

more scalable components

example-dimo-auth/src/App.tsx

@@ -11,7 +11,8 @@ import {
 
 function App() {
   const [permissionsEnabled, setPermissionsEnabled] = useState(false);
-  const { isAuthenticated, getValidJWT } = useDimoAuthState();
+  const { isAuthenticated, getValidJWT, email, getEmail, walletAddress } =
+    useDimoAuthState();
 
   const sampleAbi = [
     {
@@ -1120,6 +1121,14 @@ function App() {
           </label>
         </div>
 
+        {isAuthenticated && (
+          <div>
+            <p>Connected User</p>
+            <p>Wallet Address:{walletAddress}</p>
+            {email && <p>{email}</p>}
+          </div>
+        )}
+
         <div>
           <h3>Popup Example</h3>
 

sdk/src/auth/context/DimoAuthContext.tsx

@@ -1,12 +1,15 @@
 // DimoAuthContext.tsx
 import React, { createContext, useContext, useEffect, useState } from "react";
-import { getJWTFromCookies } from "../../storage/storageManager";
+import { getEmailFromLocalStorage, getJWTFromCookies, getWalletAddressFromLocalStorage } from "../../storage/storageManager";
 import { isTokenExpired } from "../../token/tokenManager";
 
 // Define the type of the context
 type DimoAuthContextType = {
   isAuthenticated: boolean; // Read-only for app developers
+  walletAddress: string | null;
+  email: string | null;
   getValidJWT: () => string | null;
+  getEmail: () => string | null;
 };
 
 // Create the context
@@ -29,6 +32,18 @@ export const DimoAuthProvider = ({
   children: React.ReactNode;
 }) => {
   const [isAuthenticated, setAuthenticated] = useState(false);
+
+  const hasEmailPermission = !!getEmailFromLocalStorage();
+  const email = hasEmailPermission ? getEmailFromLocalStorage() : "";
+  const walletAddress = getWalletAddressFromLocalStorage();
+
+  const getEmail = () => {
+    if (hasEmailPermission) {
+      return email;
+    } else {
+      throw new Error("No permission to access email");
+    }
+  };    
 
 
   const getValidJWT = () => {
@@ -47,7 +62,7 @@ export const DimoAuthProvider = ({
   }, []);
 
   return (
-    <DimoAuthContext.Provider value={{ isAuthenticated, getValidJWT }}>
+    <DimoAuthContext.Provider value={{ isAuthenticated, getValidJWT, email, getEmail, walletAddress }}>
       <DimoAuthUpdaterContext.Provider value={{ setAuthenticated }}>
         {children}
       </DimoAuthUpdaterContext.Provider>

sdk/src/auth/embedAuth.ts

@@ -1,37 +1,11 @@
 import { EntryState } from "../enums/globalEnums";
+import { BasePayload } from "../types/BasePayload";
 import { TransactionData } from "../types/TransactionData";
 import { handleMessageForEmbed } from "../utils/eventHandler";
 
 export const embedAuth = (
-  entryState: EntryState,
-  onSuccess: (data: {
-    token: string;
-    transactionHash?: string;
-    transactionReceipt?: any;
-  }) => void,
-  onError: (error: Error) => void,
-  setAuthenticated: React.Dispatch<React.SetStateAction<boolean>>,
-  dimoLogin: string,
-  clientId?: string,
-  redirectUri?: string,
-  apiKey?: string,
-  permissionTemplateId?: string,
-  vehicles?: string[],
-  vehicleMakes?: string[],
-  transactionData?: TransactionData
+  basePayload: BasePayload,
+  data?: Record<string, any>
 ) => {
-  const cleanup = handleMessageForEmbed(
-    dimoLogin,
-    entryState,
-    onSuccess,
-    onError,
-    setAuthenticated,
-    clientId,
-    redirectUri,
-    apiKey,
-    permissionTemplateId,
-    vehicles,
-    vehicleMakes,
-    transactionData
-  );
+  const cleanup = handleMessageForEmbed(basePayload, data);
 };

sdk/src/auth/popupAuth.ts

@@ -1,26 +1,14 @@
 import { EntryState } from "../enums/globalEnums";
+import { BasePayload } from "../types/BasePayload";
 import { TransactionData } from "../types/TransactionData";
 import { handleMessageForPopup } from "../utils/eventHandler";
 
 export const popupAuth = (
-  entryState: EntryState,
-  onSuccess: (data: {
-    token: string;
-    transactionHash?: string;
-    transactionReceipt?: any;
-  }) => void,
-  onError: (error: Error) => void,
-  setAuthenticated: React.Dispatch<React.SetStateAction<boolean>>,
-  dimoLogin: string,
-  clientId?: string,
-  redirectUri?: string,
-  apiKey?: string,
-  permissionTemplateId?: string,
-  vehicles?: string[],
-  vehicleMakes?: string[],
-  transactionData?: TransactionData
+  basePayload: BasePayload,
+  data?: Record<string, any> // Component-specific data
 ) => {
   try {
+    const { entryState, onSuccess, onError, setAuthenticated, dimoLogin } = basePayload;
     const popup = window.open(
       dimoLogin,
       "_blank",
@@ -32,26 +20,12 @@ export const popupAuth = (
     }
 
     // Set up message handler for popup auth
-    const cleanup = handleMessageForPopup(
-      dimoLogin,
-      entryState,
-      onSuccess,
-      onError,
-      setAuthenticated,
-      popup,
-      clientId,
-      redirectUri,
-      apiKey,
-      permissionTemplateId,
-      vehicles,
-      vehicleMakes,
-      transactionData
-    );
+    const cleanup = handleMessageForPopup(basePayload, data, dimoLogin, popup);
   } catch (error: unknown) {
     if (error instanceof Error) {
-      onError(error);
+      basePayload.onError(error);
     } else {
-      onError(new Error("An unknown error occurred"));
+      basePayload.onError(new Error("An unknown error occurred"));
     }
   }
 };