tek-wallet 0.0.755 → 0.0.757

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

@@ -1,7 +1,10 @@
+import { SxProps } from "@mui/material";
 import { TransactionType } from "../../../services/axios/get-activities-service/type";
 export interface ActivitiesTypeSlicePropsType {
     type: TransactionType;
     isActive?: boolean;
+    limitItems?: number;
+    sx?: SxProps;
 }
 export declare enum Status {
     Loading = "loading",

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

@@ -28,7 +28,6 @@ var DrawerComponent_1 = __importDefault(require("../DrawerComponent"));
 var ModalLayout_1 = __importDefault(require("../ModalLayout"));
 var ActivityDetail_1 = __importDefault(require("../ActivityDetail"));
 var SmartList_1 = __importDefault(require("../SmartList"));
-var type_1 = require("../../../providers/ActivitiesProvider/type");
 var Status;
 (function (Status) {
     Status["Loading"] = "loading";
@@ -37,11 +36,11 @@ var Status;
 })(Status || (exports.Status = Status = {}));
 var prefix = "activities_";
 function ActivitiesTypeSlice(props) {
-    var _a, _b;
+    var _a, _b, _c;
     var theme = (0, ThemeProvider_1.useTheme)();
-    var _c = (0, useActivities_1.default)(), activities = _c.activities, loadActivities = _c.loadActivities, pages = _c.pages;
-    var type = props.type, isActive = props.isActive;
-    var _d = (0, react_1.useState)(undefined), detailActivity = _d[0], setDetailActivity = _d[1];
+    var _d = (0, useActivities_1.default)(), activities = _d.activities, loadActivities = _d.loadActivities, loadOutActivityType = _d.loadOutActivityType;
+    var type = props.type, isActive = props.isActive, limitItems = props.limitItems, sx = props.sx;
+    var _e = (0, react_1.useState)(undefined), detailActivity = _e[0], setDetailActivity = _e[1];
     var detailDrawerRef = (0, react_1.useRef)(null);
     var activitiesByType = (0, react_1.useMemo)(function () {
         if (!(type === null || type === void 0 ? void 0 : type.slug))
@@ -73,11 +72,12 @@ function ActivitiesTypeSlice(props) {
     var loadMore = (0, react_1.useCallback)(function () {
         loadActivities(type.slug);
     }, [loadActivities, type.slug]);
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: { width: "100%", height: "100%", display: "flex" }, children: [status === Status.Loading && (0, jsx_runtime_1.jsx)(WaitingData_1.default, { sx: { margin: "auto" } }), status === Status.Empty && ((0, jsx_runtime_1.jsx)(EmptyData_1.default, { sx: { margin: "auto" }, icon: (0, getIcon_1.default)(prefix + "empty_" + type.slug), description: "No ".concat((_a = type.name) === null || _a === void 0 ? void 0 : _a.toLowerCase(), " activity") })), status === Status.Filled && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SmartList_1.default, { items: activitiesByType || [], loadMoreData: loadMore, hasMore: pages[type.slug] !== type_1.MAX_PAGE, loadingComponent: (0, jsx_runtime_1.jsx)(WaitingData_1.default, { sx: { margin: "auto" } }), children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, paddingTop: theme.mixins.customPadding.p16, paddingBottom: theme.mixins.customPadding.p32, px: theme.mixins.customPadding.p16 }), children: activitiesByType === null || activitiesByType === void 0 ? void 0 : activitiesByType.map(function (activity, index) {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ width: "100%", height: "100%", display: "flex", paddingTop: theme.mixins.customPadding.p8, px: theme.mixins.customPadding.p16 }, sx), children: [status === Status.Loading && (0, jsx_runtime_1.jsx)(WaitingData_1.default, { sx: { marginBottom: "auto" } }), status === Status.Empty && ((0, jsx_runtime_1.jsx)(EmptyData_1.default, { sx: { marginBottom: "auto", marginTop: "4rem" }, icon: (0, getIcon_1.default)(prefix + "empty_" + type.slug), description: "No ".concat((_a = type.name) === null || _a === void 0 ? void 0 : _a.toLowerCase(), " activity") })), status === Status.Filled && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(SmartList_1.default, { loadMoreData: loadMore, hasMore: !loadOutActivityType[type.slug] &&
+                            ((activitiesByType === null || activitiesByType === void 0 ? void 0 : activitiesByType.length) || 0) < (limitItems || Infinity), loadingComponent: (0, jsx_runtime_1.jsx)(WaitingData_1.default, { numberOfSkeleton: 3, sx: { marginTop: theme.mixins.customMargin.m12 } }), sx: {}, children: (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12 }), children: (_b = activitiesByType === null || activitiesByType === void 0 ? void 0 : activitiesByType.slice(0, limitItems)) === null || _b === void 0 ? void 0 : _b.map(function (activity, index) {
                                 if (!activity)
                                     return null;
                                 var dataAsJson = JSON.stringify(activity);
                                 return ((0, jsx_runtime_1.jsx)(ActivityItem_1.default, { onClick: function () { return openDetail(activity); }, data: dataAsJson }, index));
-                            }) }) }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: detailDrawerRef, children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { onClose: closeDetail, title: (_b = detailActivity === null || detailActivity === void 0 ? void 0 : detailActivity.transaction_type) === null || _b === void 0 ? void 0 : _b.name, children: (0, jsx_runtime_1.jsx)(ActivityDetail_1.default, { activityData: detailActivity }) }) })] }))] }));
+                            }) }) }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: detailDrawerRef, children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { onClose: closeDetail, title: (_c = detailActivity === null || detailActivity === void 0 ? void 0 : detailActivity.transaction_type) === null || _c === void 0 ? void 0 : _c.name, children: (0, jsx_runtime_1.jsx)(ActivityDetail_1.default, { activityData: detailActivity }) }) })] }))] }));
 }
 exports.default = ActivitiesTypeSlice;

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

