Any

src/core/client/stream/components/PermalinkPopover.tsx

@@ -36,7 +36,6 @@ class PermalinkPopover extends React.Component<InnerProps> {
     const { commentId, ref, style } = this.props;
     const { copied } = this.state;
 
-    console.log(this.props, "props");
     return (
       <div className={styles.root} ref={ref} style={style}>
         <TextField defaultValue={commentId} className={styles.textField} />

src/core/client/ui/components/Attachment/Attachment.tsx

@@ -1,11 +1,14 @@
-import cn from "classnames";
-import React from "react";
-import { Manager, Popper, Reference } from "react-popper";
-import * as styles from "./Attachment.css";
+import React, { CSSProperties } from "react";
+import { Manager, Popper, Reference, RefHandler } from "react-popper";
+
+interface RenderProps {
+  ref: RefHandler;
+  style?: CSSProperties;
+}
 
 interface InnerProps {
   body: React.ReactElement<any> | null;
-  children: React.ReactElement<any>;
+  children: (props: RenderProps) => React.ReactElement<any>;
   className?: string;
   placement?:
     | "auto-start"
@@ -31,13 +34,10 @@ interface Props {
 
 class Attachment extends React.Component<InnerProps> {
   public render() {
-    const { children, body, placement = "top", className } = this.props;
+    const { children, body, placement = "top" } = this.props;
     return (
       <Manager>
-        <Reference>
-          {(props: Props) => React.cloneElement(children, { ref: props.ref })}
-        </Reference>
-
+        <Reference>{(props: Props) => children({ ref: props.ref })}</Reference>
         <Popper
           placement={placement}
           modifiers={{ preventOverflow: { enabled: false } }}
@@ -45,12 +45,12 @@ class Attachment extends React.Component<InnerProps> {
           positionFixed={false}
         >
           {({ ref, style }) =>
-            body &&
-            React.cloneElement(body, {
-              ref,
-              style,
-              className: cn(styles.root, className),
-            })
+            body
+              ? React.cloneElement(body, {
+                  ref,
+                  style,
+                })
+              : null
           }
         </Popper>
       </Manager>

src/core/client/ui/components/Popover/Popover.tsx

@@ -1,18 +1,16 @@
 import React from "react";
+import { RefHandler } from "react-popper";
 import Attachment from "../Attachment";
 import * as styles from "./Popover.css";
 
 interface RenderProps {
-  toggleShow: () => void;
+  toggleShow?: () => void;
+  ref?: RefHandler;
 }
 
 interface InnerProps {
-  body: React.ReactElement<Props> | null;
-  children: (props: RenderProps) => React.ReactElement<any>;
-}
-
-interface Props {
-  ref: any;
+  body: React.ReactElement<any> | null;
+  children: (props: RenderProps) => any;
 }
 
 interface State {
@@ -33,7 +31,7 @@ class Popover extends React.Component<InnerProps> {
   public render() {
     const { body, children } = this.props;
     // const { show } = this.state;
-    console.log(children);
+    // console.log(children);
     return (
       <Attachment body={body} className={styles.root}>
         {({ ref }) => children({ toggleShow: this.toggleShow, ref })}