tek-wallet 0.0.828 → 0.0.830

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

@@ -23,6 +23,7 @@ export * from "./views/SwapView";
 export * from "./views/ActivityView";
 export * from "./views/DetailActivityView";
 export * from "./views/SettingView";
+export * from "./views/SendNftView";
 export * from "./ui/ReceiveFunction";
 export * from "./ui/ReceiveDirectly";
 export * from "./ui/TokensBoard";

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

@@ -39,6 +39,7 @@ __exportStar(require("./views/SwapView"), exports);
 __exportStar(require("./views/ActivityView"), exports);
 __exportStar(require("./views/DetailActivityView"), exports);
 __exportStar(require("./views/SettingView"), exports);
+__exportStar(require("./views/SendNftView"), exports);
 __exportStar(require("./ui/ReceiveFunction"), exports);
 __exportStar(require("./ui/ReceiveDirectly"), exports);
 __exportStar(require("./ui/TokensBoard"), exports);

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

@@ -68,7 +68,7 @@ var AssetViewHeader = function () {
     var theme = (0, mui_1.useTheme)();
     var modalRef = (0, react_1.useRef)(null);
     var offset = (0, TekWalletProvider_1.useWalletSetup)().offset;
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { justifyContent: "start", position: "relative", boxShadow: "0 0 1px 2px rgba(0, 0, 0, 0.03)", px: theme.styleMixins.customPadding.p16 }), children: [(0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: modalRef, trigger: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.styleMixins.row), { alignItems: "center", justifyContent: "start", textAlign: "center", gap: theme.styleMixins.gaps.g4, py: theme.styleMixins.customPadding.p8 }), theme.styleMixins.value), children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: "1.25rem", height: "1.25rem" }, children: SvgPath_1.WALLET }), (0, compactWalletAddress_1.default)(masterWallet), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: "0.625rem", height: "0.625rem" }, children: SvgPath_1.ARROW_DROP_DOWN })] }), direction: DrawerComponent_1.DRAWER_DIRECTION.TOP, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { justifyContent: "start", position: "relative", px: theme.styleMixins.customPadding.p16, pb: 1, borderBottom: "1px solid ".concat(theme.palette.divider) }), children: [(0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: modalRef, trigger: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.styleMixins.row), { alignItems: "center", justifyContent: "start", textAlign: "center", gap: theme.styleMixins.gaps.g4, py: theme.styleMixins.customPadding.p8 }), theme.styleMixins.value), children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: "1.25rem", height: "1.25rem" }, children: SvgPath_1.WALLET }), (0, compactWalletAddress_1.default)(masterWallet), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: "0.625rem", height: "0.625rem" }, children: SvgPath_1.ARROW_DROP_DOWN })] }), direction: DrawerComponent_1.DRAWER_DIRECTION.TOP, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                         width: "100%",
                         height: "fit-content",
                         backgroundColor: "background.default",

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

@@ -11,6 +11,7 @@ var SwiperControlled_1 = __importDefault(require("../SwiperControlled"));
 var react_1 = require("swiper/react");
 var TokensBoard_1 = __importDefault(require("../TokensBoard"));
 var NftsBoard_1 = __importDefault(require("../NftsBoard"));
+var react_2 = require("react");
 var ASSETS_TABS = [
     {
         name: "Tokens",
@@ -23,7 +24,8 @@ var ASSETS_TABS = [
 ];
 var AssetsBoard = function () {
     var theme = (0, mui_1.useTheme)();
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(SwiperControlled_1.default, { swiperProps: {
+    var swiperRef = (0, react_2.useRef)(null);
+    return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(SwiperControlled_1.default, { ref: swiperRef, swiperProps: {
                 slidesPerView: 1,
                 spaceBetween: 40,
                 autoHeight: true,
@@ -54,7 +56,7 @@ var AssetsBoard = function () {
             }, children: ASSETS_TABS === null || ASSETS_TABS === void 0 ? void 0 : ASSETS_TABS.map(function (type, index) {
                 return ((0, jsx_runtime_1.jsxs)(react_1.SwiperSlide, { style: {
                         position: "relative",
-                    }, children: [type.value === "tokens" && (0, jsx_runtime_1.jsx)(TokensBoard_1.default, {}), type.value === "nfts" && (0, jsx_runtime_1.jsx)(NftsBoard_1.default, {})] }, index));
+                    }, children: [type.value === "tokens" && ((0, jsx_runtime_1.jsx)(TokensBoard_1.default, { onDataChanged: function () { var _a; return (_a = swiperRef.current) === null || _a === void 0 ? void 0 : _a.update(); } })), type.value === "nfts" && ((0, jsx_runtime_1.jsx)(NftsBoard_1.default, { onDataChanged: function () { var _a; return (_a = swiperRef.current) === null || _a === void 0 ? void 0 : _a.update(); } }))] }, index));
             }) }) }));
 };
 exports.AssetsBoard = AssetsBoard;

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