@@ -72,19 +72,19 @@ function ActivityDetail(props) {
     var getAmountColor = (0, react_1.useCallback)(function () {
         if (isIncrease)
             return theme.palette.text.successStatus;
-        return theme.palette.text.white;
+        return theme.palette.text.black;
     }, [isIncrease, theme]);
     if (!activityData)
         return null;
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g16, alignItems: "center" }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { mr: "0.5rem" }), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: currency === null || currency === void 0 ? void 0 : currency.link, width: 64, sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g16, alignItems: "center" }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.row), children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { src: currency === null || currency === void 0 ? void 0 : currency.link, width: 64, sx: {
                             borderRadius: theme.mixins.customRadius.full,
                             border: isSwap ? "0.25rem white solid" : "none",
-                            ml: "-0.5rem",
+                            // ml: "-0.5rem",
                         } }), (swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.link) && ((0, jsx_runtime_1.jsx)(Icon_1.default, { src: swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.link, width: 64, sx: {
                             borderRadius: theme.mixins.customRadius.full,
                             border: isSwap ? "0.25rem white solid" : "none",
-                            ml: "-0.5rem",
-                        } }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { width: "fit-content", gap: theme.mixins.gaps.g4, alignItems: "center" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeightBold, fontSize: theme.typography.fontSize24, color: getAmountColor(), opacity: isSwap ? 0.5 : 1 }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: isIncrease ? "+" : "-", value: activityData.amount, unit: " ".concat(currency === null || currency === void 0 ? void 0 : currency.name) }) }), isSwap && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeightBold, fontSize: theme.typography.fontSize24, color: theme.palette.text.successStatus }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: "+", value: swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.swap_total_amount, unit: " ".concat(swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.name) }) })), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: (0, formatDate_1.default)(activityData.date_created) }), status !== type_1.TransactionStatus.Success && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [status === type_1.TransactionStatus.Processing && ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "secondary", size: 16 })), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                            ml: "-1rem",
+                        } }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { width: "fit-content", gap: theme.mixins.gaps.g4, alignItems: "center" }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.column), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeight700, fontSize: theme.typography.fontSize24, color: getAmountColor() }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: isIncrease ? "+" : "-", value: activityData.amount, unit: " ".concat(currency === null || currency === void 0 ? void 0 : currency.name) }) }), isSwap && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeight700, fontSize: theme.typography.fontSize24, color: theme.palette.text.successStatus }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: "+", value: swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.swap_total_amount, unit: " ".concat(swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.name) }) }))] }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.mixins.valueDescription), children: (0, formatDate_1.default)(activityData.date_created) }), status !== type_1.TransactionStatus.Success && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [status === type_1.TransactionStatus.Processing && ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "secondary", size: 16 })), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                     fontSize: theme.typography.fontSize12,
                                     textTransform: "capitalize",
                                     color: getStatusColor(),

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

