From bd622dcd98b6e1688b3a2b7d8d351ed776f91c73 Mon Sep 17 00:00:00 2001
From: Conrad Chan <conradchan@box.com>
Date: Tue, 29 Sep 2020 16:13:28 -0700
Subject: [PATCH] fix(popuplayer): Only render PopupReply for staged location

---
 src/popup/PopupLayer.tsx                | 2 +-
 src/popup/__tests__/PopupLayer-test.tsx | 7 ++++++-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/src/popup/PopupLayer.tsx b/src/popup/PopupLayer.tsx
index edb78d1ec..92bb0b98e 100644
--- a/src/popup/PopupLayer.tsx
+++ b/src/popup/PopupLayer.tsx
@@ -89,7 +89,7 @@ const PopupLayer = (props: Props): JSX.Element | null => {
 
     return (
         <>
-            {canCreate && canReply && reference && (
+            {canCreate && canReply && reference && staged && (
                 <div className="ba-PopupLayer-popup">
                     <PopupReply
                         isPending={isPending}
diff --git a/src/popup/__tests__/PopupLayer-test.tsx b/src/popup/__tests__/PopupLayer-test.tsx
index 8de3d98db..105bf210a 100644
--- a/src/popup/__tests__/PopupLayer-test.tsx
+++ b/src/popup/__tests__/PopupLayer-test.tsx
@@ -84,10 +84,15 @@ describe('PopupLayer', () => {
             expect(wrapper.exists(PopupReply)).toBe(false);
         });
 
-        test('should render PopupReply if promoting a highlight', () => {
+        test('should render PopupReply if promoting a highlight and staged exists', () => {
             const wrapper = getWrapper({ mode: Mode.NONE, isPromoting: true });
             expect(wrapper.exists(PopupReply)).toBe(true);
         });
+
+        test('should not render PopupReply if promoting a highlight but staged does not exist', () => {
+            const wrapper = getWrapper({ mode: Mode.NONE, isPromoting: true, staged: null });
+            expect(wrapper.exists(PopupReply)).toBe(false);
+        });
     });
 
     describe('event handlers', () => {