wip: creates saveActions

packages/next/src/templates/Default/index.tsx

@@ -20,6 +20,7 @@ const baseClass = 'template-default'
 export type DefaultTemplateProps = {
   children?: React.ReactNode
   className?: string
+  saveActions?: CustomComponent[]
   viewActions?: CustomComponent[]
   visibleEntities: VisibleEntities
 } & ServerProps
@@ -32,6 +33,7 @@ export const DefaultTemplate: React.FC<DefaultTemplateProps> = ({
   params,
   payload,
   permissions,
+  saveActions,
   searchParams,
   user,
   viewActions,
@@ -90,6 +92,34 @@ export const DefaultTemplate: React.FC<DefaultTemplateProps> = ({
     }
   }, [payload, serverProps, viewActions])
 
+  const { SaveActions } = React.useMemo<{
+    SaveActions: Record<string, React.ReactNode>
+  }>(() => {
+    return {
+      SaveActions: saveActions
+        ? saveActions.reduce((acc, action) => {
+            if (action) {
+              if (typeof action === 'object') {
+                acc[action.path] = RenderServerComponent({
+                  Component: action,
+                  importMap: payload.importMap,
+                  serverProps,
+                })
+              } else {
+                acc[action] = RenderServerComponent({
+                  Component: action,
+                  importMap: payload.importMap,
+                  serverProps,
+                })
+              }
+            }
+
+            return acc
+          }, {})
+        : undefined,
+    }
+  }, [payload, serverProps, saveActions])
+
   const NavComponent = RenderServerComponent({
     clientProps: { clientProps: { visibleEntities } },
     Component: CustomNav,
@@ -101,7 +131,7 @@ export const DefaultTemplate: React.FC<DefaultTemplateProps> = ({
   return (
     <EntityVisibilityProvider visibleEntities={visibleEntities}>
       <BulkUploadProvider>
-        <ActionsProvider Actions={Actions}>
+        <ActionsProvider Actions={Actions} SaveActions={SaveActions}>
           {RenderServerComponent({
             clientProps: { clientProps: { visibleEntities } },
             Component: CustomHeader,

packages/next/src/views/Root/getViewFromConfig.ts

@@ -54,14 +54,16 @@ const oneSegmentViews: OneSegmentViews = {
 }
 
 function getViewActions({
+  actionsKey = 'actions',
   editConfig,
   viewKey,
 }: {
+  actionsKey?: 'actions' | 'saveActions'
   editConfig: EditConfig
   viewKey: keyof EditConfig
 }): CustomComponent[] | undefined {
-  if (editConfig && viewKey in editConfig && 'actions' in editConfig[viewKey]) {
-    return editConfig[viewKey].actions
+  if (editConfig && viewKey in editConfig && actionsKey in editConfig[viewKey]) {
+    return editConfig[viewKey][actionsKey]
   }
 
   return undefined
@@ -70,6 +72,7 @@ function getViewActions({
 type ServerPropsFromView = {
   collectionConfig?: SanitizedConfig['collections'][number]
   globalConfig?: SanitizedConfig['globals'][number]
+  saveActions: CustomComponent[]
   viewActions: CustomComponent[]
 }
 
@@ -119,6 +122,7 @@ export const getViewFromConfig = ({
   let matchedGlobal: SanitizedConfig['globals'][number] = undefined
 
   const serverProps: ServerPropsFromView = {
+    saveActions: [],
     viewActions: config?.admin?.components?.actions || [],
   }
 
@@ -259,6 +263,14 @@ export const getViewFromConfig = ({
                 viewKey: 'root',
               }),
             )
+
+            serverProps.saveActions = serverProps.saveActions.concat(
+              getViewActions({
+                actionsKey: 'saveActions',
+                editConfig: matchedCollection.admin?.components?.views?.edit,
+                viewKey: 'root',
+              }),
+            )
           } else {
             if (segmentFive) {
               if (segmentFour === 'versions') {
@@ -287,6 +299,14 @@ export const getViewFromConfig = ({
                     viewKey: 'livePreview',
                   }),
                 )
+
+                serverProps.saveActions = serverProps.saveActions.concat(
+                  getViewActions({
+                    actionsKey: 'saveActions',
+                    editConfig: matchedCollection.admin?.components?.views?.edit,
+                    viewKey: 'livePreview',
+                  }),
+                )
               } else if (segmentFour === 'api') {
                 // add api view actions
                 serverProps.viewActions = serverProps.viewActions.concat(
@@ -304,6 +324,14 @@ export const getViewFromConfig = ({
                   viewKey: 'default',
                 }),
               )
+
+              serverProps.saveActions = serverProps.saveActions.concat(
+                getViewActions({
+                  actionsKey: 'saveActions',
+                  editConfig: matchedCollection.admin?.components?.views?.edit,
+                  viewKey: 'default',
+                }),
+              )
             }
           }
         }
@@ -330,6 +358,14 @@ export const getViewFromConfig = ({
                 viewKey: 'root',
               }),
             )
+
+            serverProps.saveActions = serverProps.saveActions.concat(
+              getViewActions({
+                actionsKey: 'saveActions',
+                editConfig: matchedGlobal.admin.components?.views?.edit,
+                viewKey: 'root',
+              }),
+            )
           } else {
             if (segmentFour) {
               if (segmentThree === 'versions') {
@@ -358,6 +394,14 @@ export const getViewFromConfig = ({
                     viewKey: 'livePreview',
                   }),
                 )
+
+                serverProps.saveActions = serverProps.saveActions.concat(
+                  getViewActions({
+                    actionsKey: 'saveActions',
+                    editConfig: matchedGlobal.admin.components?.views?.edit,
+                    viewKey: 'livePreview',
+                  }),
+                )
               } else if (segmentThree === 'api') {
                 // add api view actions
                 serverProps.viewActions = serverProps.viewActions.concat(

packages/next/src/views/Root/index.tsx

@@ -151,6 +151,7 @@ export const RootPage = async ({
           params={params}
           payload={initPageResult?.req.payload}
           permissions={initPageResult?.permissions}
+          saveActions={serverProps.saveActions}
           searchParams={searchParams}
           user={initPageResult?.req.user}
           viewActions={serverProps.viewActions}

packages/payload/src/config/types.ts

@@ -378,6 +378,7 @@ export type EditViewConfig = {
 } & (
   | {
       actions?: CustomComponent[]
+      saveActions?: CustomComponent[]
     }
   | {
       Component: EditViewComponent

packages/ui/src/providers/Actions/index.tsx

@@ -6,11 +6,17 @@ type ActionsContextType = {
   Actions: {
     [key: string]: React.ReactNode
   }
+  SaveActions: {
+    [key: string]: React.ReactNode
+  }
+  setSaveActions: (actions: ActionsContextType['SaveActions']) => void
   setViewActions: (actions: ActionsContextType['Actions']) => void
 }
 
 const ActionsContext = createContext<ActionsContextType>({
   Actions: {},
+  SaveActions: {},
+  setSaveActions: () => {},
   setViewActions: () => {},
 })
 
@@ -21,8 +27,12 @@ export const ActionsProvider: React.FC<{
     [key: string]: React.ReactNode
   }
   readonly children: React.ReactNode
-}> = ({ Actions, children }) => {
+  readonly SaveActions?: {
+    [key: string]: React.ReactNode
+  }
+}> = ({ Actions, children, SaveActions }) => {
   const [viewActions, setViewActions] = useState(Actions)
+  const [saveActions, setSaveActions] = useState(SaveActions)
 
   return (
     <ActionsContext.Provider
@@ -31,6 +41,10 @@ export const ActionsProvider: React.FC<{
           ...viewActions,
           ...Actions,
         },
+        SaveActions: {
+          ...saveActions,
+        },
+        setSaveActions,
         setViewActions,
       }}
     >