tek-wallet 0.0.540 → 0.0.542
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -23,6 +23,9 @@ var ActivityItem_1 = __importDefault(require("../ActivityItem"));
|
|
|
23
23
|
var useActivities_1 = __importDefault(require("../../../hooks/useActivities"));
|
|
24
24
|
var react_1 = require("react");
|
|
25
25
|
var WaitingData_1 = __importDefault(require("../WaitingData"));
|
|
26
|
+
var DrawerComponent_1 = __importDefault(require("../DrawerComponent"));
|
|
27
|
+
var ModalLayout_1 = __importDefault(require("../ModalLayout"));
|
|
28
|
+
var ActivityDetail_1 = __importDefault(require("../ActivityDetail"));
|
|
26
29
|
var Status;
|
|
27
30
|
(function (Status) {
|
|
28
31
|
Status["Loading"] = "loading";
|
|
@@ -31,10 +34,12 @@ var Status;
|
|
|
31
34
|
})(Status || (exports.Status = Status = {}));
|
|
32
35
|
var prefix = "activities_";
|
|
33
36
|
function ActivitiesTypeSlice(props) {
|
|
34
|
-
var _a;
|
|
37
|
+
var _a, _b;
|
|
35
38
|
var theme = (0, material_1.useTheme)();
|
|
36
|
-
var
|
|
39
|
+
var _c = (0, useActivities_1.default)(), activities = _c.activities, updateActivities = _c.updateActivities, isLoadingActivities = _c.isLoadingActivities;
|
|
37
40
|
var type = props.type, isActive = props.isActive;
|
|
41
|
+
var _d = (0, react_1.useState)(undefined), detailActivity = _d[0], setDetailActivity = _d[1];
|
|
42
|
+
var detailDrawerRef = (0, react_1.useRef)(null);
|
|
38
43
|
var activitiesByType = (0, react_1.useMemo)(function () {
|
|
39
44
|
if (!(type === null || type === void 0 ? void 0 : type.slug))
|
|
40
45
|
return undefined;
|
|
@@ -47,6 +52,16 @@ function ActivitiesTypeSlice(props) {
|
|
|
47
52
|
return Status.Filled;
|
|
48
53
|
return Status.Empty;
|
|
49
54
|
}, [type, activitiesByType]);
|
|
55
|
+
var openDetail = (0, react_1.useCallback)(function (activity) {
|
|
56
|
+
var _a;
|
|
57
|
+
setDetailActivity(activity);
|
|
58
|
+
(_a = detailDrawerRef.current) === null || _a === void 0 ? void 0 : _a.open();
|
|
59
|
+
}, []);
|
|
60
|
+
var closeDetail = (0, react_1.useCallback)(function (e) {
|
|
61
|
+
var _a;
|
|
62
|
+
e.stopPropagation();
|
|
63
|
+
(_a = detailDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
|
|
64
|
+
}, []);
|
|
50
65
|
(0, react_1.useEffect)(function () {
|
|
51
66
|
if (!isActive || !(type === null || type === void 0 ? void 0 : type.slug) || !!activitiesByType || isLoadingActivities[type.slug])
|
|
52
67
|
return;
|
|
@@ -56,11 +71,11 @@ function ActivitiesTypeSlice(props) {
|
|
|
56
71
|
take: 10,
|
|
57
72
|
});
|
|
58
73
|
}, [isActive, type, activitiesByType, updateActivities]);
|
|
59
|
-
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.jsx)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, paddingTop: theme.mixins.customPadding.p16 }), children: activitiesByType === null || activitiesByType === void 0 ? void 0 : activitiesByType.map(function (activity, index) {
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
74
|
+
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)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g12, paddingTop: theme.mixins.customPadding.p16 }), children: activitiesByType === null || activitiesByType === void 0 ? void 0 : activitiesByType.map(function (activity, index) {
|
|
75
|
+
if (!activity)
|
|
76
|
+
return null;
|
|
77
|
+
var dataAsJson = JSON.stringify(activity);
|
|
78
|
+
return (0, jsx_runtime_1.jsx)(ActivityItem_1.default, { onClick: function () { return openDetail(activity); }, data: dataAsJson }, index);
|
|
79
|
+
}) }), (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 }) }) })] }))] }));
|
|
65
80
|
}
|
|
66
81
|
exports.default = ActivitiesTypeSlice;
|
|
@@ -35,14 +35,10 @@ var Text_1 = __importDefault(require("../Text"));
|
|
|
35
35
|
var Formatter_1 = __importDefault(require("../Formatter"));
|
|
36
36
|
var formatDate_1 = __importDefault(require("../../../utils/formatDate"));
|
|
37
37
|
var compactWalletAddress_1 = __importDefault(require("../../../utils/compactWalletAddress"));
|
|
38
|
-
var DrawerComponent_1 = __importDefault(require("../DrawerComponent"));
|
|
39
|
-
var ActivityDetail_1 = __importDefault(require("../ActivityDetail"));
|
|
40
|
-
var ModalLayout_1 = __importDefault(require("../ModalLayout"));
|
|
41
38
|
function ActivityItem(props) {
|
|
42
|
-
var _a
|
|
39
|
+
var _a;
|
|
43
40
|
var sx = props.sx, data = props.data, rest = __rest(props, ["sx", "data"]);
|
|
44
41
|
var theme = (0, material_1.useTheme)();
|
|
45
|
-
var detailDrawerRef = (0, react_1.useRef)(null);
|
|
46
42
|
var activityData = (0, react_1.useMemo)(function () {
|
|
47
43
|
if (!data)
|
|
48
44
|
return undefined;
|
|
@@ -69,15 +65,6 @@ function ActivityItem(props) {
|
|
|
69
65
|
}
|
|
70
66
|
return null;
|
|
71
67
|
}, [slug, activityData === null || activityData === void 0 ? void 0 : activityData.from_address, activityData === null || activityData === void 0 ? void 0 : activityData.to_address]);
|
|
72
|
-
var openDetail = (0, react_1.useCallback)(function () {
|
|
73
|
-
var _a;
|
|
74
|
-
(_a = detailDrawerRef.current) === null || _a === void 0 ? void 0 : _a.open();
|
|
75
|
-
}, []);
|
|
76
|
-
var closeDetail = (0, react_1.useCallback)(function (e) {
|
|
77
|
-
var _a;
|
|
78
|
-
e.stopPropagation();
|
|
79
|
-
(_a = detailDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
|
|
80
|
-
}, []);
|
|
81
68
|
var getStatusColor = (0, react_1.useCallback)(function () {
|
|
82
69
|
switch (status) {
|
|
83
70
|
case type_1.TransactionStatus.Processing:
|
|
@@ -97,13 +84,13 @@ function ActivityItem(props) {
|
|
|
97
84
|
}, [isIncrease, theme]);
|
|
98
85
|
if (!activityData)
|
|
99
86
|
return null;
|
|
100
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
87
|
+
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: {
|
|
88
|
+
width: "fit-content",
|
|
89
|
+
height: "fit-content",
|
|
90
|
+
}, 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: {
|
|
91
|
+
fontSize: theme.typography.fontSize12,
|
|
92
|
+
textTransform: "capitalize",
|
|
93
|
+
color: getStatusColor(),
|
|
94
|
+
}, 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: [(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((_a = activityData.currency_data) === null || _a === void 0 ? void 0 : _a.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) })] })] })));
|
|
108
95
|
}
|
|
109
96
|
exports.default = ActivityItem;
|