@@ -42,6 +42,6 @@ function NftDetail(props) {
                             alignItems: "center",
                             mt: "auto",
                             gap: theme.styleMixins.gaps.g4,
-                        }, children: (voucher === null || voucher === void 0 ? void 0 : voucher.expire) && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.activityDescription), { textTransform: "none", py: 1, px: 2, borderRadius: Infinity, color: theme.palette.tertiary.main, backgroundColor: "color-mix(in srgb, currentcolor 10%, transparent)", fontSize: theme.typography.fontSize13 }), children: ["Exp ", (0, formatDate_1.default)(voucher === null || voucher === void 0 ? void 0 : voucher.expire)] })) })] }), (0, jsx_runtime_1.jsx)(Button_1.default, { sx: { mt: "auto" }, onClick: handleClickButton, loading: isMinting, fullWidth: true, children: buttonLabel })] })));
+                        }, children: (voucher === null || voucher === void 0 ? void 0 : voucher.expire) && ((0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.activityDescription), { textTransform: "none", py: 1, px: 2, borderRadius: Infinity, color: theme.palette.tertiary.main, backgroundColor: "color-mix(in srgb, currentcolor 10%, transparent)", fontSize: theme.typography.fontSize13 }), children: ["Exp ", (0, formatDate_1.default)(voucher === null || voucher === void 0 ? void 0 : voucher.expire, true)] })) })] }), (0, jsx_runtime_1.jsx)(Button_1.default, { sx: { mt: "auto" }, onClick: handleClickButton, loading: isMinting, fullWidth: true, children: buttonLabel })] })));
 }
 exports.default = NftDetail;

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

@@ -1,2 +1,6 @@
-export declare const NftsBoard: () => import("react/jsx-runtime").JSX.Element;
+import { Nft } from "../../../hooks/data/useNfts/service.type";
+export interface NftsBoardProps {
+    onDataChanged: (nfts?: Nft[]) => void;
+}
+export declare const NftsBoard: (props: NftsBoardProps) => import("react/jsx-runtime").JSX.Element;
 export default NftsBoard;

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

@@ -63,7 +63,8 @@ var react_1 = require("react");
 var DrawerComponent_1 = __importStar(require("../DrawerComponent"));
 var NftDetailView_1 = __importDefault(require("../../views/NftDetailView"));
 var useCustomRouter_1 = __importDefault(require("../../../hooks/useCustomRouter"));