@@ -88,17 +88,22 @@ function ActivityItem(props) {
     var getAmountColor = (0, react_1.useCallback)(function () {
         if (isIncrease)
             return theme.palette.text.successStatus;
-        return theme.palette.text.white;
+        return theme.palette.text.black;
     }, [isIncrease, theme]);
     if (!activityData)
         return null;
-    return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, __assign({ sx: __assign(__assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, backgroundColor: theme.palette.background.white16, borderRadius: theme.mixins.customRadius.r16, p: theme.mixins.customPadding.p12, flexGrow: "unset", boxShadow: theme.shadows[1] }), sx) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.ListItemButton, __assign({ sx: __assign(__assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g8, backgroundColor: theme.palette.background.tertiary, borderRadius: theme.mixins.customRadius.r16, p: theme.mixins.customPadding.p12, flexGrow: "unset", boxShadow: theme.shadows[1] }), sx) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
                     width: "fit-content",
                     height: "fit-content",
-                }, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: type === null || type === void 0 ? void 0 : type.link, width: 24 }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { width: "fit-content", gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.activityTitle, children: type === null || type === void 0 ? void 0 : type.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.activityDescription, children: descriptionElement }), status !== type_1.TransactionStatus.Success && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [status === type_1.TransactionStatus.Processing && ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "secondary", size: 12 })), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                }, children: (0, jsx_runtime_1.jsx)(Icon_1.default, { src: type === null || type === void 0 ? void 0 : type.link, width: 24, sx: { borderRadius: theme.mixins.customRadius.full } }) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { width: "fit-content", gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.activityTitle, children: type === null || type === void 0 ? void 0 : type.name }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: theme.mixins.activityDescription, children: descriptionElement }), status !== type_1.TransactionStatus.Success && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [status === type_1.TransactionStatus.Processing && ((0, jsx_runtime_1.jsx)(material_1.CircularProgress, { color: "secondary", size: 12 })), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                     fontSize: theme.typography.fontSize12,
                                     textTransform: "capitalize",
                                     color: getStatusColor(),
-                                }, children: status })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g2, width: "fit-content", alignItems: "flex-end", ml: "auto" }), children: [slug === type_1.TransactionSlug.SWAP && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeightBold, color: theme.palette.text.successStatus, textAlign: "right" }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: "+", value: swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.swap_total_amount, unit: " ".concat(swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.name) }) })), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeightBold, color: getAmountColor(), textAlign: "right" }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: isIncrease ? "+" : "-", value: activityData.amount, unit: " ".concat(currency === null || currency === void 0 ? void 0 : currency.name) }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { textAlign: "right" }), children: (0, formatDate_1.default)(activityData.date_created) })] })] })));
+                                }, children: status })] }))] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g2, width: "fit-content", alignItems: "flex-end", ml: "auto" }), children: [slug === type_1.TransactionSlug.SWAP && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { fontWeight: theme.typography.fontWeight700, fontSize: theme.typography.fontSize13, color: theme.palette.text.successStatus, textAlign: "right" }), children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: "+", value: swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.swap_total_amount, unit: " ".concat(swapToCurrency === null || swapToCurrency === void 0 ? void 0 : swapToCurrency.name) }) })), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                            fontSize: theme.typography.fontSize13,
+                            fontWeight: theme.typography.fontWeight700,
+                            color: getAmountColor(),
+                            textAlign: "right",
+                        }, children: (0, jsx_runtime_1.jsx)(Formatter_1.default, { start: isIncrease ? "+" : "-", value: activityData.amount, unit: " ".concat(currency === null || currency === void 0 ? void 0 : currency.name) }) }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.valueDescription), { textAlign: "right" }), children: (0, formatDate_1.default)(activityData.date_created) })] })] })));
 }
 exports.default = ActivityItem;

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

@@ -16,123 +16,125 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
-var framer_motion_1 = require("framer-motion");
 var AnalyticGroup_1 = __importDefault(require("../AnalyticGroup"));
 var TimeFilter_1 = __importDefault(require("../TimeFilter"));
-var TimeFilter_2 = require("../TimeFilter");
 var DelayMounted_1 = __importDefault(require("../DelayMounted"));
 var material_1 = require("@mui/material");
 var ThemeProvider_1 = require("../../../providers/ThemeProvider");
 var NeonLineChart_1 = __importDefault(require("../NeonLineChart"));
-var ContentHiddenProvider_1 = require("../../../providers/ContentHiddenProvider");
 var SvgPath_1 = require("../SvgPath");
