@xyo-network/react-schema 7.5.8 → 7.5.12

package/src/contexts/Schema/Context.ts

@@ -1,5 +0,0 @@
-import { createContextEx } from '@xylabs/react-shared'
-
-import type { SchemaContextState } from './State.ts'
-
-export const SchemaContext = createContextEx<SchemaContextState>()

package/src/contexts/Schema/Provider/Memory.tsx

@@ -1,31 +0,0 @@
-import { exists } from '@xylabs/sdk-js'
-import type { PropsWithChildren } from 'react'
-import React, {
-  useEffect, useMemo, useState,
-} from 'react'
-
-import { useSchemaStats } from '../../../hooks/index.ts'
-import { SchemaContext } from '../Context.ts'
-import type { SchemaContextState } from '../State.ts'
-import type { SchemaProviderProps } from './Props.ts'
-
-export const SchemaMemoryProvider: React.FC<PropsWithChildren<SchemaProviderProps>> = ({
-  defaultSchema, knownSchemaList, ...props
-}) => {
-  const [schema, setSchema] = useState(defaultSchema)
-  const [schemaList, setSchemaList] = useState<string[] | undefined>(knownSchemaList)
-  const [fetchedSchemaStats] = useSchemaStats()
-
-  useEffect(() => {
-    if (fetchedSchemaStats) {
-      const schemaList = (fetchedSchemaStats.map(({ name }) => name)).filter(exists)
-      setSchemaList(schemaList)
-    }
-  }, [fetchedSchemaStats])
-
-  const value: SchemaContextState = useMemo(() => ({
-    provided: true, schema, schemaList: knownSchemaList ?? schemaList, setSchema, setSchemaList,
-  }), [schema, schemaList, knownSchemaList])
-
-  return <SchemaContext value={value} {...props} />
-}

package/src/contexts/Schema/Provider/Props.ts

@@ -1,4 +0,0 @@
-export interface SchemaProviderProps {
-  defaultSchema?: string
-  knownSchemaList?: string[]
-}

package/src/contexts/Schema/Provider/Route.tsx

@@ -1,73 +0,0 @@
-import type { PropsWithChildren } from 'react'
-import React, {
-  useCallback, useEffect, useMemo,
-} from 'react'
-import { useSearchParams } from 'react-router-dom'
-
-import { SchemaContext } from '../Context.ts'
-import type { SchemaContextState } from '../State.ts'
-import { useSchema } from '../use.ts'
-import { SchemaMemoryProvider } from './Memory.tsx'
-import type { SchemaProviderProps } from './Props.ts'
-
-const SchemaRouteProviderInner: React.FC<PropsWithChildren> = ({ children }) => {
-  const {
-    schema, setSchema, schemaList,
-  } = useSchema()
-
-  const [params, setParams] = useSearchParams()
-
-  const routeSchema = params.get('schema')
-
-  // update the network stored in the route
-  const setSchemaParam = useCallback(
-    (schema?: string) => {
-      if (schema) {
-        params.set('schema', schema)
-        setParams(params, { replace: true })
-        setSchema?.(schema)
-      } else {
-        params.delete('network')
-      }
-    },
-    [params, setParams, setSchema],
-  )
-
-  // if the network is actively changed, update both memory and route
-  const setSchemaLocal = useCallback(
-    (schema: string) => {
-      setSchemaParam(schema)
-      setSchema?.(schema)
-    },
-    [setSchemaParam, setSchema],
-  )
-
-  // sync memory and route storage of network
-  useEffect(() => {
-    if (routeSchema !== schema) {
-      if (routeSchema === undefined && schema !== undefined) {
-        // if the route does not have a network selected, use what is in the memory context
-        setSchemaLocal(schema)
-      } else if (routeSchema) {
-        // if the route has a selection and it is different from memory, update memory
-        setSchema?.(routeSchema)
-      }
-    }
-  }, [routeSchema, schema, setSchemaParam, setSchema, setSchemaLocal])
-
-  const value: SchemaContextState = useMemo(() => ({
-    provided: true, schema, schemaList, setSchema: setSchemaLocal,
-  }), [schema, schemaList, setSchemaLocal])
-
-  return <SchemaContext value={value}>{children}</SchemaContext>
-}
-
-export const SchemaRouteProvider: React.FC<PropsWithChildren<SchemaProviderProps>> = ({
-  knownSchemaList, defaultSchema, ...props
-}) => {
-  return (
-    <SchemaMemoryProvider knownSchemaList={knownSchemaList} defaultSchema={defaultSchema}>
-      <SchemaRouteProviderInner {...props} />
-    </SchemaMemoryProvider>
-  )
-}

