fix: publish locale with autosave enabled and close dropdown (#8719)

1. Fix publish specific locale option when no published versions exist
2. Close the publish locale dropdown on click

Author: jessrynkar

packages/next/src/views/Version/Restore/index.tsx

@@ -100,7 +100,7 @@ const Restore: React.FC<Props> = ({
           className={[canRestoreAsDraft && `${baseClass}__button`].filter(Boolean).join(' ')}
           onClick={() => toggleModal(modalSlug)}
           size="small"
-          SubMenuPopupContent={
+          SubMenuPopupContent={() =>
             canRestoreAsDraft && (
               <PopupList.ButtonGroup>
                 <PopupList.Button onClick={() => [setDraft(true), toggleModal(modalSlug)]}>

packages/payload/src/collections/operations/updateByID.ts

@@ -309,7 +309,12 @@ export const updateByIDOperation = async <
     }
 
     if (publishSpecificLocale) {
-      publishedDocWithLocales = await getLatestCollectionVersion({
+      versionSnapshotResult = await beforeChange({
+        ...beforeChangeArgs,
+        docWithLocales,
+      })
+
+      const lastPublished = await getLatestCollectionVersion({
         id,
         config: collectionConfig,
         payload,
@@ -318,10 +323,7 @@ export const updateByIDOperation = async <
         req,
       })
 
-      versionSnapshotResult = await beforeChange({
-        ...beforeChangeArgs,
-        docWithLocales,
-      })
+      publishedDocWithLocales = lastPublished ? lastPublished : {}
     }
 
     let result = await beforeChange({

packages/ui/src/elements/Button/index.tsx

@@ -183,11 +183,10 @@ export const Button = forwardRef<HTMLAnchorElement | HTMLButtonElement, Props>((
           className={disabled ? `${baseClass}--popup-disabled` : ''}
           horizontalAlign="right"
           noBackground
+          render={({ close }) => SubMenuPopupContent({ close: () => close() })}
           size="large"
           verticalAlign="bottom"
-        >
-          {SubMenuPopupContent}
-        </Popup>
+        />
       </div>
     )
   }

packages/ui/src/elements/Button/types.ts

@@ -23,7 +23,7 @@ export type Props = {
   round?: boolean
   secondaryActions?: secondaryAction | secondaryAction[]
   size?: 'large' | 'medium' | 'small'
-  SubMenuPopupContent?: React.ReactNode
+  SubMenuPopupContent?: (props: { close: () => void }) => React.ReactNode
   to?: string
   tooltip?: string
   type?: 'button' | 'submit'

packages/ui/src/elements/PublishButton/index.tsx

@@ -126,7 +126,7 @@ export const DefaultPublishButton: React.FC<{ label?: string }> = ({ label: labe
       disabled={!canPublish}
       onClick={publish}
       size="medium"
-      SubMenuPopupContent={
+      SubMenuPopupContent={({ close }) =>
         localization
           ? localization.locales.map((locale) => {
               const formattedLabel =
@@ -139,7 +139,7 @@ export const DefaultPublishButton: React.FC<{ label?: string }> = ({ label: labe
               if (isActive) {
                 return (
                   <PopupList.ButtonGroup key={locale.code}>
-                    <PopupList.Button onClick={() => publishSpecificLocale(locale.code)}>
+                    <PopupList.Button onClick={() => [publishSpecificLocale(locale.code), close()]}>
                       {t('version:publishIn', { locale: formattedLabel || locale.code })}
                     </PopupList.Button>
                   </PopupList.ButtonGroup>