diff --git a/src/core/client/stream/components/PermalinkPopover.tsx b/src/core/client/stream/components/PermalinkPopover.tsx index 85e3bdd06..6a85ffcad 100644 --- a/src/core/client/stream/components/PermalinkPopover.tsx +++ b/src/core/client/stream/components/PermalinkPopover.tsx @@ -36,7 +36,6 @@ class PermalinkPopover extends React.Component { const { commentId, ref, style } = this.props; const { copied } = this.state; - console.log(this.props, "props"); return (
diff --git a/src/core/client/ui/components/Attachment/Attachment.tsx b/src/core/client/ui/components/Attachment/Attachment.tsx index 5af459729..2a44bcac1 100644 --- a/src/core/client/ui/components/Attachment/Attachment.tsx +++ b/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 | null; - children: React.ReactElement; + children: (props: RenderProps) => React.ReactElement; className?: string; placement?: | "auto-start" @@ -31,13 +34,10 @@ interface Props { class Attachment extends React.Component { public render() { - const { children, body, placement = "top", className } = this.props; + const { children, body, placement = "top" } = this.props; return ( - - {(props: Props) => React.cloneElement(children, { ref: props.ref })} - - + {(props: Props) => children({ ref: props.ref })} { positionFixed={false} > {({ ref, style }) => - body && - React.cloneElement(body, { - ref, - style, - className: cn(styles.root, className), - }) + body + ? React.cloneElement(body, { + ref, + style, + }) + : null } diff --git a/src/core/client/ui/components/Popover/Popover.tsx b/src/core/client/ui/components/Popover/Popover.tsx index 3605dc3b2..e9f054de3 100644 --- a/src/core/client/ui/components/Popover/Popover.tsx +++ b/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 | null; - children: (props: RenderProps) => React.ReactElement; -} - -interface Props { - ref: any; + body: React.ReactElement | null; + children: (props: RenderProps) => any; } interface State { @@ -33,7 +31,7 @@ class Popover extends React.Component { public render() { const { body, children } = this.props; // const { show } = this.state; - console.log(children); + // console.log(children); return ( {({ ref }) => children({ toggleShow: this.toggleShow, ref })}