-var NftsBoard = function () {
+var NftsBoard = function (props) {
+    var onDataChanged = props.onDataChanged;
     var searchParams = (0, navigation_1.useSearchParams)();
     var pathname = (0, navigation_1.usePathname)();
     var detailNftId = searchParams.get("detail") || undefined;
@@ -71,6 +72,9 @@ var NftsBoard = function () {
     var theme = (0, mui_1.useTheme)();
     var router = (0, useCustomRouter_1.default)();
     var _a = (0, useNfts_1.default)(), nfts = _a.nfts, isLoadingNfts = _a.isLoading, hasNextPageNfts = _a.hasNextPage, fetchNextPageNfts = _a.fetchNextPage, refetchNfts = _a.refetch;
+    (0, react_1.useEffect)(function () {
+        onDataChanged === null || onDataChanged === void 0 ? void 0 : onDataChanged(nfts);
+    }, [nfts, onDataChanged]);
     var isEmpty = nfts && nfts.length === 0;
     var openDetailNft = (0, react_1.useCallback)(function () {
         var _a;

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

@@ -1,2 +1,6 @@
-export declare const TokensBoard: () => import("react/jsx-runtime").JSX.Element;
+import { Balance } from "../../../types/expose-type";
+export interface TokensBoardProps {
+    onDataChanged: (tokens?: Balance[]) => void;
+}
+export declare const TokensBoard: (props: TokensBoardProps) => import("react/jsx-runtime").JSX.Element;
 export default TokensBoard;

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

@@ -22,9 +22,14 @@ var TokenItem_1 = __importDefault(require("../TokenItem"));
 var material_1 = require("@mui/material");
 var mui_1 = require("../../../theme/mui");
 var WaitingData_1 = __importDefault(require("../WaitingData"));
-var TokensBoard = function () {
+var react_1 = require("react");
+var TokensBoard = function (props) {
+    var onDataChanged = props.onDataChanged;
     var tokens = (0, useWalletData_1.default)().tokens;
     var theme = (0, mui_1.useTheme)();
+    (0, react_1.useEffect)(function () {
+        onDataChanged === null || onDataChanged === void 0 ? void 0 : onDataChanged(tokens);
+    }, [tokens, onDataChanged]);
     return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g12, mt: theme.styleMixins.customMargin.m8, pt: theme.styleMixins.customPadding.p8, minHeight: !tokens ? "20rem" : "unset" }), children: [!!tokens && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                     display: "grid",
                     gridTemplateColumns: "1fr auto",

package/dist/components/TekWallet/components/views/AssetView/LoadingView.d.ts

@@ -0,0 +1,2 @@
+declare function AssetViewLoadingView(): import("react/jsx-runtime").JSX.Element;
+export default AssetViewLoadingView;

package/dist/components/TekWallet/components/views/AssetView/LoadingView.js

@@ -0,0 +1,55 @@
+"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 });
+var jsx_runtime_1 = require("react/jsx-runtime");
+var material_1 = require("@mui/material");
+var mui_1 = require("../../../theme/mui");
+var WaitingData_1 = __importDefault(require("../../ui/WaitingData"));
+function AssetViewLoadingView() {
+    var theme = (0, mui_1.useTheme)();
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.styleMixins.column), theme.styleMixins.pagePadding), { gap: theme.styleMixins.gaps.g16 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { justifyContent: "space-between", alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 120, height: 18, sx: {
+                                    transform: "scale(1)",
+                                } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 70, height: 18, sx: {
+                                    transform: "scale(1)",
+                                } })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g6 }), children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: "55%", height: 34, sx: {
+                                    transform: "scale(1)",
+                                } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: "35%", height: 18, sx: {
+                                    transform: "scale(1)",
+                                } })] })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                    borderRadius: theme.styleMixins.customRadius.r16,
+                    border: "1px solid ".concat(theme.palette.divider),
+                    overflow: "hidden",
+                    display: "grid",
+                    gridTemplateColumns: "1fr 1px 1fr 1px 1fr",
+                    // alignItems: "stretch",
+                }, children: Array.from({ length: 3 }).map(function (_, idx) {
+                    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [idx !== 0 && (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", flexItem: true, sx: { my: 4 } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                                    py: theme.styleMixins.customPadding.p12,
+                                    display: "flex",
+                                    flexDirection: "column",
+                                    alignItems: "center",
+                                    justifyContent: "center",
+                                    gap: theme.styleMixins.gaps.g8,
+                                }, children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "circular", width: 32, height: 32 }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 56, height: 18, sx: {
+                                            transform: "scale(1)",
+                                        } })] }, "item-".concat(idx))] }));
+                }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g12, alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 64, height: 20, sx: {
+                            transform: "scale(1)",
+                        } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 48, height: 20, sx: {
+                            transform: "scale(1)",
+                        } })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g12 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { display: "grid", gridTemplateColumns: "1fr auto", gap: theme.styleMixins.gaps.g12 }, children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 80, height: 20, sx: { transform: "scale(1)" } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { variant: "text", width: 80, height: 20, sx: { transform: "scale(1)" } })] }), (0, jsx_runtime_1.jsx)(WaitingData_1.default, { numberOfSkeleton: 6 })] })] }));
+}
+exports.default = AssetViewLoadingView;

package/dist/components/TekWallet/components/views/AssetView/index.js

@@ -84,9 +84,10 @@ var ClickEffect_1 = __importDefault(require("../../ui/ClickEffect"));
 var mui_1 = require("../../../theme/mui");
 var AssetsBoard_1 = __importDefault(require("../../ui/AssetsBoard"));
 var InitPasscodeView_1 = __importDefault(require("../InitPasscodeView"));
