From dd76ac1ed4fb5fbdd27c473eccf27d7637f06dbc Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Tue, 27 Jun 2017 16:51:00 -0300
Subject: [PATCH 1/2] Now the smooth flag works

---
 client/coral-admin/src/index.js               |   2 +
 package.json                                  |   1 +
 .../client/components/CopyButton.js           |  16 +++
 .../client/components/Permalink.js            | 107 ++++++++++++++++++
 yarn.lock                                     |   4 +
 5 files changed, 130 insertions(+)
 create mode 100644 plugins/talk-plugin-permalink/client/components/CopyButton.js
 create mode 100644 plugins/talk-plugin-permalink/client/components/Permalink.js

diff --git a/client/coral-admin/src/index.js b/client/coral-admin/src/index.js
index 2f2e75275..29df3753c 100644
--- a/client/coral-admin/src/index.js
+++ b/client/coral-admin/src/index.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import {render} from 'react-dom';
 import {ApolloProvider} from 'react-apollo';
+import smoothscroll from 'smoothscroll-polyfill';
 
 import {getClient} from './services/client';
 import store from './services/store';
@@ -13,6 +14,7 @@ import {loadPluginsTranslations, injectPluginsReducers} from 'coral-framework/he
 
 loadPluginsTranslations();
 injectPluginsReducers();
