some improvements and add more tests

iamraphson · Jan 4, 2024 · cd14707 · cd14707
1 parent db73925
commit cd14707
Show file tree

Hide file tree

Showing 5 changed files with 89 additions and 10 deletions.
diff --git a/dist/types.d.ts b/dist/types.d.ts
@@ -1,5 +1,5 @@
 export type Currency = 'NGN' | 'GHS' | 'USD' | 'ZAR' | 'KES' | 'XOF';
-type PaymentChannels = 'bank' | 'card' | 'qr' | 'ussd' | 'mobile_money' | 'eft' | 'bank_transfer' | 'payattitude';
+export type PaymentChannels = 'bank' | 'card' | 'qr' | 'ussd' | 'mobile_money' | 'eft' | 'bank_transfer' | 'payattitude';
 type Bearer = 'account' | 'subaccount';
 type phone = number | string;
 interface PaystackCustomFields {
@@ -23,8 +23,8 @@ export interface PaystackProps {
     phone?: phone;
     reference?: string;
     metadata?: PaystackMetadata;
-    currency?: Currency;
-    channels?: PaymentChannels[];
+    currency?: Currency | string;
+    channels?: PaymentChannels[] | string[];
     label?: string;
     plan?: string;
     quantity?: number;

diff --git a/example/package.json b/example/package.json
@@ -11,7 +11,7 @@
     "react-scripts": "^5.0.1"
   },
   "scripts": {
-    "start": "react-scripts --openssl-legacy-provider start",
+    "start": "DISABLE_ESLINT_PLUGIN=true react-scripts --openssl-legacy-provider start",
     "build": "react-scripts --openssl-legacy-provider build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"

diff --git a/example/src/App.js b/example/src/App.js
@@ -32,7 +32,7 @@ const onSuccess = (reference) => {
 };
 
 const onClose = () => {
-  // implementation for  whatever you want to do when the Paystack dialog closed.
+  // implementation for whatever you want to do when the Paystack dialog closed.
   console.log('closed');
 };
 
@@ -51,6 +51,21 @@ const PaystackHookExample = () => {
   );
 };
 
+const PaystackHookSplitParameterExample = () => {
+    const initializePayment = usePaystackPayment(config);
+    return (
+        <div>
+            <button
+                onClick={() => {
+                    initializePayment({config: {currency: 'NGN'}, onSuccess, onClose});
+                }}
+            >
+                Paystack Hooks with split parameter Implementation
+            </button>
+        </div>
+    );
+};
+
 function App() {
   const componentProps = {
     ...config,
@@ -76,6 +91,7 @@ function App() {
         </a>
       </header>
       <PaystackHookExample />
+      <PaystackHookSplitParameterExample />
       <PaystackButton {...componentProps} />
       <PaystackConsumer {...componentProps}>
         {({initializePayment}) => {

diff --git a/libs/test/use-paystack.test.tsx b/libs/test/use-paystack.test.tsx
@@ -6,8 +6,11 @@ import usePaystackPayment from '../use-paystack';
 import {callPaystackPop} from '../paystack-actions';
 import usePaystackScript from '../paystack-script';
 import {config} from './fixtures';
+import {Currency, PaymentChannels} from '../types';
 
 jest.mock('../paystack-actions');
+const onSuccess = jest.fn();
+const onClose = jest.fn();
 
 describe('usePaystackPayment()', () => {
   beforeEach(() => {
@@ -25,8 +28,6 @@ describe('usePaystackPayment()', () => {
     const {result, rerender} = renderHook(() => usePaystackPayment(config));
     rerender();
 
-    const onSuccess = jest.fn();
-    const onClose = jest.fn();
     act(() => {
       result.current({onSuccess, onClose});
     });
@@ -95,6 +96,68 @@ describe('usePaystackPayment()', () => {
     expect(callPaystackPop).toHaveBeenCalledTimes(1);
   });
 
+  it('should usePaystackPayment accept parameter parameters', () => {
+    const currency: Currency = 'GHS';
+    const channels: PaymentChannels[] = ['mobile_money', 'ussd'];
+    const moreConfig = {
+      amount: config.amount,
+      email: config.email,
+      metadata: {
+        custom_fields: [
+          {
+            display_name: 'Mobile Number',
+            variable_name: 'mobile_number',
+            value: '2348012345678',
+          },
+        ],
+        cart_id: 398,
+      },
+      currency,
+      channels,
+      plan: '1',
+      subaccount: 'ACCT_olodo',
+      'data-custom-button': 'savage',
+      quantity: 2,
+      split_code: 'SPL_ehshjerjh1232343',
+      firstname: '404',
+      lastname: 'err',
+      phone: '080456789012',
+      split: {
+        type: 'percentage',
+        bearer_type: 'all-proportional',
+        subaccounts: [
+          {
+            subaccount: 'ACCT_hhs519xgrbocdtr',
+            share: 30,
+          },
+          {
+            subaccount: 'ACCT_fpzizqxofyshxs5',
+            share: 20,
+          },
+        ],
+      },
+    };
+
+    const {result, rerender} = renderHook(() =>
+      usePaystackPayment({
+        ...config,
+      }),
+    );
+
+    rerender();
+    act(() => {
+      result.current({
+        config: moreConfig,
+        onSuccess,
+        onClose,
+      });
+    });
+
+    expect(onSuccess).toHaveBeenCalledTimes(0);
+    expect(onClose).toHaveBeenCalledTimes(0);
+    expect(callPaystackPop).toHaveBeenCalledTimes(1);
+  });
+
   it('should be accept trigger from other component', () => {
     const {result, rerender} = renderHook(() => usePaystackPayment(config));
     rerender();

diff --git a/libs/types.ts b/libs/types.ts
@@ -1,6 +1,6 @@
 export type Currency = 'NGN' | 'GHS' | 'USD' | 'ZAR' | 'KES' | 'XOF';
 
-type PaymentChannels =
+export type PaymentChannels =
   | 'bank'
   | 'card'
   | 'qr'
@@ -39,8 +39,8 @@ export interface PaystackProps {
   phone?: phone;
   reference?: string;
   metadata?: PaystackMetadata;
-  currency?: Currency;
-  channels?: PaymentChannels[];
+  currency?: Currency | string;
+  channels?: PaymentChannels[] | string[];
   label?: string;
   plan?: string;
   quantity?: number;