-var fakeSeries = [
-    {
-        name: "All",
-        data: [
-            1003785.6864951615, 1003795.988344575, 1003827.99766239, 1003899.7426850981,
-            1003891.7710159089, 1003810.6439517767, 1003780.7195320514, 1003797.9506016063,
-            1003781.455378438, 1003782.0072632281, 1003715.167883104, 1003724.9791682598,
-            1003716.6018329085, 1003711.3282671372, 1003686.1868489254, 1003625.4795220237,
-            1003584.3334449014, 1003498.9139435134, 1003310.7825506503, 1003339.72584186,
-            1003334.3069939599, 1003364.3540547496, 1003394.4011155394, 1003398.386950134,
-            1003233.005474726, 1003185.2981006557, 1003165.7981714085,
-        ],
-    },
-];
-var labels = [
-    "2025-03-04T08:10:17.311Z",
-    "2025-03-04T12:10:18.859Z",
-    "2025-03-04T16:10:19.118Z",
-    "2025-03-04T20:10:18.246Z",
-    "2025-03-05T00:10:18.371Z",
-    "2025-03-05T10:12:40.882Z",
-    "2025-03-05T14:12:42.832Z",
-    "2025-03-05T18:12:41.114Z",
-    "2025-03-05T22:12:40.544Z",
-    "2025-03-06T02:12:40.718Z",
-    "2025-03-08T10:35:52.596Z",
-    "2025-03-08T14:35:52.979Z",
-    "2025-03-08T16:01:31.209Z",
-    "2025-03-08T18:35:52.824Z",
-    "2025-03-08T22:35:52.901Z",
-    "2025-03-09T06:35:53.327Z",
-    "2025-03-09T10:35:52.682Z",
-    "2025-03-09T14:35:53.001Z",
-    "2025-03-09T18:35:52.886Z",
-    "2025-03-09T22:35:52.880Z",
-    "2025-03-10T03:43:34.153Z",
-    "2025-03-10T06:35:52.944Z",
-    "2025-03-10T10:35:52.253Z",
-    "2025-03-10T14:35:52.727Z",
-    "2025-03-10T18:35:52.865Z",
-    "2025-03-10T22:35:53.563Z",
-    "2025-03-11T04:16:45.409Z",
-];
-var defaultTimeRange = TimeFilter_2.TimeFilterType.SEVEN_DAYS;
-var variants = {
-    hidden: { opacity: 0, display: "none" },
-    visible: { opacity: 1, display: "block" },
-};
+var user_1 = __importDefault(require("../../../store/user"));
+var balance_1 = __importDefault(require("../../../store/balance"));
+var useWallet_1 = __importDefault(require("../../../hooks/useWallet"));
+// const fakeSeries = [
+//   {
+//     name: "All",
+//     data: [
+//       1003785.6864951615, 1003795.988344575, 1003827.99766239, 1003899.7426850981,
+//       1003891.7710159089, 1003810.6439517767, 1003780.7195320514, 1003797.9506016063,
+//       1003781.455378438, 1003782.0072632281, 1003715.167883104, 1003724.9791682598,
+//       1003716.6018329085, 1003711.3282671372, 1003686.1868489254, 1003625.4795220237,
+//       1003584.3334449014, 1003498.9139435134, 1003310.7825506503, 1003339.72584186,
+//       1003334.3069939599, 1003364.3540547496, 1003394.4011155394, 1003398.386950134,
+//       1003233.005474726, 1003185.2981006557, 1003165.7981714085,
+//     ],
+//   },
+// ];
+// const labels = [
+//   "2025-03-04T08:10:17.311Z",
+//   "2025-03-04T12:10:18.859Z",
+//   "2025-03-04T16:10:19.118Z",
+//   "2025-03-04T20:10:18.246Z",
+//   "2025-03-05T00:10:18.371Z",
+//   "2025-03-05T10:12:40.882Z",
+//   "2025-03-05T14:12:42.832Z",
+//   "2025-03-05T18:12:41.114Z",
+//   "2025-03-05T22:12:40.544Z",
+//   "2025-03-06T02:12:40.718Z",
+//   "2025-03-08T10:35:52.596Z",
+//   "2025-03-08T14:35:52.979Z",
+//   "2025-03-08T16:01:31.209Z",
+//   "2025-03-08T18:35:52.824Z",
+//   "2025-03-08T22:35:52.901Z",
+//   "2025-03-09T06:35:53.327Z",
+//   "2025-03-09T10:35:52.682Z",
+//   "2025-03-09T14:35:53.001Z",
+//   "2025-03-09T18:35:52.886Z",
+//   "2025-03-09T22:35:52.880Z",
+//   "2025-03-10T03:43:34.153Z",
+//   "2025-03-10T06:35:52.944Z",
+//   "2025-03-10T10:35:52.253Z",
+//   "2025-03-10T14:35:52.727Z",
+//   "2025-03-10T18:35:52.865Z",
+//   "2025-03-10T22:35:53.563Z",
+//   "2025-03-11T04:16:45.409Z",
+// ];
 var AmountGroupAndChart = function (props) {
+    var defaultTimeRange = (0, user_1.default)(function (state) { return state.settings.balance.timeRangeTracking; });
     var _a = (0, react_1.useState)(false), expandAreaChart = _a[0], setExpandAreaChart = _a[1];
     var _b = (0, react_1.useState)(), timeRangeData = _b[0], setTimeRangeData = _b[1];
-    var isHidden = (0, ContentHiddenProvider_1.useContentHidden)().isHidden;
     var theme = (0, ThemeProvider_1.useTheme)();
+    var isShowBalance = (0, user_1.default)(function (state) { return state.settings.balance.isShowBalance; });
+    var analytic = (0, balance_1.default)(function (state) { return state.analytic; });
+    var setTimeRangeTracking = (0, user_1.default)(function (state) { return state.setTimeRangeTracking; });
+    var updateBalanceAnalytic = (0, useWallet_1.default)().updateBalanceAnalytic;
+    var series = (0, react_1.useMemo)(function () {
+        var _a;
+        return (_a = analytic === null || analytic === void 0 ? void 0 : analytic.data) === null || _a === void 0 ? void 0 : _a.map(function (item) { return ({
+            name: item.name,
+            data: item.values,
+        }); });
+    }, [analytic]);
     var handleChangeTimeRange = function (data) {
         setTimeRangeData(data);
+        setTimeRangeTracking(data.type);
+        updateBalanceAnalytic(data.type);
     };
     var toggleExpand = function () {
         setExpandAreaChart(function (prev) { return !prev; });
     };
-    return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign(__assign({}, props.sx), { width: "100%" }), children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({}, theme.mixins.column), children: [(0, jsx_runtime_1.jsx)(AnalyticGroup_1.default, { timeRange: timeRangeData === null || timeRangeData === void 0 ? void 0 : timeRangeData.type }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { position: "relative", marginTop: theme.mixins.customMargin.m12 }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
-                                width: "100%",
-                                position: "relative",
-                                transition: "all 500ms ease-in-out",
-                                // aspectRatio: expandAreaChart ? "1.47317073171" : 999999,
-                                zIndex: 10,
-                                minHeight: expandAreaChart ? "16rem" : "0",
-                                maxHeight: expandAreaChart ? "28rem" : "0",
-                            }, children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
-                                        position: "absolute",
-                                        top: 0,
-                                        right: 0,
-                                        left: 0,
-                                        bottom: 0,
-                                        transition: "all 500ms ease-in-out",
-                                        transform: !expandAreaChart ? "translateX(-25%) scale(0.5)" : "none",
-                                        display: isHidden && !expandAreaChart ? "none" : "block",
-                                    }, children: (0, jsx_runtime_1.jsx)(DelayMounted_1.default, { delay: 800, children: (0, jsx_runtime_1.jsx)(NeonLineChart_1.default, { showMinMaxValues: expandAreaChart, series: fakeSeries, categories: labels, sx: {
-                                                width: "100%",
-                                                height: "fit-content",
-                                                transition: "all 500ms ease-in-out",
-                                                transform: !expandAreaChart ? "translateY(-100%)" : "none",
-                                                my: theme.mixins.customMargin.m3,
-                                            } }) }) }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { style: {
-                                        position: "relative",
-                                        transform: "translateY(350%)",
-                                    }, initial: "hidden", animate: expandAreaChart ? "visible" : "hidden", variants: variants, transition: {
-                                        opacity: {
-                                            duration: expandAreaChart ? 0.5 : 0.25,
-                                            ease: "linear",
-                                            delay: expandAreaChart ? 0.5 : 0,
-                                        },
-                                        display: {
-                                            duration: 0,
-                                            ease: "linear",
-                                            delay: expandAreaChart ? 0.5 : 0.25,
-                                        },
-                                    }, children: (0, jsx_runtime_1.jsx)(DelayMounted_1.default, { delay: 100, children: (0, jsx_runtime_1.jsx)(TimeFilter_1.default, { hideAll: true, initialValue: defaultTimeRange, onChange: handleChangeTimeRange }) }) })] }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { onClick: toggleExpand, sx: {
-                                alignSelf: "center",
-                                transition: "all 500ms ease-in-out",
-                                cursor: "pointer",
-                                mt: theme.mixins.customMargin.m4,
-                                transform: !expandAreaChart
-                                    ? "rotate(180deg) translateX(900%) translateY(120%)"
-                                    : "translateX(-50%) translateY(100%)",
-                                zIndex: 20,
-                                width: 20,
-                                height: 20,
-                            }, children: SvgPath_1.IC_EXPANDER_ARROW })] })] }) }));
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ width: "100%", height: "fit-content", position: "relative" }, props.sx), children: [(0, jsx_runtime_1.jsx)(AnalyticGroup_1.default, { sx: { position: "relative" }, timeRange: timeRangeData === null || timeRangeData === void 0 ? void 0 : timeRangeData.type }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                    width: "100%",
+                    position: "relative",
+                    transition: "all 500ms ease-in-out",
+                    top: expandAreaChart ? "0px" : "-30px",
+                    aspectRatio: expandAreaChart ? "1.6" : 6.2,
+                }, children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                            position: "absolute",
+                            top: 0,
+                            right: 0,
+                            left: 0,
+                            bottom: 0,
+                            transition: "all 500ms ease-in-out",
+                            transform: !expandAreaChart ? "scale(0.5)" : "scale(1)",
+                            transformOrigin: "top left",
+                        }, children: (0, jsx_runtime_1.jsx)(DelayMounted_1.default, { delay: 800, children: (0, jsx_runtime_1.jsx)(NeonLineChart_1.default, { showMinMaxValues: expandAreaChart && isShowBalance, series: series, categories: analytic === null || analytic === void 0 ? void 0 : analytic.labels, sx: {
+                                    width: "100%",
+                                    height: "fit-content",
+                                    transition: "all 500ms ease-in-out",
+                                    my: theme.mixins.customMargin.m3,
+                                }, children: (0, jsx_runtime_1.jsx)(DelayMounted_1.default, { delay: 800, children: (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { onClick: toggleExpand, sx: {
+                                            position: "absolute",
+                                            right: 0,
+                                            bottom: 0,
+                                            width: 20,
+                                            height: 20,
+                                            cursor: "pointer",
+                                            zIndex: 9999,
+                                            transition: "all 500ms ease-in-out",
+                                            transform: !expandAreaChart
+                                                ? "scale(2) translate(50%, -50%)"
+                                                : "scale(1) translate(50%, -50%)",
+                                        }, children: SvgPath_1.IC_EXPANDER_ARROW }) }) }) }) }), (0, jsx_runtime_1.jsx)(TimeFilter_1.default, { hideAll: true, initialValue: defaultTimeRange, onChange: handleChangeTimeRange, sx: {
+                            position: "absolute",
+                            bottom: 0,
+                            left: 0,
+                            right: 0,
+                            opacity: expandAreaChart ? 1 : 0,
+                            transform: expandAreaChart ? "scale(1)" : "scale(0)",
+                            transition: expandAreaChart
+                                ? "opacity 300ms ease-in-out 500ms, transform 0ms ease-in-out 0ms"
+                                : "opacity 200ms ease-in-out 0ms, transform 0ms ease-in-out 200ms",
+                        } })] })] }));
 };
 exports.default = AmountGroupAndChart;

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

