diff --git a/packages/ui/src/elements/IDLabel/index.tsx b/packages/ui/src/elements/IDLabel/index.tsx
index c224c39203..4315c06e0e 100644
--- a/packages/ui/src/elements/IDLabel/index.tsx
+++ b/packages/ui/src/elements/IDLabel/index.tsx
@@ -2,7 +2,12 @@
 import React from 'react'
 
 import './index.scss'
+import { Link } from '../../elements/Link/index.js'
+import { useConfig } from '../../providers/Config/index.js'
+import { useDocumentInfo } from '../../providers/DocumentInfo/index.js'
+import { formatAdminURL } from '../../utilities/formatAdminURL.js'
 import { sanitizeID } from '../../utilities/sanitizeID.js'
+import { useDrawerDepth } from '../Drawer/index.js'
 
 const baseClass = 'id-label'
 
@@ -10,10 +15,26 @@ export const IDLabel: React.FC<{ className?: string; id: string; prefix?: string
   id,
   className,
   prefix = 'ID:',
-}) => (
-  <div className={[baseClass, className].filter(Boolean).join(' ')} title={id}>
-    {prefix}
-    &nbsp;
-    {sanitizeID(id)}
-  </div>
-)
+}) => {
+  const {
+    config: {
+      routes: { admin: adminRoute },
+    },
+  } = useConfig()
+
+  const { collectionSlug, globalSlug } = useDocumentInfo()
+  const drawerDepth = useDrawerDepth()
+
+  const docPath = formatAdminURL({
+    adminRoute,
+    path: `/${collectionSlug ? `collections/${collectionSlug}` : `globals/${globalSlug}`}/${id}`,
+  })
+
+  return (
+    <div className={[baseClass, className].filter(Boolean).join(' ')} title={id}>
+      {prefix}
+      &nbsp;
+      {drawerDepth > 1 ? <Link href={docPath}>{sanitizeID(id)}</Link> : sanitizeID(id)}
+    </div>
+  )
+}
diff --git a/test/admin/e2e/document-view/e2e.spec.ts b/test/admin/e2e/document-view/e2e.spec.ts
index d3830b255d..7b5d617198 100644
--- a/test/admin/e2e/document-view/e2e.spec.ts
+++ b/test/admin/e2e/document-view/e2e.spec.ts
@@ -360,6 +360,65 @@ describe('Document View', () => {
 
       await expect.poll(() => drawer2Left > drawerLeft).toBe(true)
     })
+
+    test('document drawer displays a link to document', async () => {
+      await navigateToDoc(page, postsUrl)
+
+      // change the relationship to a document which is a different one than the current one
+      await page.locator('#field-relationship').click()
+      await page.locator('#field-relationship .rs__option').nth(2).click()
+      await saveDocAndAssert(page)
+
+      // open relationship drawer
+      await page
+        .locator('.field-type.relationship .relationship--single-value__drawer-toggler')
+        .click()
+
+      const drawer1Content = page.locator('[id^=doc-drawer_posts_1_] .drawer__content')
+      await expect(drawer1Content).toBeVisible()
+
+      // modify the title to trigger the leave page modal
+      await page.locator('.drawer__content #field-title').fill('New Title')
+
+      // Open link in a new tab by holding down the Meta or Control key
+      const documentLink = page.locator('.id-label a')
+      const documentId = String(await documentLink.textContent())
+      await documentLink.click()
+
+      const leavePageModal = page.locator('#leave-without-saving #confirm-action').last()
+      await expect(leavePageModal).toBeVisible()
+
+      await leavePageModal.click()
+      await page.waitForURL(postsUrl.edit(documentId))
+    })
+
+    test('document can be opened in a new tab from within the drawer', async () => {
+      await navigateToDoc(page, postsUrl)
+      await page
+        .locator('.field-type.relationship .relationship--single-value__drawer-toggler')
+        .click()
+      await wait(500)
+      const drawer1Content = page.locator('[id^=doc-drawer_posts_1_] .drawer__content')
+      await expect(drawer1Content).toBeVisible()
+
+      const currentUrl = page.url()
+
+      // Open link in a new tab by holding down the Meta or Control key
+      const documentLink = page.locator('.id-label a')
+      const documentId = String(await documentLink.textContent())
+      const [newPage] = await Promise.all([
+        page.context().waitForEvent('page'),
+        documentLink.click({ modifiers: ['ControlOrMeta'] }),
+      ])
+
+      // Wait for navigation to complete in the new tab and ensure correct URL
+      await expect(newPage.locator('.doc-header')).toBeVisible()
+      // using contain here, because after load the lists view will add query params like "?limit=10"
+      expect(newPage.url()).toContain(postsUrl.edit(documentId))
+
+      // Ensure the original page did not change
+      expect(page.url()).toBe(currentUrl)
+    })
   })
 
   describe('descriptions', () => {
diff --git a/tsconfig.base.json b/tsconfig.base.json
index 93d171a6a7..c9793d25c6 100644
--- a/tsconfig.base.json
+++ b/tsconfig.base.json
@@ -31,7 +31,7 @@
       }
     ],
     "paths": {
-      "@payload-config": ["./test/fields/config.ts"],
+      "@payload-config": ["./test/_community/config.ts"],
       "@payloadcms/admin-bar": ["./packages/admin-bar/src"],
       "@payloadcms/live-preview": ["./packages/live-preview/src"],
       "@payloadcms/live-preview-react": ["./packages/live-preview-react/src/index.ts"],