Merge pull request #2082 from lbryio/rc-fixes

Rc fixes

.eslintrc.json

@@ -42,6 +42,7 @@
     "jsx-a11y/no-noninteractive-element-to-interactive-role": 0,
     "class-methods-use-this": 0,
     "jsx-a11y/interactive-supports-focus": 0,
-    "jsx-a11y/click-events-have-key-events": 0
+    "jsx-a11y/click-events-have-key-events": 0,
+    "consistent-return": 0
   }
 }

src/renderer/component/categoryList/view.jsx

@@ -262,12 +262,19 @@ class CategoryList extends React.PureComponent<Props, State> {
               this.rowItems = ref;
             }}
           >
-            {names && names.map(name => <FileCard key={name} uri={normalizeURI(name)} />)}
+            {names &&
+              names.map(name => (
+                <FileCard showSubscribedLogo key={name} uri={normalizeURI(name)} />
+              ))}
 
             {channelClaims &&
               channelClaims.length &&
               channelClaims.map(claim => (
-                <FileCard key={claim.claim_id} uri={`lbry://${claim.name}#${claim.claim_id}`} />
+                <FileCard
+                  showSubcribedLogo
+                  key={claim.claim_id}
+                  uri={`lbry://${claim.name}#${claim.claim_id}`}
+                />
               ))}
           </div>
         )}

src/renderer/component/common/tooltip.jsx

@@ -20,7 +20,7 @@ class ToolTip extends React.PureComponent<Props, State> {
     direction: 'bottom',
   };
 
-  constructor(props) {
+  constructor(props: Props) {
     super(props);
     this.tooltip = React.createRef();
     this.state = {
@@ -33,6 +33,10 @@ class ToolTip extends React.PureComponent<Props, State> {
   }
 
   getVisibility = () => {
+    if (!this.tooltip.current) {
+      return;
+    }
+
     const node = this.tooltip.current;
     const rect = node.getBoundingClientRect();
 
@@ -81,6 +85,8 @@ class ToolTip extends React.PureComponent<Props, State> {
     }
   };
 
+  tooltip: { current: null | HTMLSpanElement };
+
   render() {
     const { direction } = this.state;
     const { children, label, body, icon, onComponent } = this.props;

src/renderer/page/channel/view.jsx

@@ -87,7 +87,7 @@ class ChannelPage extends React.PureComponent<Props> {
           </h1>
         </section>
         <div className="card__actions">
-          <SubscribeButton uri={permanentUrl} channelName={name} />
+          <SubscribeButton uri={`lbry://${permanentUrl}`} channelName={name} />
           <ViewOnWebButton claimId={claimId} claimName={name} />
         </div>
         <section className="card__content">{contentList}</section>

src/renderer/redux/actions/content.js

@@ -23,6 +23,7 @@ import {
   doNotify,
   makeSelectChannelForClaimUri,
   parseURI,
+  creditsToString,
 } from 'lbry-redux';
 import { makeSelectClientSetting, selectosNotificationsEnabled } from 'redux/selectors/settings';
 import setBadge from 'util/setBadge';
@@ -373,7 +374,7 @@ export function doFetchChannelListMine() {
   };
 }
 
-export function doCreateChannel(name, amount) {
+export function doCreateChannel(name: string, amount: number) {
   return dispatch => {
     dispatch({
       type: ACTIONS.CREATE_CHANNEL_STARTED,
@@ -382,7 +383,7 @@ export function doCreateChannel(name, amount) {
     return new Promise((resolve, reject) => {
       Lbry.channel_new({
         channel_name: name,
-        amount: parseFloat(amount),
+        amount: creditsToString(amount),
       }).then(
         newChannelClaim => {
           const channelClaim = newChannelClaim;

src/renderer/redux/actions/subscriptions.js

@@ -315,6 +315,13 @@ export const doChannelSubscribe = (subscription: Subscription) => (
   } = getState();
   const { share_usage_data: isSharingData } = daemonSettings;
 
+  const subscriptionUri = subscription.uri;
+  if (!subscriptionUri.startsWith('lbry://')) {
+    throw Error(
+      `Subscription uris must inclue the "lbry://" prefix.\nTried to subscribe to ${subscriptionUri}`
+    );
+  }
+
   dispatch({
     type: ACTIONS.CHANNEL_SUBSCRIBE,
     data: subscription,

src/renderer/scss/component/_markdown-editor.scss

@@ -16,16 +16,14 @@
   }
 
   .CodeMirror-selected {
-    background-color: transparent;
+    // background-color: transparent;
   }
 
   .CodeMirror-selectedtext {
-    background-color: $lbry-teal-5;
     color: $lbry-white;
   }
 
   .cm-spell-error:not(.cm-url):not(.cm-comment):not(.cm-tag):not(.cm-word) {
-    background: none;
     text-decoration: underline;
     text-decoration-color: $lbry-red-3;
     text-decoration-style: dotted;
@@ -65,7 +63,7 @@
   }
 
   a {
-    color: $lbry-black !important;
+    color: $lbry-black;
     transition: opacity 0.3s ease;
 
     &:not(.active),
@@ -85,12 +83,6 @@
   }
 }
 
-.editor-preview {
-  background-color: rgba($lbry-gray-1, 0.5);
-  border: none;
-  font-size: calc(var(--font-size-subtext-multiple) * 1em);
-}
-
 .editor-statusbar {
   color: rgba($lbry-black, 0.5);
 }

src/renderer/scss/component/_nav.scss

@@ -12,11 +12,11 @@
 
   @media (min-width: $medium-breakpoint) {
     padding-left: $spacing-width;
-    width: calc(var(--side-nav-width) * 1.4);
+    min-width: calc(var(--side-nav-width) * 1.4);
   }
 
   @media (min-width: $large-breakpoint) {
-    width: calc(var(--side-nav-width) * 1.6);
+    min-width: calc(var(--side-nav-width) * 1.6);
   }
 }
 

src/renderer/scss/themes/_dark.scss

@@ -130,4 +130,47 @@ html[data-theme='dark'] {
     border: 1px solid rgba($lbry-gray-1, 0.1);
     color: $lbry-gray-3;
   }
+
+  // Markdown editor on publish page
+  .form-field--SimpleMDE {
+    .editor-toolbar {
+      background-color: rgba($lbry-white, 0.2);
+
+      a {
+        color: $lbry-white !important; // We need to use !important to override the CodeMirror styles
+
+        &:hover {
+          color: $lbry-black !important;
+        }
+      }
+
+      &.disabled-for-preview {
+        a:not(.no-disable) {
+          background-color: transparent;
+        }
+
+        // The markdown preview button is highlighted during preview when the other buttons are disabled
+        a.no-disable {
+          background-color: rgba($lbry-white, 0.3);
+        }
+      }
+    }
+
+    .CodeMirror {
+      border-left: 1px solid rgba($lbry-white, 0.2);
+      border-right: 1px solid rgba($lbry-white, 0.2);
+      border-bottom: 1px solid rgba($lbry-white, 0.2);
+      background-color: rgba($lbry-white, 0.1);
+      color: $lbry-white;
+
+      .CodeMirror-selectedtext {
+        color: $lbry-black;
+      }
+
+      .editor-preview.editor-preview-active {
+        background-color: $lbry-gray-5;
+        color: $lbry-black;
+      }
+    }
+  }
 }