sanity-plugin-workflow 1.0.0-beta.1 → 1.0.0-beta.11

package/src/components/WorkflowContext.tsx

@@ -0,0 +1,71 @@
+import {useCallback, useContext, useState} from 'react'
+import {createContext} from 'react'
+import {LayoutProps} from 'sanity'
+
+import {DEFAULT_CONFIG} from '../constants'
+import {useWorkflowMetadata} from '../hooks/useWorkflowMetadata'
+import {KeyedMetadata, WorkflowConfig} from '../types'
+
+export type WorkflowContextValue = Required<WorkflowConfig> & {
+  data: KeyedMetadata
+  loading: boolean
+  error: boolean
+  ids: string[]
+  addId: (id: string) => void
+  removeId: (id: string) => void
+}
+
+const WorkflowContext = createContext<WorkflowContextValue>({
+  data: {},
+  loading: false,
+  error: false,
+  ids: [],
+  addId: () => null,
+  removeId: () => null,
+  ...DEFAULT_CONFIG,
+})
+
+export function useWorkflowContext(id?: string) {
+  const current = useContext(WorkflowContext)
+
+  return {...current, metadata: id ? current.data[id] : null}
+}
+
+type WorkflowProviderProps = LayoutProps & {workflow: Required<WorkflowConfig>}
+
+/**
+ * This Provider wraps the Studio and provides the workflow context to document actions and badges.
+ * This is so individual actions and badges do not need to all register their own listeners.
+ * Instead, each document "signals" its ID up to the provider, which then registers a single listener
+ * This is performed inside of a component loaded at the root level of the Document Form
+ */
+export function WorkflowProvider(props: WorkflowProviderProps) {
+  const [ids, setIds] = useState<string[]>([])
+  const addId = useCallback(
+    (id: string) =>
+      setIds((current) => (current.includes(id) ? current : [...current, id])),
+    []
+  )
+  const removeId = useCallback(
+    (id: string) => setIds((current) => current.filter((i) => i !== id)),
+    []
+  )
+  const {data, loading, error} = useWorkflowMetadata(ids)
+
+  return (
+    <WorkflowContext.Provider
+      value={{
+        data,
+        loading,
+        error,
+        ids,
+        addId,
+        removeId,
+        states: props.workflow.states,
+        schemaTypes: props.workflow.schemaTypes,
+      }}
+    >
+      {props.renderDefault(props)}
+    </WorkflowContext.Provider>
+  )
+}

package/src/components/WorkflowSignal.tsx

@@ -0,0 +1,30 @@
+import {useEffect} from 'react'
+import {ObjectInputProps} from 'sanity'
+
+import {useWorkflowContext} from './WorkflowContext'
+
+// This component is loaded at the root level of the Document Form
+// It is used to signal the document ID to the WorkflowProvider
+export default function WorkflowSignal(props: ObjectInputProps) {
+  const documentId = props?.value?._id
+    ? props.value._id.replace(`drafts.`, ``)
+    : null
+
+  const {addId, removeId} = useWorkflowContext()
+
+  useEffect(() => {
+    // On mount, add  to the query of listening documents
+    if (documentId) {
+      addId(documentId)
+    }
+
+    // On unmount, remove from the query of listening documents
+    return () => {
+      if (documentId) {
+        removeId(documentId)
+      }
+    }
+  }, [documentId, addId, removeId])
+
+  return props.renderDefault(props)
+}