Don't reload on showing chat (#79)

packages/react-chat-example/src/index.tsx

@@ -62,30 +62,35 @@ function DragDiv() {
           document.addEventListener("mouseup", onMouseUp);
         }}
       />
+      <FloatingDiv className={showChat ? "" : "hide"}>
+        <ReactChat
+          theme={lightTheme}
+          community={community}
+          fetchMetadata={fetchMetadata}
+        />
+      </FloatingDiv>
       {showChat && (
-        <>
+        <SizeSet
-          <div
+          onMouseDown={() => {
-            style={{ height: "calc(100% - 50px)", border: "1px solid black" }}
+            setting.current = "size";
-          >
+            document.addEventListener("mousemove", onMouseMove);
-            <ReactChat
+            document.addEventListener("mouseup", onMouseUp);
-              theme={lightTheme}
+          }}
-              community={community}
+        ></SizeSet>
-              fetchMetadata={fetchMetadata}
-            />
-          </div>
-          <SizeSet
-            onMouseDown={() => {
-              setting.current = "size";
-              document.addEventListener("mousemove", onMouseMove);
-              document.addEventListener("mouseup", onMouseUp);
-            }}
-          ></SizeSet>
-        </>
       )}
     </Drag>
   );
 }
 
+const FloatingDiv = styled.div`
+  height: calc(100% - 50px);
+  border: 1px solid black;
+
+  &.hide {
+    display: none;
+  }
+`;
+
 const SizeSet = styled.div`
   margin-left: auto;
   margin-right: 0px;