+var LoadingView_1 = __importDefault(require("./LoadingView"));
 var AssetView = function (props) {
     var sx = props.sx, rest = __rest(props, ["sx"]);
-    var _a = (0, useWalletData_1.default)(), isInitPasscode = _a.isInitPasscode, masterWallet = _a.masterWallet, updateWalletDetail = _a.updateWalletDetail;
+    var _a = (0, useWalletData_1.default)(), isInitPasscode = _a.isInitPasscode, masterWallet = _a.masterWallet, updateWalletDetail = _a.updateWalletDetail, isTokensLoading = _a.isTokensLoading, tokens = _a.tokens;
     var theme = (0, mui_1.useTheme)();
     var options = (0, TekWalletProvider_1.useWalletSetup)().options;
     var _b = options || {}, hideActivitySectionInAssetView = _b.hideActivitySectionInAssetView, useBasicAmountGroupInAssetView = _b.useBasicAmountGroupInAssetView, basePath = _b.basePath;
@@ -95,7 +96,8 @@ var AssetView = function (props) {
             return [2 /*return*/, updateWalletDetail()];
         });
     }); };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!isInitPasscode && !!masterWallet && (0, jsx_runtime_1.jsx)(InitPasscodeView_1.default, { useAutoBack: false }), !!isInitPasscode && ((0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { header: !!isInitPasscode && (0, jsx_runtime_1.jsx)(AssetViewHeader_1.default, {}), pullToRefreshProps: {
+    var isInitialLoading = !!isInitPasscode && isTokensLoading && !tokens;
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [!masterWallet && (0, jsx_runtime_1.jsx)(LoadingView_1.default, {}), !isInitPasscode && !!masterWallet && (0, jsx_runtime_1.jsx)(InitPasscodeView_1.default, { useAutoBack: false }), !!isInitPasscode && ((0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { header: !!isInitPasscode && !isInitialLoading && (0, jsx_runtime_1.jsx)(AssetViewHeader_1.default, {}), pullToRefreshProps: {
                     isPullable: !!isInitPasscode,
                     onRefresh: handleRefresh,
                 }, children: (0, jsx_runtime_1.jsxs)(DefaultPageLayout_1.default, __assign({}, rest, { sx: __assign({ display: "flex", flexDirection: "column", gap: theme.styleMixins.gaps.g16 }, sx), children: [useBasicAmountGroupInAssetView ? (0, jsx_runtime_1.jsx)(BasicAmountGroup_1.default, {}) : (0, jsx_runtime_1.jsx)(AmountGroupAndChart_1.default, {}), (0, jsx_runtime_1.jsx)(Menu_1.default, { sx: {

package/dist/components/TekWallet/hooks/useEventHandler.js

@@ -44,7 +44,7 @@ var useEventHandler = function () {
         var _a, _b, _c;
         if (!messageEvent)
             return undefined;
-        var type = messageEvent.transaction_type;
+        var type = messageEvent === null || messageEvent === void 0 ? void 0 : messageEvent.transaction_type;
         var amount = messageEvent.amount;
         var currency = (_a = messageEvent.currency_data) === null || _a === void 0 ? void 0 : _a.name;
         var status = messageEvent.transaction_status;
@@ -64,7 +64,7 @@ var useEventHandler = function () {
                 notificationType = "info";
         }
         var notificationMessage = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: { textTransform: "capitalize" }, children: type === null || type === void 0 ? void 0 : type.name }), " ", (0, jsx_runtime_1.jsx)(Formatter_1.default, { disableTooltip: true, value: amount, unit: " ".concat(currency) }), " is ", status] }));
-        switch (type.slug) {
+        switch (type === null || type === void 0 ? void 0 : type.slug) {
             case type_1.TransactionSlug.SWAP:
                 var toCurrency = (_b = messageEvent.to_currency_data) === null || _b === void 0 ? void 0 : _b.name;
                 var toAmount = (_c = messageEvent.to_currency_data) === null || _c === void 0 ? void 0 : _c.swap_total_amount;

package/dist/components/TekWallet/providers/TanstackReactQuery/query.config.js

@@ -2,13 +2,17 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.queryClient = void 0;
 var react_query_1 = require("@tanstack/react-query");
+var DEFAULT_STALE_TIME = 1000 * 30; // 30s: hiển thị nhanh từ cache, vẫn refetch sau đó khi cần
+var DEFAULT_GC_TIME = 1000 * 60 * 60 * 24 * 30; // 30 days: nên >= maxAge của persister
 exports.queryClient = new react_query_1.QueryClient({
     defaultOptions: {
         queries: {
-            retry: 3,
+            retry: 1,
             retryDelay: 2000,
-            staleTime: 0,
-            gcTime: 0,
+            staleTime: DEFAULT_STALE_TIME,
+            gcTime: DEFAULT_GC_TIME,
+            refetchOnWindowFocus: false,
+            refetchOnMount: false,
         },
         mutations: {
             retry: 0,

package/package.json

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