Revert "Stream Key Button (#7127)"

I forgot to lint before merging. Reverting for now, will fix in a bit.

This reverts commit 5c8878353f.

CHANGELOG.md

@@ -22,7 +22,6 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 - Clicking on the title of a floating player will take you back to the list ([#6921](https://github.com/lbryio/lbry-desktop/pull/6921))
 - Fix floating player stopping on markdown or image files ([#7073](https://github.com/lbryio/lbry-desktop/pull/7073))
 - Fix list thumbnail upload ([#7074](https://github.com/lbryio/lbry-desktop/pull/7074))
-- Stream Key is now hidden. ([#7127](https://github.com/lbryio/lbry-desktop/pull/7127))
 
 ## [0.51.2] - [2021-08-20]
 
@@ -1956,4 +1955,4 @@ This release includes a breaking change that will reset many of your settings. T
 
 - Use local file for publishing
 - Use local file and html5 for video playback
-- Misc changes needed to make UI compatible with electron.
+- Misc changes needed to make UI compatible with electron.

ui/component/copyableStreamkey/index.js

@@ -1,7 +0,0 @@
-import { connect } from 'react-redux';
-import { doToast } from 'redux/actions/notifications';
-import CopyableStreamkey from './view';
-
-export default connect(null, {
-  doToast,
-})(CopyableStreamkey);

ui/component/copyableStreamkey/view.jsx

@@ -1,93 +0,0 @@
-// @flow
-import * as ICONS from 'constants/icons';
-import { FormField } from 'component/common/form';
-import Button from 'component/button';
-import React, { useRef, Fragment } from 'react';
-
-type Props = {
-  copyable: string,
-  snackMessage: ?string,
-  doToast: ({ message: string }) => void,
-  primaryButton?: boolean,
-  name?: string,
-  onCopy?: (string) => string,
-  enableMask?: boolean,
-};
-
-export default function CopyableStreamkey(props: Props) {
-  const { copyable, doToast, snackMessage, primaryButton = false, name, onCopy, enableMask = true } = props;
-
-  const input = useRef();
-
-  function copyToClipboard() {
-    const topRef = input.current;
-    if (topRef[1].type === 'password') {
-      navigator.clipboard.writeText(topRef[1].defaultValue);
-    }
-    if (topRef[1].type === 'text') {
-      topRef[1].select();
-      if (onCopy) {
-        onCopy(topRef[1]);
-      }
-    }
-
-    document.execCommand('copy');
-  }
-
-  function checkMaskType() {
-    if (enableMask === true) {
-      return 'password';
-    }
-    if (enableMask === false) {
-      return 'text';
-    }
-  }
-  function showStreamkeyFunc() {
-    const topRef = input.current;
-    if (topRef[1].type === 'password') {
-      topRef[1].type = 'text';
-      topRef[0].innerText = 'Hide';
-      return;
-    }
-    if (topRef[1].type === 'text') {
-      topRef[1].type = 'password';
-      topRef[0].innerText = 'Show';
-    }
-  }
-
-  return (
-    <Fragment>
-      <form ref={input}>
-        <div>
-          <label name="livestream-key">Stream key</label>{' '}
-          <Button
-            className="button--link"
-            label={__('Show')}
-            onClick={() => {
-              showStreamkeyFunc();
-            }}
-          />
-        </div>
-        <FormField
-          type={checkMaskType()}
-          className="form-field--copyable-streamkey"
-          readOnly
-          name={name}
-          value={copyable || ''}
-          inputButton={
-            <Button
-              button={primaryButton ? 'primary' : 'secondary'}
-              icon={ICONS.COPY}
-              onClick={() => {
-                copyToClipboard();
-                doToast({
-                  message: snackMessage || __('Text copied'),
-                });
-              }}
-            />
-          }
-        />
-      </form>
-    </Fragment>
-  );
-}

ui/page/livestreamSetup/view.jsx

@@ -13,7 +13,6 @@ import { Lbry } from 'lbry-redux';
 import { toHex } from 'util/hex';
 import { FormField } from 'component/common/form';
 import CopyableText from 'component/copyableText';
-import CopyableStreamkey from 'component/copyableStreamkey';
 import Card from 'component/common/card';
 import ClaimList from 'component/claimList';
 import usePersistedState from 'effects/use-persisted-state';
@@ -187,7 +186,7 @@ export default function LivestreamSetupPage(props: Props) {
                       copyable={LIVESTREAM_RTMP_URL}
                       snackMessage={__('Copied')}
                     />
-                    <CopyableStreamkey
+                    <CopyableText
                       primaryButton
                       name="livestream-key"
                       label={__('Stream key')}