zh-web-sdk 2.1.0 → 2.1.4

package/dist/redux/reducers/ach-deposits.d.ts

@@ -0,0 +1,13 @@
+export interface IAchDepositsState {
+    jwt: string;
+    isAppLoaded: boolean;
+    isAppActive: boolean;
+}
+export interface IAchDepositsAction {
+    type: string;
+    jwt?: string;
+    isAppActive?: boolean;
+    isAppLoaded?: boolean;
+}
+declare const achDepositsReducer: (state: IAchDepositsState | undefined, action: IAchDepositsAction) => IAchDepositsState;
+export default achDepositsReducer;

package/dist/redux/reducers/index.d.ts

@@ -1,5 +1,6 @@
 declare const rootReducer: import("redux").Reducer<import("redux").CombinedState<{
     "crypto-withdrawals": import("./crypto-withdrawals").ICryptoWithdrawalsState;
     onboarding: import("./onboarding").IOnboardingState;
+    "ach-deposits": import("./ach-deposits").IAchDepositsState;
 }>, import("./crypto-withdrawals").ICryptoWithdrawalsAction>;
 export default rootReducer;

package/dist/redux/store/index.d.ts

@@ -1,5 +1,6 @@
 declare const store: import("redux").Store<import("redux").EmptyObject & {
     "crypto-withdrawals": import("../reducers/crypto-withdrawals").ICryptoWithdrawalsState;
     onboarding: import("../reducers/onboarding").IOnboardingState;
+    "ach-deposits": import("../reducers/ach-deposits").IAchDepositsState;
 }, import("../reducers/crypto-withdrawals").ICryptoWithdrawalsAction>;
 export default store;

package/dist/styles.d.ts

@@ -9,6 +9,7 @@ export declare const containerMediaStyles: {
     [id: string]: CSSProperties;
 };
 export declare const appWrapperStyle: CSSProperties;
+export declare const height: CSSProperties;
 export declare const appWrapperHiddenStyle: CSSProperties;
 export declare const modalStyle: CSSProperties;
 export declare const iframeWrapperStyle: CSSProperties;

package/dist/types.d.ts