package/src/contexts/Schema/Provider/index.ts

@@ -1,3 +0,0 @@
-export * from './Memory.tsx'
-export * from './Props.ts'
-export * from './Route.tsx'

package/src/contexts/Schema/State.ts

@@ -1,13 +0,0 @@
-import type { ContextExState } from '@xylabs/react-shared'
-import type { Dispatch } from 'react'
-
-export type SchemaContextState = ContextExState<{
-  /** @field The currently selected XYO Schema */
-  schema?: string
-  /** @field The list of known available schema */
-  schemaList?: string[]
-  /** @field Function to set the selected Schema */
-  setSchema?: Dispatch<string>
-  /** @field Function to set the list of known available schema */
-  setSchemaList?: Dispatch<string[]>
-}>

package/src/contexts/Schema/index.ts

@@ -1,4 +0,0 @@
-export * from './Context.ts'
-export * from './Provider/index.ts'
-export * from './State.ts'
-export * from './use.ts'

package/src/contexts/Schema/use.ts

@@ -1,8 +0,0 @@
-import { useContextEx } from '@xylabs/react-shared'
-
-import { SchemaContext } from './Context.ts'
-import type { SchemaContextState } from './State.ts'
-
-export const useSchema = (required = false) => {
-  return useContextEx<SchemaContextState>(SchemaContext, 'Schema', required)
-}

package/src/contexts/index.ts

@@ -1 +0,0 @@
-export * from './Schema/index.ts'

package/src/hooks/index.ts

@@ -1,4 +0,0 @@
-export * from './useGetSchema.tsx'
-export * from './useSchemaDefinitions.tsx'
-export * from './useSchemaList.tsx'
-export * from './useSchemaStats.tsx'

package/src/hooks/stories/TestSchemaHooks.stories.tsx

