tek-wallet 0.0.603 → 0.0.605

package/dist/components/TekWallet/components/ui/ConfirmLayout/index.d.ts

@@ -2,6 +2,10 @@ import { DrawerComponentProps, DrawerComponentRef } from "../DrawerComponent";
 import { TransactionSlug } from "../../../services/axios/get-activities-service/type";
 export interface ConfirmLayoutProps extends DrawerComponentProps {
     action: TransactionSlug;
+    title?: string;
+    transferAmount?: number;
+    link?: string;
+    currency?: string;
 }
 declare const ConfirmLayout: import("react").ForwardRefExoticComponent<Omit<ConfirmLayoutProps, "ref"> & import("react").RefAttributes<DrawerComponentRef>>;
 export default ConfirmLayout;

package/dist/components/TekWallet/components/ui/ConfirmLayout/index.js

@@ -11,6 +11,39 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -27,13 +60,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
-var Text_1 = __importDefault(require("../Text"));
 var material_1 = require("@mui/material");
+var DrawerComponent_1 = __importStar(require("../DrawerComponent"));
+var react_1 = require("react");
+var Text_1 = __importDefault(require("../Text"));
+var Formatter_1 = __importDefault(require("../Formatter"));
 var Icon_1 = __importDefault(require("../Icon"));
+var ChildPageLayout_1 = __importDefault(require("../../../layouts/ChildPageLayout"));
+var PageHeader_1 = __importDefault(require("../PageHeader"));
 var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
-var ModalLayout_1 = __importDefault(require("../ModalLayout"));
-var DrawerComponent_1 = __importDefault(require("../DrawerComponent"));
-var react_1 = require("react");
 var ConfirmLayout = (0, react_1.forwardRef)(function (props, ref) {
     var children = props.children, rest = __rest(props, ["children"]);
     var theme = (0, material_1.useTheme)();
@@ -60,7 +95,15 @@ var ConfirmLayout = (0, react_1.forwardRef)(function (props, ref) {
             (_a = confirmByPasscodeDrawerRef.current) === null || _a === void 0 ? void 0 : _a.unlockStatus();
         },
     }); });
-    return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, __assign({ ref: confirmByPasscodeDrawerRef }, rest, { children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { onClose: handleOnClose, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { alignItems: "center", gap: theme.mixins.gaps.g16 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { alignItems: "center", gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 64, sx: {}, src: (0, getIcon_1.default)("wallet_logo") }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionDescription), children: "Confirm action" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.sessionTitle), { textTransform: "capitalize" }), children: props.action })] }), children] }) }) })));
+    return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, __assign({ direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, ref: confirmByPasscodeDrawerRef }, rest, { children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { header: (0, jsx_runtime_1.jsx)(PageHeader_1.default, { title: "Transfer Summary", overrideBack: handleOnClose, rightAdornment: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("clock"), width: 20, height: 20, className: "absolute right-2" }) }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { alignItems: "center", gap: theme.mixins.gaps.g16, padding: theme.mixins.customPadding.p16 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { alignItems: "center", marginTop: theme.mixins.customMargin.m16, marginBottom: theme.mixins.customMargin.m12, gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.sessionDescription), { textTransform: "capitalize" }), children: props.title }), (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: props.transferAmount, sx: {
+                                    color: theme.palette.text.mainGreen,
+                                    fontSize: theme.typography.fontSize24,
+                                    fontWeight: theme.typography.fontWeight600,
+                                } }), (0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", alignItems: "center", gap: 0.5, children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: props.link, width: 16, height: 16 }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                            fontWeight: theme.typography.fontWeight500,
+                                            fontSize: theme.typography.fontSize15,
+                                            color: theme.palette.text.accent2,
+                                        }, children: props.currency })] })] }), children] }) }) })));
 });
 ConfirmLayout.displayName = "ConfirmLayout";
 exports.default = ConfirmLayout;

package/dist/components/TekWallet/components/ui/ConfirmLayout copy/index.d.ts

@@ -0,0 +1,7 @@
+import { DrawerComponentProps, DrawerComponentRef } from "../DrawerComponent";
+import { TransactionSlug } from "../../../services/axios/get-activities-service/type";
+export interface ConfirmLayoutProps extends DrawerComponentProps {
+    action: TransactionSlug;
+}
+declare const ConfirmLayout: import("react").ForwardRefExoticComponent<Omit<ConfirmLayoutProps, "ref"> & import("react").RefAttributes<DrawerComponentRef>>;
+export default ConfirmLayout;

package/dist/components/TekWallet/components/ui/ConfirmLayout copy/index.js

@@ -0,0 +1,66 @@
+"use strict";
+"use client";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var Text_1 = __importDefault(require("../Text"));
+var material_1 = require("@mui/material");
+var Icon_1 = __importDefault(require("../Icon"));
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
+var ModalLayout_1 = __importDefault(require("../ModalLayout"));
+var DrawerComponent_1 = __importDefault(require("../DrawerComponent"));
+var react_1 = require("react");
+var ConfirmLayout = (0, react_1.forwardRef)(function (props, ref) {
+    var children = props.children, rest = __rest(props, ["children"]);
+    var theme = (0, material_1.useTheme)();
+    var confirmByPasscodeDrawerRef = (0, react_1.useRef)(null);
+    var handleOnClose = function () {
+        var _a;
+        (_a = confirmByPasscodeDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
+    };
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        open: function () {
+            var _a;
+            (_a = confirmByPasscodeDrawerRef.current) === null || _a === void 0 ? void 0 : _a.open();
+        },
+        close: function () {
+            var _a;
+            (_a = confirmByPasscodeDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
+        },
+        lockStatus: function () {
+            var _a;
+            (_a = confirmByPasscodeDrawerRef.current) === null || _a === void 0 ? void 0 : _a.lockStatus();
+        },
+        unlockStatus: function () {
+            var _a;
+            (_a = confirmByPasscodeDrawerRef.current) === null || _a === void 0 ? void 0 : _a.unlockStatus();
+        },
+    }); });
+    return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, __assign({ ref: confirmByPasscodeDrawerRef }, rest, { children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { onClose: handleOnClose, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { alignItems: "center", gap: theme.mixins.gaps.g16 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { alignItems: "center", gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { width: 64, sx: {}, src: (0, getIcon_1.default)("wallet_logo") }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.sessionDescription), children: "Confirm action" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.sessionTitle), { textTransform: "capitalize" }), children: props.action })] }), children] }) }) })));
+});
+ConfirmLayout.displayName = "ConfirmLayout";
+exports.default = ConfirmLayout;