@@ -42,6 +42,12 @@ export interface IInitializeParameters {
      * perform crypto withdrawals.
      */
     cryptoWithdrawalsJWT?: string;
+    /**
+     * achDepositsJWT is the JWT that you received from
+     * the ZeroHash HTTP API and have specific permissions to
+     * perform ACH Deposits.
+     */
+    achDepositsJWT?: string;
     /**
      * zeroHashAppsURL is the base URL for all our Apps.
      * It defaults to https://web-sdk.zerohash.com/ and will
@@ -94,7 +100,17 @@ export declare enum IncomingMessageType {
      * CryptoWithdrawalsCloseButtonClicked is received when the close button
      * has been clicked in the Crypto Withdrawals app
      */
-    CryptoWithdrawalsCloseButtonClicked = "CRYPTO_WITHDRAWALS_CLOSE_BUTTON_CLICKED"
+    CryptoWithdrawalsCloseButtonClicked = "CRYPTO_WITHDRAWALS_CLOSE_BUTTON_CLICKED",
+    /**
+     * AchDepositsAppLoaded is received when the crypto
+     * withdrawals app has initialized.
+     */
+    AchDepositsAppLoaded = "ACH_DEPOSITS_APP_LOADED",
+    /**
+     * AchDepositsCloseButtonClicked is received when the close button
+     * has been clicked in the ACH Deposits app
+    */
+    AchDepositsCloseButtonClicked = "ACH_DEPOSITS_CLOSE_BUTTON_CLICKED"
 }
 /**
  * IncomingMessage defines the structure of an incoming
@@ -128,7 +144,8 @@ export interface IZeroHashSDK {
  */
 export declare enum AppIdentifier {
     ONBOARDING = "onboarding",
-    CRYPTO_WITHDRAWALS = "crypto-withdrawals"
+    CRYPTO_WITHDRAWALS = "crypto-withdrawals",
+    ACH_DEPOSITS = "ach-deposits"
 }
 /**
 * Map that maps the app AppIdentifier to the redux action prefix

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zh-web-sdk",
-  "version": "2.1.0",
+  "version": "2.1.4",
   "private": false,
   "description": "ZeroHash Web SDK",
   "homepage": "https://github.com/seedcx/zh-web-sdk",

package/src/iframe-container/AppContainer.tsx

@@ -11,9 +11,11 @@ import {
   modalStyle,
   screenSizes,
   appWrapperHiddenStyle,
+  height
 } from "../styles";
 import {
-  MESSAGE_TYPE_SEND_JWT_TOKEN,
+  MESSAGE_TYPE_SEND_JWT_TOKEN_ACH_DEPOSITS,
+  MESSAGE_TYPE_SEND_JWT_TOKEN_ONBOARDING,
   MESSAGE_TYPE_SEND_JWT_TOKEN_WITHDRAWALS,
 } from "./constants";
 import { closeModal } from "../redux/actions";
@@ -38,6 +40,11 @@ interface AppContainerMappedProps {
     isAppLoaded: boolean;
     jwt: string;
   };
+  [AppIdentifier.ACH_DEPOSITS]: {
+    isAppActive: boolean;
+    isAppLoaded: boolean;
+    jwt: string;
+  };
 }
 
 const appLoadTime = Date.now();
@@ -45,6 +52,7 @@ const appLoadTime = Date.now();
 const mapAppToTitle = {
   [AppIdentifier.ONBOARDING]: "Onboarding",
   [AppIdentifier.CRYPTO_WITHDRAWALS]: "Crypto Withdrawals",
+  [AppIdentifier.ACH_DEPOSITS]: "ACH Deposits",
 };
 
 const AppContainer = ({
@@ -93,12 +101,21 @@ const AppContainer = ({
         case AppIdentifier.ONBOARDING:
           iRef.current.contentWindow.postMessage(
             {
-              type: MESSAGE_TYPE_SEND_JWT_TOKEN,
+              type: MESSAGE_TYPE_SEND_JWT_TOKEN_ONBOARDING,
               userOnboardingJWT: jwt,
             },
             zeroHashAppURL
           );
           break;
+          case AppIdentifier.ACH_DEPOSITS:
+            iRef.current.contentWindow.postMessage(
+              {
+                type: MESSAGE_TYPE_SEND_JWT_TOKEN_ACH_DEPOSITS,
+                achDepositsJWT: jwt,
+              },
+              zeroHashAppURL
+            );
+            break;
         default:
           break;
       }
@@ -130,7 +147,10 @@ const AppContainer = ({
   }
   return (
     <div
-      style={isAppActive ? appWrapperStyle : appWrapperHiddenStyle}
+      style={isAppActive ? {
+        ...appWrapperStyle,
+        ...height
+      } : appWrapperHiddenStyle}
       onClick={() => closeModal(appIdentifier)}
     >
       <div

package/src/iframe-container/constants.ts

@@ -3,6 +3,11 @@ import { appIdentifierToActionPrefixMap } from "../types"
 
 const ONBOARDING_MESSAGE_TYPE_PREFIX = appIdentifierToActionPrefixMap.get(AppIdentifier.ONBOARDING)
 const CRYPTO_WITHDRAWALS_MESSAGE_TYPE_PREFIX = appIdentifierToActionPrefixMap.get(AppIdentifier.CRYPTO_WITHDRAWALS)
+const ACH_DEPOSITS_MESSAGE_TYPE_PREFIX = appIdentifierToActionPrefixMap.get(AppIdentifier.ACH_DEPOSITS)
 
-export const MESSAGE_TYPE_SEND_JWT_TOKEN = ONBOARDING_MESSAGE_TYPE_PREFIX + "SEND_JWT_TOKEN"
-export const MESSAGE_TYPE_SEND_JWT_TOKEN_WITHDRAWALS = CRYPTO_WITHDRAWALS_MESSAGE_TYPE_PREFIX + "SEND_JWT_TOKEN"
+const SEND_JWT_TOKEN = "SEND_JWT_TOKEN"
+
+
+export const MESSAGE_TYPE_SEND_JWT_TOKEN_ONBOARDING = ONBOARDING_MESSAGE_TYPE_PREFIX + SEND_JWT_TOKEN
+export const MESSAGE_TYPE_SEND_JWT_TOKEN_WITHDRAWALS = CRYPTO_WITHDRAWALS_MESSAGE_TYPE_PREFIX + SEND_JWT_TOKEN
+export const MESSAGE_TYPE_SEND_JWT_TOKEN_ACH_DEPOSITS = ACH_DEPOSITS_MESSAGE_TYPE_PREFIX + SEND_JWT_TOKEN

package/src/index.tsx

@@ -45,6 +45,13 @@ const appsMessageHandlers: {
   [IncomingMessageType.CryptoWithdrawalsAppLoaded]: () => {
     appLoaded(AppIdentifier.CRYPTO_WITHDRAWALS);
   },
+    // ACH Deposits message handlers
+    [IncomingMessageType.AchDepositsCloseButtonClicked]: () => {
+      closeModal(AppIdentifier.ACH_DEPOSITS);
+    },
+    [IncomingMessageType.AchDepositsAppLoaded]: () => {
+      appLoaded(AppIdentifier.ACH_DEPOSITS);
+    },
 };
 
 /**
@@ -79,6 +86,7 @@ export class ZeroHashSDK implements IZeroHashSDK {
   private initializedApps: Map<AppIdentifier, boolean> = new Map([
     [AppIdentifier.CRYPTO_WITHDRAWALS, false],
     [AppIdentifier.ONBOARDING, false],
+    [AppIdentifier.ACH_DEPOSITS, false],
   ]);
 
   /**
@@ -91,6 +99,7 @@ export class ZeroHashSDK implements IZeroHashSDK {
     rootQuerySelector,
     userOnboardingJWT,
     cryptoWithdrawalsJWT,
+    achDepositsJWT,
     zeroHashAppsURL,
   }: IInitializeParameters) {
     // The || is for backwards compatibility
@@ -116,6 +125,12 @@ export class ZeroHashSDK implements IZeroHashSDK {
         appIdentifier: AppIdentifier.CRYPTO_WITHDRAWALS,
       });
     }
+    if (achDepositsJWT) {
+      this.setJWT({
+        jwt: achDepositsJWT,
+        appIdentifier: AppIdentifier.ACH_DEPOSITS,
+      });
+    }
   }
 
   /**

package/src/redux/reducers/ach-deposits.ts

@@ -0,0 +1,64 @@
+import { AppIdentifier } from "../../types";
+import { appIdentifierToActionPrefixMap } from "../../types";
+import {
+  ACTION_SET_JWT,
+  ACTION_SET_MODAL_STATE,
+  ACTION_APP_LOADED
+} from "./constants";
+
+export interface IAchDepositsState {
+  jwt: string;
+  isAppLoaded: boolean;
+  isAppActive: boolean;
+}
+
+export interface IAchDepositsAction {
+  type: string;
+  jwt?: string;
+  isAppActive?: boolean;
+  isAppLoaded?: boolean;
+}
+
+const INITIAL_STATE: IAchDepositsState = {
+  jwt: "",
+  isAppActive: false,
+  isAppLoaded: false
+}
+
+const applySetIsAppActive = (state: IAchDepositsState, action: IAchDepositsAction) : IAchDepositsState => {
+  return {
+      ...state,
+      isAppActive: !!action.isAppActive,
+  }
+}
+
+const applySetSendJWTToApp = (state: IAchDepositsState, action: IAchDepositsAction) : IAchDepositsState => {
+  return {
+      ...state,
+      isAppLoaded: !!action.isAppLoaded,
+  }
+}
+
+const applySetJWT = (state: IAchDepositsState, action: IAchDepositsAction) : IAchDepositsState => {
+  return {
+      ...state,
+      jwt: action.jwt as string,
+  }
+}
+
+const reducerMap: { [actionType: string]: (state: IAchDepositsState, action: IAchDepositsAction) => IAchDepositsState } = {
+  // ACH Deposits reducer
+  [`${appIdentifierToActionPrefixMap.get(AppIdentifier.ACH_DEPOSITS)}${ACTION_SET_JWT}`]: applySetJWT,
+  [`${appIdentifierToActionPrefixMap.get(AppIdentifier.ACH_DEPOSITS)}${ACTION_SET_MODAL_STATE}`]: applySetIsAppActive,
+  [`${appIdentifierToActionPrefixMap.get(AppIdentifier.ACH_DEPOSITS)}${ACTION_APP_LOADED}`]: applySetSendJWTToApp,
+};
+
+const achDepositsReducer = (state = INITIAL_STATE, action: IAchDepositsAction) => {
+  if (!!action.type && !!reducerMap[action.type]) {
+      return reducerMap[action.type](state, action);
+  } else {
+      return state;
+  }
+}
+
+export default achDepositsReducer;

package/src/redux/reducers/index.ts

@@ -1,10 +1,12 @@
 import {combineReducers} from "redux";
 import cryptoWithdrawalsReducer from './crypto-withdrawals'
 import onboardingReducer from "./onboarding";
+import achDepositsReducer from "./ach-deposits";
 
 const rootReducer = combineReducers({
     ["crypto-withdrawals"]: cryptoWithdrawalsReducer,
     ["onboarding"]: onboardingReducer,
+    ["ach-deposits"]: achDepositsReducer,
 });
 
 export default rootReducer;

package/src/styles.ts

@@ -1,4 +1,4 @@
-import {CSSProperties} from "react";
+import { CSSProperties } from "react";
 
 const MTE_SM = 540;
 
@@ -11,7 +11,7 @@ export const screenSizes: { id: string, size: number }[] = [
 
 export const minWidthMatcher = (): string => {
     for (let i = 0; i < screenSizes.length; i++) {
-        const {id, size} = screenSizes[i];
+        const { id, size } = screenSizes[i];
         if (window.matchMedia(`(min-width: ${size}px`).matches) {
             return id
         }
@@ -53,6 +53,10 @@ export const appWrapperStyle: CSSProperties = {
     cursor: "pointer",
 }
 
+export const height: CSSProperties = {
+    height: "100dvh",
+}
+
 export const appWrapperHiddenStyle: CSSProperties = {
     display: "none",
     width: 0,
@@ -82,4 +86,4 @@ export const iframeStyle: CSSProperties = {
     padding: 0,
     overflow: "hidden",
     borderRadius: "0 0 15px 15px"
-};
+};

package/src/types.ts

@@ -44,6 +44,12 @@ export interface IInitializeParameters {
      * perform crypto withdrawals.
      */
     cryptoWithdrawalsJWT?: string
