@sky-mavis/tanto-widget
Version:
Tanto Widget
58 lines • 2.27 kB
JavaScript
import {jsx,jsxs}from'@emotion/react/jsx-runtime';import {TransitionedView}from'../../components/animated-containers/TransitionedView.mjs';import {Box}from'../../components/box/Box.mjs';import {CopyButton}from'../../components/copy-button/CopyButton.mjs';import {GetWalletCTA}from'../../components/get-wallet-cta/GetWalletCTA.mjs';import {AnimatedQRCode}from'../../components/qr-code/AnimatedQRCode.mjs';import {RONIN_WALLET_APP_DEEPLINK}from'../../constants.mjs';import {useWidgetConnect}from'../../contexts/widget-connect/useWidgetConnect.mjs';import {useWalletConnectUri}from'../../hooks/useWalletConnectUri.mjs';import {ConnectState}from'../../types/connect.mjs';import {openWindow}from'../../utils/openWindow.mjs';import {generateRoninMobileWCLink}from'../../utils/url.mjs';import {isMobile}from'../../utils/userAgent.mjs';import {ConnectLayout}from'./components/ConnectLayout.mjs';import {ScanGuideline}from'./components/ScanGuideline.mjs';function ScanQRCode({
uri
}) {
return jsxs(Box, {
vertical: true,
align: "center",
justify: "center",
gap: 20,
pt: 20,
children: [jsxs(Box, {
vertical: true,
align: "center",
justify: "center",
gap: 16,
children: [jsx(CopyButton, {
value: uri,
children: "Copy link"
}), jsx(AnimatedQRCode, {
value: uri
}), jsx(ScanGuideline, {})]
}), jsx(GetWalletCTA, {})]
});
}
function ConnectWC() {
const mobile = isMobile();
const {
selectedWallet,
selectedConnector
} = useWidgetConnect();
const {
uri,
status,
generateConnectUri
} = useWalletConnectUri({
connector: selectedConnector,
onReceiveDisplayUri: uri => {
if (mobile) openWindow(generateRoninMobileWCLink(uri, RONIN_WALLET_APP_DEEPLINK));
}
});
if (!selectedWallet) return null;
if (mobile) return jsx(ConnectLayout, {
status: status,
wallet: selectedWallet,
wcUri: uri,
onRetry: generateConnectUri
});
return jsx(TransitionedView, {
viewKey: status,
children: status === ConnectState.CONNECTING ? jsx(ScanQRCode, {
uri: uri
}) : jsx(ConnectLayout, {
status: status,
wallet: selectedWallet,
wcUri: uri,
onRetry: generateConnectUri
})
});
}export{ConnectWC};