package/dist/components/TekWallet/components/ui/Fees/index.d.ts

@@ -3,7 +3,7 @@ export interface FeesProps extends Omit<AccordionProps, "children"> {
     feesData: string;
     amount: number;
     isFeePaidByAmount?: boolean;
-    onEnoughBalanceToPayFee?: () => void;
+    onEnoughBalanceToPayFee?: (isEnough: boolean) => void;
     onNotEnoughBalanceToPayFee?: () => void;
     tokenSlug: string;
 }

package/dist/components/TekWallet/components/ui/Fees/index.js

@@ -28,7 +28,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
 var Icon_1 = __importDefault(require("../Icon"));
-var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
 var Text_1 = __importDefault(require("../Text"));
 var Formatter_1 = __importDefault(require("../Formatter"));
 var jsx_runtime_2 = require("react/jsx-runtime");
@@ -36,6 +35,7 @@ var parsePropsData_1 = __importDefault(require("../../../utils/parsePropsData"))
 var useWalletData_1 = __importDefault(require("../../../hooks/useWalletData"));
 var react_1 = require("react");
 var ReceiveFunction_1 = __importDefault(require("../ReceiveFunction"));
+var getIcon_1 = __importDefault(require("../../../utils/getIcon"));
 function Fees(props) {
     var sx = props.sx, amount = props.amount, feesDataString = props.feesData, isFeePaidByAmount = props.isFeePaidByAmount, tokenSlug = props.tokenSlug, rest = __rest(props, ["sx", "amount", "feesData", "isFeePaidByAmount", "tokenSlug"]);
     var theme = (0, material_1.useTheme)();
@@ -50,8 +50,12 @@ function Fees(props) {
         return +((_a = tokenMustBePaidFee === null || tokenMustBePaidFee === void 0 ? void 0 : tokenMustBePaidFee.current_value) !== null && _a !== void 0 ? _a : 0);
     }, [isFeePaidByAmount, amount, tokenSlug, tokens]);
     var feeCheckedBalance = (0, react_1.useMemo)(function () {
-        var _a, _b;
-        return ((_b = (_a = feesData === null || feesData === void 0 ? void 0 : feesData.feeDetail) === null || _a === void 0 ? void 0 : _a.map(function (fee, index, array) {
+        var _a, _b, _c;
+        var feeDetail = (_a = feesData === null || feesData === void 0 ? void 0 : feesData.feeDetail) !== null && _a !== void 0 ? _a : [];
+        if (feeDetail.length > 0) {
+            (_b = props.onEnoughBalanceToPayFee) === null || _b === void 0 ? void 0 : _b.call(props, true);
+        }
+        return ((_c = feeDetail === null || feeDetail === void 0 ? void 0 : feeDetail.map(function (fee, index, array) {
             var _a, _b;
             var totalFeeInCurrency = array === null || array === void 0 ? void 0 : array.reduce(function (acc, feeDetail) {
                 var _a, _b;
@@ -61,43 +65,61 @@ function Fees(props) {
                 return acc;
             }, 0);
             var balanceUseToPaidFee = getBalanceUseToPaidFee((_b = (_a = fee === null || fee === void 0 ? void 0 : fee.currency) === null || _a === void 0 ? void 0 : _a.slug) !== null && _b !== void 0 ? _b : "");
-            return __assign(__assign({}, fee), { isEnoughBalanceToPay: balanceUseToPaidFee >= totalFeeInCurrency });
-        })) !== null && _b !== void 0 ? _b : []);
+            var isEnoughBalanceToPay = balanceUseToPaidFee >= totalFeeInCurrency;
+            return __assign(__assign({}, fee), { isEnoughBalanceToPay: isEnoughBalanceToPay });
+        })) !== null && _c !== void 0 ? _c : []);
     }, [feesData === null || feesData === void 0 ? void 0 : feesData.feeDetail, getBalanceUseToPaidFee]);
     var isEnoughBalanceToPayFee = (0, react_1.useMemo)(function () {
-        return feeCheckedBalance === null || feeCheckedBalance === void 0 ? void 0 : feeCheckedBalance.some(function (fee) { return !fee.isEnoughBalanceToPay; });
+        var _a;
+        var isEnoughBalanceToPay = feeCheckedBalance === null || feeCheckedBalance === void 0 ? void 0 : feeCheckedBalance.some(function (fee) { return !fee.isEnoughBalanceToPay; });
+        (_a = props.onEnoughBalanceToPayFee) === null || _a === void 0 ? void 0 : _a.call(props, isEnoughBalanceToPay);
+        return isEnoughBalanceToPay;
     }, [feeCheckedBalance]);
     var totalFeeInUSD = (0, react_1.useMemo)(function () {
         return feesData === null || feesData === void 0 ? void 0 : feesData.feeInUSD;
     }, [feesData]);
-    return ((0, jsx_runtime_1.jsxs)(material_1.Accordion, __assign({ defaultExpanded: true }, rest, { sx: __assign({ "&.MuiAccordion-root": {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Accordion, __assign({ defaultExpanded: true }, rest, { disableGutters: true, sx: __assign({ "&.MuiAccordion-root": {
                 backgroundColor: "transparent",
                 margin: 0,
-                borderRadius: theme.mixins.customRadius.r12,
+                padding: 0,
+                borderRadius: 0,
             }, "&.MuiAccordion-root::before": {
                 display: "none",
             }, "& .MuiAccordionSummary-root": {
-                paddingLeft: theme.mixins.customPadding.p12,
-                paddingRight: theme.mixins.customPadding.p12,
+                margin: 0,
+                padding: 0,
+                minHeight: 0,
             }, "& .MuiAccordionSummary-content": {
+                margin: 0,
+                padding: 0,
                 display: "inline-block",
                 width: "100%",
             }, "& .MuiAccordionSummary-content.Mui-expanded": {
-                marginTop: theme.mixins.customMargin.m12,
-                marginBottom: theme.mixins.customMargin.m12,
+                margin: 0,
             }, "& .MuiAccordionDetails-root": {
-                paddingLeft: theme.mixins.customPadding.p12,
-                paddingRight: theme.mixins.customPadding.p12,
-            } }, sx), children: [(0, jsx_runtime_1.jsx)(material_1.AccordionSummary, { expandIcon: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_down"), width: 20 }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { width: "100%" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.fieldTitle), children: "Total fees" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { ml: "auto" }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: totalFeeInUSD, start: "~ $", disableTooltip: true }) })] }) }), (0, jsx_runtime_1.jsx)(material_1.AccordionDetails, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { alignItems: "stretch" }), children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { width: "fit-content", gap: theme.mixins.gaps.g8, alignItems: "center" }), children: feeCheckedBalance === null || feeCheckedBalance === void 0 ? void 0 : feeCheckedBalance.map(function (item, index) {
+                margin: 0,
+                padding: 0,
+            } }, sx), children: [(0, jsx_runtime_1.jsx)(material_1.AccordionSummary, { expandIcon: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("arrow_down"), width: 10, height: 10 }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { width: "100%" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize11,
+                                fontWeight: theme.typography.fontWeight500,
+                                color: theme.palette.text.darkContrast,
+                            }, children: "Total fees" }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                borderTop: "1px dashed ".concat(theme.palette.border.accent),
+                                flex: 1,
+                                height: "1px",
+                                width: "100%",
+                                ml: theme.mixins.gaps.g8,
+                                mr: theme.mixins.gaps.g8,
+                            } }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { ml: "auto", mr: theme.mixins.gaps.g8 }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: totalFeeInUSD, start: "~ $", disableTooltip: true }) })] }) }), (0, jsx_runtime_1.jsx)(material_1.AccordionDetails, { children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g8, pt: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { alignItems: "stretch" }), children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { width: "fit-content", gap: theme.mixins.gaps.g8, alignItems: "center", justifyContent: "center" }), children: feeCheckedBalance === null || feeCheckedBalance === void 0 ? void 0 : feeCheckedBalance.map(function (item, index) {
                                         var _a;
                                         return ((0, jsx_runtime_1.jsxs)(jsx_runtime_2.Fragment, { children: [index !== 0 && ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
                                                         borderRight: "1px dashed ".concat(theme.palette.border.white24),
                                                         flex: 1,
-                                                    } })), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("timeline_dot"), width: 16 })] }, (_a = item.feeType) === null || _a === void 0 ? void 0 : _a.name));
+                                                    } })), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("timeline_dot"), width: 14, height: 14 })] }, (_a = item.feeType) === null || _a === void 0 ? void 0 : _a.name));
                                     }) }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { flex: 1, gap: theme.mixins.gaps.g8 }), children: feeCheckedBalance === null || feeCheckedBalance === void 0 ? void 0 : feeCheckedBalance.map(function (item) {
                                         var _a, _b, _c;
                                         return ((0, jsx_runtime_1.jsx)(FeeDetail, { feeName: (_a = item.feeType) === null || _a === void 0 ? void 0 : _a.name, feeInCurrency: item.feeInCurrency, feeInUSD: item.feeInUSD, currencyName: (_b = item.currency) === null || _b === void 0 ? void 0 : _b.name }, (_c = item.feeType) === null || _c === void 0 ? void 0 : _c.name));
-                                    }) })] }), isEnoughBalanceToPayFee && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: ["You don't have enough balance to pay the fee, please ", " ", (0, jsx_runtime_1.jsxs)(ReceiveFunction_1.default, { children: [" ", (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    }) })] }), !isEnoughBalanceToPayFee && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.validationError), children: ["You don't have enough balance to pay the fee, please ", " ", (0, jsx_runtime_1.jsxs)(ReceiveFunction_1.default, { children: [" ", (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                                 textDecoration: "underline",
                                                 cursor: "pointer",
                                                 fontWeight: theme.typography.fontWeight600,
@@ -107,5 +129,12 @@ exports.default = Fees;
 var FeeDetail = function (_a) {
     var feeName = _a.feeName, feeInCurrency = _a.feeInCurrency, feeInUSD = _a.feeInUSD, currencyName = _a.currencyName;
     var theme = (0, material_1.useTheme)();
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g4 }), children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.fieldTitle), { whiteSpace: "nowrap" }), children: feeName }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { flex: 1, width: "fit-content", alignItems: "flex-end" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: feeInCurrency, unit: " ".concat(currencyName) }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: feeInUSD, start: "~ $" }) })] })] }));
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                    fontSize: theme.typography.fontSize11,
+                    fontWeight: theme.typography.fontWeight500,
+                    lineHeight: theme.typography.leading160,
+                    color: theme.palette.text.accent,
+                    pl: theme.mixins.gaps.g12,
+                    whiteSpace: "nowrap",
+                }, children: feeName }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { flex: 1, width: "fit-content", alignItems: "flex-end" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: feeInCurrency, unit: " ".concat(currencyName) }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: feeInUSD, start: "~ $" }) })] })] }));
 };