@@ -1,6 +1,7 @@
 import { GeneralProps } from "../../../types/ui";
+import { TimeFilterType } from "../TimeFilter";
 interface AnalyticGroupProps extends GeneralProps {
-    timeRange?: string;
+    timeRange?: TimeFilterType;
 }
 declare const AnalyticGroup: (props: AnalyticGroupProps) => import("react/jsx-runtime").JSX.Element;
 export default AnalyticGroup;

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

@@ -19,61 +19,76 @@ var Text_1 = __importDefault(require("../Text"));
 var Formatter_1 = __importDefault(require("../Formatter"));
 var material_1 = require("@mui/material");
 var providers_1 = require("../../../providers");
-var ContentHiddenProvider_1 = require("../../../providers/ContentHiddenProvider");
 var SvgPath_1 = require("../SvgPath");
+var TimeFilter_1 = require("../TimeFilter");
+var user_1 = __importDefault(require("../../../store/user"));
+var balance_1 = __importDefault(require("../../../store/balance"));
 var AnalyticGroup = function (props) {
+    var sx = props.sx;
     var theme = (0, providers_1.useTheme)();
-    var _a = (0, ContentHiddenProvider_1.useContentHidden)(), isHidden = _a.isHidden, setIsHidden = _a.setIsHidden;
-    var toggleHidden = function () {
-        setIsHidden(!isHidden);
-    };
-    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { justifyContent: "space-between" }), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g6, position: "relative", bottom: "30px" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+    var isShowBalance = (0, user_1.default)(function (state) { return state.settings.balance.isShowBalance; });
+    var toggleShowBalance = (0, user_1.default)(function (state) { return state.toggleShowBalance; });
+    var totalBalanceInUSD = (0, balance_1.default)(function (state) { return state.totalBalanceInUSD; });
+    var analytic = (0, balance_1.default)(function (state) { return state.analytic; });
+    return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.mixins.row), { justifyContent: "space-between", alignItems: "flex-start" }), sx), children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g6, position: "relative" }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                             fontSize: theme.typography.fontSize15,
                             fontWeight: theme.typography.fontWeight500,
                             color: theme.palette.text.accent2,
