From 96e7407d4ca7a90d760a5702f3e8af3535cd20b4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bel=C3=A9n=20Curcio?= <curciobelen@gmail.com>
Date: Tue, 24 Jul 2018 13:22:22 -0300
Subject: [PATCH] Working

---
 .../client/stream/components/Comment/Comment.tsx  |  8 ++++++--
 .../client/stream/components/PermalinkPopover.css |  5 -----
 .../client/stream/components/PermalinkPopover.tsx | 15 ++++++++-------
 src/core/client/ui/components/Popover/Popover.tsx |  4 ++--
 .../client/ui/components/TextField/TextField.tsx  |  4 ++--
 5 files changed, 18 insertions(+), 18 deletions(-)

diff --git a/src/core/client/stream/components/Comment/Comment.tsx b/src/core/client/stream/components/Comment/Comment.tsx
index 72eec2bc3..889ffbe1f 100644
--- a/src/core/client/stream/components/Comment/Comment.tsx
+++ b/src/core/client/stream/components/Comment/Comment.tsx
@@ -28,8 +28,12 @@ const Comment: StatelessComponent<CommentProps> = props => {
       <div>
         <Popover
           // tslint:disable-next-line:jsx-no-lambda
-          body={({ forwardRef }) => (
-            <PermalinkPopover commentId={props.id} forwardRef={forwardRef} />
+          body={({ toggleVisibility, forwardRef }) => (
+            <PermalinkPopover
+              commentID={props.id}
+              forwardRef={forwardRef}
+              toggleVisibility={toggleVisibility}
+            />
           )}
         >
           {({ toggleVisibility, forwardRef }) => (
diff --git a/src/core/client/stream/components/PermalinkPopover.css b/src/core/client/stream/components/PermalinkPopover.css
index 2d5f33fd2..8f956e370 100644
--- a/src/core/client/stream/components/PermalinkPopover.css
+++ b/src/core/client/stream/components/PermalinkPopover.css
@@ -3,11 +3,6 @@
 }
 
 .root {
-  background-color: #ffffff;
-  border: 1px solid #c9cacb;
-  box-sizing: border-box;
-  box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.25);
-  border-radius: 1px;
   padding: 6px 10px;
   display: flex;
 }
diff --git a/src/core/client/stream/components/PermalinkPopover.tsx b/src/core/client/stream/components/PermalinkPopover.tsx
index a4d8feca2..3093d009d 100644
--- a/src/core/client/stream/components/PermalinkPopover.tsx
+++ b/src/core/client/stream/components/PermalinkPopover.tsx
@@ -6,9 +6,10 @@ import { Button, TextField } from "talk-ui/components";
 import * as styles from "./PermalinkPopover.css";
 
 interface InnerProps {
-  commentId: string;
+  commentID: string;
   style?: CSSProperties;
-  innerRef?: RefHandler;
+  forwardRef?: RefHandler;
+  toggleVisibility?: () => any;
 }
 
 interface State {
@@ -34,13 +35,13 @@ class PermalinkPopover extends React.Component<InnerProps> {
   };
 
   public render() {
-    const { commentId, style, innerRef } = this.props;
+    const { commentID } = this.props;
     const { copied } = this.state;
     return (
-      <div className={styles.root} style={style} ref={innerRef}>
-        <TextField defaultValue={commentId} className={styles.textField} />
-        <CopyToClipboard text={commentId} onCopy={this.onCopy}>
-          <Button primary>
+      <div className={styles.root}>
+        <TextField defaultValue={commentID} className={styles.textField} />
+        <CopyToClipboard text={commentID} onCopy={this.onCopy}>
+          <Button color="primary" variant="filled">
             {copied ? (
               <Localized id="comments-permalink-copied">
                 <span>Copied!</span>
diff --git a/src/core/client/ui/components/Popover/Popover.tsx b/src/core/client/ui/components/Popover/Popover.tsx
index 1d3dffc8d..0873f42c1 100644
--- a/src/core/client/ui/components/Popover/Popover.tsx
+++ b/src/core/client/ui/components/Popover/Popover.tsx
@@ -13,7 +13,7 @@ interface InnerProps {
   body: (props: RenderProps) => any;
   // body: React.ReactElement<any> | null;
   children: (props: RenderProps) => any;
-  description: string;
+  description?: string;
   id?: string;
   onClose?: () => void;
   className?: string;
@@ -57,7 +57,7 @@ class Popover extends React.Component<InnerProps> {
           {(props: Props) => (
             <div
               id={id}
-              aria-role="popup"
+              role="popup"
               aria-labelledby={`${id}-ariainfo`}
               aria-hidden={!visible}
             >
diff --git a/src/core/client/ui/components/TextField/TextField.tsx b/src/core/client/ui/components/TextField/TextField.tsx
index ac980b102..6b530a3db 100644
--- a/src/core/client/ui/components/TextField/TextField.tsx
+++ b/src/core/client/ui/components/TextField/TextField.tsx
@@ -7,8 +7,8 @@ interface InnerProps extends InputHTMLAttributes<HTMLInputElement> {
   classes?: typeof styles;
 }
 
-const Input: StatelessComponent<InnerProps> = ({ className, ...rest }) => {
+const TextField: StatelessComponent<InnerProps> = ({ className, ...rest }) => {
   return <input {...rest} className={cn(styles.root, className)} />;
 };
 
-export default Input;
+export default TextField;