package/dist/components/TekWallet/components/ui/Icon/index.d.ts

@@ -5,6 +5,7 @@ export interface IconProps extends React.ImgHTMLAttributes<HTMLImageElement> {
     width?: number;
     height?: number;
     sx?: SxProps;
+    rounded?: boolean;
 }
 declare const Icon: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
 export default Icon;

package/dist/components/TekWallet/components/ui/IconText/index.d.ts

@@ -0,0 +1,9 @@
+import { SxProps } from "@mui/material";
+interface IconTextProps {
+    title: string;
+    beforeIcon?: React.ReactNode | undefined;
+    afterIcon?: React.ReactNode | undefined;
+    sx?: SxProps;
+}
+export default function IconText(props: IconTextProps): import("react/jsx-runtime").JSX.Element;
+export type { IconTextProps };

package/dist/components/TekWallet/components/ui/IconText/index.js

@@ -0,0 +1,25 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = IconText;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var Text_1 = __importDefault(require("../Text"));
+var material_1 = require("@mui/material");
+function IconText(props) {
+    var title = props.title, beforeIcon = props.beforeIcon, afterIcon = props.afterIcon, sx = props.sx;
+    var theme = (0, material_1.useTheme)();
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g12 }), children: [beforeIcon && beforeIcon, (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, sx), children: title }), afterIcon && afterIcon] }));
+}

package/dist/components/TekWallet/components/ui/LineValue/index.d.ts

@@ -1,9 +1,13 @@
 import { GeneralProps } from "../../../types/ui";
+import { SxProps } from "@mui/material";
 import { ReactNode } from "react";
 interface LineValueProps extends GeneralProps {
     field?: ReactNode;
     value?: ReactNode;
     valueDescription?: ReactNode;
+    sxField?: SxProps;
+    sxValue?: SxProps;
+    sxValueDescription?: SxProps;
 }
 declare const LineValue: (props: LineValueProps) => import("react/jsx-runtime").JSX.Element;
 export default LineValue;

package/dist/components/TekWallet/components/ui/LineValue/index.js

