fix(core): update GetHookCollectionState types

sanity-io · Mar 10, 2024 · 0fbdbb2 · 0fbdbb2
1 parent 06cbce7
commit 0fbdbb2
Show file tree

Hide file tree

Showing 5 changed files with 39 additions and 33 deletions.
diff --git a/packages/sanity/src/core/components/hookCollection/GetHookCollectionState.tsx b/packages/sanity/src/core/components/hookCollection/GetHookCollectionState.tsx
@@ -9,10 +9,16 @@ import {type ActionHook} from './types'
 
 /** @internal */
 export interface GetHookCollectionStateProps<T, K> {
+  /**
+   * Arguments that will be received by the action hooks, `onComplete` will be added by the HookStateContainer component.
+   */
   args: T
   children: (props: {states: K[]}) => ReactNode
-  hooks: ActionHook<T, K>[]
+  hooks: ActionHook<T & {onComplete: () => void}, K>[]
   onReset?: () => void
+  /**
+   * Name for the hook group. If provided, only hooks with the same group name will be included in the collection.
+   */
   group?: string
 }
 

diff --git a/packages/sanity/src/structure/components/RenderActionCollectionState.tsx b/packages/sanity/src/structure/components/RenderActionCollectionState.tsx
@@ -14,7 +14,7 @@ export interface Action<Args, Description> {
 /** @internal */
 export interface RenderActionCollectionProps {
   actions: Action<DocumentActionProps, DocumentActionDescription>[]
-  actionProps: DocumentActionProps
+  actionProps: Omit<DocumentActionProps, 'onComplete'>
   children: (props: {states: DocumentActionDescription[]}) => React.ReactNode
   onActionComplete?: () => void
   group?: DocumentActionGroup

diff --git a/packages/sanity/src/structure/panes/document/documentPanel/header/DocumentPanelHeader.tsx b/packages/sanity/src/structure/panes/document/documentPanel/header/DocumentPanelHeader.tsx
@@ -134,35 +134,36 @@ export const DocumentPanelHeader = memo(
               {menuButtonNodes.map((item) => (
                 <PaneHeaderActionButton key={item.key} node={item} />
               ))}
+              {editState && (
+                <RenderActionCollectionState
+                  actions={actions || []}
+                  actionProps={editState}
+                  group="paneActions"
+                >
+                  {({states}) => (
+                    <ActionDialogWrapper actionStates={states} referenceElement={referenceElement}>
+                      {({handleAction}) => (
+                        <div ref={setReferenceElement}>
+                          <PaneContextMenuButton
+                            nodes={contextMenuNodes}
+                            key="context-menu"
+                            actionsNodes={states?.map((actionState, actionIndex) => (
+                              <ActionMenuListItem
+                                key={actionState.label}
+                                actionState={actionState}
+                                disabled={Boolean(actionState.disabled)}
+                                index={actionIndex}
+                                onAction={handleAction}
+                              />
+                            ))}
+                          />
+                        </div>
+                      )}
+                    </ActionDialogWrapper>
+                  )}
+                </RenderActionCollectionState>
+              )}
 
-              <RenderActionCollectionState
-                actions={actions || []}
-                // @ts-expect-error TODO: fix the document actions
-                actionProps={editState}
-                group="paneActions"
-              >
-                {({states}) => (
-                  <ActionDialogWrapper actionStates={states} referenceElement={referenceElement}>
-                    {({handleAction}) => (
-                      <div ref={setReferenceElement}>
-                        <PaneContextMenuButton
-                          nodes={contextMenuNodes}
-                          key="context-menu"
-                          actionsNodes={states?.map((actionState, actionIndex) => (
-                            <ActionMenuListItem
-                              key={actionState.label}
-                              actionState={actionState}
-                              disabled={Boolean(actionState.disabled)}
-                              index={actionIndex}
-                              onAction={handleAction}
-                            />
-                          ))}
-                        />
-                      </div>
-                    )}
-                  </ActionDialogWrapper>
-                )}
-              </RenderActionCollectionState>
               {showSplitPaneButton && (
                 <Button
                   aria-label={t('buttons.split-pane-button.aria-label')}

diff --git a/packages/sanity/src/structure/panes/document/statusBar/ActionMenuButton.tsx b/packages/sanity/src/structure/panes/document/statusBar/ActionMenuButton.tsx
@@ -1,5 +1,5 @@
 import {Menu} from '@sanity/ui'
-import {useCallback, useId, useMemo, useState} from 'react'
+import {type ReactNode, useCallback, useId, useMemo, useState} from 'react'
 import {
   ContextMenuButton,
   type DocumentActionDescription,
@@ -25,7 +25,7 @@ export function ActionDialogWrapper({
   referenceElement,
 }: {
   actionStates: DocumentActionDescription[]
-  children: ({handleAction}: {handleAction: (idx: number) => void}) => React.ReactNode
+  children: ({handleAction}: {handleAction: (idx: number) => void}) => ReactNode
   referenceElement?: HTMLElement | null
 }) {
   const [actionIndex, setActionIndex] = useState(-1)

diff --git a/packages/sanity/src/structure/panes/document/statusBar/DocumentStatusBarActions.tsx b/packages/sanity/src/structure/panes/document/statusBar/DocumentStatusBarActions.tsx
@@ -87,7 +87,6 @@ export const DocumentStatusBarActions = memo(function DocumentStatusBarActions()
       // component={}
       // onActionComplete={handleActionComplete}
       actions={actions}
-      // @ts-expect-error TODO: fix the document actions
       actionProps={editState}
       group="default"
     >