-                        }, children: "Total Amount" }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { onClick: toggleHidden, sx: { cursor: "pointer", width: 14, height: 14 }, children: SvgPath_1.IC_NO_SEE })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
+                        }, children: "Total Amount" }), (0, jsx_runtime_1.jsxs)(material_1.Box, { onClick: toggleShowBalance, sx: {
+                            position: "relative",
+                        }, children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { cursor: "pointer", width: 20, height: 20 }, children: SvgPath_1.IC_NO_SEE }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
+                                    position: "absolute",
+                                    left: "50%",
+                                    width: "2px",
+                                    top: "50%",
+                                    height: !isShowBalance ? "80%" : "0px",
+                                    transition: "height 0.2s ease-in-out",
+                                    backgroundColor: theme.palette.text.accent2,
+                                    transform: "translate(calc(-50% + 1px), calc(-50% + 1px)) rotate(45deg)",
+                                    transformOrigin: "center center",
+                                } })] })] }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
                     display: "flex",
                     flexDirection: "column",
                     alignItems: "flex-end",
                     gap: theme.mixins.gaps.g6,
                     fontSize: theme.typography.fontSize12,
-                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign(__assign({}, theme.mixins.row), theme.mixins.value), { fontSize: theme.typography.fontSize20, gap: theme.mixins.gaps.g6 }), children: !isHidden ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: { fontWeight: theme.typography.fontWeight700 }, value: 1000000 }), (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: {
+                }, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign(__assign({}, theme.mixins.row), theme.mixins.value), { alignItems: "baseline", fontSize: theme.typography.fontSize20, gap: theme.mixins.gaps.g2 }), children: isShowBalance ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Formatter_1.default, { sx: { fontWeight: theme.typography.fontWeight700 }, value: totalBalanceInUSD, unit: "USD", hideUnitOutSide: true }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g2 }), children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                                 fontWeight: theme.typography.fontWeight400,
                                                 fontSize: "0.8em",