@@ -21,6 +21,6 @@ var material_1 = require("@mui/material");
 var LineValue = function (props) {
     var theme = (0, material_1.useTheme)();
     var field = props.field, value = props.value, valueDescription = props.valueDescription;
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.mixins.row), { alignItems: "start", gap: theme.mixins.gaps.g32 }), props.sx), children: [!!field && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { whiteSpace: "nowrap" }), children: field })), (!!value || !!valueDescription) && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { flex: 1, alignItems: "end", gap: theme.mixins.gaps.g2 }), children: [!!value && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { textAlign: "right" }), children: value })), !!valueDescription && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { textAlign: "right" }), children: valueDescription }))] }))] }));
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.mixins.row), { alignItems: "center", gap: theme.mixins.gaps.g32 }), props.sx), children: [!!field && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign(__assign({}, theme.mixins.valueDescription), props.sxField), { whiteSpace: "nowrap" }), children: field })), (!!value || !!valueDescription) && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { flex: 1, alignItems: "end", gap: theme.mixins.gaps.g2 }), children: [!!value && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign(__assign({}, theme.mixins.value), { textAlign: "right" }), props.sxValue), children: value })), !!valueDescription && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign(__assign({}, theme.mixins.valueDescription), { textAlign: "right" }), props.sxValueDescription), children: valueDescription }))] }))] }));
 };
 exports.default = LineValue;

package/dist/components/TekWallet/components/ui/PageHeader/index.d.ts

@@ -2,6 +2,7 @@ import { GeneralProps } from "../../../types/ui";
 interface PageHeaderProps extends GeneralProps {
     overrideBack?: (e: React.MouseEvent<HTMLDivElement>) => unknown;
     title?: React.ReactNode;
+    rightAdornment?: React.ReactNode;
 }
 declare const PageHeader: (props: PageHeaderProps) => import("react/jsx-runtime").JSX.Element;
 export default PageHeader;

package/dist/components/TekWallet/components/ui/PageHeader/index.js

@@ -21,6 +21,6 @@ var BackHeader_1 = __importDefault(require("../BackHeader"));
 var Text_1 = __importDefault(require("../Text"));
 var PageHeader = function (props) {
     var theme = (0, material_1.useTheme)();
-    return ((0, jsx_runtime_1.jsx)(BackHeader_1.default, { overrideBack: props.overrideBack, sx: __assign({ display: "flex", alignItems: "center", height: "100%", position: "relative", paddingLeft: theme.mixins.pagePadding.paddingLeft, paddingRight: theme.mixins.pagePadding.paddingRight }, props.sx), children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.headerTitle), theme.mixins.center), children: props.title }) }));
+    return ((0, jsx_runtime_1.jsxs)(BackHeader_1.default, { overrideBack: props.overrideBack, sx: __assign({ display: "flex", alignItems: "center", justifyContent: "space-between", height: "100%", position: "relative", paddingLeft: theme.mixins.pagePadding.paddingLeft, paddingRight: theme.mixins.pagePadding.paddingRight }, props.sx), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.headerTitle), theme.mixins.center), children: props.title }), props.rightAdornment && props.rightAdornment] }));
 };
 exports.default = PageHeader;

package/dist/components/TekWallet/components/ui/TransferInternal/components/transferInfo.d.ts

@@ -0,0 +1,11 @@
+import { TransferInternalData } from "..";
+import { FeesDataType } from "../../../../services/axios/get-est-fee-service/type";
+interface TransferInfoProps {
+    transferData: TransferInternalData;
+    estimateFee?: FeesDataType;
+    amount?: number;
+    tokenSlug?: string;
+    onEnoughBalanceToPayFee: (isEnough: boolean) => void;
+}
+export default function TransferInfo(props: TransferInfoProps): import("react/jsx-runtime").JSX.Element;
+export type { TransferInfoProps };

package/dist/components/TekWallet/components/ui/TransferInternal/components/transferInfo.js

@@ -0,0 +1,80 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = TransferInfo;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var IconText_1 = __importDefault(require("../../../ui/IconText"));
+var LineValue_1 = __importDefault(require("../../LineValue"));
+var material_1 = require("@mui/material");
+var Fees_1 = __importDefault(require("../../Fees"));
+var Text_1 = __importDefault(require("../../Text"));
+var safeText_1 = require("../../../../utils/safeText");
+var Icon_1 = __importDefault(require("../../Icon"));
+var CopyTextComponent_1 = __importDefault(require("../../CopyTextComponent"));
+var getIcon_1 = __importDefault(require("../../../../utils/getIcon"));
+function TransferInfo(props) {
+    var _a, _b, _c;
+    var transferData = props.transferData, estimateFee = props.estimateFee, amount = props.amount, tokenSlug = props.tokenSlug;
+    var theme = (0, material_1.useTheme)();
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                    fontWeight: theme.typography.fontWeight700,
+                    color: theme.palette.primary.contrastText,
+                    fontSize: theme.typography.fontSize18,
+                    marginTop: theme.mixins.customMargin.m12,
+                }, children: "transferSummary" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "transferTo", sxField: {
+                            fontSize: theme.typography.fontSize11,
+                            fontWeight: theme.typography.fontWeight500,
+                            color: theme.palette.text.darkContrast,
+                        }, value: (0, jsx_runtime_1.jsx)(IconText_1.default, { title: (0, safeText_1.safeText)((_a = transferData.receiver) === null || _a === void 0 ? void 0 : _a.nick_name), sx: {
+                                fontSize: theme.typography.fontSize14,
+                                fontWeight: theme.typography.fontWeight700,
+                            }, beforeIcon: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (_b = transferData.receiver) === null || _b === void 0 ? void 0 : _b.avatar, width: 24, height: 24, rounded: true }) }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "network", sxField: {
+                            fontSize: theme.typography.fontSize11,
+                            fontWeight: theme.typography.fontWeight500,
+                            color: theme.palette.text.darkContrast,
+                        }, value: (0, jsx_runtime_1.jsx)(IconText_1.default, { title: (0, safeText_1.safeText)(transferData.network), sx: {
+                                fontSize: theme.typography.fontSize14,
+                                fontWeight: theme.typography.fontWeight700,
+                            }, beforeIcon: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: transferData.link, width: 24, height: 24, rounded: true }) }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "address", sxField: {
+                            fontSize: theme.typography.fontSize11,
+                            fontWeight: theme.typography.fontWeight500,
+                            color: theme.palette.text.darkContrast,
+                        }, value: (0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: (0, safeText_1.safeText)(transferData.to_address, { isShort: true }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                            fontSize: theme.typography.fontSize14,
+                                            fontWeight: theme.typography.fontWeight700,
+                                        }, children: (0, safeText_1.safeText)(transferData.to_address, { isShort: true }) }), (0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("ic_copy") })] }) }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "type", sxField: {
+                            fontSize: theme.typography.fontSize11,
+                            fontWeight: theme.typography.fontWeight500,
+                            color: theme.palette.text.darkContrast,
+                        }, value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize14,
+                                fontWeight: theme.typography.fontWeight700,
+                            }, children: (0, safeText_1.safeText)(transferData.type) }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "message", sxField: {
+                            fontSize: theme.typography.fontSize11,
+                            fontWeight: theme.typography.fontWeight500,
+                            color: theme.palette.text.darkContrast,
+                        }, value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize14,
+                                fontWeight: theme.typography.fontWeight700,
+                            }, children: (0, safeText_1.safeText)(transferData.message) }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "datetime", sxField: {
+                            fontSize: theme.typography.fontSize11,
+                            fontWeight: theme.typography.fontWeight500,
+                            color: theme.palette.text.darkContrast,
+                        }, value: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                fontSize: theme.typography.fontSize14,
+                                fontWeight: theme.typography.fontWeight700,
+                            }, children: (0, safeText_1.safeDateTimeText)(transferData.datetime) }) }), ((_c = estimateFee === null || estimateFee === void 0 ? void 0 : estimateFee.feeDetail) === null || _c === void 0 ? void 0 : _c.length) && !!amount && ((0, jsx_runtime_1.jsx)(Fees_1.default, { isFeePaidByAmount: true, feesData: JSON.stringify(estimateFee), amount: +amount, tokenSlug: tokenSlug !== null && tokenSlug !== void 0 ? tokenSlug : "", onEnoughBalanceToPayFee: props.onEnoughBalanceToPayFee }))] })] }));
+}

