tek-wallet 0.0.813 → 0.0.822
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.
- package/dist/components/TekWallet/components/ui/AssetsBoard/index.d.ts +2 -0
- package/dist/components/TekWallet/components/ui/AssetsBoard/index.js +60 -0
- package/dist/components/TekWallet/components/ui/ChangePasscode/index.js +1 -1
- package/dist/components/TekWallet/components/ui/ConfirmByPasscode/index.js +4 -4
- package/dist/components/TekWallet/components/ui/ConfirmSendExternal/index.d.ts +2 -2
- package/dist/components/TekWallet/components/ui/ConfirmSendExternal/index.js +1 -1
- package/dist/components/TekWallet/components/ui/ConfirmSendNft/Result.d.ts +10 -0
- package/dist/components/TekWallet/components/ui/ConfirmSendNft/Result.js +87 -0
- package/dist/components/TekWallet/components/ui/ConfirmSendNft/index.d.ts +17 -0
- package/dist/components/TekWallet/components/ui/ConfirmSendNft/index.js +133 -0
- package/dist/components/TekWallet/components/ui/ConfirmSwapToken/index.d.ts +1 -1
- package/dist/components/TekWallet/components/ui/ConfirmSwapToken/index.js +1 -1
- package/dist/components/TekWallet/components/ui/DrawerComponent/index.d.ts +1 -1
- package/dist/components/TekWallet/components/ui/DrawerComponent/index.js +2 -1
- package/dist/components/TekWallet/components/ui/LoadingLayout/index.js +1 -1
- package/dist/components/TekWallet/components/ui/NftDetail/index.d.ts +6 -0
- package/dist/components/TekWallet/components/ui/NftDetail/index.js +47 -0
- package/dist/components/TekWallet/components/ui/NftItem/index.d.ts +8 -0
- package/dist/components/TekWallet/components/ui/NftItem/index.js +74 -0
- package/dist/components/TekWallet/components/ui/NftsBoard/index.d.ts +2 -0
- package/dist/components/TekWallet/components/ui/NftsBoard/index.js +118 -0
- package/dist/components/TekWallet/components/ui/QrCodeReader/index.js +1 -1
- package/dist/components/TekWallet/components/ui/ReceiveDirectly/index.js +1 -1
- package/dist/components/TekWallet/components/ui/ReceiveFunction/index.js +2 -2
- package/dist/components/TekWallet/components/ui/ReceiveHistory/index.js +1 -1
- package/dist/components/TekWallet/components/ui/TokensBoard/index.js +21 -44
- package/dist/components/TekWallet/components/ui/WithdrawFunction/index.js +1 -1
- package/dist/components/TekWallet/components/views/AssetView/index.js +2 -2
- package/dist/components/TekWallet/components/views/NftDetailView/LoadingView.d.ts +2 -0
- package/dist/components/TekWallet/components/views/NftDetailView/LoadingView.js +29 -0
- package/dist/components/TekWallet/components/views/NftDetailView/index.d.ts +8 -0
- package/dist/components/TekWallet/components/views/NftDetailView/index.js +20 -0
- package/dist/components/TekWallet/components/views/SendExternalView/index.js +1 -1
- package/dist/components/TekWallet/components/views/SendNftView/components/Form.d.ts +12 -0
- package/dist/components/TekWallet/components/views/SendNftView/components/Form.js +268 -0
- package/dist/components/TekWallet/components/views/SendNftView/index.d.ts +2 -0
- package/dist/components/TekWallet/components/views/SendNftView/index.js +32 -0
- package/dist/components/TekWallet/components/views/SwapView/index.js +1 -1
- package/dist/components/TekWallet/components/views/TekWalletView/index.d.ts +1 -0
- package/dist/components/TekWallet/components/views/TekWalletView/index.js +5 -0
- package/dist/components/TekWallet/hooks/data/useNfts/api.d.ts +5 -0
- package/dist/components/TekWallet/hooks/data/useNfts/api.js +83 -0
- package/dist/components/TekWallet/hooks/data/useNfts/index.d.ts +213 -0
- package/dist/components/TekWallet/hooks/data/useNfts/index.js +55 -0
- package/dist/components/TekWallet/hooks/data/useNfts/nftQueryKey.d.ts +5 -0
- package/dist/components/TekWallet/hooks/data/useNfts/nftQueryKey.js +18 -0
- package/dist/components/TekWallet/hooks/data/useNfts/service.type.d.ts +84 -0
- package/dist/components/TekWallet/hooks/data/useNfts/service.type.js +10 -0
- package/dist/components/TekWallet/hooks/data/useNfts/state.type.d.ts +4 -0
- package/dist/components/TekWallet/hooks/data/useNfts/state.type.js +2 -0
- package/dist/components/TekWallet/hooks/data/useNfts/useNft.d.ts +22 -0
- package/dist/components/TekWallet/hooks/data/useNfts/useNft.js +213 -0
- package/dist/components/TekWallet/hooks/data/useVouchers/service.type.d.ts +22 -0
- package/dist/components/TekWallet/hooks/data/useVouchers/service.type.js +14 -0
- package/dist/components/TekWallet/hooks/store/useQueryKeys/index.d.ts +3 -0
- package/dist/components/TekWallet/hooks/store/useQueryKeys/index.js +86 -0
- package/dist/components/TekWallet/hooks/store/useQueryKeys/type.d.ts +27 -0
- package/dist/components/TekWallet/hooks/store/useQueryKeys/type.js +29 -0
- package/dist/components/TekWallet/hooks/store/useQueryKeys/useQueryKeyDependence.d.ts +11 -0
- package/dist/components/TekWallet/hooks/store/useQueryKeys/useQueryKeyDependence.js +35 -0
- package/dist/components/TekWallet/hooks/store/useQueryKeys/useQueryKeyDependenceOnAccount.d.ts +6 -0
- package/dist/components/TekWallet/hooks/store/useQueryKeys/useQueryKeyDependenceOnAccount.js +25 -0
- package/dist/components/TekWallet/hooks/useCustomRouter.js +7 -3
- package/dist/components/TekWallet/hooks/utils/useEditPageQuery.d.ts +9 -0
- package/dist/components/TekWallet/hooks/utils/useEditPageQuery.js +86 -0
- package/dist/components/TekWallet/hooks/utils/useEditSinglePageQuery.d.ts +4 -0
- package/dist/components/TekWallet/hooks/utils/useEditSinglePageQuery.js +75 -0
- package/dist/components/TekWallet/providers/TanstackReactQuery/index.d.ts +4 -0
- package/dist/components/TekWallet/providers/TanstackReactQuery/index.js +30 -0
- package/dist/components/TekWallet/providers/TanstackReactQuery/query.config.d.ts +2 -0
- package/dist/components/TekWallet/providers/TanstackReactQuery/query.config.js +18 -0
- package/dist/components/TekWallet/providers/TekWalletProvider/index.d.ts +1 -0
- package/dist/components/TekWallet/providers/TekWalletProvider/index.js +3 -1
- package/dist/components/TekWallet/services/axios/clients/userClientRequest.d.ts +2 -2
- package/dist/components/TekWallet/services/axios/clients/userClientRequest.js +3 -3
- package/dist/components/TekWallet/services/axios/type.d.ts +11 -0
- package/dist/components/TekWallet/theme/mui/components/index.d.ts +1 -15
- package/dist/components/TekWallet/theme/mui/components/overrides/Button.d.ts +1 -15
- package/dist/components/TekWallet/theme/mui/components/overrides/Button.js +3 -8
- package/dist/components/TekWallet/theme/mui/palette.d.ts +10 -4
- package/dist/components/TekWallet/theme/mui/palette.js +6 -1
- package/dist/components/TekWallet/utils/getContractColor.d.ts +1 -1
- package/package.json +5 -2
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.AssetsBoard = void 0;
|
|
7
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
8
|
+
var material_1 = require("@mui/material");
|
|
9
|
+
var mui_1 = require("../../../theme/mui");
|
|
10
|
+
var SwiperControlled_1 = __importDefault(require("../SwiperControlled"));
|
|
11
|
+
var react_1 = require("swiper/react");
|
|
12
|
+
var TokensBoard_1 = __importDefault(require("../TokensBoard"));
|
|
13
|
+
var NftsBoard_1 = __importDefault(require("../NftsBoard"));
|
|
14
|
+
var ASSETS_TABS = [
|
|
15
|
+
{
|
|
16
|
+
name: "Tokens",
|
|
17
|
+
value: "tokens",
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
name: "NFTs",
|
|
21
|
+
value: "nfts",
|
|
22
|
+
},
|
|
23
|
+
];
|
|
24
|
+
var AssetsBoard = function () {
|
|
25
|
+
var theme = (0, mui_1.useTheme)();
|
|
26
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Box, { children: (0, jsx_runtime_1.jsx)(SwiperControlled_1.default, { swiperProps: {
|
|
27
|
+
slidesPerView: 1,
|
|
28
|
+
spaceBetween: 40,
|
|
29
|
+
}, tabParamName: "assets-tab", tabs: ASSETS_TABS === null || ASSETS_TABS === void 0 ? void 0 : ASSETS_TABS.map(function (type, index) {
|
|
30
|
+
return ((0, jsx_runtime_1.jsx)(material_1.Tab, { label: type.name, value: index, "data-index": index, sx: {
|
|
31
|
+
padding: "".concat(theme.styleMixins.customPadding.p8, " ").concat(theme.styleMixins.customPadding.p16),
|
|
32
|
+
minHeight: "unset",
|
|
33
|
+
minWidth: "unset",
|
|
34
|
+
textTransform: "capitalize",
|
|
35
|
+
color: theme.palette.text.secondary,
|
|
36
|
+
transition: "all 0.3s linear",
|
|
37
|
+
fontSize: theme.typography.fontSize12,
|
|
38
|
+
borderColor: "currentcolor",
|
|
39
|
+
"&.Mui-selected": {
|
|
40
|
+
color: theme.palette.text.primary,
|
|
41
|
+
},
|
|
42
|
+
"&.Mui-selected::after": {
|
|
43
|
+
content: "''",
|
|
44
|
+
position: "absolute",
|
|
45
|
+
bottom: 0,
|
|
46
|
+
left: 0,
|
|
47
|
+
},
|
|
48
|
+
} }, index));
|
|
49
|
+
}), sx: {
|
|
50
|
+
height: "100%",
|
|
51
|
+
}, swiperStyle: {
|
|
52
|
+
flex: 1,
|
|
53
|
+
}, children: ASSETS_TABS === null || ASSETS_TABS === void 0 ? void 0 : ASSETS_TABS.map(function (type, index) {
|
|
54
|
+
return ((0, jsx_runtime_1.jsxs)(react_1.SwiperSlide, { style: {
|
|
55
|
+
position: "relative",
|
|
56
|
+
}, children: [type.value === "tokens" && (0, jsx_runtime_1.jsx)(TokensBoard_1.default, {}), type.value === "nfts" && (0, jsx_runtime_1.jsx)(NftsBoard_1.default, {})] }, index));
|
|
57
|
+
}) }) }));
|
|
58
|
+
};
|
|
59
|
+
exports.AssetsBoard = AssetsBoard;
|
|
60
|
+
exports.default = exports.AssetsBoard;
|
|
@@ -82,6 +82,6 @@ function ChangePasscode(_a) {
|
|
|
82
82
|
}, 400);
|
|
83
83
|
};
|
|
84
84
|
var keyboardPrefix = (0, useUniqueId_1.useUniqueId)();
|
|
85
|
-
return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, {
|
|
85
|
+
return ((0, jsx_runtime_1.jsx)(RequireConnect_1.default, { children: (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { onClose: onClose, ref: getSeedPhraseViewRef, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, trigger: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { autoFocus: true, useBrowserInput: false, htmlFor: "".concat(keyboardPrefix, "-change-passcode-keyboard"), children: (0, jsx_runtime_1.jsxs)(material_1.Box, __assign({}, rest, { sx: { position: "relative" }, children: [children, (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { position: "absolute", inset: 0, zIndex: 10 } })] })) }), children: (0, jsx_runtime_1.jsx)(ChangePasscodeView_1.default, { onBack: backAuthView, idPrefix: keyboardPrefix }, resetTrigger) }) }));
|
|
86
86
|
}
|
|
87
87
|
exports.default = ChangePasscode;
|
|
@@ -116,7 +116,7 @@ var ConfirmByPasscode = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
116
116
|
var _a, _b;
|
|
117
117
|
handleBlurAll();
|
|
118
118
|
(_a = drawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
|
|
119
|
-
(_b = props.
|
|
119
|
+
(_b = props.onClose) === null || _b === void 0 ? void 0 : _b.call(props);
|
|
120
120
|
}, [handleBlurAll, props]);
|
|
121
121
|
(0, react_1.useImperativeHandle)(ref, function () { return ({
|
|
122
122
|
clearData: handleCleardata,
|
|
@@ -139,7 +139,7 @@ var ConfirmByPasscode = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
139
139
|
var handleOnClose = function () {
|
|
140
140
|
var _a;
|
|
141
141
|
handleCleardata();
|
|
142
|
-
(_a = props.
|
|
142
|
+
(_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props);
|
|
143
143
|
};
|
|
144
144
|
var handleOnOpen = function () {
|
|
145
145
|
var _a;
|
|
@@ -190,7 +190,7 @@ var ConfirmByPasscode = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
190
190
|
var keyboardThemeMode = (0, TekWalletProvider_1.useKeyboardThemeMode)();
|
|
191
191
|
return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: drawerRef, trigger: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { style: {
|
|
192
192
|
width: "100%",
|
|
193
|
-
}, useBrowserInput: false, htmlFor: keyboardId, children: props.children }), onOpen: handleOnOpen,
|
|
193
|
+
}, useBrowserInput: false, htmlFor: keyboardId, children: props.children }), onOpen: handleOnOpen, onClose: handleOnClose, triggerStatus: props.triggerStatus, sx: __assign({ width: "100%", maxWidth: "calc(100dvw - 2rem)", display: "flex" }, sx), children: (0, jsx_runtime_1.jsx)(xhub_keyboard_1.Keyboard, { theme: keyboardThemeMode, ref: keyboardRef, id: keyboardId, value: passcode, onChange: handlePasscodeChange, keyboardType: xhub_keyboard_1.KeyboardType.Text, layoutType: xhub_keyboard_1.LayoutType.Integer, styles: {
|
|
194
194
|
keyboardContainer: {
|
|
195
195
|
display: isLocked ? "none" : "block",
|
|
196
196
|
},
|
|
@@ -204,7 +204,7 @@ var ConfirmByPasscode = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
204
204
|
backgroundColor: theme.palette.background.tertiary,
|
|
205
205
|
}, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { justifyContent: "center", alignItems: "center", gap: "0.75rem", width: "100%" }), children: [(0, jsx_runtime_1.jsx)(xhub_keyboard_1.Label, { style: {
|
|
206
206
|
width: "100%",
|
|
207
|
-
}, useBrowserInput: false, htmlFor: keyboardId, children: (0, jsx_runtime_1.jsx)(OTP_1.default, { disabled: isLocked, value: passcode, onChange: handlePasscodeChange, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.CONFIRM_BY_PASSCODE }) }),
|
|
207
|
+
}, useBrowserInput: false, htmlFor: keyboardId, children: (0, jsx_runtime_1.jsx)(OTP_1.default, { disabled: isLocked, value: passcode, onChange: handlePasscodeChange, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.CONFIRM_BY_PASSCODE }) }), warningContent, unknownError] }) }) }) }) }));
|
|
208
208
|
});
|
|
209
209
|
ConfirmByPasscode.displayName = "ConfirmByPasscode";
|
|
210
210
|
exports.default = ConfirmByPasscode;
|
|
@@ -14,7 +14,7 @@ export interface ConfirmSendExternalProps extends Omit<ConfirmLayoutProps, "acti
|
|
|
14
14
|
onError?: (error: Error | unknown) => void;
|
|
15
15
|
children?: React.ReactNode;
|
|
16
16
|
sx?: SxProps;
|
|
17
|
-
|
|
17
|
+
onClose?: ReactEventHandler;
|
|
18
18
|
}
|
|
19
|
-
export declare const ConfirmSendExternal: ({ payload, onSuccess, onStart, onFinally, onError, children, sx, onDone, }: ConfirmSendExternalProps) => import("react/jsx-runtime").JSX.Element;
|
|
19
|
+
export declare const ConfirmSendExternal: ({ payload, onSuccess, onStart, onFinally, onError, children, sx, onClose: onDone, }: ConfirmSendExternalProps) => import("react/jsx-runtime").JSX.Element;
|
|
20
20
|
export default ConfirmSendExternal;
|
|
@@ -98,7 +98,7 @@ var useWallet_1 = __importDefault(require("../../../hooks/useWallet"));
|
|
|
98
98
|
var type_1 = require("../../../services/axios/get-activities-service/type");
|
|
99
99
|
var useRealtime_1 = __importDefault(require("../../../hooks/useRealtime"));
|
|
100
100
|
var ConfirmSendExternal = function (_a) {
|
|
101
|
-
var payload = _a.payload, onSuccess = _a.onSuccess, onStart = _a.onStart, onFinally = _a.onFinally, onError = _a.onError, children = _a.children, sx = _a.sx, onDone = _a.
|
|
101
|
+
var payload = _a.payload, onSuccess = _a.onSuccess, onStart = _a.onStart, onFinally = _a.onFinally, onError = _a.onError, children = _a.children, sx = _a.sx, onDone = _a.onClose;
|
|
102
102
|
var network = payload.network;
|
|
103
103
|
var _b = (0, react_1.useState)(), response = _b[0], setResponse = _b[1];
|
|
104
104
|
var thisTransactionId = (0, react_1.useRef)("");
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { ReactEventHandler } from "react";
|
|
2
|
+
import { Transaction } from "../../../services/axios/get-activities-service/type";
|
|
3
|
+
import { SendNftPayload } from "../../../hooks/data/useNfts/service.type";
|
|
4
|
+
interface ResultProps {
|
|
5
|
+
transaction?: Transaction;
|
|
6
|
+
onDone?: ReactEventHandler;
|
|
7
|
+
payload?: SendNftPayload;
|
|
8
|
+
}
|
|
9
|
+
export default function Result(props: ResultProps): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export type { ResultProps };
|
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.default = Result;
|
|
18
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
19
|
+
var material_1 = require("@mui/material");
|
|
20
|
+
var Text_1 = __importDefault(require("../Text"));
|
|
21
|
+
var InlineTitleValue_1 = __importDefault(require("../InlineTitleValue"));
|
|
22
|
+
var CopyTextComponent_1 = __importDefault(require("../CopyTextComponent"));
|
|
23
|
+
var SvgPath_1 = require("../SvgPath");
|
|
24
|
+
var safeText_1 = require("../../../utils/safeText");
|
|
25
|
+
var react_1 = require("react");
|
|
26
|
+
var Button_1 = __importDefault(require("../Button"));
|
|
27
|
+
var mui_1 = require("../../../theme/mui");
|
|
28
|
+
var Icon_1 = __importDefault(require("../Icon"));
|
|
29
|
+
var type_1 = require("../../../services/axios/get-activities-service/type");
|
|
30
|
+
var NftItem_1 = __importDefault(require("../NftItem"));
|
|
31
|
+
var getIconKey = function (status) {
|
|
32
|
+
if (status === type_1.TransactionStatus.Success)
|
|
33
|
+
return "IC_CHECK_CIRCLE";
|
|
34
|
+
if (status === type_1.TransactionStatus.Failed)
|
|
35
|
+
return "IC_ERROR_CIRCLE";
|
|
36
|
+
return "IC_PROCESSING_CIRCLE";
|
|
37
|
+
};
|
|
38
|
+
function Result(props) {
|
|
39
|
+
var theme = (0, mui_1.useTheme)();
|
|
40
|
+
var transaction = props.transaction, onDone = props.onDone, payload = props.payload;
|
|
41
|
+
var status = (0, react_1.useMemo)(function () { return (transaction === null || transaction === void 0 ? void 0 : transaction.transaction_status) || type_1.TransactionStatus.Failed; }, [transaction === null || transaction === void 0 ? void 0 : transaction.transaction_status]);
|
|
42
|
+
var recipientAddress = (0, react_1.useMemo)(function () { return (transaction === null || transaction === void 0 ? void 0 : transaction.to_address) || (payload === null || payload === void 0 ? void 0 : payload.to_address); }, [transaction === null || transaction === void 0 ? void 0 : transaction.to_address, payload === null || payload === void 0 ? void 0 : payload.to_address]);
|
|
43
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
44
|
+
display: "flex",
|
|
45
|
+
flexDirection: "column",
|
|
46
|
+
gap: 3,
|
|
47
|
+
height: "100%",
|
|
48
|
+
}, children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
49
|
+
display: "flex",
|
|
50
|
+
flexDirection: "column",
|
|
51
|
+
alignItems: "center",
|
|
52
|
+
gap: theme.styleMixins.gaps.g16,
|
|
53
|
+
my: "auto",
|
|
54
|
+
backgroundColor: theme.palette.background.tertiary,
|
|
55
|
+
borderRadius: theme.styleMixins.customRadius.r16,
|
|
56
|
+
padding: theme.styleMixins.customPadding.p16,
|
|
57
|
+
paddingTop: "0px",
|
|
58
|
+
}, children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { iconKey: getIconKey(status), width: 100, sx: {
|
|
59
|
+
transform: "translateY(-50%)",
|
|
60
|
+
} }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
61
|
+
display: "flex",
|
|
62
|
+
flexDirection: "column",
|
|
63
|
+
alignItems: "center",
|
|
64
|
+
}, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
|
|
65
|
+
fontSize: theme.typography.fontSize13,
|
|
66
|
+
color: theme.palette.text.secondary,
|
|
67
|
+
}, children: "Send NFT" }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
|
|
68
|
+
color: theme.palette.text.primary,
|
|
69
|
+
textTransform: "capitalize",
|
|
70
|
+
fontWeight: 600,
|
|
71
|
+
fontSize: theme.typography.fontSize24,
|
|
72
|
+
}, children: status })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: "100%", borderTop: "1px ".concat(theme.palette.divider, " solid") } }), (0, jsx_runtime_1.jsx)(NftItem_1.default, { id: payload === null || payload === void 0 ? void 0 : payload.id, noAction: true, useSnapshot: true, sx: { width: "100%" } }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: "100%", borderTop: "1px ".concat(theme.palette.divider, " solid") } }), (0, jsx_runtime_1.jsx)(InlineTitleValue_1.default, { title: "Recipient address", titleStyle: {
|
|
73
|
+
fontSize: "0.875rem",
|
|
74
|
+
fontWeight: 500,
|
|
75
|
+
color: "text.secondary",
|
|
76
|
+
}, value: (0, jsx_runtime_1.jsx)(CopyTextComponent_1.default, { value: recipientAddress || "", children: (0, jsx_runtime_1.jsxs)(material_1.Box, { className: "flex flex-row gap-2 items-center", children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign({}, theme.styleMixins.value), children: (0, safeText_1.safeText)(recipientAddress || "", { isShort: true }) }), (0, jsx_runtime_1.jsx)(material_1.SvgIcon, { sx: {
|
|
77
|
+
width: 16,
|
|
78
|
+
height: 16,
|
|
79
|
+
ml: "auto",
|
|
80
|
+
}, children: SvgPath_1.IC_COPY })] }) }), isAligned: true })] }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
|
|
81
|
+
marginTop: "auto",
|
|
82
|
+
width: "100%",
|
|
83
|
+
display: "grid",
|
|
84
|
+
gridTemplateColumns: "1fr",
|
|
85
|
+
gap: theme.styleMixins.gaps.g8,
|
|
86
|
+
}, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { sx: { width: "100%" }, onClick: onDone, children: "Done" }) })] }));
|
|
87
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { ConfirmLayoutProps } from "../ConfirmLayout";
|
|
2
|
+
import { SendExternalBody } from "../../../services/axios/send-external-service/type";
|
|
3
|
+
import { NetworkData } from "../../../services/axios/type";
|
|
4
|
+
import { SxProps } from "@mui/material";
|
|
5
|
+
import { ReactEventHandler } from "react";
|
|
6
|
+
import { SendNftPayload } from "../../../hooks/data/useNfts/service.type";
|
|
7
|
+
export interface SendExternalDataType extends Omit<SendExternalBody, "network" | "passcode"> {
|
|
8
|
+
network: NetworkData;
|
|
9
|
+
}
|
|
10
|
+
export interface ConfirmSendNftProps extends Omit<ConfirmLayoutProps, "action"> {
|
|
11
|
+
payload: SendNftPayload;
|
|
12
|
+
sx?: SxProps;
|
|
13
|
+
onClose?: ReactEventHandler;
|
|
14
|
+
childrenRender?: (isSendingNft: boolean) => React.ReactNode;
|
|
15
|
+
}
|
|
16
|
+
export declare const ConfirmSendNft: ({ payload, sx, onClose: onDone, childrenRender, }: ConfirmSendNftProps) => import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
export default ConfirmSendNft;
|
|
@@ -0,0 +1,133 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
"use client";
|
|
3
|
+
var __assign = (this && this.__assign) || function () {
|
|
4
|
+
__assign = Object.assign || function(t) {
|
|
5
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
6
|
+
s = arguments[i];
|
|
7
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
8
|
+
t[p] = s[p];
|
|
9
|
+
}
|
|
10
|
+
return t;
|
|
11
|
+
};
|
|
12
|
+
return __assign.apply(this, arguments);
|
|
13
|
+
};
|
|
14
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
15
|
+
if (k2 === undefined) k2 = k;
|
|
16
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
17
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
18
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
19
|
+
}
|
|
20
|
+
Object.defineProperty(o, k2, desc);
|
|
21
|
+
}) : (function(o, m, k, k2) {
|
|
22
|
+
if (k2 === undefined) k2 = k;
|
|
23
|
+
o[k2] = m[k];
|
|
24
|
+
}));
|
|
25
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
26
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
27
|
+
}) : function(o, v) {
|
|
28
|
+
o["default"] = v;
|
|
29
|
+
});
|
|
30
|
+
var __importStar = (this && this.__importStar) || (function () {
|
|
31
|
+
var ownKeys = function(o) {
|
|
32
|
+
ownKeys = Object.getOwnPropertyNames || function (o) {
|
|
33
|
+
var ar = [];
|
|
34
|
+
for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
|
|
35
|
+
return ar;
|
|
36
|
+
};
|
|
37
|
+
return ownKeys(o);
|
|
38
|
+
};
|
|
39
|
+
return function (mod) {
|
|
40
|
+
if (mod && mod.__esModule) return mod;
|
|
41
|
+
var result = {};
|
|
42
|
+
if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
|
|
43
|
+
__setModuleDefault(result, mod);
|
|
44
|
+
return result;
|
|
45
|
+
};
|
|
46
|
+
})();
|
|
47
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
48
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
49
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
50
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
51
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
52
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
53
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
57
|
+
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g = Object.create((typeof Iterator === "function" ? Iterator : Object).prototype);
|
|
58
|
+
return g.next = verb(0), g["throw"] = verb(1), g["return"] = verb(2), typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
|
|
59
|
+
function verb(n) { return function (v) { return step([n, v]); }; }
|
|
60
|
+
function step(op) {
|
|
61
|
+
if (f) throw new TypeError("Generator is already executing.");
|
|
62
|
+
while (g && (g = 0, op[0] && (_ = 0)), _) try {
|
|
63
|
+
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
|
|
64
|
+
if (y = 0, t) op = [op[0] & 2, t.value];
|
|
65
|
+
switch (op[0]) {
|
|
66
|
+
case 0: case 1: t = op; break;
|
|
67
|
+
case 4: _.label++; return { value: op[1], done: false };
|
|
68
|
+
case 5: _.label++; y = op[1]; op = [0]; continue;
|
|
69
|
+
case 7: op = _.ops.pop(); _.trys.pop(); continue;
|
|
70
|
+
default:
|
|
71
|
+
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
|
|
72
|
+
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
|
|
73
|
+
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
|
|
74
|
+
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
|
|
75
|
+
if (t[2]) _.ops.pop();
|
|
76
|
+
_.trys.pop(); continue;
|
|
77
|
+
}
|
|
78
|
+
op = body.call(thisArg, _);
|
|
79
|
+
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
|
|
80
|
+
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
81
|
+
}
|
|
82
|
+
};
|
|
83
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
84
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
85
|
+
};
|
|
86
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
87
|
+
exports.ConfirmSendNft = void 0;
|
|
88
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
89
|
+
var ConfirmByPasscode_1 = __importDefault(require("../ConfirmByPasscode"));
|
|
90
|
+
var DrawerComponent_1 = __importStar(require("../DrawerComponent"));
|
|
91
|
+
var react_1 = require("react");
|
|
92
|
+
var DefaultPageLayout_1 = __importDefault(require("../../layouts/DefaultPageLayout"));
|
|
93
|
+
var ChildPageLayout_1 = __importDefault(require("../../layouts/ChildPageLayout"));
|
|
94
|
+
var stopPropagation_1 = __importDefault(require("../../../utils/stopPropagation"));
|
|
95
|
+
var useNft_1 = __importDefault(require("../../../hooks/data/useNfts/useNft"));
|
|
96
|
+
var Result_1 = __importDefault(require("./Result"));
|
|
97
|
+
var useCustomRouter_1 = __importDefault(require("../../../hooks/useCustomRouter"));
|
|
98
|
+
var ConfirmSendNft = function (_a) {
|
|
99
|
+
var payload = _a.payload, sx = _a.sx, onDone = _a.onClose, childrenRender = _a.childrenRender;
|
|
100
|
+
var id = payload.id;
|
|
101
|
+
var sendNft = (0, useNft_1.default)(id).sendNft;
|
|
102
|
+
var router = (0, useCustomRouter_1.default)();
|
|
103
|
+
var sendNftMutate = sendNft.mutate, isSendingNft = sendNft.isPending;
|
|
104
|
+
var _b = (0, react_1.useState)(), transaction = _b[0], setTransaction = _b[1];
|
|
105
|
+
var resultRef = (0, react_1.useRef)(null);
|
|
106
|
+
var handleCloseResult = function (e) {
|
|
107
|
+
router.back();
|
|
108
|
+
onDone === null || onDone === void 0 ? void 0 : onDone(e);
|
|
109
|
+
};
|
|
110
|
+
var handleConfirmSendNft = function (passcode) { return __awaiter(void 0, void 0, void 0, function () {
|
|
111
|
+
return __generator(this, function (_a) {
|
|
112
|
+
sendNftMutate(__assign(__assign({}, payload), { passcode: passcode }), {
|
|
113
|
+
onSettled: function (data) {
|
|
114
|
+
var _a;
|
|
115
|
+
setTransaction(data);
|
|
116
|
+
(_a = resultRef.current) === null || _a === void 0 ? void 0 : _a.open();
|
|
117
|
+
},
|
|
118
|
+
});
|
|
119
|
+
return [2 /*return*/];
|
|
120
|
+
});
|
|
121
|
+
}); };
|
|
122
|
+
return ((0, jsx_runtime_1.jsxs)(ConfirmByPasscode_1.default, { sx: sx, onConfirmSuccess: handleConfirmSendNft, children: [childrenRender === null || childrenRender === void 0 ? void 0 : childrenRender(isSendingNft), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: resultRef, sx: {
|
|
123
|
+
width: 0,
|
|
124
|
+
height: 0,
|
|
125
|
+
position: "absolute",
|
|
126
|
+
top: 0,
|
|
127
|
+
left: 0,
|
|
128
|
+
}, direction: DrawerComponent_1.DRAWER_DIRECTION.RIGHT, onClose: handleCloseResult, children: (0, jsx_runtime_1.jsx)(ChildPageLayout_1.default, { onClick: stopPropagation_1.default, children: (0, jsx_runtime_1.jsx)(DefaultPageLayout_1.default, { sx: {
|
|
129
|
+
height: "100%",
|
|
130
|
+
}, children: (0, jsx_runtime_1.jsx)(Result_1.default, { transaction: transaction, payload: payload, onDone: handleCloseResult }) }) }) })] }));
|
|
131
|
+
};
|
|
132
|
+
exports.ConfirmSendNft = ConfirmSendNft;
|
|
133
|
+
exports.default = exports.ConfirmSendNft;
|
|
@@ -10,7 +10,7 @@ export interface ConfirmSwapTokenProps extends Omit<ConfirmLayoutProps, "action"
|
|
|
10
10
|
onStart?: () => void;
|
|
11
11
|
onFinally?: () => void;
|
|
12
12
|
onError?: (error: Error | unknown) => void;
|
|
13
|
-
|
|
13
|
+
onClose?: ReactEventHandler;
|
|
14
14
|
sx?: SxProps;
|
|
15
15
|
children?: React.ReactNode;
|
|
16
16
|
}
|
|
@@ -97,7 +97,7 @@ var Result_1 = __importDefault(require("./Result"));
|
|
|
97
97
|
var useRealtime_1 = __importDefault(require("../../../hooks/useRealtime"));
|
|
98
98
|
var ConfirmSwapToken = function (props) {
|
|
99
99
|
var confirmLayoutDrawerRef = (0, react_1.useRef)(null);
|
|
100
|
-
var sx = props.sx, children = props.children, onSuccess = props.onSuccess, onStart = props.onStart, onFinally = props.onFinally, onError = props.onError, payload = props.payload, onDone = props.
|
|
100
|
+
var sx = props.sx, children = props.children, onSuccess = props.onSuccess, onStart = props.onStart, onFinally = props.onFinally, onError = props.onError, payload = props.payload, onDone = props.onClose;
|
|
101
101
|
var _a = (0, react_1.useState)(null), response = _a[0], setResponse = _a[1];
|
|
102
102
|
var pushNotification = (0, useRealtime_1.default)().pushNotification;
|
|
103
103
|
var openResult = function () {
|
|
@@ -12,7 +12,7 @@ export declare enum DRAWER_TRIGGER_STATUS {
|
|
|
12
12
|
}
|
|
13
13
|
export interface DrawerComponentProps extends Omit<GeneralProps, "onClick" | "sx">, Omit<SwipeableDrawerProps, "onClose" | "onToggle" | "onOpen"> {
|
|
14
14
|
onOpen?: UnknownFunction;
|
|
15
|
-
|
|
15
|
+
onClose?: UnknownFunction;
|
|
16
16
|
trigger?: React.ReactNode;
|
|
17
17
|
onToggle?: (status?: boolean) => unknown;
|
|
18
18
|
direction?: DRAWER_DIRECTION;
|
|
@@ -39,7 +39,7 @@ var DRAWER_TRIGGER_STATUS;
|
|
|
39
39
|
DRAWER_TRIGGER_STATUS["DISABLED"] = "DISABLED";
|
|
40
40
|
})(DRAWER_TRIGGER_STATUS || (exports.DRAWER_TRIGGER_STATUS = DRAWER_TRIGGER_STATUS = {}));
|
|
41
41
|
var DrawerComponent = (0, react_1.forwardRef)(function (props, ref) {
|
|
42
|
-
var onOpen = props.onOpen, onClose = props.
|
|
42
|
+
var onOpen = props.onOpen, onClose = props.onClose, onToggle = props.onToggle, sx = props.sx, trigger = props.trigger, direction = props.direction, children = props.children, _a = props.triggerStatus, triggerStatus = _a === void 0 ? DRAWER_TRIGGER_STATUS.ENABLED : _a, onDismiss = props.onDismiss, disableSwipe = props.disableSwipe, className = props.className, rest = __rest(props, ["onOpen", "onClose", "onToggle", "sx", "trigger", "direction", "children", "triggerStatus", "onDismiss", "disableSwipe", "className"]);
|
|
43
43
|
var _b = (0, react_1.useState)(false), isShowDrawerComponent = _b[0], setIsShowDrawerComponent = _b[1];
|
|
44
44
|
var _c = (0, react_1.useState)(undefined), isOpen = _c[0], setIsOpen = _c[1];
|
|
45
45
|
var lockStatus = function () {
|
|
@@ -97,6 +97,7 @@ var DrawerComponent = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
97
97
|
backgroundColor: "transparent",
|
|
98
98
|
overflow: "hidden",
|
|
99
99
|
boxShadow: "none",
|
|
100
|
+
width: "100%",
|
|
100
101
|
},
|
|
101
102
|
}, anchor: direction || DRAWER_DIRECTION.BOTTOM, open: isOpen !== null && isOpen !== void 0 ? isOpen : isShowDrawerComponent, onOpen: onDrawerOpen, onClose: onDrawerClose, ModalProps: {
|
|
102
103
|
onBackdropClick: function () {
|
|
@@ -31,7 +31,7 @@ var LoadingLayout = (0, react_1.forwardRef)(function (props, ref) {
|
|
|
31
31
|
setLoading(false);
|
|
32
32
|
},
|
|
33
33
|
}); });
|
|
34
|
-
return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ position: "relative", width: "fit-content", height: "fit-content" }, sx), children: [children, loading && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8, justifyContent: "center" }), overlaySx), children: [(0, jsx_runtime_1.jsx)(material_1.CircularProgress, { sx: { color: "black" }, size: 20 }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
|
|
34
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign({ position: "relative", width: "fit-content", height: "fit-content" }, sx), children: [children, loading && ((0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign(__assign({}, theme.styleMixins.row), { gap: theme.styleMixins.gaps.g8, justifyContent: "center", position: "absolute", inset: 0, backgroundColor: (0, material_1.alpha)(theme.palette.background.default, 0.5), borderRadius: theme.styleMixins.customRadius.r12, backdropFilter: "blur(2px)" }), overlaySx), children: [(0, jsx_runtime_1.jsx)(material_1.CircularProgress, { sx: { color: "black" }, size: 20 }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: {
|
|
35
35
|
fontSize: theme.typography.fontSize12,
|
|
36
36
|
color: "black",
|
|
37
37
|
}, children: loadingMessage })] }))] }));
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
29
|
+
var material_1 = require("@mui/material");
|
|
30
|
+
var Text_1 = __importDefault(require("../Text"));
|
|
31
|
+
var formatDate_1 = __importDefault(require("../../../utils/formatDate"));
|
|
32
|
+
var mui_1 = require("../../../theme/mui");
|
|
33
|
+
var useNft_1 = __importDefault(require("../../../hooks/data/useNfts/useNft"));
|
|
34
|
+
var Button_1 = __importDefault(require("../Button"));
|
|
35
|
+
function NftDetail(props) {
|
|
36
|
+
var theme = (0, mui_1.useTheme)();
|
|
37
|
+
var id = props.id, sx = props.sx, rest = __rest(props, ["id", "sx"]);
|
|
38
|
+
var _a = (0, useNft_1.default)(id), voucher = _a.metadataAttributes, isMinting = _a.isMinting, voucherUnit = _a.voucherUnit, voucherValue = _a.voucherValue, handleClickButton = _a.handleClickButton, buttonLabel = _a.buttonLabel;
|
|
39
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Box, __assign({ sx: __assign(__assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g16, alignItems: "center" }), sx) }, rest, { children: [(0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.styleMixins.column), { gap: theme.styleMixins.gaps.g8, alignItems: "center" }), children: [(0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.bigValue), { textTransform: "none", fontSize: "2.25rem", color: theme.palette.tertiary.main }), children: [voucherValue, voucherUnit] }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.activityTitle), { textTransform: "none", fontSize: theme.typography.fontSize24 }), children: voucher === null || voucher === void 0 ? void 0 : voucher.title }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.activityDescription), { textTransform: "none", fontSize: theme.typography.fontSize14 }), children: voucher === null || voucher === void 0 ? void 0 : voucher.description }), (0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
|
|
40
|
+
display: "flex",
|
|
41
|
+
flexDirection: "row",
|
|
42
|
+
alignItems: "center",
|
|
43
|
+
mt: "auto",
|
|
44
|
+
gap: theme.styleMixins.gaps.g4,
|
|
45
|
+
}, 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 })] })));
|
|
46
|
+
}
|
|
47
|
+
exports.default = NftDetail;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { BoxProps } from "@mui/material";
|
|
2
|
+
interface NftItemProps extends BoxProps {
|
|
3
|
+
id?: string;
|
|
4
|
+
noAction?: boolean;
|
|
5
|
+
useSnapshot?: boolean;
|
|
6
|
+
}
|
|
7
|
+
declare function NftItem(props: NftItemProps): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export default NftItem;
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
var jsx_runtime_1 = require("react/jsx-runtime");
|
|
29
|
+
var material_1 = require("@mui/material");
|
|
30
|
+
var mui_1 = require("../../../theme/mui");
|
|
31
|
+
var Text_1 = __importDefault(require("../Text"));
|
|
32
|
+
var useNft_1 = __importDefault(require("../../../hooks/data/useNfts/useNft"));
|
|
33
|
+
var Button_1 = __importDefault(require("../Button"));
|
|
34
|
+
var useFormatter_1 = __importDefault(require("../../../hooks/useFormatter"));
|
|
35
|
+
var react_1 = require("react");
|
|
36
|
+
var useCustomRouter_1 = __importDefault(require("../../../hooks/useCustomRouter"));
|
|
37
|
+
function NftItem(props) {
|
|
38
|
+
var sx = props.sx, id = props.id, _a = props.noAction, noAction = _a === void 0 ? false : _a, _b = props.useSnapshot, useSnapshot = _b === void 0 ? false : _b, rest = __rest(props, ["sx", "id", "noAction", "useSnapshot"]);
|
|
39
|
+
var theme = (0, mui_1.useTheme)();
|
|
40
|
+
var formatDate = (0, useFormatter_1.default)().formatDate;
|
|
41
|
+
var _c = (0, useNft_1.default)(id, useSnapshot), voucher = _c.metadataAttributes, isMinting = _c.isMinting, voucherUnit = _c.voucherUnit, voucherValue = _c.voucherValue, handleClickButton = _c.handleClickButton, buttonLabel = _c.buttonLabel; // in this phase we use nft metadata for voucher data
|
|
42
|
+
var router = (0, useCustomRouter_1.default)();
|
|
43
|
+
(0, react_1.useEffect)(function () {
|
|
44
|
+
if (!id)
|
|
45
|
+
return;
|
|
46
|
+
router.prefetch("?detail=".concat(id));
|
|
47
|
+
}, [id, router]);
|
|
48
|
+
var handleClick = (0, react_1.useCallback)(function () {
|
|
49
|
+
router.push("?detail=".concat(id));
|
|
50
|
+
}, [id, router]);
|
|
51
|
+
return ((0, jsx_runtime_1.jsxs)(material_1.Box, __assign({ onClick: noAction ? undefined : handleClick, sx: __assign(__assign(__assign({}, theme.styleMixins.row), { backgroundColor: theme.palette.background.tertiary, borderRadius: theme.styleMixins.customRadius.r16, backdropFilter: "blur(12px)", cursor: noAction ? "not-allowed" : "pointer", display: "grid", pointerEvents: noAction ? "none" : "auto", gridTemplateColumns: "0.3346303502fr 1px 1fr" }), sx) }, rest, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: {
|
|
52
|
+
width: "100%",
|
|
53
|
+
aspectRatio: "1/1",
|
|
54
|
+
display: "flex",
|
|
55
|
+
flexDirection: "column",
|
|
56
|
+
justifyContent: "center",
|
|
57
|
+
alignItems: "center",
|
|
58
|
+
}, children: (0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.bigValue), { textTransform: "none", color: "text.primary" }), children: [voucherValue, voucherUnit] }) }), (0, jsx_runtime_1.jsx)(material_1.Divider, { orientation: "vertical", flexItem: true, sx: { borderStyle: "dashed" } }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
59
|
+
width: "100%",
|
|
60
|
+
display: "flex",
|
|
61
|
+
flexDirection: "column",
|
|
62
|
+
height: "100%",
|
|
63
|
+
pr: 3,
|
|
64
|
+
pl: theme.spacing(4),
|
|
65
|
+
py: 2,
|
|
66
|
+
}, children: [(0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.activityTitle), { textTransform: "none" }), children: voucher === null || voucher === void 0 ? void 0 : voucher.title }), (0, jsx_runtime_1.jsx)(Text_1.default, { sx: __assign(__assign({}, theme.styleMixins.activityDescription), { textTransform: "none" }), children: voucher === null || voucher === void 0 ? void 0 : voucher.description }), (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: {
|
|
67
|
+
display: "flex",
|
|
68
|
+
flexDirection: "row",
|
|
69
|
+
alignItems: "center",
|
|
70
|
+
mt: "auto",
|
|
71
|
+
gap: theme.styleMixins.gaps.g4,
|
|
72
|
+
}, 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" }), children: ["Exp ", formatDate(voucher === null || voucher === void 0 ? void 0 : voucher.expire)] })), !noAction && ((0, jsx_runtime_1.jsx)(Button_1.default, { size: "small", sx: { ml: "auto" }, onClick: handleClickButton, loading: isMinting, children: buttonLabel }))] })] })] })));
|
|
73
|
+
}
|
|
74
|
+
exports.default = NftItem;
|