@xyo-network/react-module 2.75.6 → 2.76.0

package/src/components/Card/Module/CardActions.tsx

@@ -6,15 +6,15 @@ import { useState } from 'react'
 import { ModuleRenderProps } from '../../../ModuleRenderProps'
 import { DiscoverDialog } from './components'
 
-export const ModuleCardActions: React.FC<CardActionsProps & ModuleRenderProps> = ({ children, module, sx, ...props }) => {
+export const ModuleCardActions: React.FC<CardActionsProps & ModuleRenderProps> = ({ children, mod, sx, ...props }) => {
   const [discoverDialogOpen, setDiscoverDialogOpen] = useState(false)
 
-  const config = module?.config
+  const config = mod?.config
 
   return (
     <CardActions sx={{ alignItems: 'stretch', flexDirection: 'column', ml: 1, ...sx }} {...props}>
       <FlexRow justifyContent="space-between" gap={1} alignItems="center">
-        {module ?
+        {mod ?
           <Chip label={config?.schema} size={'small'} />
         : null}
         {children}
@@ -22,7 +22,7 @@ export const ModuleCardActions: React.FC<CardActionsProps & ModuleRenderProps> =
           Discover
         </ButtonEx>
       </FlexRow>
-      <DiscoverDialog fullWidth maxWidth={'md'} module={module} open={discoverDialogOpen} setOpen={setDiscoverDialogOpen} />
+      <DiscoverDialog fullWidth maxWidth={'md'} mod={mod} open={discoverDialogOpen} setOpen={setDiscoverDialogOpen} />
     </CardActions>
   )
 }

package/src/components/Card/Module/CardHeader.tsx

@@ -6,21 +6,21 @@ import { ModuleRenderProps } from '../../../ModuleRenderProps'
 
 const moduleTypes = ['sentinel', 'bridge', 'archivist', 'diviner', 'node', 'witness']
 
-const getModuleIcons = (moduleType: string, module: Module) => {
-  return module?.queries.find((query) => query.startsWith(`network.xyo.query.${moduleType}`)) ? findNetworkComponent(moduleType)?.icon : null
+const getModuleIcons = (moduleType: string, mod: Module) => {
+  return mod?.queries.find((query) => query.startsWith(`network.xyo.query.${moduleType}`)) ? findNetworkComponent(moduleType)?.icon : null
 }
 
-export const ModuleCardHeader: React.FC<ModuleRenderProps & CardHeaderProps> = ({ subheader, avatar, title, module, ...props }) => {
+export const ModuleCardHeader: React.FC<ModuleRenderProps & CardHeaderProps> = ({ subheader, avatar, title, mod, ...props }) => {
   return (
     <CardHeader
-      title={title ?? module?.config.name ?? 'Module'}
-      subheader={subheader ?? module?.address}
+      title={title ?? mod?.config.name ?? 'Module'}
+      subheader={subheader ?? mod?.address}
       avatar={
         avatar ?? (
           <>
-            {module ?
+            {mod ?
               moduleTypes.map((moduleType) => {
-                const Icon = getModuleIcons(moduleType, module)
+                const Icon = getModuleIcons(moduleType, mod)
                 return Icon ? <Icon key={moduleType} fontSize={'large'} color="primary" /> : null
               })
             : null}

package/src/components/Card/Module/components/DiscoverDialog.tsx

@@ -4,20 +4,20 @@ import { ModuleInstance } from '@xyo-network/module-model'
 import { Dispatch, SetStateAction } from 'react'
 
 export interface DiscoverDialogProps extends DialogProps {
-  module?: ModuleInstance
+  mod?: ModuleInstance
   setOpen?: Dispatch<SetStateAction<boolean>>
 }
 
 // Add a dialogue title and quick tip to show description of discover query
 
-export const DiscoverDialog: React.FC<DiscoverDialogProps> = ({ module, setOpen, ...props }) => {
+export const DiscoverDialog: React.FC<DiscoverDialogProps> = ({ mod, setOpen, ...props }) => {
   const [discoverPayloads] = usePromise(async () => {
-    return await module?.state()
-  }, [module])
+    return await mod?.state()
+  }, [mod])
 
   return (
     <Dialog {...props}>
-      <DialogTitle>Supported Queries for {module?.config.name || module?.address}</DialogTitle>
+      <DialogTitle>Supported Queries for {mod?.config.name || mod?.address}</DialogTitle>
       <Divider />
       <DialogContent>
         <Paper sx={{ p: 1 }}>

package/src/components/DetailsBox.stories.tsx

@@ -34,7 +34,7 @@ const NodeTemplate: StoryFn<typeof ModuleDetailsBox> = (args) => {
   )
   return (
     <FlexCol minHeight="80vh" alignItems="stretch">
-      <ModuleDetailsBox module={node} {...args} />
+      <ModuleDetailsBox mod={node} {...args} />
     </FlexCol>
   )
 }
@@ -56,7 +56,7 @@ const ArchivistTemplate: StoryFn<typeof ModuleDetailsBox> = (args) => {
   )
   return (
     <FlexCol minHeight="80vh" alignItems="stretch">
-      <ModuleDetailsBox module={archivist} {...args} />
+      <ModuleDetailsBox mod={archivist} {...args} />
     </FlexCol>
   )
 }
@@ -78,7 +78,7 @@ const DivinerTemplate: StoryFn<typeof ModuleDetailsBox> = (args) => {
   )
   return (
     <FlexCol minHeight="80vh" alignItems="stretch">
-      <ModuleDetailsBox module={diviner} {...args} />
+      <ModuleDetailsBox mod={diviner} {...args} />
     </FlexCol>
   )
 }

package/src/components/DetailsBox.tsx

@@ -8,18 +8,18 @@ import { useState } from 'react'
 
 import { ModuleRenderProps } from '../ModuleRenderProps'
 
-const getModuleIcon = (moduleType: string, module: Module) => {
-  return module?.queries.find((query) => query.startsWith(`network.xyo.query.${moduleType}`)) ? findNetworkComponent(moduleType)?.icon() : null
+const getModuleIcon = (moduleType: string, mod: Module) => {
+  return mod?.queries.find((query) => query.startsWith(`network.xyo.query.${moduleType}`)) ? findNetworkComponent(moduleType)?.icon() : null
 }
 
-export const ModuleDetailsBox: React.FC<ModuleRenderProps & FlexBoxProps> = ({ children, module, ...props }) => {
+export const ModuleDetailsBox: React.FC<ModuleRenderProps & FlexBoxProps> = ({ children, mod, ...props }) => {
   const [showQueries, setShowQueries] = useState(false)
   return (
     <FlexCol {...props}>
       <FlexRow>
-        {module ?
+        {mod ?
           ['sentinel', 'bridge', 'archivist', 'diviner', 'node'].map((moduleType) => {
-            const icon = getModuleIcon(moduleType, module)
+            const icon = getModuleIcon(moduleType, mod)
             return icon ?
                 <ButtonEx onClick={() => setShowQueries(!showQueries)} key={moduleType}>
                   {icon}
@@ -27,11 +27,11 @@ export const ModuleDetailsBox: React.FC<ModuleRenderProps & FlexBoxProps> = ({ c
               : null
           })
         : null}
-        <EthAccountBox address={EthAddress.fromString(module?.address)} />
+        <EthAccountBox address={EthAddress.fromString(mod?.address)} />
       </FlexRow>
 
       {showQueries ?
-        module?.queries.map((query) => {
+        mod?.queries.map((query) => {
           return <FlexRow key={query}>{query}</FlexRow>
         })
       : null}

package/src/components/TableCell.tsx

@@ -4,10 +4,10 @@ import { EthAccountBox } from '@xylabs/react-crypto'
 
 import { ModuleRenderProps } from '../ModuleRenderProps'
 
-export const ModuleTableCell: React.FC<ModuleRenderProps & TableCellProps> = ({ children, module, ...props }) => {
+export const ModuleTableCell: React.FC<ModuleRenderProps & TableCellProps> = ({ children, mod, ...props }) => {
   return (
     <TableCell {...props}>
-      <EthAccountBox address={EthAddress.fromString(module?.address)} />
+      <EthAccountBox address={EthAddress.fromString(mod?.address)} />
       {children}
     </TableCell>
   )