fix(ui): published, draft and changed labels should now be correctly displayed (#8382)

Fixes the issue where the published or changed document is always shown
as "Changed" instead of "Published" or "Draft"


![image](https://github.com/user-attachments/assets/05581b73-0e17-4b41-96a8-007c8b6161f2)


Statuses:
- Published - when the current version is also the published version
- Changed - when the current version is a draft version but a published
version exists
- Draft - when the current version is a draft and no published versions
exist

---------

Co-authored-by: Jessica Chowdhury <jessica@trbl.design>

Author: paulpopus

packages/payload/src/versions/types.ts

@@ -36,6 +36,7 @@ export type TypeWithVersion<T> = {
   createdAt: string
   id: string
   parent: number | string
+  publishedLocale?: string
   snapshot?: boolean
   updatedAt: string
   version: T

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

@@ -43,7 +43,8 @@ export const DefaultPublishButton: React.FC<{ label?: string }> = ({ label: labe
   const { code } = useLocale()
   const label = labelProp || t('version:publishChanges')
 
-  const hasNewerVersions = unpublishedVersions?.totalDocs > 0
+  const hasNewerVersions =
+    unpublishedVersions?.totalDocs > 0 && unpublishedVersions?.docs[0]?.version?._status === 'draft'
   const canPublish = hasPublishPermission && (modified || hasNewerVersions || !publishedDoc)
   const operation = useOperation()
 

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

@@ -41,14 +41,22 @@ export const Status: React.FC = () => {
 
   let statusToRender: 'changed' | 'draft' | 'published'
 
-  if (unpublishedVersions?.docs?.length > 0 && publishedDoc) {
+  const isChangedFromPublished = unpublishedVersions?.docs?.[0]?.version?._status === 'draft'
+
+  if (unpublishedVersions?.docs?.length > 0 && isChangedFromPublished && publishedDoc) {
     statusToRender = 'changed'
   } else if (!publishedDoc) {
     statusToRender = 'draft'
-  } else if (publishedDoc && unpublishedVersions?.docs?.length <= 1) {
+  } else if (publishedDoc && unpublishedVersions?.docs?.length <= 2) {
     statusToRender = 'published'
   }
 
+  const lastVersion = unpublishedVersions?.docs?.[0]
+
+  if (lastVersion && lastVersion.publishedLocale) {
+    statusToRender = locale === lastVersion.publishedLocale ? 'published' : 'draft'
+  }
+
   const performAction = useCallback(
     async (action: 'revert' | 'unpublish') => {
       let url

test/versions/e2e.spec.ts

@@ -647,7 +647,7 @@ describe('versions', () => {
 
       await textField.fill('spanish published')
       await saveDocAndAssert(page)
-      await expect(status).toContainText('Changed')
+      await expect(status).toContainText('Published')
 
       await textField.fill('spanish draft')
       await saveDocAndAssert(page, '#action-save-draft')
@@ -662,6 +662,16 @@ describe('versions', () => {
       await expect(publishSpecificLocale).toContainText('English')
       await publishSpecificLocale.click()
 
+      await wait(500)
+
+      await expect(async () => {
+        await expect(
+          page.locator('.payload-toast-item:has-text("Updated successfully.")'),
+        ).toBeVisible()
+      }).toPass({
+        timeout: POLL_TOPASS_TIMEOUT,
+      })
+
       id = await page.locator('.id-label').getAttribute('title')
 
       const data = await payload.find({