@xyo-network/react-chain-network 1.16.5 → 1.16.7
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/browser/components/menu/Icon.d.ts.map +1 -1
- package/dist/browser/hooks/provider/UseViewerInPage.stories.d.ts +12 -0
- package/dist/browser/hooks/provider/UseViewerInPage.stories.d.ts.map +1 -0
- package/dist/browser/hooks/provider/useViewerInPage.d.ts +2 -1
- package/dist/browser/hooks/provider/useViewerInPage.d.ts.map +1 -1
- package/dist/browser/index.mjs +10 -6
- package/dist/browser/index.mjs.map +1 -1
- package/package.json +10 -10
- package/src/components/menu/Icon.tsx +1 -0
- package/src/hooks/provider/UseViewerInPage.stories.tsx +89 -0
- package/src/hooks/provider/useViewerInPage.ts +12 -4
- package/src/types/global.d.ts +9 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,WAAW,gBAAiB,SAAQ,iBAAiB,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,eAAe,CAAC;IAC/G,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,
|
|
1
|
+
{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/components/menu/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,WAAW,gBAAiB,SAAQ,iBAAiB,CAAC,kBAAkB,CAAC,eAAe,CAAC,EAAE,eAAe,CAAC;IAC/G,IAAI,CAAC,EAAE,MAAM,CAAA;CACd;AAED,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAalD,CAAA"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { StoryFn } from '@storybook/react-vite';
|
|
2
|
+
import React from 'react';
|
|
3
|
+
declare const UseViewerInPageStoryTemplate: React.FC;
|
|
4
|
+
declare const _default: {
|
|
5
|
+
title: string;
|
|
6
|
+
component: React.FC<{}>;
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const Template: StoryFn<typeof UseViewerInPageStoryTemplate>;
|
|
10
|
+
declare const Default: import("storybook/internal/csf").AnnotatedStoryFn<import("@storybook/react").ReactRenderer, {}>;
|
|
11
|
+
export { Default };
|
|
12
|
+
//# sourceMappingURL=UseViewerInPage.stories.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UseViewerInPage.stories.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/UseViewerInPage.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAMpD,OAAO,KAA8B,MAAM,OAAO,CAAA;AAQlD,QAAA,MAAM,4BAA4B,EAAE,KAAK,CAAC,EAMzC,CAAA;;;;;AAyDD,wBAGC;AAED,eAAO,MAAM,QAAQ,EAAE,OAAO,CAAC,OAAO,4BAA4B,CAAsD,CAAA;AAExH,QAAA,MAAM,OAAO,iGAAoB,CAAA;AAGjC,OAAO,EAAE,OAAO,EAAE,CAAA"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { type NetworkBootstrap } from '@xyo-network/chain-network-model';
|
|
1
2
|
/**
|
|
2
3
|
* Get the viewer for the active network, first from the wallet or fallback to HTTP RPC
|
|
3
4
|
* @returns - XyoViewer for the active network
|
|
4
5
|
*/
|
|
5
|
-
export declare const useViewerInPage: () => import("@xyo-network/xl1-protocol-sdk").XyoViewer | import("@xyo-network/xl1-rpc").JsonRpcXyoViewer | undefined;
|
|
6
|
+
export declare const useViewerInPage: (networkOverride?: NetworkBootstrap) => import("@xyo-network/xl1-protocol-sdk").XyoViewer | import("@xyo-network/xl1-rpc").JsonRpcXyoViewer | undefined;
|
|
6
7
|
//# sourceMappingURL=useViewerInPage.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useViewerInPage.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useViewerInPage.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useViewerInPage.d.ts","sourceRoot":"","sources":["../../../../src/hooks/provider/useViewerInPage.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,kCAAkC,CAAA;AAKxE;;;GAGG;AACH,eAAO,MAAM,eAAe,GAAI,kBAAkB,gBAAgB,oHAUjE,CAAA"}
|
package/dist/browser/index.mjs
CHANGED
|
@@ -76,6 +76,7 @@ var useChainNetwork = /* @__PURE__ */ __name((required = true) => useContextEx(C
|
|
|
76
76
|
import React2 from "react";
|
|
77
77
|
var NetworkIcon = /* @__PURE__ */ __name(({ icon, style, ...props }) => {
|
|
78
78
|
return /* @__PURE__ */ React2.createElement("span", {
|
|
79
|
+
// eslint-disable-next-line react-dom/no-dangerously-set-innerhtml
|
|
79
80
|
dangerouslySetInnerHTML: {
|
|
80
81
|
__html: icon ?? ""
|
|
81
82
|
},
|
|
@@ -216,12 +217,15 @@ import React7 from "react";
|
|
|
216
217
|
import { useCurrentBlock, useViewerFromWallet as useViewerFromWallet2 } from "@xyo-network/react-chain-provider";
|
|
217
218
|
|
|
218
219
|
// src/hooks/provider/useViewerInPage.ts
|
|
219
|
-
import { isDefinedNotNull } from "@xylabs/typeof";
|
|
220
|
+
import { isDefined, isDefinedNotNull, isUndefined } from "@xylabs/typeof";
|
|
220
221
|
import { useHttpRpcViewer, useViewerFromWallet } from "@xyo-network/react-chain-provider";
|
|
221
|
-
var useViewerInPage = /* @__PURE__ */ __name(() => {
|
|
222
|
+
var useViewerInPage = /* @__PURE__ */ __name((networkOverride) => {
|
|
223
|
+
let networkBootstrap;
|
|
222
224
|
const { activeNetwork } = useChainNetwork();
|
|
223
|
-
|
|
224
|
-
const
|
|
225
|
+
networkBootstrap = isDefined(networkOverride) ? networkOverride : activeNetwork;
|
|
226
|
+
const httpRpcViewer = useHttpRpcViewer(networkBootstrap?.url);
|
|
227
|
+
const [walletRpcViewer] = useViewerFromWallet(networkBootstrap?.id);
|
|
228
|
+
if (isUndefined(walletRpcViewer)) return;
|
|
225
229
|
return isDefinedNotNull(walletRpcViewer) ? walletRpcViewer : httpRpcViewer;
|
|
226
230
|
}, "useViewerInPage");
|
|
227
231
|
|
|
@@ -267,7 +271,7 @@ var useViewerInWallet = /* @__PURE__ */ __name(() => {
|
|
|
267
271
|
|
|
268
272
|
// src/hooks/status/usePollNetworkStatus.ts
|
|
269
273
|
import { delay } from "@xylabs/delay";
|
|
270
|
-
import { isUndefined } from "@xylabs/typeof";
|
|
274
|
+
import { isUndefined as isUndefined2 } from "@xylabs/typeof";
|
|
271
275
|
import { useEffect, useState as useState3 } from "react";
|
|
272
276
|
var STATUS_CHECK_INTERVAL = 1e4;
|
|
273
277
|
var usePollNetworkStatus = /* @__PURE__ */ __name(() => {
|
|
@@ -277,7 +281,7 @@ var usePollNetworkStatus = /* @__PURE__ */ __name(() => {
|
|
|
277
281
|
useEffect(() => {
|
|
278
282
|
let checkNetwork = true;
|
|
279
283
|
void (async () => {
|
|
280
|
-
if (
|
|
284
|
+
if (isUndefined2(network)) return;
|
|
281
285
|
while (checkNetwork) {
|
|
282
286
|
try {
|
|
283
287
|
const response = await network.status();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/menu/Avatar.tsx","../../src/context/network/context.ts","../../src/context/network/Provider.tsx","../../src/context/network/use.ts","../../src/components/menu/Icon.tsx","../../src/components/menu/MenuItem.tsx","../../src/components/status/Alert.tsx","../../src/components/status/Dialog.tsx","../../src/components/status/NetworkStatus.tsx","../../src/hooks/provider/useActiveNetworkCurrentBlock.ts","../../src/hooks/provider/useViewerInPage.ts","../../src/hooks/provider/useActiveNetworkNetwork.ts","../../src/hooks/provider/useActiveNetworkRunner.ts","../../src/hooks/provider/useViewerInWallet.ts","../../src/hooks/status/usePollNetworkStatus.ts"],"sourcesContent":["import type { AvatarProps } from '@mui/material'\nimport { Avatar } from '@mui/material'\nimport type { CSSProperties } from 'react'\nimport React from 'react'\n\nimport { useChainNetwork } from '../../context/index.ts'\nimport { NetworkIcon } from './Icon.tsx'\n\nexport interface NetworkAvatarProps extends AvatarProps {\n icon?: string\n iconStyles?: CSSProperties\n name?: string\n}\n\nexport const NetworkAvatar: React.FC<NetworkAvatarProps> = ({\n icon, iconStyles, name, sx, ...props\n}) => {\n return (\n <Avatar\n sx={{ backgroundColor: 'white', ...sx }}\n alt={name}\n {...props}\n >\n <NetworkIcon\n icon={icon}\n style={{ ...iconStyles }}\n />\n </Avatar>\n )\n}\n\nexport const ActiveNetworkAvatar: React.FC<AvatarProps> = (props) => {\n const { activeNetwork } = useChainNetwork()\n\n return (\n <NetworkAvatar\n icon={activeNetwork?.icon}\n name={activeNetwork?.name}\n {...props}\n />\n )\n}\n","import { createContextEx } from '@xylabs/react-shared'\n\nimport type { ChainNetworkState } from './state.ts'\n\nexport const ChainNetworkContext = createContextEx<ChainNetworkState>()\n","import { ErrorRender } from '@xylabs/react-error'\nimport { usePromise } from '@xylabs/react-promise'\nimport type { NetworkBootstrap } from '@xyo-network/chain-network-model'\nimport { MainNetwork } from '@xyo-network/chain-network-model'\nimport type { PropsWithChildren } from 'react'\nimport React, {\n useCallback, useMemo, useState,\n} from 'react'\n\nimport { ChainNetworkContext } from './context.ts'\nimport type { ChainNetworkState } from './state.ts'\n\nexport interface ChainNetworkProviderProps extends PropsWithChildren {\n getActiveNetwork?: () => Promise<NetworkBootstrap | undefined>\n networks?: NetworkBootstrap[]\n setActiveNetwork?: (networkId: NetworkBootstrap['id']) => Promise<NetworkBootstrap>\n}\n\nexport const ChainNetworkProvider: React.FC<ChainNetworkProviderProps> = ({\n children, getActiveNetwork, networks, setActiveNetwork: setActiveNetworkExternal,\n}) => {\n const [activeNetwork, setActiveNetwork] = useState<NetworkBootstrap>()\n const [error, setError] = useState<Error>()\n\n // Set the active network upon initialization\n const [resolvedActiveNetwork, activeNetworkError] = usePromise(async () => {\n // ensure networks are loaded\n if (!networks) return\n // get last saved active network\n const activeNetwork = await getActiveNetwork?.()\n // ensure the active network saved is found in the list of networks\n if (activeNetwork && networks?.find(network => network.id === activeNetwork.id)) {\n // Set the active network if it exists\n return activeNetwork\n } else {\n // Set the default network if no active network exists\n const defaultNetwork = networks.find(network => network.id === MainNetwork.id) ?? networks[0]\n await setActiveNetworkExternal?.(defaultNetwork.id)\n\n // Set the active network in the context\n return defaultNetwork\n }\n }, [networks])\n\n useMemo(() => {\n if (resolvedActiveNetwork) {\n setActiveNetwork(resolvedActiveNetwork)\n }\n }, [resolvedActiveNetwork])\n\n const updateActiveNetwork = useCallback((networkId: NetworkBootstrap['id']) => {\n setError(undefined)\n const network = networks?.find(network => network.id === networkId)\n if (!network) {\n setError(new Error(`Network with id ${networkId} not found`))\n return\n }\n // set internally\n setActiveNetwork(network)\n // set externally\n void setActiveNetworkExternal?.(networkId)\n }, [networks])\n\n const value: ChainNetworkState = useMemo(() => ({\n activeNetwork,\n networks,\n provided: true,\n updateActiveNetwork,\n chainNetworkError: error ?? activeNetworkError,\n }), [activeNetwork, networks, updateActiveNetwork])\n\n return (\n <ChainNetworkContext value={value}>\n <ErrorRender error={error ?? activeNetworkError} scope=\"ChainNetworkProvider\" />\n {children}\n </ChainNetworkContext>\n )\n}\n","import { useContextEx } from '@xylabs/react-shared'\n\nimport { ChainNetworkContext } from './context.ts'\n\nexport const useChainNetwork = (required = true) => useContextEx(ChainNetworkContext, 'ChainNetwork', required)\n","import type { DetailedHTMLProps, HtmlHTMLAttributes } from 'react'\nimport React from 'react'\n\nexport interface NetworkIconProps extends DetailedHTMLProps<HtmlHTMLAttributes<HTMLSpanElement>, HTMLSpanElement> {\n icon?: string\n}\n\nexport const NetworkIcon: React.FC<NetworkIconProps> = ({\n icon, style, ...props\n}) => {\n return (\n <span\n dangerouslySetInnerHTML={{ __html: icon ?? '' }} // Placeholder for SVG\\\n style={{\n display: 'inline-flex', width: 24, height: 24, ...style,\n }}\n {...props}\n />\n )\n}\n","import type { MenuItemProps } from '@mui/material'\nimport { ListItemText } from '@mui/material'\nimport type { NetworkBootstrap } from '@xyo-network/chain-network-model'\nimport { ActiveMenuItem } from '@xyo-network/react-chain-shared'\nimport type { NetworkId } from '@xyo-network/xl1-protocol'\nimport type { MouseEvent as ReactMouseEvent } from 'react'\nimport React from 'react'\n\nimport { NetworkAvatar } from './Avatar.tsx'\n\nexport interface NetworkMenuItemProps extends MenuItemProps {\n active?: boolean\n network?: NetworkBootstrap\n updateActiveNetwork?: (networkId: NetworkId) => void\n}\n\nexport const NetworkMenuItem: React.FC<NetworkMenuItemProps> = ({\n active, network, onClick, updateActiveNetwork, ...props\n}) => {\n const handleClick = (event: ReactMouseEvent<HTMLLIElement, MouseEvent>) => {\n if (network === undefined) throw new Error('Network is undefined')\n updateActiveNetwork?.(network.id)\n onClick?.(event)\n }\n\n return (\n <ActiveMenuItem\n title={network?.name}\n disableRipple\n onClick={handleClick}\n active={active}\n sx={{ py: 1 }}\n {...props}\n >\n <NetworkAvatar icon={network?.icon} name={network?.name} sx={{ width: 30, height: 30 }} />\n <ListItemText>{network?.name}</ListItemText>\n </ActiveMenuItem>\n )\n}\n","import type { AlertProps } from '@mui/material'\nimport {\n Alert, AlertTitle, Button,\n} from '@mui/material'\nimport type { NetworkStatus } from '@xyo-network/xl1-protocol'\nimport React, { useMemo, useState } from 'react'\n\nimport { NetworkStatusDialog } from './Dialog.tsx'\n\nexport interface NetworkStatusAlertProps extends AlertProps {\n status?: NetworkStatus\n}\n\nexport const NetworkStatusAlert: React.FC<NetworkStatusAlertProps> = ({ status, ...props }) => {\n const [open, setOpen] = useState(false)\n const handleClose = () => setOpen(false)\n\n const severity = useMemo(() => {\n if (!status) return\n switch (status.state) {\n case 'online': {\n return 'success'\n }\n case 'offline': {\n return 'error'\n }\n case 'degraded': {\n return 'warning'\n }\n case 'unknown': {\n return 'error'\n }\n }\n }, [status])\n\n return (\n <Alert severity={severity} {...props}>\n <AlertTitle>{status?.description}</AlertTitle>\n {status?.updates && status.updates.length > 0\n ? (\n <>\n <Button color={severity} variant=\"outlined\" size=\"small\" onClick={() => setOpen(true)}>\n Updates\n </Button>\n <NetworkStatusDialog open={open} onClose={handleClose} updates={status.updates} />\n </>\n )\n : null}\n </Alert>\n )\n}\n","import type { DialogProps } from '@mui/material'\nimport {\n Button, Dialog, DialogActions, DialogContent, DialogTitle, List, ListItem, Typography,\n} from '@mui/material'\nimport type { NetworkStatusUpdate } from '@xyo-network/xl1-protocol'\nimport React from 'react'\n\nexport interface NetworkStatusDialogProps extends DialogProps {\n updates: NetworkStatusUpdate[]\n}\n\nexport const NetworkStatusDialog: React.FC<NetworkStatusDialogProps> = ({ updates, ...props }) => {\n return (\n <Dialog {...props}>\n <DialogTitle>Recent Status Updates</DialogTitle>\n <DialogContent>\n <List>\n {updates.map(({\n start, end, update,\n }) => (\n <ListItem\n key={start + update}\n sx={{\n flexDirection: 'column', alignItems: 'start', pl: 0,\n }}\n >\n <Typography>\n {update}\n </Typography>\n <Typography gutterBottom sx={{ opacity: 0.75, fontSize: '.8333rem' }}>\n Start:\n {' '}\n {new Date(start).toLocaleString()}\n {' '}\n <br />\n End:\n {' '}\n {new Date(end).toLocaleString()}\n </Typography>\n </ListItem>\n ))}\n </List>\n </DialogContent>\n <DialogActions>\n <Button onClick={e => props.onClose?.(e, 'backdropClick')} color=\"primary\" variant=\"outlined\">\n Close\n </Button>\n </DialogActions>\n </Dialog>\n )\n}\n","import type { AlertProps } from '@mui/material'\nimport type { PropsWithChildren } from 'react'\nimport React from 'react'\n\nimport { usePollNetworkStatus } from '../../hooks/index.ts'\nimport { NetworkStatusAlert } from './Alert.tsx'\n\nconst validNetworkStates = new Set(['online', 'unknown'])\n\nexport interface NetworkStatusProps extends PropsWithChildren<AlertProps> {}\n\nexport const NetworkStatus: React.FC<NetworkStatusProps> = ({ children, ...props }) => {\n const [networkStatus] = usePollNetworkStatus()\n const showStatus = networkStatus && !validNetworkStates.has(networkStatus.state)\n return (\n <>\n {showStatus ? <NetworkStatusAlert status={networkStatus} {...props} /> : null}\n {children}\n </>\n )\n}\n","import { useCurrentBlock, useViewerFromWallet } from '@xyo-network/react-chain-provider'\nimport type { XyoViewer } from '@xyo-network/xl1-protocol-sdk'\n\nimport { useViewerInPage } from './useViewerInPage.ts'\n\nexport const useActiveNetworkCurrentBlock = (refresh = 1, viewer?: XyoViewer) => {\n const currentBlock = useCurrentBlock(refresh, viewer)\n\n return currentBlock\n}\n\nexport const useActiveNetworkCurrentBlockInPage = (refresh = 1) => {\n const viewer = useViewerInPage()\n const currentBlock = useCurrentBlock(refresh, viewer)\n\n return currentBlock\n}\n\nexport const useActiveNetworkCurrentBlockInWallet = (refresh = 1) => {\n const [viewer] = useViewerFromWallet()\n const currentBlock = useCurrentBlock(refresh, viewer)\n\n return currentBlock\n}\n","import { isDefinedNotNull } from '@xylabs/typeof'\nimport { useHttpRpcViewer, useViewerFromWallet } from '@xyo-network/react-chain-provider'\n\nimport { useChainNetwork } from '../../context/index.ts'\n\n/**\n * Get the viewer for the active network, first from the wallet or fallback to HTTP RPC\n * @returns - XyoViewer for the active network\n */\nexport const useViewerInPage = () => {\n const { activeNetwork } = useChainNetwork()\n const httpRpcViewer = useHttpRpcViewer(activeNetwork?.url)\n const [walletRpcViewer] = useViewerFromWallet(activeNetwork?.id)\n return isDefinedNotNull(walletRpcViewer) ? walletRpcViewer : httpRpcViewer\n}\n","import { useNetwork } from '@xyo-network/react-chain-provider'\n\nimport { useChainNetwork } from '../../context/index.ts'\n\nexport const useActiveNetworkNetwork = () => {\n const { activeNetwork } = useChainNetwork()\n const network = useNetwork(activeNetwork?.id)\n return network\n}\n","import { useHttpRpcRunner } from '@xyo-network/react-chain-provider'\n\nimport { useChainNetwork } from '../../context/index.ts'\n\nexport const useActiveNetworkRunner = () => {\n const { activeNetwork } = useChainNetwork()\n const runner = useHttpRpcRunner(activeNetwork?.url)\n\n return runner\n}\n","import { useHttpRpcViewer } from '@xyo-network/react-chain-provider'\n\nimport { useChainNetwork } from '../../context/index.ts'\n\n/**\n * Get the viewer directly from the active network\n * @returns - The viewer for the active network\n */\nexport const useViewerInWallet = () => {\n const { activeNetwork } = useChainNetwork()\n const walletViewer = useHttpRpcViewer(activeNetwork?.url)\n return walletViewer\n}\n","import { delay } from '@xylabs/delay'\nimport { isUndefined } from '@xylabs/typeof'\nimport type { NetworkStatus } from '@xyo-network/xl1-protocol'\nimport { useEffect, useState } from 'react'\n\nimport { useActiveNetworkNetwork } from '../index.ts'\n\nconst STATUS_CHECK_INTERVAL = 10_000\n\nexport const usePollNetworkStatus = () => {\n const network = useActiveNetworkNetwork()\n const [networkStatus, setNetworkStatus] = useState<NetworkStatus>()\n const [networkStatusError, setNetworkStatusError] = useState<Error>()\n\n // Check network status every 10 seconds\n useEffect(() => {\n let checkNetwork = true\n void (async () => {\n if (isUndefined(network)) return\n while (checkNetwork) {\n try {\n const response = await network.status()\n setNetworkStatus(response)\n setNetworkStatusError(undefined)\n } catch (error) {\n console.error('Error fetching network status:', error)\n setNetworkStatus(undefined)\n setNetworkStatusError(error as Error)\n }\n await delay(STATUS_CHECK_INTERVAL)\n }\n })()\n\n return () => {\n // Cleanup function to stop checking network status at the current statusUrl\n checkNetwork = false\n }\n }, [network])\n\n return [networkStatus, networkStatusError] as const\n}\n"],"mappings":"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","names":["Avatar","React","createContextEx","ChainNetworkContext","ErrorRender","usePromise","MainNetwork","React","useCallback","useMemo","useState","ChainNetworkProvider","children","getActiveNetwork","networks","setActiveNetwork","setActiveNetworkExternal","activeNetwork","useState","error","setError","resolvedActiveNetwork","activeNetworkError","usePromise","find","network","id","defaultNetwork","MainNetwork","useMemo","updateActiveNetwork","useCallback","networkId","undefined","Error","value","provided","chainNetworkError","ChainNetworkContext","ErrorRender","scope","useContextEx","useChainNetwork","required","useContextEx","ChainNetworkContext","React","NetworkIcon","icon","style","props","React","span","dangerouslySetInnerHTML","__html","display","width","height","NetworkAvatar","icon","iconStyles","name","sx","props","React","Avatar","backgroundColor","alt","NetworkIcon","style","ActiveNetworkAvatar","activeNetwork","useChainNetwork","ListItemText","ActiveMenuItem","React","NetworkMenuItem","active","network","onClick","updateActiveNetwork","props","handleClick","event","undefined","Error","id","React","ActiveMenuItem","title","name","disableRipple","sx","py","NetworkAvatar","icon","width","height","ListItemText","Alert","AlertTitle","Button","React","useMemo","useState","Button","Dialog","DialogActions","DialogContent","DialogTitle","List","ListItem","Typography","React","NetworkStatusDialog","updates","props","React","Dialog","DialogTitle","DialogContent","List","map","start","end","update","ListItem","key","sx","flexDirection","alignItems","pl","Typography","gutterBottom","opacity","fontSize","Date","toLocaleString","br","DialogActions","Button","onClick","e","onClose","color","variant","NetworkStatusAlert","status","props","open","setOpen","useState","handleClose","severity","useMemo","state","React","Alert","AlertTitle","description","updates","length","Button","color","variant","size","onClick","NetworkStatusDialog","onClose","React","useCurrentBlock","useViewerFromWallet","isDefinedNotNull","useHttpRpcViewer","useViewerFromWallet","useViewerInPage","activeNetwork","useChainNetwork","httpRpcViewer","useHttpRpcViewer","url","walletRpcViewer","useViewerFromWallet","id","isDefinedNotNull","useActiveNetworkCurrentBlock","refresh","viewer","currentBlock","useCurrentBlock","useActiveNetworkCurrentBlockInPage","useViewerInPage","useActiveNetworkCurrentBlockInWallet","useViewerFromWallet","useNetwork","useActiveNetworkNetwork","activeNetwork","useChainNetwork","network","useNetwork","id","useHttpRpcRunner","useActiveNetworkRunner","activeNetwork","useChainNetwork","runner","useHttpRpcRunner","url","useHttpRpcViewer","useViewerInWallet","activeNetwork","useChainNetwork","walletViewer","useHttpRpcViewer","url","delay","isUndefined","useEffect","useState","STATUS_CHECK_INTERVAL","usePollNetworkStatus","network","useActiveNetworkNetwork","networkStatus","setNetworkStatus","useState","networkStatusError","setNetworkStatusError","useEffect","checkNetwork","isUndefined","response","status","undefined","error","console","delay","validNetworkStates","Set","NetworkStatus","children","props","networkStatus","usePollNetworkStatus","showStatus","has","state","React","NetworkStatusAlert","status"]}
|
|
1
|
+
{"version":3,"sources":["../../src/components/menu/Avatar.tsx","../../src/context/network/context.ts","../../src/context/network/Provider.tsx","../../src/context/network/use.ts","../../src/components/menu/Icon.tsx","../../src/components/menu/MenuItem.tsx","../../src/components/status/Alert.tsx","../../src/components/status/Dialog.tsx","../../src/components/status/NetworkStatus.tsx","../../src/hooks/provider/useActiveNetworkCurrentBlock.ts","../../src/hooks/provider/useViewerInPage.ts","../../src/hooks/provider/useActiveNetworkNetwork.ts","../../src/hooks/provider/useActiveNetworkRunner.ts","../../src/hooks/provider/useViewerInWallet.ts","../../src/hooks/status/usePollNetworkStatus.ts"],"sourcesContent":["import type { AvatarProps } from '@mui/material'\nimport { Avatar } from '@mui/material'\nimport type { CSSProperties } from 'react'\nimport React from 'react'\n\nimport { useChainNetwork } from '../../context/index.ts'\nimport { NetworkIcon } from './Icon.tsx'\n\nexport interface NetworkAvatarProps extends AvatarProps {\n icon?: string\n iconStyles?: CSSProperties\n name?: string\n}\n\nexport const NetworkAvatar: React.FC<NetworkAvatarProps> = ({\n icon, iconStyles, name, sx, ...props\n}) => {\n return (\n <Avatar\n sx={{ backgroundColor: 'white', ...sx }}\n alt={name}\n {...props}\n >\n <NetworkIcon\n icon={icon}\n style={{ ...iconStyles }}\n />\n </Avatar>\n )\n}\n\nexport const ActiveNetworkAvatar: React.FC<AvatarProps> = (props) => {\n const { activeNetwork } = useChainNetwork()\n\n return (\n <NetworkAvatar\n icon={activeNetwork?.icon}\n name={activeNetwork?.name}\n {...props}\n />\n )\n}\n","import { createContextEx } from '@xylabs/react-shared'\n\nimport type { ChainNetworkState } from './state.ts'\n\nexport const ChainNetworkContext = createContextEx<ChainNetworkState>()\n","import { ErrorRender } from '@xylabs/react-error'\nimport { usePromise } from '@xylabs/react-promise'\nimport type { NetworkBootstrap } from '@xyo-network/chain-network-model'\nimport { MainNetwork } from '@xyo-network/chain-network-model'\nimport type { PropsWithChildren } from 'react'\nimport React, {\n useCallback, useMemo, useState,\n} from 'react'\n\nimport { ChainNetworkContext } from './context.ts'\nimport type { ChainNetworkState } from './state.ts'\n\nexport interface ChainNetworkProviderProps extends PropsWithChildren {\n getActiveNetwork?: () => Promise<NetworkBootstrap | undefined>\n networks?: NetworkBootstrap[]\n setActiveNetwork?: (networkId: NetworkBootstrap['id']) => Promise<NetworkBootstrap>\n}\n\nexport const ChainNetworkProvider: React.FC<ChainNetworkProviderProps> = ({\n children, getActiveNetwork, networks, setActiveNetwork: setActiveNetworkExternal,\n}) => {\n const [activeNetwork, setActiveNetwork] = useState<NetworkBootstrap>()\n const [error, setError] = useState<Error>()\n\n // Set the active network upon initialization\n const [resolvedActiveNetwork, activeNetworkError] = usePromise(async () => {\n // ensure networks are loaded\n if (!networks) return\n // get last saved active network\n const activeNetwork = await getActiveNetwork?.()\n // ensure the active network saved is found in the list of networks\n if (activeNetwork && networks?.find(network => network.id === activeNetwork.id)) {\n // Set the active network if it exists\n return activeNetwork\n } else {\n // Set the default network if no active network exists\n const defaultNetwork = networks.find(network => network.id === MainNetwork.id) ?? networks[0]\n await setActiveNetworkExternal?.(defaultNetwork.id)\n\n // Set the active network in the context\n return defaultNetwork\n }\n }, [networks])\n\n useMemo(() => {\n if (resolvedActiveNetwork) {\n setActiveNetwork(resolvedActiveNetwork)\n }\n }, [resolvedActiveNetwork])\n\n const updateActiveNetwork = useCallback((networkId: NetworkBootstrap['id']) => {\n setError(undefined)\n const network = networks?.find(network => network.id === networkId)\n if (!network) {\n setError(new Error(`Network with id ${networkId} not found`))\n return\n }\n // set internally\n setActiveNetwork(network)\n // set externally\n void setActiveNetworkExternal?.(networkId)\n }, [networks])\n\n const value: ChainNetworkState = useMemo(() => ({\n activeNetwork,\n networks,\n provided: true,\n updateActiveNetwork,\n chainNetworkError: error ?? activeNetworkError,\n }), [activeNetwork, networks, updateActiveNetwork])\n\n return (\n <ChainNetworkContext value={value}>\n <ErrorRender error={error ?? activeNetworkError} scope=\"ChainNetworkProvider\" />\n {children}\n </ChainNetworkContext>\n )\n}\n","import { useContextEx } from '@xylabs/react-shared'\n\nimport { ChainNetworkContext } from './context.ts'\n\nexport const useChainNetwork = (required = true) => useContextEx(ChainNetworkContext, 'ChainNetwork', required)\n","import type { DetailedHTMLProps, HtmlHTMLAttributes } from 'react'\nimport React from 'react'\n\nexport interface NetworkIconProps extends DetailedHTMLProps<HtmlHTMLAttributes<HTMLSpanElement>, HTMLSpanElement> {\n icon?: string\n}\n\nexport const NetworkIcon: React.FC<NetworkIconProps> = ({\n icon, style, ...props\n}) => {\n return (\n <span\n // eslint-disable-next-line react-dom/no-dangerously-set-innerhtml\n dangerouslySetInnerHTML={{ __html: icon ?? '' }} // Placeholder for SVG\\\n style={{\n display: 'inline-flex', width: 24, height: 24, ...style,\n }}\n {...props}\n />\n )\n}\n","import type { MenuItemProps } from '@mui/material'\nimport { ListItemText } from '@mui/material'\nimport type { NetworkBootstrap } from '@xyo-network/chain-network-model'\nimport { ActiveMenuItem } from '@xyo-network/react-chain-shared'\nimport type { NetworkId } from '@xyo-network/xl1-protocol'\nimport type { MouseEvent as ReactMouseEvent } from 'react'\nimport React from 'react'\n\nimport { NetworkAvatar } from './Avatar.tsx'\n\nexport interface NetworkMenuItemProps extends MenuItemProps {\n active?: boolean\n network?: NetworkBootstrap\n updateActiveNetwork?: (networkId: NetworkId) => void\n}\n\nexport const NetworkMenuItem: React.FC<NetworkMenuItemProps> = ({\n active, network, onClick, updateActiveNetwork, ...props\n}) => {\n const handleClick = (event: ReactMouseEvent<HTMLLIElement, MouseEvent>) => {\n if (network === undefined) throw new Error('Network is undefined')\n updateActiveNetwork?.(network.id)\n onClick?.(event)\n }\n\n return (\n <ActiveMenuItem\n title={network?.name}\n disableRipple\n onClick={handleClick}\n active={active}\n sx={{ py: 1 }}\n {...props}\n >\n <NetworkAvatar icon={network?.icon} name={network?.name} sx={{ width: 30, height: 30 }} />\n <ListItemText>{network?.name}</ListItemText>\n </ActiveMenuItem>\n )\n}\n","import type { AlertProps } from '@mui/material'\nimport {\n Alert, AlertTitle, Button,\n} from '@mui/material'\nimport type { NetworkStatus } from '@xyo-network/xl1-protocol'\nimport React, { useMemo, useState } from 'react'\n\nimport { NetworkStatusDialog } from './Dialog.tsx'\n\nexport interface NetworkStatusAlertProps extends AlertProps {\n status?: NetworkStatus\n}\n\nexport const NetworkStatusAlert: React.FC<NetworkStatusAlertProps> = ({ status, ...props }) => {\n const [open, setOpen] = useState(false)\n const handleClose = () => setOpen(false)\n\n const severity = useMemo(() => {\n if (!status) return\n switch (status.state) {\n case 'online': {\n return 'success'\n }\n case 'offline': {\n return 'error'\n }\n case 'degraded': {\n return 'warning'\n }\n case 'unknown': {\n return 'error'\n }\n }\n }, [status])\n\n return (\n <Alert severity={severity} {...props}>\n <AlertTitle>{status?.description}</AlertTitle>\n {status?.updates && status.updates.length > 0\n ? (\n <>\n <Button color={severity} variant=\"outlined\" size=\"small\" onClick={() => setOpen(true)}>\n Updates\n </Button>\n <NetworkStatusDialog open={open} onClose={handleClose} updates={status.updates} />\n </>\n )\n : null}\n </Alert>\n )\n}\n","import type { DialogProps } from '@mui/material'\nimport {\n Button, Dialog, DialogActions, DialogContent, DialogTitle, List, ListItem, Typography,\n} from '@mui/material'\nimport type { NetworkStatusUpdate } from '@xyo-network/xl1-protocol'\nimport React from 'react'\n\nexport interface NetworkStatusDialogProps extends DialogProps {\n updates: NetworkStatusUpdate[]\n}\n\nexport const NetworkStatusDialog: React.FC<NetworkStatusDialogProps> = ({ updates, ...props }) => {\n return (\n <Dialog {...props}>\n <DialogTitle>Recent Status Updates</DialogTitle>\n <DialogContent>\n <List>\n {updates.map(({\n start, end, update,\n }) => (\n <ListItem\n key={start + update}\n sx={{\n flexDirection: 'column', alignItems: 'start', pl: 0,\n }}\n >\n <Typography>\n {update}\n </Typography>\n <Typography gutterBottom sx={{ opacity: 0.75, fontSize: '.8333rem' }}>\n Start:\n {' '}\n {new Date(start).toLocaleString()}\n {' '}\n <br />\n End:\n {' '}\n {new Date(end).toLocaleString()}\n </Typography>\n </ListItem>\n ))}\n </List>\n </DialogContent>\n <DialogActions>\n <Button onClick={e => props.onClose?.(e, 'backdropClick')} color=\"primary\" variant=\"outlined\">\n Close\n </Button>\n </DialogActions>\n </Dialog>\n )\n}\n","import type { AlertProps } from '@mui/material'\nimport type { PropsWithChildren } from 'react'\nimport React from 'react'\n\nimport { usePollNetworkStatus } from '../../hooks/index.ts'\nimport { NetworkStatusAlert } from './Alert.tsx'\n\nconst validNetworkStates = new Set(['online', 'unknown'])\n\nexport interface NetworkStatusProps extends PropsWithChildren<AlertProps> {}\n\nexport const NetworkStatus: React.FC<NetworkStatusProps> = ({ children, ...props }) => {\n const [networkStatus] = usePollNetworkStatus()\n const showStatus = networkStatus && !validNetworkStates.has(networkStatus.state)\n return (\n <>\n {showStatus ? <NetworkStatusAlert status={networkStatus} {...props} /> : null}\n {children}\n </>\n )\n}\n","import { useCurrentBlock, useViewerFromWallet } from '@xyo-network/react-chain-provider'\nimport type { XyoViewer } from '@xyo-network/xl1-protocol-sdk'\n\nimport { useViewerInPage } from './useViewerInPage.ts'\n\nexport const useActiveNetworkCurrentBlock = (refresh = 1, viewer?: XyoViewer) => {\n const currentBlock = useCurrentBlock(refresh, viewer)\n\n return currentBlock\n}\n\nexport const useActiveNetworkCurrentBlockInPage = (refresh = 1) => {\n const viewer = useViewerInPage()\n const currentBlock = useCurrentBlock(refresh, viewer)\n\n return currentBlock\n}\n\nexport const useActiveNetworkCurrentBlockInWallet = (refresh = 1) => {\n const [viewer] = useViewerFromWallet()\n const currentBlock = useCurrentBlock(refresh, viewer)\n\n return currentBlock\n}\n","import {\n isDefined, isDefinedNotNull, isUndefined,\n} from '@xylabs/typeof'\nimport { type NetworkBootstrap } from '@xyo-network/chain-network-model'\nimport { useHttpRpcViewer, useViewerFromWallet } from '@xyo-network/react-chain-provider'\n\nimport { useChainNetwork } from '../../context/index.ts'\n\n/**\n * Get the viewer for the active network, first from the wallet or fallback to HTTP RPC\n * @returns - XyoViewer for the active network\n */\nexport const useViewerInPage = (networkOverride?: NetworkBootstrap) => {\n let networkBootstrap: NetworkBootstrap | undefined\n const { activeNetwork } = useChainNetwork()\n networkBootstrap = isDefined(networkOverride) ? networkOverride : activeNetwork\n\n const httpRpcViewer = useHttpRpcViewer(networkBootstrap?.url)\n const [walletRpcViewer] = useViewerFromWallet(networkBootstrap?.id)\n\n if (isUndefined(walletRpcViewer)) return\n return isDefinedNotNull(walletRpcViewer) ? walletRpcViewer : httpRpcViewer\n}\n","import { useNetwork } from '@xyo-network/react-chain-provider'\n\nimport { useChainNetwork } from '../../context/index.ts'\n\nexport const useActiveNetworkNetwork = () => {\n const { activeNetwork } = useChainNetwork()\n const network = useNetwork(activeNetwork?.id)\n return network\n}\n","import { useHttpRpcRunner } from '@xyo-network/react-chain-provider'\n\nimport { useChainNetwork } from '../../context/index.ts'\n\nexport const useActiveNetworkRunner = () => {\n const { activeNetwork } = useChainNetwork()\n const runner = useHttpRpcRunner(activeNetwork?.url)\n\n return runner\n}\n","import { useHttpRpcViewer } from '@xyo-network/react-chain-provider'\n\nimport { useChainNetwork } from '../../context/index.ts'\n\n/**\n * Get the viewer directly from the active network\n * @returns - The viewer for the active network\n */\nexport const useViewerInWallet = () => {\n const { activeNetwork } = useChainNetwork()\n const walletViewer = useHttpRpcViewer(activeNetwork?.url)\n return walletViewer\n}\n","import { delay } from '@xylabs/delay'\nimport { isUndefined } from '@xylabs/typeof'\nimport type { NetworkStatus } from '@xyo-network/xl1-protocol'\nimport { useEffect, useState } from 'react'\n\nimport { useActiveNetworkNetwork } from '../index.ts'\n\nconst STATUS_CHECK_INTERVAL = 10_000\n\nexport const usePollNetworkStatus = () => {\n const network = useActiveNetworkNetwork()\n const [networkStatus, setNetworkStatus] = useState<NetworkStatus>()\n const [networkStatusError, setNetworkStatusError] = useState<Error>()\n\n // Check network status every 10 seconds\n useEffect(() => {\n let checkNetwork = true\n void (async () => {\n if (isUndefined(network)) return\n while (checkNetwork) {\n try {\n const response = await network.status()\n setNetworkStatus(response)\n setNetworkStatusError(undefined)\n } catch (error) {\n console.error('Error fetching network status:', error)\n setNetworkStatus(undefined)\n setNetworkStatusError(error as Error)\n }\n await delay(STATUS_CHECK_INTERVAL)\n }\n })()\n\n return () => {\n // Cleanup function to stop checking network status at the current statusUrl\n checkNetwork = false\n }\n }, [network])\n\n return [networkStatus, networkStatusError] as const\n}\n"],"mappings":"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","names":["Avatar","React","createContextEx","ChainNetworkContext","ErrorRender","usePromise","MainNetwork","React","useCallback","useMemo","useState","ChainNetworkProvider","children","getActiveNetwork","networks","setActiveNetwork","setActiveNetworkExternal","activeNetwork","useState","error","setError","resolvedActiveNetwork","activeNetworkError","usePromise","find","network","id","defaultNetwork","MainNetwork","useMemo","updateActiveNetwork","useCallback","networkId","undefined","Error","value","provided","chainNetworkError","ChainNetworkContext","ErrorRender","scope","useContextEx","useChainNetwork","required","useContextEx","ChainNetworkContext","React","NetworkIcon","icon","style","props","React","span","dangerouslySetInnerHTML","__html","display","width","height","NetworkAvatar","icon","iconStyles","name","sx","props","React","Avatar","backgroundColor","alt","NetworkIcon","style","ActiveNetworkAvatar","activeNetwork","useChainNetwork","ListItemText","ActiveMenuItem","React","NetworkMenuItem","active","network","onClick","updateActiveNetwork","props","handleClick","event","undefined","Error","id","React","ActiveMenuItem","title","name","disableRipple","sx","py","NetworkAvatar","icon","width","height","ListItemText","Alert","AlertTitle","Button","React","useMemo","useState","Button","Dialog","DialogActions","DialogContent","DialogTitle","List","ListItem","Typography","React","NetworkStatusDialog","updates","props","React","Dialog","DialogTitle","DialogContent","List","map","start","end","update","ListItem","key","sx","flexDirection","alignItems","pl","Typography","gutterBottom","opacity","fontSize","Date","toLocaleString","br","DialogActions","Button","onClick","e","onClose","color","variant","NetworkStatusAlert","status","props","open","setOpen","useState","handleClose","severity","useMemo","state","React","Alert","AlertTitle","description","updates","length","Button","color","variant","size","onClick","NetworkStatusDialog","onClose","React","useCurrentBlock","useViewerFromWallet","isDefined","isDefinedNotNull","isUndefined","useHttpRpcViewer","useViewerFromWallet","useViewerInPage","networkOverride","networkBootstrap","activeNetwork","useChainNetwork","isDefined","httpRpcViewer","useHttpRpcViewer","url","walletRpcViewer","useViewerFromWallet","id","isUndefined","isDefinedNotNull","useActiveNetworkCurrentBlock","refresh","viewer","currentBlock","useCurrentBlock","useActiveNetworkCurrentBlockInPage","useViewerInPage","useActiveNetworkCurrentBlockInWallet","useViewerFromWallet","useNetwork","useActiveNetworkNetwork","activeNetwork","useChainNetwork","network","useNetwork","id","useHttpRpcRunner","useActiveNetworkRunner","activeNetwork","useChainNetwork","runner","useHttpRpcRunner","url","useHttpRpcViewer","useViewerInWallet","activeNetwork","useChainNetwork","walletViewer","useHttpRpcViewer","url","delay","isUndefined","useEffect","useState","STATUS_CHECK_INTERVAL","usePollNetworkStatus","network","useActiveNetworkNetwork","networkStatus","setNetworkStatus","useState","networkStatusError","setNetworkStatusError","useEffect","checkNetwork","isUndefined","response","status","undefined","error","console","delay","validNetworkStates","Set","NetworkStatus","children","props","networkStatus","usePollNetworkStatus","showStatus","has","state","React","NetworkStatusAlert","status"]}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "http://json.schemastore.org/package.json",
|
|
3
3
|
"name": "@xyo-network/react-chain-network",
|
|
4
|
-
"version": "1.16.
|
|
4
|
+
"version": "1.16.7",
|
|
5
5
|
"description": "XYO Layer One React SDK",
|
|
6
6
|
"homepage": "https://xylabs.com",
|
|
7
7
|
"bugs": {
|
|
@@ -45,24 +45,24 @@
|
|
|
45
45
|
"start": "storybook dev -p 6006"
|
|
46
46
|
},
|
|
47
47
|
"dependencies": {
|
|
48
|
-
"@xylabs/delay": "~5.0.
|
|
48
|
+
"@xylabs/delay": "~5.0.24",
|
|
49
49
|
"@xylabs/react-error": "~7.1.8",
|
|
50
50
|
"@xylabs/react-promise": "~7.1.8",
|
|
51
51
|
"@xylabs/react-shared": "~7.1.8",
|
|
52
|
-
"@xylabs/typeof": "~5.0.
|
|
53
|
-
"@xyo-network/chain-network-model": "~1.16.
|
|
54
|
-
"@xyo-network/react-chain-provider": "~1.16.
|
|
55
|
-
"@xyo-network/react-chain-shared": "~1.16.
|
|
56
|
-
"@xyo-network/xl1-protocol": "~1.13.
|
|
57
|
-
"@xyo-network/xl1-protocol-sdk": "~1.16.
|
|
52
|
+
"@xylabs/typeof": "~5.0.24",
|
|
53
|
+
"@xyo-network/chain-network-model": "~1.16.7",
|
|
54
|
+
"@xyo-network/react-chain-provider": "~1.16.7",
|
|
55
|
+
"@xyo-network/react-chain-shared": "~1.16.7",
|
|
56
|
+
"@xyo-network/xl1-protocol": "~1.13.6",
|
|
57
|
+
"@xyo-network/xl1-protocol-sdk": "~1.16.7"
|
|
58
58
|
},
|
|
59
59
|
"devDependencies": {
|
|
60
60
|
"@emotion/react": "~11.14.0",
|
|
61
61
|
"@emotion/styled": "~11.14.1",
|
|
62
62
|
"@mui/icons-material": "~7.3.5",
|
|
63
63
|
"@mui/material": "~7.3.5",
|
|
64
|
-
"@storybook/react-vite": "~10.0.
|
|
65
|
-
"@types/react": "~19.2.
|
|
64
|
+
"@storybook/react-vite": "~10.0.7",
|
|
65
|
+
"@types/react": "~19.2.4",
|
|
66
66
|
"@xylabs/ts-scripts-yarn3": "~7.2.8",
|
|
67
67
|
"@xylabs/tsconfig": "~7.2.8",
|
|
68
68
|
"@xylabs/tsconfig-dom": "~7.2.8",
|
|
@@ -10,6 +10,7 @@ export const NetworkIcon: React.FC<NetworkIconProps> = ({
|
|
|
10
10
|
}) => {
|
|
11
11
|
return (
|
|
12
12
|
<span
|
|
13
|
+
// eslint-disable-next-line react-dom/no-dangerously-set-innerhtml
|
|
13
14
|
dangerouslySetInnerHTML={{ __html: icon ?? '' }} // Placeholder for SVG\
|
|
14
15
|
style={{
|
|
15
16
|
display: 'inline-flex', width: 24, height: 24, ...style,
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import { Alert, Stack } from '@mui/material'
|
|
2
|
+
import type { StoryFn } from '@storybook/react-vite'
|
|
3
|
+
import { ButtonEx } from '@xylabs/react-button'
|
|
4
|
+
import { isDefined, isDefinedNotNull } from '@xylabs/typeof'
|
|
5
|
+
import { LocalNetwork } from '@xyo-network/chain-network-model'
|
|
6
|
+
import { isXyoGlobal } from '@xyo-network/react-chain-model'
|
|
7
|
+
import type { HydratedBlock } from '@xyo-network/xl1-protocol'
|
|
8
|
+
import React, { useEffect, useState } from 'react'
|
|
9
|
+
|
|
10
|
+
import { ChainNetworkProvider } from '../../context/index.ts'
|
|
11
|
+
import { useViewerInPage } from './useViewerInPage.ts'
|
|
12
|
+
|
|
13
|
+
const hasXyoGlobal = isXyoGlobal(globalThis.xyo)
|
|
14
|
+
const inIframe = globalThis.self !== window.top
|
|
15
|
+
|
|
16
|
+
const UseViewerInPageStoryTemplate: React.FC = () => {
|
|
17
|
+
return (
|
|
18
|
+
<ChainNetworkProvider>
|
|
19
|
+
<UseViewerInPageStoryTemplateInner />
|
|
20
|
+
</ChainNetworkProvider>
|
|
21
|
+
)
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
const UseViewerInPageStoryTemplateInner: React.FC = () => {
|
|
25
|
+
const viewer = useViewerInPage(LocalNetwork)
|
|
26
|
+
const [error, setError] = useState<Error | null>(null)
|
|
27
|
+
const [result, setResult] = useState<HydratedBlock | null | undefined>()
|
|
28
|
+
const [loading, setLoading] = useState(false)
|
|
29
|
+
|
|
30
|
+
useEffect(() => {
|
|
31
|
+
if (isDefined(viewer)) {
|
|
32
|
+
void handleClick()
|
|
33
|
+
}
|
|
34
|
+
}, [viewer])
|
|
35
|
+
|
|
36
|
+
const handleClick = async () => {
|
|
37
|
+
if (isDefinedNotNull(viewer)) {
|
|
38
|
+
try {
|
|
39
|
+
setLoading(true)
|
|
40
|
+
const block = await viewer.currentBlock()
|
|
41
|
+
setError(null)
|
|
42
|
+
setResult(block)
|
|
43
|
+
setLoading(false)
|
|
44
|
+
} catch (err) {
|
|
45
|
+
setError(err as Error)
|
|
46
|
+
setResult(undefined)
|
|
47
|
+
setLoading(false)
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
return (
|
|
53
|
+
<Stack gap={2} alignItems="center">
|
|
54
|
+
{inIframe
|
|
55
|
+
? (
|
|
56
|
+
<Alert severity="warning">
|
|
57
|
+
This story is running in an iframe. Please run it in a standalone browser window to test the wallet extension.
|
|
58
|
+
</Alert>
|
|
59
|
+
)
|
|
60
|
+
: null}
|
|
61
|
+
{hasXyoGlobal
|
|
62
|
+
? null
|
|
63
|
+
: (
|
|
64
|
+
<Alert severity="warning">
|
|
65
|
+
No wallet extension found. Please install the Xyo Wallet Chrome Extension.
|
|
66
|
+
</Alert>
|
|
67
|
+
)}
|
|
68
|
+
<ButtonEx loading={loading} variant="contained" onClick={() => void handleClick()} disabled={!isDefined(viewer)}>
|
|
69
|
+
Get Current Block
|
|
70
|
+
</ButtonEx>
|
|
71
|
+
<pre>
|
|
72
|
+
{JSON.stringify(result, null, 2)}
|
|
73
|
+
</pre>
|
|
74
|
+
{error ? <Alert severity="error">{error.message}</Alert> : null}
|
|
75
|
+
</Stack>
|
|
76
|
+
)
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
export default {
|
|
80
|
+
title: 'provider/useViewerInPage',
|
|
81
|
+
component: UseViewerInPageStoryTemplate,
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
export const Template: StoryFn<typeof UseViewerInPageStoryTemplate> = args => <UseViewerInPageStoryTemplate {...args} />
|
|
85
|
+
|
|
86
|
+
const Default = Template.bind({})
|
|
87
|
+
Default.args = {}
|
|
88
|
+
|
|
89
|
+
export { Default }
|
|
@@ -1,4 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import {
|
|
2
|
+
isDefined, isDefinedNotNull, isUndefined,
|
|
3
|
+
} from '@xylabs/typeof'
|
|
4
|
+
import { type NetworkBootstrap } from '@xyo-network/chain-network-model'
|
|
2
5
|
import { useHttpRpcViewer, useViewerFromWallet } from '@xyo-network/react-chain-provider'
|
|
3
6
|
|
|
4
7
|
import { useChainNetwork } from '../../context/index.ts'
|
|
@@ -7,9 +10,14 @@ import { useChainNetwork } from '../../context/index.ts'
|
|
|
7
10
|
* Get the viewer for the active network, first from the wallet or fallback to HTTP RPC
|
|
8
11
|
* @returns - XyoViewer for the active network
|
|
9
12
|
*/
|
|
10
|
-
export const useViewerInPage = () => {
|
|
13
|
+
export const useViewerInPage = (networkOverride?: NetworkBootstrap) => {
|
|
14
|
+
let networkBootstrap: NetworkBootstrap | undefined
|
|
11
15
|
const { activeNetwork } = useChainNetwork()
|
|
12
|
-
|
|
13
|
-
|
|
16
|
+
networkBootstrap = isDefined(networkOverride) ? networkOverride : activeNetwork
|
|
17
|
+
|
|
18
|
+
const httpRpcViewer = useHttpRpcViewer(networkBootstrap?.url)
|
|
19
|
+
const [walletRpcViewer] = useViewerFromWallet(networkBootstrap?.id)
|
|
20
|
+
|
|
21
|
+
if (isUndefined(walletRpcViewer)) return
|
|
14
22
|
return isDefinedNotNull(walletRpcViewer) ? walletRpcViewer : httpRpcViewer
|
|
15
23
|
}
|