fix: Inbox and Popup re-rendering needlessly

Previously we'd incorrectly pass their `children` into `useUIBox` which
would cause the UIBoxes to be destroyed and re-initialized over and over.

Author: Asha20

lib/ui/Inbox.tsx

@@ -50,6 +50,7 @@ function ActiveInbox(props: InboxProps & { session: Talk.Session }) {
     style,
     className,
     loadingComponent,
+    children,
     ...optionsAndEvents
   } = props;
 
@@ -77,6 +78,7 @@ function ActiveInbox(props: InboxProps & { session: Talk.Session }) {
       style={style}
       loadingComponent={loadingComponent}
       handlers={events}
+      children={children}
     />
   );
 }

lib/ui/Popup.tsx

@@ -8,6 +8,7 @@ import {
 import { useSetter, useConversation, useUIBox, useMountBox } from "../hooks";
 import { EventListeners } from "../EventListeners";
 import { UIBoxProps } from "../types";
+import { BoxContext } from "../MountedBox";
 
 type PopupProps = UIBoxProps<Talk.Popup> &
   Talk.PopupOptions & {
@@ -38,6 +39,7 @@ function ActivePopup(props: PopupProps & { session: Talk.Session }) {
     conversationId,
     syncConversation,
     popupRef,
+    children,
     ...optionsAndEvents
   } = props;
 
@@ -52,5 +54,10 @@ function ActivePopup(props: PopupProps & { session: Talk.Session }) {
   useConversation(session, box, syncConversation, conversationId);
   useMountBox(box, undefined);
 
-  return <EventListeners target={box} handlers={events} />;
+  return (
+    <BoxContext.Provider value={box}>
+      {children}
+      <EventListeners target={box} handlers={events} />
+    </BoxContext.Provider>
+  );
 }