+smoothscroll.polyfill();
 
 render(
   <ApolloProvider client={getClient()} store={store}>
diff --git a/package.json b/package.json
index 9d48f39cd..2834a3e3a 100644
--- a/package.json
+++ b/package.json
@@ -118,6 +118,7 @@
     "resolve": "^1.3.2",
     "semver": "^5.3.0",
     "simplemde": "^1.11.2",
+    "smoothscroll-polyfill": "^0.3.5",
     "snake-case": "^2.1.0",
     "subscriptions-transport-ws": "^0.7.2",
     "timekeeper": "^1.0.0",
diff --git a/plugins/talk-plugin-permalink/client/components/CopyButton.js b/plugins/talk-plugin-permalink/client/components/CopyButton.js
new file mode 100644
index 000000000..405468a6e
--- /dev/null
+++ b/plugins/talk-plugin-permalink/client/components/CopyButton.js
@@ -0,0 +1,16 @@
+import React from 'react';
+import {t} from 'plugin-api/beta/client/services';
+import {withCopyToClipboard} from 'plugin-api/beta/client/hocs';
+import {Button} from 'plugin-api/beta/client/components/ui';
+
+class ButtonCopyToClipboard extends React.Component {
+  render () {
+    return (
+      <Button {...this.props} >
+        {t('common.copy')}
+      </Button>
+    );
+  }
+}
+
+export default withCopyToClipboard(ButtonCopyToClipboard);
diff --git a/plugins/talk-plugin-permalink/client/components/Permalink.js b/plugins/talk-plugin-permalink/client/components/Permalink.js
new file mode 100644
index 000000000..68406472e
--- /dev/null
+++ b/plugins/talk-plugin-permalink/client/components/Permalink.js
@@ -0,0 +1,107 @@
+import React from 'react';
+import cn from 'classnames';
+import styles from './styles.css';
+import {t} from 'plugin-api/beta/client/services';
+import {ClickOutside} from 'plugin-api/beta/client/components';
+import {Icon, Button} from 'plugin-api/beta/client/components/ui';
+
+const name = 'talk-plugin-permalink';
+
+export default class PermalinkButton extends React.Component {
+  constructor (props) {
+    super(props);
+
+    this.state = {
+      popoverOpen: false,
+      copySuccessful: null,
+      copyFailure: null
+    };
+
+  }
+
+  toggle = () => {
+    this.popover.style.top = `${this.linkButton.offsetTop - 80}px`;
+
+    this.setState({
+      popoverOpen: !this.state.popoverOpen
+    });
+  }
+
+  handleClickOutside = () => {
+    this.setState({
+      popoverOpen: false
+    });
+  }
+
+  copyPermalink = () => {
+    this.permalinkInput.select();
+    try {
+      document.execCommand('copy');
+      this.setState({
+        copySuccessful: true,
+        copyFailure: null
+      });
+    } catch (err) {
+      this.setState({
+        copyFailure: true,
+        copySuccessful: null
+      });
+    }
+
+    this.timeout = window.setTimeout(() => {
+      this.setState({
+        copyFailure: null,
+        copySuccessful: null
+      });
+    }, 3000);
+  }
+
+  componentWillUnmount() {
+    window.clearTimeout(this.timeout);
+  }
+
+  render () {
+    const {copySuccessful, copyFailure, popoverOpen} = this.state;
+    const {asset} = this.props;
+    return (
+      <ClickOutside onClickOutside={this.handleClickOutside}>
+        <div className={cn(`${name}-container`, styles.container)}>
+          
+          <button
+            ref={(ref) => this.linkButton = ref}
+            onClick={this.toggle}
+            className={`${name}-button`}>
+              {t('permalink')}
+            <Icon name="link" />
+          </button>
+
+          <div
+            ref={(ref) => this.popover = ref}
+            className={cn([`${name}-popover`, styles.popover, {[styles.active]: popoverOpen}])}>
+
+            <input
+              className={cn(styles.input, `${name}-copy-field`)}
+              type='text'
+              ref={(input) => this.permalinkInput = input}
+              defaultValue={`${asset.url}#${this.props.commentId}`}
+            />
+
+            <Button
+              onClick={this.copyPermalink}
+              className={cn([
+                styles.button,
+                `${name}-copy-button`, {
+                  [styles.success]:copySuccessful,
+                  [styles.failure]: copyFailure
+                }])}>
+              {!copyFailure && !copySuccessful && 'Copy'}
+              {copySuccessful && 'Copied'}
+              {copyFailure && 'Not supported'}
+            </Button>
+            
+          </div>
+        </div>
+      </ClickOutside>
+    );
+  }
+}
diff --git a/yarn.lock b/yarn.lock
index 6e8776e08..92edf11b5 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7602,6 +7602,10 @@ smart-buffer@^1.0.4:
   version "1.1.15"
   resolved "https://registry.yarnpkg.com/smart-buffer/-/smart-buffer-1.1.15.tgz#7f114b5b65fab3e2a35aa775bb12f0d1c649bf16"
 
+smoothscroll-polyfill@^0.3.5:
+  version "0.3.5"
+  resolved "https://registry.yarnpkg.com/smoothscroll-polyfill/-/smoothscroll-polyfill-0.3.5.tgz#466e6039b51cb525d70e1a5077ef81e064678eae"
+
 smtp-connection@2.12.0:
   version "2.12.0"
   resolved "https://registry.yarnpkg.com/smtp-connection/-/smtp-connection-2.12.0.tgz#d76ef9127cb23c2259edb1e8349c2e8d5e2d74c1"

From f767b6a99806b5e19fd326ffbef57c7ffa134533 Mon Sep 17 00:00:00 2001
From: Belen Curcio <curciobelen@gmail.com>
Date: Wed, 28 Jun 2017 09:06:46 -0300
Subject: [PATCH 2/2] Removing old

---
 .../client/components/CopyButton.js           |  16 ---
 .../client/components/Permalink.js            | 107 ------------------
 2 files changed, 123 deletions(-)
 delete mode 100644 plugins/talk-plugin-permalink/client/components/CopyButton.js
 delete mode 100644 plugins/talk-plugin-permalink/client/components/Permalink.js

diff --git a/plugins/talk-plugin-permalink/client/components/CopyButton.js b/plugins/talk-plugin-permalink/client/components/CopyButton.js
deleted file mode 100644
index 405468a6e..000000000
--- a/plugins/talk-plugin-permalink/client/components/CopyButton.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import React from 'react';
-import {t} from 'plugin-api/beta/client/services';
-import {withCopyToClipboard} from 'plugin-api/beta/client/hocs';
-import {Button} from 'plugin-api/beta/client/components/ui';
-
-class ButtonCopyToClipboard extends React.Component {
-  render () {
-    return (
-      <Button {...this.props} >
-        {t('common.copy')}
-      </Button>
-    );
-  }
-}
-
-export default withCopyToClipboard(ButtonCopyToClipboard);
diff --git a/plugins/talk-plugin-permalink/client/components/Permalink.js b/plugins/talk-plugin-permalink/client/components/Permalink.js
deleted file mode 100644
index 68406472e..000000000
--- a/plugins/talk-plugin-permalink/client/components/Permalink.js
+++ /dev/null
@@ -1,107 +0,0 @@
-import React from 'react';
-import cn from 'classnames';
-import styles from './styles.css';
-import {t} from 'plugin-api/beta/client/services';
-import {ClickOutside} from 'plugin-api/beta/client/components';
-import {Icon, Button} from 'plugin-api/beta/client/components/ui';
-
-const name = 'talk-plugin-permalink';
-
-export default class PermalinkButton extends React.Component {
-  constructor (props) {
-    super(props);
-
-    this.state = {
-      popoverOpen: false,
-      copySuccessful: null,
-      copyFailure: null
-    };
-
-  }
-
-  toggle = () => {
-    this.popover.style.top = `${this.linkButton.offsetTop - 80}px`;
-
-    this.setState({
-      popoverOpen: !this.state.popoverOpen
-    });
-  }
-
-  handleClickOutside = () => {
-    this.setState({
-      popoverOpen: false
-    });
-  }
-
-  copyPermalink = () => {
-    this.permalinkInput.select();
-    try {
-      document.execCommand('copy');
-      this.setState({
-        copySuccessful: true,
-        copyFailure: null
-      });
-    } catch (err) {
-      this.setState({
-        copyFailure: true,
-        copySuccessful: null
-      });
-    }
-
-    this.timeout = window.setTimeout(() => {
-      this.setState({
-        copyFailure: null,
-        copySuccessful: null
-      });
-    }, 3000);
-  }
-
-  componentWillUnmount() {
-    window.clearTimeout(this.timeout);
-  }
-
-  render () {
-    const {copySuccessful, copyFailure, popoverOpen} = this.state;
-    const {asset} = this.props;
-    return (
-      <ClickOutside onClickOutside={this.handleClickOutside}>
-        <div className={cn(`${name}-container`, styles.container)}>
-          
-          <button
-            ref={(ref) => this.linkButton = ref}
-            onClick={this.toggle}
-            className={`${name}-button`}>
-              {t('permalink')}
-            <Icon name="link" />
-          </button>
-
-          <div
-            ref={(ref) => this.popover = ref}
-            className={cn([`${name}-popover`, styles.popover, {[styles.active]: popoverOpen}])}>
-
-            <input
-              className={cn(styles.input, `${name}-copy-field`)}
-              type='text'
-              ref={(input) => this.permalinkInput = input}
-              defaultValue={`${asset.url}#${this.props.commentId}`}
-            />
-
-            <Button
-              onClick={this.copyPermalink}
-              className={cn([
-                styles.button,
-                `${name}-copy-button`, {
-                  [styles.success]:copySuccessful,
-                  [styles.failure]: copyFailure
-                }])}>
-              {!copyFailure && !copySuccessful && 'Copy'}
-              {copySuccessful && 'Copied'}
-              {copyFailure && 'Not supported'}
-            </Button>
-            
-          </div>
-        </div>
-      </ClickOutside>
-    );
-  }
-}