-                                            }, children: "USDC" }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { cursor: "pointer", width: 8, height: 8 }, children: SvgPath_1.ARROW_DROP_DOWN })] })] })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                            }, children: "USD" }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { cursor: "pointer", width: 8, height: 8 }, children: SvgPath_1.ARROW_DROP_DOWN })] })] })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                 fontSize: theme.typography.fontSize24,
                                 fontWeight: theme.typography.fontWeight700,
                                 color: theme.palette.text.black,
-                            }, children: "*****" })) }), (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: {
-                                    fontWeight: theme.typography.fontWeight600,
-                                    leading: theme.typography.leading140,
-                                    fontSize: theme.typography.fontSize12,
-                                    textTransform: "capitalize",
-                                    color: theme.palette.text.accent,
-                                }, children: props.timeRange }), !isHidden ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { cursor: "pointer", width: 8, height: 8 }, children: SvgPath_1.ARROW_DROP_UP }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: theme.palette.text.alertStatus, fontSize: theme.typography.fontSize12, fontWeight: theme.typography.fontWeight600, borderBottom: "1px dashed currentColor" }), children: "5.63 (+3,22%)" })] })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                    fontSize: theme.typography.fontSize12,
+                            }, children: "******" })) }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.row), { gap: theme.mixins.gaps.g4 }), children: [!!props.timeRange && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                     fontWeight: theme.typography.fontWeight600,
-                                    color: theme.palette.text.accent2,
-                                    display: theme.mixins.row,
-                                }, children: "****" }))] }), (0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
-                            width: "110%",
-                            borderColor: "".concat(theme.palette.border.accent),
-                            opacity: 0.2,
-                            marginTop: theme.mixins.customMargin.m4,
-                        } }), (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: {
-                                    fontWeight: theme.typography.fontWeight500,
                                     leading: theme.typography.leading140,
                                     fontSize: theme.typography.fontSize12,
                                     textTransform: "capitalize",
                                     color: theme.palette.text.accent,
-                                }, children: "Profit" }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({}, theme.mixins.row), children: !isHidden ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                }, children: TimeFilter_1.TIME_FILTER_LABEL[props.timeRange] })), !!(analytic === null || analytic === void 0 ? void 0 : analytic.pnl) && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [isShowBalance && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { cursor: "pointer", width: 8, height: 8 }, children: SvgPath_1.ARROW_DROP_UP }), (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.mixins.value), { color: theme.palette.text.alertStatus, fontSize: theme.typography.fontSize12, fontWeight: theme.typography.fontWeight600, borderBottom: "1px dashed currentColor" }), children: [(0, jsx_runtime_1.jsx)("span", { children: (analytic === null || analytic === void 0 ? void 0 : analytic.pnl) > 0 ? "+" : "" }), " ", (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: analytic === null || analytic === void 0 ? void 0 : analytic.pnl }), " ", "(", (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: analytic === null || analytic === void 0 ? void 0 : analytic.pnl_percent, unit: "%" }), ")"] })] })), !isShowBalance && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
                                             fontSize: theme.typography.fontSize12,
                                             fontWeight: theme.typography.fontWeight600,
                                             color: theme.palette.text.accent2,
