@xyo-network/react-schema 2.23.7

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

@@ -0,0 +1,13 @@
+import { WithChildren } from '@xylabs/sdk-react'
+import { useState } from 'react'
+
+import { SchemaContext } from '../Context'
+import { useSchemaList } from '../Hooks'
+import { SchemaProviderProps } from './Props'
+
+export const SchemaMemoryProvider: React.FC<WithChildren<SchemaProviderProps>> = ({ defaultSchema, knownSchemaList = [], ...props }) => {
+  const [schema, setSchema] = useState(defaultSchema)
+  const [schemaList, setSchemaList] = useSchemaList(knownSchemaList)
+
+  return <SchemaContext.Provider value={{ provided: true, schema, schemaList, setSchema, setSchemaList }} {...props} />
+}

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

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

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

@@ -0,0 +1,62 @@
+import { WithChildren } from '@xylabs/sdk-react'
+import { useCallback, useEffect } from 'react'
+import { useSearchParams } from 'react-router-dom'
+
+import { SchemaContext } from '../Context'
+import { useSchema } from '../use'
+import { SchemaMemoryProvider } from './Memory'
+import { SchemaProviderProps } from './Props'
+
+const SchemaRouteProviderInner: React.FC<WithChildren> = ({ 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])
+
+  return <SchemaContext.Provider value={{ provided: true, schema, schemaList, setSchema: setSchemaLocal }}>{children}</SchemaContext.Provider>
+}
+
+export const SchemaRouteProvider: React.FC<WithChildren<SchemaProviderProps>> = ({ knownSchemaList, defaultSchema, ...props }) => {
+  return (
+    <SchemaMemoryProvider knownSchemaList={knownSchemaList} defaultSchema={defaultSchema}>
+      <SchemaRouteProviderInner {...props} />
+    </SchemaMemoryProvider>
+  )
+}

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

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

package/src/contexts/Schema/State.ts

@@ -0,0 +1,13 @@
+import { ContextExState } from '@xyo-network/react-shared'
+import { Dispatch } from 'react'
+
+export interface SchemaContextState extends 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

@@ -0,0 +1,5 @@
+export * from './Context'
+export * from './Hooks'
+export * from './Provider'
+export * from './State'
+export * from './use'

package/src/contexts/Schema/use.ts

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

package/src/contexts/index.ts

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

package/src/index.ts

@@ -0,0 +1,2 @@
+export * from './components'
+export * from './contexts'