@@ -1,102 +0,0 @@
-import {
-  Alert, Button, TextField, Typography,
-} from '@mui/material'
-import type {
-  Decorator, Meta, StoryFn,
-} from '@storybook/react-vite'
-import { useAsyncEffect } from '@xylabs/react-async-effect'
-import { FlexGrowRow } from '@xylabs/react-flexbox'
-import type { Address } from '@xylabs/sdk-js'
-import { HttpBridge, HttpBridgeConfigSchema } from '@xyo-network/bridge-http'
-import { MemoryNode } from '@xyo-network/node-memory'
-import { NodeConfigSchema } from '@xyo-network/node-model'
-import { NodeProvider } from '@xyo-network/react-node'
-import { DefaultSeedPhrase } from '@xyo-network/react-storybook'
-import { useWallet, WalletProvider } from '@xyo-network/react-wallet'
-import { SchemaCache } from '@xyo-network/schema-cache'
-import React, { useState } from 'react'
-
-import { useSchemaDefinitions } from '../useSchemaDefinitions.tsx'
-import { useSchemaList } from '../useSchemaList.tsx'
-import { useSchemaStats } from '../useSchemaStats.tsx'
-
-const apiConfig = { apiDomain: 'https://api.archivist.xyo.network' }
-const client = { url: 'http://localhost:8080/node' }
-
-const MemoryNodeDecorator: Decorator = (Story, args) => {
-  const [node, setNode] = useState<MemoryNode>()
-
-  useAsyncEffect(
-    async () => {
-      const node = await MemoryNode.create({ config: { schema: NodeConfigSchema } })
-      const bridge = await HttpBridge.create({
-        config: {
-          client, schema: HttpBridgeConfigSchema, security: { allowAnonymous: true },
-        },
-      })
-      await node.register(bridge)
-      await node.attach(bridge.address, true)
-      setNode(node)
-    },
-    [],
-  )
-
-  const [wallet] = useWallet({ mnemonic: DefaultSeedPhrase })
-
-  return (
-    <WalletProvider rootWallet={wallet}>
-      <NodeProvider node={node}>
-        <Story {...args} />
-      </NodeProvider>
-    </WalletProvider>
-  )
-}
-
-export default {
-  decorators: [MemoryNodeDecorator],
-  title: 'schema/Hooks',
-} as Meta
-
-const Template: StoryFn<React.FC> = () => {
-  // eslint-disable-next-line react-hooks/immutability
-  SchemaCache.instance.proxy = `${apiConfig.apiDomain}/domain`
-  const [addressText, setAddressText] = useState<Address>('' as Address)
-  const [address, setAddress] = useState<Address>()
-  const [schemaStats, schemaStatsError] = useSchemaStats(address)
-  const [schemaList, schemaListError] = useSchemaList(address)
-  const mappedSchemaList = schemaList?.schemas?.map(name => ({ name })) as { name: string }[]
-  const schemaDefinitions = useSchemaDefinitions(mappedSchemaList)
-
-  return (
-    <div style={{
-      display: 'flex', flexDirection: 'column', rowGap: '16px',
-    }}
-    >
-      {schemaStatsError
-        ? <Alert severity="error">{schemaStatsError.message ?? schemaListError?.message}</Alert>
-        : null}
-      <FlexGrowRow columnGap={4}>
-        <TextField fullWidth size="small" value={address} label="Address" onChange={event => setAddressText(event.target.value as Address)} />
-        <Button variant="contained" onClick={() => setAddress(addressText)} sx={{ whiteSpace: 'nowrap' }}>
-          Get Stats
-        </Button>
-      </FlexGrowRow>
-      <Typography variant="h2">Schema Stats</Typography>
-      <code>
-        <pre>{JSON.stringify(schemaStats, null, 2)}</pre>
-      </code>
-      <Typography variant="h2">Schema List</Typography>
-      <code>
-        <pre>{JSON.stringify(schemaList, null, 2)}</pre>
-      </code>
-      <Typography variant="h2">Schema Definitions</Typography>
-      <pre>
-        <code>{JSON.stringify(schemaDefinitions, null, 2)}</code>
-      </pre>
-    </div>
-  )
-}
-
-const Default = Template.bind({})
-
-export { Default }

package/src/hooks/useGetSchema.stories.tsx

@@ -1,65 +0,0 @@
-import {
-  FormControl, TextField, Typography,
-} from '@mui/material'
-import type { Meta, StoryFn } from '@storybook/react-vite'
-import { FlexRow } from '@xylabs/react-flexbox'
-import { useResetState } from '@xylabs/react-hooks'
-import { JsonViewerEx } from '@xyo-network/react-payload-raw-info'
-import { SchemaCache } from '@xyo-network/schema-cache'
-import React from 'react'
-
-import { useGetSchemaPayload } from './useGetSchema.tsx'
-
-SchemaCache.instance.proxy = 'https://beta.api.archivist.xyo.network/domain'
-
-const UseGetSchemaComponent: React.FC<{ schema: string }> = ({ schema }) => {
-  const exampleSchemas = ['network.xyo.domain', 'network.xyo.payload', 'network.xyo.schema']
-  const [schemaFieldValue, setSchemaFieldValue] = useResetState(schema)
-  const { schemaPayload } = useGetSchemaPayload(schemaFieldValue)
-
-  return (
-    <>
-      <Typography variant="body1" fontWeight="bold" mb={2}>
-        Example schemas to test:
-        {exampleSchemas.map(schema => (
-          <Typography
-            component="span"
-            mx={1}
-            key={exampleSchemas.indexOf(schema)}
-            onClick={() => setSchemaFieldValue(schema)}
-            sx={{ cursor: 'pointer', textDecoration: 'underline' }}
-          >
-            {schema}
-          </Typography>
-        ))}
-      </Typography>
-      <FormControl>
-        <TextField value={schemaFieldValue} label="Schema Name" onChange={e => setSchemaFieldValue(e.target.value)} />
-      </FormControl>
-      <FlexRow my={3} justifyContent="start">
-        <JsonViewerEx value={schemaPayload || {}} />
-      </FlexRow>
-    </>
-  )
-}
-
-const StorybookEntry: Meta = {
-  argTypes: {},
-  component: UseGetSchemaComponent,
-  parameters: { docs: { page: null } },
-  title: 'payload/useGetSchema',
-}
-
-const Template: StoryFn<typeof UseGetSchemaComponent> = ({ schema }) => {
-  return <UseGetSchemaComponent schema={schema} />
-}
-
-const Default = Template.bind({})
-Default.args = { schema: 'network.xyo.schema' }
-
-const Domain = Template.bind({})
-Domain.args = { schema: 'network.xyo.domain' }
-
-export { Default, Domain }
-
-export default StorybookEntry

