@weareconceptstudio/account 0.3.4 → 0.3.6

package/dist/modules/payment/SelectPaymentMethodPopup/index.js

@@ -17,7 +17,7 @@ const SelectPaymentMethodPopup = () => {
     return (React.createElement(SelectPaymentMethodPopupStyle, null,
         React.createElement("div", { className: `select-payment-wrap` },
             React.createElement(Text, { tag: `h6`, className: 'account-p account-p2 account-font-bold account-primary-color1', text: 'selectPaymentMethod' })),
-        React.createElement(PaymentWrap, { selectedPayment: selectedPayment, setSelectedPayment: setSelectedPayment }),
+        React.createElement(PaymentWrap, { selectedPayment: selectedPayment, setSelectedPayment: setSelectedPayment, isCheckout: true }),
         React.createElement("div", { className: `cancel-and-save-wrap` },
             React.createElement(AccountButton, { btnType: `green-large-text`, text: `cancel`, onClick: closePopup }),
             React.createElement(AccountButton, { btnType: `full-width`, text: `saveAndApply`, onClick: handlePaymentMethodChangeSubmit }))));

package/dist/modules/payment/SelectedPayment/index.d.ts

@@ -0,0 +1,3 @@
+export default SelectedPayment;
+declare function SelectedPayment(): React.JSX.Element;
+import React from 'react';

package/dist/modules/payment/SelectedPayment/index.js

@@ -0,0 +1,45 @@
+import React, { useMemo } from 'react';
+import PaymentMethodItem from '../PaymentMethodItem';
+import { useAccountContext } from '../../../AccountProvider';
+import { useCheckoutContext } from '../../checkout';
+const isNumeric = (value) => !isNaN(value) && !isNaN(parseFloat(value));
+// if (cardDetails && !showAll) {
+//     filteredOptions = filteredOptions.map((option) =>
+//         option.value === 'credit_card'
+//             ? {
+//                     ...option,
+//                     label: <span className='card-type'>{cardDetails.card_type}</span>,
+//                 }
+//             : option
+//     );
+// }
+// const cardDetails = isNumeric(checkoutData.paymentType)
+// 	? {
+// 			card_type: 'MasterCard', // Or 'Visa', based on your logic
+// 			number: '**** **** **** 1234',
+// 			expDate: '12/24',
+// 		}
+// 	: null;
+const SelectedPayment = () => {
+    const { paymentOptions, useUser } = useAccountContext();
+    const { checkoutData } = useCheckoutContext();
+    const { user } = useUser();
+    const isCardType = useMemo(() => {
+        return isNumeric(checkoutData.paymentType);
+    }, [checkoutData.paymentType]);
+    const selectedItem = useMemo(() => {
+        if (isCardType) {
+            const selectedCard = user.cards.find((item) => item.id == checkoutData.paymentType);
+            return {
+                label: selectedCard.name,
+                value: selectedCard.brand,
+                card: selectedCard,
+            };
+        }
+        else {
+            return paymentOptions.find((item) => item.value == checkoutData.paymentType);
+        }
+    }, [isCardType, checkoutData.paymentType]);
+    return (React.createElement(PaymentMethodItem, { singlePayment: true, isCardType: isCardType, item: selectedItem }));
+};
+export default SelectedPayment;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@weareconceptstudio/account",
-	"version": "0.3.4",
+	"version": "0.3.6",
 	"description": "Concept Studio Account",
 	"author": "Concept Studio",
 	"license": "ISC",

package/dist/components/TotalCheckout/MuramoneyComp/index.d.ts

@@ -1,10 +0,0 @@
-export default MuramoneyComp;
-declare function MuramoneyComp({ isMuramoney, currency, balance, useBalance, balanceHandler, getItemCount }: {
-    isMuramoney?: boolean;
-    currency: any;
-    balance: any;
-    useBalance: any;
-    balanceHandler: any;
-    getItemCount: any;
-}): React.JSX.Element;
-import React from 'react';

package/dist/components/TotalCheckout/MuramoneyComp/style.d.ts

@@ -1,2 +0,0 @@
-export default MuramoneyCompStyle;
-declare const MuramoneyCompStyle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/modules/payment/CardComp/style.d.ts

@@ -1,2 +0,0 @@
-export default CardCompStyle;
-declare const CardCompStyle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/dist/modules/payment/PaymentComp/index.js

@@ -1,17 +0,0 @@
-import React from 'react';
-import { Text } from '@weareconceptstudio/core';
-import { useCheckoutContext } from '../../checkout';
-//* Components
-import AccountButton from '../../../components/AccountButton';
-import PaymentMethodsComp from '../PaymentMethodsComp';
-//* Style
-import PaymentCompStyle from './style';
-const PaymentComp = ({ title, onClick, className }) => {
-    const { checkoutData, fillCheckoutData } = useCheckoutContext();
-    return (React.createElement(PaymentCompStyle, { className: `item-container ${className || ''}` },
-        React.createElement("div", { className: `change-payment-wrap` },
-            React.createElement(Text, { className: `account-p account-p2 account-font-bold account-primary-color1`, text: title }),
-            checkoutData.paymentType && (React.createElement(AccountButton, { text: `change`, btnType: `green-small-text`, onClick: onClick }))),
-        React.createElement(PaymentMethodsComp, { showAll: false, selectedPayment: checkoutData.paymentType, setSelectedPayment: (value) => fillCheckoutData('paymentType', value) })));
-};
-export default PaymentComp;

package/dist/modules/payment/PaymentMethodsComp/index.d.ts

@@ -1,8 +0,0 @@
-export default PaymentMethodsComp;
-declare function PaymentMethodsComp({ className, showAll, selectedPayment, setSelectedPayment }: {
-    className: any;
-    showAll: any;
-    selectedPayment: any;
-    setSelectedPayment: any;
-}): React.JSX.Element;
-import React from 'react';

package/dist/modules/payment/PaymentMethodsComp/index.js

@@ -1,86 +0,0 @@
-import React from 'react';
-import { Text } from '@weareconceptstudio/core';
-import { cardSVG, idramSVG, telcellSVG, cashSVG, posTerminalSVG, inecopaySVG } from './icons';
-import { useCheckoutContext } from '../../checkout';
-//* Style
-import PaymentMethodsCompStyle from './style';
-const isNumeric = (value) => !isNaN(value) && !isNaN(parseFloat(value));
-const PaymentMethodsComp = ({ className, showAll, selectedPayment, setSelectedPayment }) => {
-    let paymentOptions = [
-        {
-            label: 'Cash',
-            value: 'cash_on_delivery',
-            svg: cashSVG,
-        },
-        {
-            label: 'Idram',
-            value: 'idram',
-            svg: idramSVG,
-        },
-        {
-            label: 'POS TERMINAL',
-            value: 'pos_terminal',
-            svg: posTerminalSVG,
-        },
-        {
-            label: 'Telcell',
-            value: 'telcell',
-            svg: telcellSVG,
-        },
-        {
-            label: 'Inecopay',
-            value: 'inecopay',
-            svg: inecopaySVG,
-        },
-    ];
-    if (!showAll) {
-        paymentOptions = [
-            {
-                label: 'Card',
-                value: 'credit_card',
-                svg: cardSVG,
-            },
-            ...paymentOptions,
-        ];
-    }
-    const { checkoutData } = useCheckoutContext();
-    const cardDetails = isNumeric(checkoutData.paymentType)
-        ? {
-            card_type: 'MasterCard', // Or 'Visa', based on your logic
-            number: '**** **** **** 1234',
-            expDate: '12/24',
-        }
-        : null;
-    let filteredOptions;
-    if (showAll) {
-        filteredOptions = paymentOptions;
-    }
-    else if (checkoutData.paymentType) {
-        filteredOptions = paymentOptions.filter((option) => option.value === (isNumeric(checkoutData.paymentType) ? 'credit_card' : checkoutData.paymentType));
-    }
-    else {
-        filteredOptions = paymentOptions;
-    }
-    if (cardDetails && !showAll) {
-        filteredOptions = filteredOptions.map((option) => option.value === 'credit_card'
-            ? {
-                ...option,
-                label: React.createElement("span", { className: 'card-type' }, cardDetails.card_type),
-            }
-            : option);
-    }
-    return (React.createElement(PaymentMethodsCompStyle, { className: `payment-item-container ${className || ''}`, "$singlePayment": !!checkoutData.paymentType }, filteredOptions.map((option, index) => (React.createElement("div", { className: 'custom-payment-options', key: index },
-        React.createElement("div", { className: 'payment-option-top' },
-            React.createElement("div", { className: 'payment-item-left' },
-                React.createElement("div", null, option.svg),
-                React.createElement(Text, { className: 'payment-label account-p account-p3 account-font-regular account-primary-color1' }, option.label)),
-            React.createElement("div", { key: option.value, className: `circle-selected-wrap cursor-pointer ${selectedPayment === option.value || (option.value == 'credit_card' && isNumeric(selectedPayment)) ? 'active' : ''}`, onClick: () => showAll && setSelectedPayment(option.value) },
-                React.createElement("svg", { version: '1.1', viewBox: '0 0 32 32', xmlns: 'http://www.w3.org/2000/svg', className: `checkbox-icon ${selectedPayment === option.value ? 'selected' : 'note-selected'}` },
-                    React.createElement("path", { d: 'M13.345 30.462c-1.062 0-1.859-0.531-2.39-1.328l-9.56-16.996c-0.797-1.328-0.266-2.921 1.062-3.718 1.328-0.531 2.921 0 3.718 1.328l7.436 13.012 12.481-20.183c0.797-1.328 2.39-1.593 3.718-0.797s1.593 2.39 0.797 3.718l-14.871 23.635c-0.531 0.797-1.328 1.328-2.39 1.328z' })))),
-        option.value === 'credit_card' && cardDetails && !showAll && (React.createElement("div", { className: 'card-details' },
-            React.createElement("span", { className: 'card-number' }, cardDetails.number),
-            React.createElement("span", { className: 'card-exp-date' },
-                "Exp. Date ",
-                cardDetails.expDate))))))));
-};
-export default PaymentMethodsComp;

package/dist/modules/payment/PaymentMethodsComp/style.d.ts

@@ -1,2 +0,0 @@
-export default PaymentMethodsCompStyle;
-declare const PaymentMethodsCompStyle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;