package/dist/components/TekWallet/components/ui/TransferInternal/components/transferTarget.d.ts

@@ -0,0 +1,6 @@
+import { TransferInternalData } from "..";
+interface TransferTargetProps {
+    transferData: TransferInternalData;
+}
+export default function TransferTarget(props: TransferTargetProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/TekWallet/components/ui/TransferInternal/components/transferTarget.js

@@ -0,0 +1,39 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = TransferTarget;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var getImage_1 = __importDefault(require("../../../../utils/getImage"));
+var UserInfo_1 = __importDefault(require("../../UserInfo"));
+var Text_1 = __importDefault(require("../../Text"));
+var Icon_1 = __importDefault(require("../../Icon"));
+var getIcon_1 = __importDefault(require("../../../../utils/getIcon"));
+function TransferTarget(props) {
+    var transferData = props.transferData;
+    var theme = (0, material_1.useTheme)();
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, padding: theme.mixins.customPadding.p12, borderRadius: theme.mixins.customRadius.r16, backgroundColor: theme.palette.text.mainGreen, backgroundImage: "url(".concat((0, getImage_1.default)("logo_transfer", "png"), ")"), backgroundPosition: "right", backgroundRepeat: "no-repeat" }), children: [(0, jsx_runtime_1.jsx)(UserInfo_1.default, { user: transferData.user, variant: "multiple", rightPart: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                        color: theme.palette.text.secondaryGreen,
+                        fontWeight: theme.typography.fontWeight500,
+                        fontSize: theme.typography.fontSize11,
+                        marginRight: theme.mixins.customMargin.m6,
+                    }, children: "From" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "flex gap-1.5 items-center", children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: (0, getIcon_1.default)("ic_transfer") }), (0, jsx_runtime_1.jsx)("div", { className: "w-full h-px border-t-[1px] border-t-accent opacity-25 border-dashed" })] }), (0, jsx_runtime_1.jsx)(UserInfo_1.default, { user: transferData.receiver, variant: "multiple", rightPart: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                        color: theme.palette.text.secondaryGreen,
+                        fontWeight: theme.typography.fontWeight500,
+                        fontSize: theme.typography.fontSize11,
+                        marginRight: theme.mixins.customMargin.m6,
+                    }, children: "To" }) })] }));
+}

package/dist/components/TekWallet/components/ui/TransferInternal/index.d.ts

@@ -1,8 +1,11 @@
-import { ConfirmLayoutProps } from "../ConfirmLayout";
+import { ConfirmLayoutProps } from "../../ui/ConfirmLayout";
 import { SendInternalBody, SendInternalResponse } from "../../../services/axios/send-internal-service/type";
