From be6e70ade781abc8e733d1d269e6e79974e51812 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Fri, 21 Jul 2023 14:45:02 -0400
Subject: [PATCH 1/4] prevents body scroll when the dialog is open

---
 src/Dialog/Dialog.tsx | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/src/Dialog/Dialog.tsx b/src/Dialog/Dialog.tsx
index 1db909aac6e..d77c5e211c0 100644
--- a/src/Dialog/Dialog.tsx
+++ b/src/Dialog/Dialog.tsx
@@ -287,6 +287,21 @@ const _Dialog = React.forwardRef<HTMLDivElement, React.PropsWithChildren<DialogP
     [onClose],
   )
 
+  React.useEffect(() => {
+    // If the body is already set to overflow: hidden, it likely means
+    // that there is already a modal open. In that case, we should bail
+    // so we don't re-enable scroll after the second dialog is closed.
+    if (document.body.style.overflow === 'hidden') {
+      return
+    }
+
+    document.body.style.overflow = 'hidden'
+
+    return () => {
+      document.body.style.overflow = ''
+    }
+  }, [])
+
   const header = (renderHeader ?? DefaultHeader)(defaultedProps)
   const body = (renderBody ?? DefaultBody)(defaultedProps)
   const footer = (renderFooter ?? DefaultFooter)(defaultedProps)

From 2ef3abfc3b22f2b1259321f6d4a7a31c891f629b Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Fri, 21 Jul 2023 14:50:57 -0400
Subject: [PATCH 2/4] Create tidy-melons-type.md

---
 .changeset/tidy-melons-type.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/tidy-melons-type.md

diff --git a/.changeset/tidy-melons-type.md b/.changeset/tidy-melons-type.md
new file mode 100644
index 00000000000..8176551bcf6
--- /dev/null
+++ b/.changeset/tidy-melons-type.md
@@ -0,0 +1,5 @@
+---
+"@primer/react": patch
+---
+
+Prevents body scroll when Dialog (the newer Dialog) is open

From fa3d244f782f170422073f6586a7ee1e25c48f73 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Fri, 21 Jul 2023 14:59:49 -0400
Subject: [PATCH 3/4] updates changset

---
 .changeset/tidy-melons-type.md | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/.changeset/tidy-melons-type.md b/.changeset/tidy-melons-type.md
index 8176551bcf6..3007a564861 100644
--- a/.changeset/tidy-melons-type.md
+++ b/.changeset/tidy-melons-type.md
@@ -3,3 +3,5 @@
 ---
 
 Prevents body scroll when Dialog (the newer Dialog) is open
+
+<!-- Changed components: Dialog -->

From 1ca7fc63711752c4ff8f87ad86a603f5b221f818 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Tue, 25 Jul 2023 12:44:46 -0400
Subject: [PATCH 4/4] keeps track of body overflow style to re-set it on
 unmount

---
 src/Dialog/Dialog.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/Dialog/Dialog.tsx b/src/Dialog/Dialog.tsx
index d77c5e211c0..6a6391384af 100644
--- a/src/Dialog/Dialog.tsx
+++ b/src/Dialog/Dialog.tsx
@@ -288,17 +288,18 @@ const _Dialog = React.forwardRef<HTMLDivElement, React.PropsWithChildren<DialogP
   )
 
   React.useEffect(() => {
+    const bodyOverflowStyle = document.body.style.overflow || ''
     // If the body is already set to overflow: hidden, it likely means
     // that there is already a modal open. In that case, we should bail
     // so we don't re-enable scroll after the second dialog is closed.
-    if (document.body.style.overflow === 'hidden') {
+    if (bodyOverflowStyle === 'hidden') {
       return
     }
 
     document.body.style.overflow = 'hidden'
 
     return () => {
-      document.body.style.overflow = ''
+      document.body.style.overflow = bodyOverflowStyle
     }
   }, [])