-                                        }, children: "\u2248 250k XP" }) })) : ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                                        fontSize: theme.typography.fontSize12,
-                                        fontWeight: theme.typography.fontWeight600,
-                                        color: theme.palette.text.accent2,
-                                    }, children: "****" })) }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { cursor: "pointer", width: 14, height: 14 }, children: SvgPath_1.IC_INFORMATION })] })] })] }));
+                                            display: theme.mixins.row,
+                                        }, children: "******" }))] }))] }), false && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Divider, { sx: {
+                                    width: "110%",
+                                    borderColor: "".concat(theme.palette.border.accent),
+                                    opacity: 0.2,
+                                    marginTop: theme.mixins.customMargin.m4,
+                                } }), isShowBalance && ((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: {
+                                            fontWeight: theme.typography.fontWeight500,
+                                            leading: theme.typography.leading140,
+                                            fontSize: theme.typography.fontSize12,
+                                            textTransform: "capitalize",
+                                            color: theme.palette.text.accent,
+                                        }, children: "Profit" }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: __assign({}, theme.mixins.row), children: (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                                    fontSize: theme.typography.fontSize12,
+                                                    fontWeight: theme.typography.fontWeight600,
+                                                    color: theme.palette.text.accent2,
+                                                }, children: "\u2248 250k XP" }) }) }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { cursor: "pointer", width: 14, height: 14 }, children: SvgPath_1.IC_INFORMATION })] })), !isShowBalance && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
+                                    fontSize: theme.typography.fontSize12,
+                                    fontWeight: theme.typography.fontWeight600,
+                                    color: theme.palette.text.accent2,
+                                }, children: "******" }))] }))] })] }));
 };
 exports.default = AnalyticGroup;

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

@@ -104,7 +104,7 @@ var CopyTextComponent = function (_a) {
                         ? "opacity 0.5s linear, transform 0.17s linear"
                         : "opacity 0.15s linear, transform 0.1s linear",
                 }, children: [iconSuccess || (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: { width: "1rem", height: "1rem" }, children: SvgPath_1.IC_SUCCESS }), !hideTextMessage && ((0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
-                            color: theme.palette.text.successStatus,
+                            color: "#01FF00",
                             fontSize: theme.typography.fontSize14,
                             lineHeight: theme.typography.leading100,
                         }, children: "Copied" }))] })] }));