-type TransferInternalData = Omit<SendInternalBody, "passcode">;
+import { TransferInfoDto } from "./type";
+import { FeesDataType } from "../../../services/axios/get-est-fee-service/type";
+export type TransferInternalData = Omit<SendInternalBody, "passcode"> & TransferInfoDto;
 interface TransferTokenProps extends Omit<ConfirmLayoutProps, "action"> {
     transferData: TransferInternalData;
+    initFeeData?: FeesDataType;
     onTransferSuccess?: (data: SendInternalResponse) => any;
 }
 export interface TransferTokenRef {

package/dist/components/TekWallet/components/ui/TransferInternal/index.js

@@ -87,18 +87,22 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.TransferError = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
-var Button_1 = __importStar(require("../Button"));
-var ConfirmLayout_1 = __importDefault(require("../ConfirmLayout"));
-var LineValue_1 = __importDefault(require("../LineValue"));
-var Formatter_1 = __importDefault(require("../Formatter"));
-var ConfirmByPasscode_1 = __importDefault(require("../ConfirmByPasscode"));
+var Button_1 = __importStar(require("../../ui/Button"));
+var ConfirmLayout_1 = __importDefault(require("../../ui/ConfirmLayout"));
+var Formatter_1 = __importDefault(require("../../ui/Formatter"));
+var ConfirmByPasscode_1 = __importDefault(require("../../ui/ConfirmByPasscode"));
 var react_1 = require("react");
-var Text_1 = __importDefault(require("../Text"));
-var RequireConnect_1 = __importDefault(require("../RequireConnect"));
+var Text_1 = __importDefault(require("../../ui/Text"));
+var RequireConnect_1 = __importDefault(require("../../ui/RequireConnect"));
 var useWalletData_1 = __importDefault(require("../../../hooks/useWalletData"));
 var type_1 = require("../../../services/axios/get-activities-service/type");
 var useWithdrawData_1 = __importDefault(require("../../../hooks/useWithdrawData"));
 var send_internal_service_1 = __importDefault(require("../../../services/axios/send-internal-service"));
+var transferTarget_1 = __importDefault(require("./components/transferTarget"));
+var transferInfo_1 = __importDefault(require("./components/transferInfo"));
+var get_est_fee_service_1 = __importDefault(require("../../../services/axios/get-est-fee-service"));
+var validate_wallet_address_service_1 = __importDefault(require("../../../services/axios/validate-wallet-address-service"));
+var type_2 = require("../../../services/axios/validate-wallet-address-service/type");
 var TransferError;
 (function (TransferError) {
     TransferError["TOKEN_NOT_FOUND"] = "Token not found";
@@ -107,60 +111,134 @@ var TransferError;
     TransferError["MIN_AMOUNT"] = "Min amount";
     TransferError["FAILED"] = "Failed";
 })(TransferError || (exports.TransferError = TransferError = {}));
+var transactionSlug = type_1.TransactionSlug.TransferInternal;
 var TransferInternal = (0, react_1.forwardRef)(function (props, ref) {
     var theme = (0, material_1.useTheme)();
     var transferData = props.transferData;
     var _a = (0, useWithdrawData_1.default)(), sendInternalTokens = _a.sendInternalTokens, updateSendInternalToken = _a.updateSendInternalToken;
     var isInitPasscode = (0, useWalletData_1.default)().isInitPasscode;
     var confirmLayoutDrawerRef = (0, react_1.useRef)(null);
-    var _b = (0, react_1.useState)(undefined), token = _b[0], setToken = _b[1];
-    var _c = (0, react_1.useState)(undefined), error = _c[0], setError = _c[1];
-    var _d = (0, react_1.useState)(undefined), errorAmount = _d[0], setErrorAmount = _d[1];
-    var _e = (0, react_1.useState)(Button_1.BUTTON_STATUS.ENABLED), buttonStatus = _e[0], setButtonStatus = _e[1];
-    var validateAmount = (0, react_1.useCallback)(function (transferData) {
-        var token = sendInternalTokens === null || sendInternalTokens === void 0 ? void 0 : sendInternalTokens.find(function (token) { return token.slug === transferData.currency_slug; });
-        setToken(token);
+    var _b = (0, react_1.useState)(undefined), error = _b[0], setError = _b[1];
+    var _c = (0, react_1.useState)(undefined), errorAmount = _c[0], setErrorAmount = _c[1];
+    var _d = (0, react_1.useState)(Button_1.BUTTON_STATUS.ENABLED), buttonStatus = _d[0], setButtonStatus = _d[1];
+    var _e = (0, react_1.useState)(false), isValidatingAddress = _e[0], setIsValidatingAddress = _e[1];
+    var _f = (0, react_1.useState)(undefined), errorAddress = _f[0], setErrorAddress = _f[1];
+    var _g = (0, react_1.useState)(props.initFeeData), estimateFee = _g[0], setEstimateFee = _g[1];
+    var _h = (0, react_1.useState)(false), isLoadingEstimateFee = _h[0], setIsLoadingEstimateFee = _h[1];
+    var _j = (0, react_1.useState)(false), isEnoughBalanceToPayFee = _j[0], setIsEnoughBalanceToPayFee = _j[1];
+    var amount = transferData.amount;
+    var toAddress = transferData.to_address;
+    var tokenSlug = transferData.currency_slug;
+    var getEstimateFee = (0, react_1.useCallback)(function () { return __awaiter(void 0, void 0, void 0, function () {
+        var response;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (!tokenSlug)
+                        return [2 /*return*/];
+                    setIsLoadingEstimateFee(true);
+                    return [4 /*yield*/, (0, get_est_fee_service_1.default)({
+                            amount: "".concat(amount),
+                            transaction_type: transactionSlug,
+                            currency: tokenSlug || "",
+                        })];
+                case 1:
+                    response = _a.sent();
+                    setIsLoadingEstimateFee(false);
+                    setEstimateFee(response === null || response === void 0 ? void 0 : response.data);
+                    return [2 /*return*/, true];
+            }
+        });
+    }); }, [amount, tokenSlug]);
+    var token = (0, react_1.useMemo)(function () {
+        return sendInternalTokens === null || sendInternalTokens === void 0 ? void 0 : sendInternalTokens.find(function (token) { return token.slug === tokenSlug; });
+    }, [tokenSlug, sendInternalTokens]);
+    var validateAmount = (0, react_1.useCallback)(function () {
         if (!token) {
             setError(TransferError.TOKEN_NOT_FOUND);
-            return;
+            return false;
         }
         if (transferData.amount > token.max_value) {
             setError(TransferError.MAX_AMOUNT);
             setErrorAmount(token.max_value);
-            return;
+            return false;
         }
         if (transferData.amount < token.min_value) {
             setError(TransferError.MIN_AMOUNT);
             setErrorAmount(token.min_value);
-            return;
+            return false;
         }
         if (transferData.amount > +token.balance) {
             setError(TransferError.NOT_ENOUGH_BALANCE);
             setErrorAmount(token.balance);
-            return;
+            return false;
         }
         setError(undefined);
         setErrorAmount(undefined);
-    }, [sendInternalTokens, transferData === null || transferData === void 0 ? void 0 : transferData.amount, transferData === null || transferData === void 0 ? void 0 : transferData.currency_slug]);
-    var handleTransfer = function (passcode) { return __awaiter(void 0, void 0, void 0, function () {
-        var response;
+        return true;
+    }, [sendInternalTokens, token]);
+    var validateAddress = (0, react_1.useCallback)(function () { return __awaiter(void 0, void 0, void 0, function () {
+        var message;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    setIsValidatingAddress(true);
+                    return [4 /*yield*/, (0, validate_wallet_address_service_1.default)({
+                            address: toAddress,
+                            network: "ton",
+                        })];
+                case 1:
+                    message = (_a.sent()).message;
+                    setIsValidatingAddress(false);
+                    if (message !== type_2.ValidateWalletAddressResultMessage.INTERNAL_WALLET) {
+                        setErrorAddress("Invalid wallet address");
+                        return [2 /*return*/, false];
+                    }
+                    setErrorAddress(undefined);
+                    return [2 /*return*/, true];
+            }
+        });
+    }); }, [toAddress]);
+    var validateAll = (0, react_1.useCallback)(function () { return __awaiter(void 0, void 0, void 0, function () {
+        var isAmountValid;
+        return __generator(this, function (_a) {
+            isAmountValid = validateAmount();
+            if (!isAmountValid)
+                return [2 /*return*/, false];
+            validateAddress();
+            getEstimateFee();
+            return [2 /*return*/];
+        });
+    }); }, [validateAmount, validateAddress, getEstimateFee]);
+    var handleSendInternalToken = function (passcode) { return __awaiter(void 0, void 0, void 0, function () {
+        var response, err_1;
         var _a, _b;
         return __generator(this, function (_c) {
             switch (_c.label) {
                 case 0:
+                    _c.trys.push([0, 2, , 3]);
                     setButtonStatus(Button_1.BUTTON_STATUS.LOADING);
-                    return [4 /*yield*/, (0, send_internal_service_1.default)(__assign({ passcode: passcode }, transferData))];
+                    return [4 /*yield*/, (0, send_internal_service_1.default)(__assign(__assign({}, props.transferData), { passcode: passcode }))];
                 case 1:
                     response = _c.sent();
                     if (response.success) {
                         (_a = confirmLayoutDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
+                        setButtonStatus(Button_1.BUTTON_STATUS.ENABLED);
                         (_b = props.onTransferSuccess) === null || _b === void 0 ? void 0 : _b.call(props, response);
                     }
                     else {
-                        setError(TransferError.FAILED);
+                        throw new Error("Send internal failed");
                     }
-                    setButtonStatus(Button_1.BUTTON_STATUS.ENABLED);
-                    return [2 /*return*/];
+                    return [3 /*break*/, 3];
+                case 2:
+                    err_1 = _c.sent();
+                    console.error(err_1);
+                    setButtonStatus(Button_1.BUTTON_STATUS.ERROR);
+                    setTimeout(function () {
+                        setButtonStatus(Button_1.BUTTON_STATUS.ENABLED);
+                    }, 1200);
+                    return [3 /*break*/, 3];
+                case 3: return [2 /*return*/];
             }
         });
     }); };
@@ -169,6 +247,7 @@ var TransferInternal = (0, react_1.forwardRef)(function (props, ref) {
         if (!isInitPasscode)
             throw new Error("Please connect your wallet");
         (_a = confirmLayoutDrawerRef.current) === null || _a === void 0 ? void 0 : _a.open();
+        validateAll();
     };
     var handleClose = function () {
         var _a;
@@ -185,13 +264,21 @@ var TransferInternal = (0, react_1.forwardRef)(function (props, ref) {
             updateSendInternalToken();
         }
     }, [sendInternalTokens, updateSendInternalToken]);
-    (0, react_1.useEffect)(function () {
-        validateAmount(transferData);
-    }, [validateAmount]);
-    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(ConfirmLayout_1.default, { ref: confirmLayoutDrawerRef, action: type_1.TransactionSlug.TransferInternal, trigger: props.children, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.paper), children: [(0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "Amount", value: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: transferData.amount, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) }) }), (0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "To", value: transferData.to_address })] }), (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.value), children: ["Your balance is", " ", (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                    fontWeight: theme.typography.fontWeight600,
-                                    color: theme.palette.text.secondary,
-                                }, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: token === null || token === void 0 ? void 0 : token.balance, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) }) })] }), !!error && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.validationError), { mt: theme.mixins.gaps.g6 }), children: [error, " ", !!errorAmount && (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: errorAmount, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) })] })), (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { action: type_1.TransactionSlug.TransferInternal, onConfirmSuccess: handleTransfer, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { status: !!error ? Button_1.BUTTON_STATUS.DISABLED : buttonStatus, sx: { width: "100%" }, children: "Confirm" }) })] }) }) }));
+    // const estimateReceive = useMemo(() => {
+    //   if (!estimateFee || !amount) return undefined;
+    //   return +amount - +estimateFee?.feeInCurrency;
+    // }, [estimateFee, amount]);
+    return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsxs)(ConfirmLayout_1.default, { title: "Transfer Amount", link: token === null || token === void 0 ? void 0 : token.link, transferAmount: transferData.amount, ref: confirmLayoutDrawerRef, action: type_1.TransactionSlug.TransferInternal, trigger: props.children, currency: token === null || token === void 0 ? void 0 : token.name, onOpen: validateAll, children: [(0, jsx_runtime_1.jsx)(transferTarget_1.default, { transferData: transferData }), (0, jsx_runtime_1.jsx)(transferInfo_1.default, { transferData: transferData, estimateFee: estimateFee, amount: amount, tokenSlug: tokenSlug, onEnoughBalanceToPayFee: setIsEnoughBalanceToPayFee }), !!error && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.validationError), { mt: theme.mixins.gaps.g6 }), children: [error, " ", !!errorAmount && (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: errorAmount, unit: " ".concat(token === null || token === void 0 ? void 0 : token.name) })] })), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { justifyContent: "center", mt: theme.mixins.customMargin.m12, mb: theme.mixins.customMargin.m16, position: "absolute", bottom: 0, left: 0, right: 0 }), children: (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { action: type_1.TransactionSlug.TransferInternal, onConfirmSuccess: handleSendInternalToken, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { status: !!error || isLoadingEstimateFee || isValidatingAddress || errorAddress || !isEnoughBalanceToPayFee
+                                ? Button_1.BUTTON_STATUS.DISABLED
+                                : buttonStatus, sx: {
+                                backgroundColor: theme.palette.text.mainGreen,
+                                color: theme.palette.text.secondaryGreen,
+                                fontWeight: theme.typography.fontWeight500,
+                                fontSize: theme.typography.fontSize14,
+                                borderRadius: theme.mixins.customRadius.r16,
+                                height: "40px",
+                                width: "calc(100dvw - 2rem)",
+                            }, fullWidth: true, children: "Confirm" }) }) })] }) }));
 });
 TransferInternal.displayName = "TransferInternal";
 exports.default = TransferInternal;