package/src/hooks/useGetSchema.tsx

@@ -1,57 +0,0 @@
-import { useAsyncEffect } from '@xylabs/react-async-effect'
-import { PayloadBuilder } from '@xyo-network/payload-builder'
-import type { ModuleError, WithSources } from '@xyo-network/payload-model'
-import { ModuleErrorSchema } from '@xyo-network/payload-model'
-import type { SchemaCacheEntry } from '@xyo-network/schema-cache'
-import { SchemaCache } from '@xyo-network/schema-cache'
-import type { SchemaPayload } from '@xyo-network/schema-payload-plugin'
-import { useState } from 'react'
-
-/**
- * Gets a Huri and schema payload from a schema string
- */
-const useGetSchemaPayload = (schema?: string) => {
-  const [notFound, setNotFound] = useState(false)
-  const [xyoError, setXyoError] = useState<WithSources<ModuleError>>()
-  const [schemaCacheEntry, setSchemaCacheEntry] = useState<SchemaCacheEntry | null | undefined>()
-  const [schemaLocal, setSchemaLocal] = useState<string>()
-
-  useAsyncEffect(
-    async (mounted) => {
-      const firstRequest = !notFound && !schemaCacheEntry && !xyoError
-      const schemaChanged = schema !== schemaLocal
-
-      if ((schema && firstRequest) || (schema && schemaChanged)) {
-        try {
-          const schemaCacheEntry = await SchemaCache.instance.get(schema)
-          if (mounted()) {
-            setSchemaCacheEntry(schemaCacheEntry)
-            setNotFound(schemaCacheEntry === null || schemaCacheEntry === undefined)
-          }
-        } catch (e) {
-          const error = e as Error
-          console.error(e)
-          if (mounted()) {
-            setXyoError({
-              message: error.message, schema: ModuleErrorSchema, $sources: [],
-            })
-          }
-        }
-      }
-      if (schemaChanged) {
-        setSchemaLocal(schema)
-      }
-    },
-    [xyoError, notFound, schema, schemaLocal, schemaCacheEntry],
-  )
-
-  return {
-    notFound,
-    schemaHuri: schemaCacheEntry?.huri,
-    schemaPayload:
-      schemaCacheEntry ? new PayloadBuilder<SchemaPayload>(schemaCacheEntry?.payload).fields(schemaCacheEntry.payload).build() : schemaCacheEntry,
-    xyoError,
-  }
-}
-
-export { useGetSchemaPayload }

package/src/hooks/useSchemaDefinitions.tsx

@@ -1,26 +0,0 @@
-import { useAsyncEffect } from '@xylabs/react-async-effect'
-import { SchemaCache } from '@xyo-network/schema-cache'
-import type { SchemaPayload } from '@xyo-network/schema-payload-plugin'
-import { useState } from 'react'
-
-export type SchemaList = { name: string }
-
-export const useSchemaDefinitions = (schemaList?: SchemaList[]): SchemaPayload[] | undefined => {
-  const [schemaPayloads, setSchemaPayloads] = useState<SchemaPayload[]>()
-  useAsyncEffect(
-    async (mounted) => {
-      if (schemaList) {
-        const promiseResults = await Promise.allSettled(schemaList?.map(({ name }) => SchemaCache.instance.get(name)))
-        if (mounted()) {
-          setSchemaPayloads(
-            promiseResults
-              .map(result => (result.status === 'fulfilled' ? result.value?.payload : undefined))
-              .filter(item => item !== undefined && item !== null) as SchemaPayload[],
-          )
-        }
-      }
-    },
-    [schemaList],
-  )
-  return schemaPayloads
-}

