From 0574725be86717f5de38ce6a75f7b7e7289dc393 Mon Sep 17 00:00:00 2001
From: Gabe Kangas <gabek@real-ity.com>
Date: Thu, 21 Jul 2022 12:15:03 -0700
Subject: [PATCH] Use vh instead of % to fix storybook rendering of chat
 container.

---
 web/components/chat/ChatContainer/ChatContainer.tsx | 2 +-
 web/stories/ChatContainer.stories.tsx               | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/web/components/chat/ChatContainer/ChatContainer.tsx b/web/components/chat/ChatContainer/ChatContainer.tsx
index 7c536fe5d..2e367078d 100644
--- a/web/components/chat/ChatContainer/ChatContainer.tsx
+++ b/web/components/chat/ChatContainer/ChatContainer.tsx
@@ -102,7 +102,7 @@ export default function ChatContainer(props: Props) {
     () => (
       <>
         <Virtuoso
-          style={{ height: 'calc(100% - 110px)', width: 'auto' }}
+          style={{ height: 'calc(100vh - 170px)', width: 'auto' }}
           ref={chatContainerRef}
           initialTopMostItemIndex={messages.length - 1} // Force alignment to bottom
           data={messages}
diff --git a/web/stories/ChatContainer.stories.tsx b/web/stories/ChatContainer.stories.tsx
index 6b4403dd4..fae82b5a5 100644
--- a/web/stories/ChatContainer.stories.tsx
+++ b/web/stories/ChatContainer.stories.tsx
@@ -35,8 +35,8 @@ const AddMessagesChatExample = args => {
       </button>
       <ChatContainer
         messages={chatMessages}
-        usernameToHighlight={null}
-        chatUserId={null}
+        usernameToHighlight="testuser"
+        chatUserId="testuser"
         isModerator={false}
         isMobile={false}
       />