package/dist/components/TekWallet/components/ui/TransferInternal/type.d.ts

@@ -1,4 +1,16 @@
+import { FeesDataType } from "../../../services/axios/get-est-fee-service/type";
+import { UserInfoDto } from "../../../types/expose-type";
 export interface LockData {
     amount: number;
     tokenSlug: string;
 }
+export interface TransferInfoDto {
+    network?: string;
+    type?: string;
+    message?: string;
+    datetime?: string;
+    link?: string;
+    user?: UserInfoDto;
+    receiver?: UserInfoDto;
+    fee?: FeesDataType;
+}

package/dist/components/TekWallet/components/ui/UserInfo/index.d.ts

@@ -0,0 +1,9 @@
+import { UserInfoDto } from "../../../types/expose-type";
+export type UserInfoVariant = "single" | "multiple";
+export interface IUserInfoProps {
+    user: UserInfoDto | undefined;
+    rightPart?: React.ReactNode;
+    className?: string;
+    variant?: UserInfoVariant;
+}
+export default function UserInfo({ user, rightPart }: IUserInfoProps): import("react/jsx-runtime").JSX.Element | "loading...";

package/dist/components/TekWallet/components/ui/UserInfo/index.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = UserInfo;
+var jsx_runtime_1 = require("react/jsx-runtime");
+var getImage_1 = __importDefault(require("../../../utils/getImage"));
+var Icon_1 = __importDefault(require("../Icon"));
+var Text_1 = __importDefault(require("../Text"));
+var material_1 = require("@mui/material");
+function UserInfo(_a) {
+    var _b;
+    var user = _a.user, rightPart = _a.rightPart;
+    var theme = (0, material_1.useTheme)();
+    if (!user)
+        return "loading...";
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex gap-3 items-center", children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: (_b = user.avatar) !== null && _b !== void 0 ? _b : (0, getImage_1.default)("default-ava", "png"), width: 24, height: 24, sx: {
+                            position: "relative",
+                            borderRadius: theme.mixins.customRadius.full,
+                        } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex flex-col", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    color: theme.palette.background.white,
+                                    fontWeight: theme.typography.fontWeight500,
+                                    fontSize: theme.typography.fontSize13,
+                                }, children: user.nick_name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    color: theme.palette.text.accent,
+                                    fontWeight: theme.typography.fontWeight500,
+                                    fontSize: theme.typography.fontSize11,
+                                }, children: user.user_name })] })] }), rightPart] }));
+}