package/src/hooks/useSchemaList.tsx

@@ -1,35 +0,0 @@
-import { usePromise } from '@xylabs/react-promise'
-import type { Address } from '@xylabs/sdk-js'
-import type { SchemaListPayload, SchemaListQueryPayload } from '@xyo-network/diviner-schema-list-model'
-import { SchemaListQuerySchema } from '@xyo-network/diviner-schema-list-model'
-import { useWeakDivinerFromNode } from '@xyo-network/react-diviner'
-import { useMemo } from 'react'
-
-export const useSchemaList = (address?: Address, nameOrAddress = 'SchemaListDiviner'): [SchemaListPayload | null | undefined, Error | undefined] => {
-  const [diviner, divinerError] = useWeakDivinerFromNode(nameOrAddress)
-
-  const query: SchemaListQueryPayload[] | undefined = useMemo(
-    () =>
-      address
-        ? [
-            {
-              address,
-              schema: SchemaListQuerySchema,
-            },
-          ]
-        : undefined,
-    [address],
-  )
-
-  const [schemaList, error] = usePromise(
-    async () => {
-      const divinerInstance = diviner?.deref()
-      if (divinerInstance) {
-        const response = (await divinerInstance.divine(query)) as SchemaListPayload[]
-        return response.at(0)
-      }
-    },
-    [diviner, divinerError, query],
-  )
-  return [schemaList, error]
-}

package/src/hooks/useSchemaStats.tsx

@@ -1,62 +0,0 @@
-import { useAsyncEffect } from '@xylabs/react-async-effect'
-import { type Address, isDefined } from '@xylabs/sdk-js'
-import type {
-  SchemaStatsPayload,
-  SchemaStatsQueryPayload,
-} from '@xyo-network/diviner-schema-stats-model'
-import {
-  SchemaStatsDivinerSchema,
-  SchemaStatsQuerySchema,
-} from '@xyo-network/diviner-schema-stats-model'
-import { TYPES } from '@xyo-network/node-core-types'
-import type { WithSources } from '@xyo-network/payload-model'
-import { isPayloadOfSchemaType } from '@xyo-network/payload-model'
-import { useWeakDivinerFromNode } from '@xyo-network/react-diviner'
-import type { Dispatch, SetStateAction } from 'react'
-import { useState } from 'react'
-
-export const useSchemaStats = (
-  statsAddress?: Address,
-  nameOrAddress = TYPES.SchemaStatsDiviner,
-): [SchemaStatsPayload[] | undefined, Error | undefined, Dispatch<SetStateAction<number>>] => {
-  const [refresh, setRefresh] = useState(1)
-  const [diviner, divinerError] = useWeakDivinerFromNode(nameOrAddress)
-  const [error, setError] = useState<Error>()
-  const refreshHistory = () => setRefresh(previous => previous + 1)
-
-  const [schemaList, setSchemaList] = useState<WithSources<SchemaStatsPayload>[]>()
-
-  useAsyncEffect(
-    async (mounted) => {
-      const instance = diviner?.deref()
-      if (isDefined(instance) && isDefined(statsAddress)) {
-        if (divinerError) {
-          if (mounted()) {
-            setError(divinerError)
-            setSchemaList(undefined)
-          }
-        } else {
-          try {
-            const query = {
-              address: statsAddress,
-              schema: SchemaStatsQuerySchema,
-            }
-            const schemas = (await instance.divine([query])).filter(isPayloadOfSchemaType(SchemaStatsDivinerSchema)) as WithSources<
-              SchemaStatsPayload
-            >[]
-            if (mounted()) {
-              setSchemaList(schemas)
-              setError(undefined)
-            }
-          } catch (ex) {
-            setError(ex as Error)
-            setSchemaList(undefined)
-          }
-        }
-      }
-    },
-    [diviner, refresh, divinerError, statsAddress],
-  )
-
-  return [schemaList, error, refreshHistory]
-}

package/src/index.ts

@@ -1,3 +0,0 @@
-export * from './components/index.ts'
-export * from './contexts/index.ts'
-export * from './hooks/index.ts'