From f5be136d9594e15c21cb433e9f96c9aed0995542 Mon Sep 17 00:00:00 2001
From: jessop <jessop@lbry.com>
Date: Mon, 4 Nov 2019 07:50:51 -0500
Subject: [PATCH] fixes copy bug and changes button

---
 .../component/common/form-components/form-field.jsx   |  2 +-
 src/ui/component/embedArea/view.jsx                   | 11 ++++++-----
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/ui/component/common/form-components/form-field.jsx b/src/ui/component/common/form-components/form-field.jsx
index 38e390a6a..4dd0864dc 100644
--- a/src/ui/component/common/form-components/form-field.jsx
+++ b/src/ui/component/common/form-components/form-field.jsx
@@ -154,7 +154,7 @@ export class FormField extends React.PureComponent<Props> {
         input = (
           <fieldset-section>
             <label htmlFor={name}>{label}</label>
-            <textarea type={type} id={name} maxLength={textAreaMaxLength} {...inputProps} />
+            <textarea type={type} id={name} maxLength={textAreaMaxLength} ref={this.input} {...inputProps} />
             {countInfo}
           </fieldset-section>
         );
diff --git a/src/ui/component/embedArea/view.jsx b/src/ui/component/embedArea/view.jsx
index 3cccee030..533938aae 100644
--- a/src/ui/component/embedArea/view.jsx
+++ b/src/ui/component/embedArea/view.jsx
@@ -21,17 +21,20 @@ export default function EmbedArea(props: Props) {
 
   const streamUrl = generateStreamUrl(name, claimId, LBRY_TV_API);
   let embedText = `<iframe width="560" height="315" src="${streamUrl}" allowfullscreen></iframe>`;
+
   function copyToClipboard() {
     const topRef = input.current;
+    console.log(topRef);
     if (topRef && topRef.input && topRef.input.current) {
       topRef.input.current.select();
+      document.execCommand('copy');
+      doToast({ message: snackMessage || 'Embed link copied' });
     }
-    document.execCommand('copy');
   }
 
   function onFocus() {
     // We have to go a layer deep since the input is inside the form component
-    const topRef = input.current;
+    const topRef = input && input.current;
     if (topRef && topRef.input && topRef.input.current) {
       topRef.input.current.select();
     }
@@ -45,16 +48,14 @@ export default function EmbedArea(props: Props) {
         label={label}
         value={embedText || ''}
         ref={input}
-        readOnly
         onFocus={onFocus}
       />
       <div className="card__actions card__actions--center">
         <Button
           icon={ICONS.COPY}
-          button="inverse"
+          button="link"
           onClick={() => {
             copyToClipboard();
-            doToast({ message: snackMessage || 'Embed link copied' });
           }}
         />
       </div>