package/dist/components/TekWallet/providers/EventHandlerProvider/index.d.ts

@@ -1,5 +1,7 @@
+import { Options } from "../TekWalletProvider";
 export interface EventHandlerProviderProps {
     children: React.ReactNode;
+    options?: Options;
 }
 declare function EventHandlerProvider(props: EventHandlerProviderProps): import("react/jsx-runtime").JSX.Element;
 export default EventHandlerProvider;

package/dist/components/TekWallet/providers/EventHandlerProvider/index.js

@@ -12,10 +12,14 @@ function EventHandlerProvider(props) {
     var eventHandler = (0, useEventHandler_1.useEventHandler)().eventHandler;
     var _a = (0, useRealtime_1.default)(), pushNotification = _a.pushNotification, transaction = _a.transaction;
     var activitiesRef = (0, react_1.useRef)(null);
+    var options = props.options;
+    var hideDefaultActivities = options === null || options === void 0 ? void 0 : options.hideDefaultActivities;
     var showActivities = (0, react_1.useCallback)(function () {
         var _a;
+        if (hideDefaultActivities)
+            return;
         (_a = activitiesRef.current) === null || _a === void 0 ? void 0 : _a.openTab(0);
-    }, []);
+    }, [hideDefaultActivities]);
     (0, react_1.useEffect)(function () {
         if (!eventHandler || !transaction)
             return;
@@ -24,6 +28,6 @@ function EventHandlerProvider(props) {
             pushNotification(theMessage);
         }
     }, [transaction]);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [props.children, false && (0, jsx_runtime_1.jsx)(Activities_1.default, { ref: activitiesRef })] }));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [props.children, !hideDefaultActivities && (0, jsx_runtime_1.jsx)(Activities_1.default, { ref: activitiesRef })] }));
 }
 exports.default = EventHandlerProvider;

package/dist/components/TekWallet/providers/TekWalletProvider/index.d.ts

@@ -1,14 +1,14 @@
 import { ReactNode } from "react";
 import { Theme } from "@mui/material";
-export interface Config {
-    hideActivitiesDefault?: boolean;
+export interface Options {
+    hideDefaultActivities?: boolean;
 }
 export interface TekWalletProviderProps {
     children: ReactNode;
     isSSO?: boolean;
     accessToken?: string;
     theme?: Theme;
-    config?: Config;
+    options?: Options;
 }
 export interface TekWalletContextType {
     isSSO: boolean | undefined;

package/dist/components/TekWallet/services/axios/get-send-tokens-list-service/type.d.ts

@@ -15,6 +15,7 @@ export interface TransferInternalCurrency {
     icon: string;
     usd_rate: string;
     icon_svg: string;
+    link: string;
     network_data: NetworkData[];
     balance: string;
     min_value: number;

package/dist/components/TekWallet/theme/mui/theme.js

@@ -54,6 +54,7 @@ var border = {
     black16: "rgba(0, 0, 0, 0.16)",
     secondary: "#01FFFF",
     secondary16: "rgba(1, 255, 255, 0.16)",
+    accent: "#A3A3A3",
 };
 var text = {
     white: "#ffffff",
@@ -64,6 +65,11 @@ var text = {
     black80: "rgba(0, 0, 0, 0.8)",
     black64: "rgba(0, 0, 0, 0.64)",
     black24: "rgba(0, 0, 0, 0.24)",
+    blackContrast: "#121212",
+    mainGreen: "#1E4841",
+    secondaryGreen: "#C5E99F",
+    accent: "#A3A3A3",
+    accent2: "#6B7271",
     secondary: "#01FFFF",
     successStatus: "#01FF00",
     errorStatus: "#FE6565",

package/dist/components/TekWallet/types/expose-type.d.ts

@@ -123,6 +123,16 @@ export interface User {
     expires_in: number;
     refresh_expires_in: number;
 }
+export type UserInfoDto = {
+    id?: string;
+    nick_name?: string;
+    user_name?: string;
+    email?: string;
+    avatar?: string;
+    bio?: string;
+    country_slug?: string;
+    user_type?: string;
+};
 export interface BlockchainWallet {
     master_address: string;
     blockchain_address: string;

package/dist/components/TekWallet/utils/safeText.d.ts

@@ -0,0 +1,6 @@
+declare const safeText: (text: string | undefined, options?: {
+    isShort?: boolean;
+    defaultValue?: string | undefined;
+}) => string;
+declare const safeDateTimeText: (text: string | undefined, defaultValue?: string | undefined) => string;
+export { safeText, safeDateTimeText };

package/dist/components/TekWallet/utils/safeText.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.safeDateTimeText = exports.safeText = void 0;
+var safeText = function (text, options) {
+    var _a = options !== null && options !== void 0 ? options : {}, isShort = _a.isShort, defaultValue = _a.defaultValue;
+    if (!text)
+        return defaultValue !== null && defaultValue !== void 0 ? defaultValue : "-";
+    if (isShort) {
+        if (text.length < 10) {
+            return text;
+        }
+        return text.slice(0, 3) + "..." + text.slice(-9);
+    }
+    return text;
+};
+exports.safeText = safeText;
+var safeDateTimeText = function (text, defaultValue) {
+    if (!text)
+        return defaultValue !== null && defaultValue !== void 0 ? defaultValue : "-";
+    return new Date(text).toLocaleString();
+};
+exports.safeDateTimeText = safeDateTimeText;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tek-wallet",
-  "version": "0.0.603",
+  "version": "0.0.605",
   "description": "A custom React provider with TypeScript support",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",