+    /**
+     * achDepositsJWT is the JWT that you received from
+     * the ZeroHash HTTP API and have specific permissions to
+     * perform ACH Deposits.
+     */
+    achDepositsJWT?: string
     /**
      * zeroHashAppsURL is the base URL for all our Apps.
      * It defaults to https://web-sdk.zerohash.com/ and will
@@ -100,6 +106,16 @@ export enum IncomingMessageType {
      * has been clicked in the Crypto Withdrawals app
      */
     CryptoWithdrawalsCloseButtonClicked = "CRYPTO_WITHDRAWALS_CLOSE_BUTTON_CLICKED",
+    /**
+     * AchDepositsAppLoaded is received when the crypto
+     * withdrawals app has initialized.
+     */
+    AchDepositsAppLoaded = "ACH_DEPOSITS_APP_LOADED",
+    /**
+     * AchDepositsCloseButtonClicked is received when the close button
+     * has been clicked in the ACH Deposits app
+    */
+    AchDepositsCloseButtonClicked = "ACH_DEPOSITS_CLOSE_BUTTON_CLICKED",
 }
 
 /**
@@ -138,6 +154,7 @@ export interface IZeroHashSDK {
 export enum AppIdentifier {
     ONBOARDING = "onboarding",
     CRYPTO_WITHDRAWALS = "crypto-withdrawals",
+    ACH_DEPOSITS = "ach-deposits",
 }
 
 /**
@@ -146,7 +163,8 @@ export enum AppIdentifier {
 export const appIdentifierToActionPrefixMap = new Map(
     [
       [AppIdentifier.ONBOARDING, "ONBOARDING_"],
-      [AppIdentifier.CRYPTO_WITHDRAWALS, "CRYPTO_WITHDRAWALS_"]
+      [AppIdentifier.CRYPTO_WITHDRAWALS, "CRYPTO_WITHDRAWALS_"],
+      [AppIdentifier.ACH_DEPOSITS, "ACH_DEPOSITS_"],
     ])
 
 export interface ISetJWTParameters {