From 421a3a8e4472b98cb8e7f1fb1d2c1bc9cd6636ff Mon Sep 17 00:00:00 2001
From: Anurag Hazra <anurag.hazra@razorpay.com>
Date: Tue, 5 Nov 2024 16:16:03 +0530
Subject: [PATCH] fix(blade): bottomsheet body scroll lock not clearing (#2403)

* fix(blade): bottomsheet body scroll edge case

* Create tricky-clocks-smoke.md
---
 .changeset/tricky-clocks-smoke.md                           | 5 +++++
 .../blade/src/components/BottomSheet/BottomSheetStack.tsx   | 6 +++++-
 2 files changed, 10 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/tricky-clocks-smoke.md

diff --git a/.changeset/tricky-clocks-smoke.md b/.changeset/tricky-clocks-smoke.md
new file mode 100644
index 00000000000..e3a88f0feb8
--- /dev/null
+++ b/.changeset/tricky-clocks-smoke.md
@@ -0,0 +1,5 @@
+---
+"@razorpay/blade": patch
+---
+
+fix(blade): bottomsheet body scroll lock not clearing
diff --git a/packages/blade/src/components/BottomSheet/BottomSheetStack.tsx b/packages/blade/src/components/BottomSheet/BottomSheetStack.tsx
index ccb8ef9d11f..59a09f1c3dd 100644
--- a/packages/blade/src/components/BottomSheet/BottomSheetStack.tsx
+++ b/packages/blade/src/components/BottomSheet/BottomSheetStack.tsx
@@ -31,7 +31,11 @@ const BottomSheetStackProvider = ({
     return stack[0] || null;
   }, [stack]);
 
-  const addBottomSheetToStack = React.useCallback((id: string) => {
+  const addBottomSheetToStack = React.useCallback((id?: string) => {
+    // id can be undefined since useId returns `undefined` on first render,
+    // if we push undefined to the stack the `removeBottomSheetFromStack` will break
+    // since it will try to match top of the stack with undefined
+    if (id === undefined) return;
     setStack((prev) => [id, ...prev]);
   }, []);