Merge pull request #2092 from lbryio/rc-fixes

Rc fixes

package.json

@@ -49,7 +49,7 @@
     "formik": "^0.10.4",
     "hast-util-sanitize": "^1.1.2",
     "keytar": "^4.2.1",
-    "lbry-redux": "lbryio/lbry-redux#aa10240bc1e90dff299821e31a88edcb4c5fd295",
+    "lbry-redux": "lbryio/lbry-redux#6139cede26a5c17a8ecfc8a5c0445568ee686255",
     "lbryinc": "lbryio/lbryinc#7a458ea13ceceffa0191e73139f94e5c953f22b1",
     "localforage": "^1.7.1",
     "mammoth": "^1.4.6",

src/renderer/component/app/index.js

@@ -1,5 +1,10 @@
 import { connect } from 'react-redux';
-import { selectPageTitle, selectHistoryIndex, selectActiveHistoryEntry } from 'lbry-redux';
+import {
+  selectPageTitle,
+  selectHistoryIndex,
+  selectActiveHistoryEntry,
+  doUpdateBlockHeight,
+} from 'lbry-redux';
 import { doRecordScroll } from 'redux/actions/navigation';
 import { selectUser } from 'lbryinc';
 import { doAlertError } from 'redux/actions/app';
@@ -17,6 +22,7 @@ const select = state => ({
 const perform = dispatch => ({
   alertError: errorList => dispatch(doAlertError(errorList)),
   recordScroll: scrollPosition => dispatch(doRecordScroll(scrollPosition)),
+  updateBlockHeight: () => dispatch(doUpdateBlockHeight()),
 });
 
 export default connect(

src/renderer/component/app/view.jsx

@@ -8,6 +8,8 @@ import SideBar from 'component/sideBar';
 import Header from 'component/header';
 import { openContextMenu } from '../../util/contextMenu';
 
+const TWO_POINT_FIVE_MINUTES = 1000 * 60 * 2.5;
+
 type Props = {
   alertError: (string | {}) => void,
   recordScroll: number => void,
@@ -15,6 +17,7 @@ type Props = {
   currentPageAttributes: { path: string, scrollY: number },
   pageTitle: ?string,
   theme: string,
+  updateBlockHeight: () => void,
 };
 
 class App extends React.PureComponent<Props> {
@@ -38,6 +41,8 @@ class App extends React.PureComponent<Props> {
   }
 
   componentDidMount() {
+    const { updateBlockHeight } = this.props;
+
     const mainContent = document.getElementById('content');
     this.mainContent = mainContent;
 
@@ -46,6 +51,11 @@ class App extends React.PureComponent<Props> {
     }
 
     ReactModal.setAppElement('#window'); // fuck this
+
+    updateBlockHeight();
+    setInterval(() => {
+      updateBlockHeight();
+    }, TWO_POINT_FIVE_MINUTES);
   }
 
   componentWillReceiveProps(props: Props) {

src/renderer/component/dateTime/view.jsx

@@ -23,27 +23,28 @@ class DateTime extends React.PureComponent<Props> {
   };
 
   componentWillMount() {
-    this.refreshDate(this.props);
+    // this.refreshDate(this.props);
   }
 
-  componentWillReceiveProps(props) {
+  componentWillReceiveProps() {
-    this.refreshDate(props);
+    // this.refreshDate(props);
   }
 
-  refreshDate(props) {
+  // Removing this for performance reasons. Can be un-commented once block_show is better with large numbers of calls
-    const { block, date, fetchBlock } = props;
+  // Or the date is included in the claim
-    if (block && date === undefined) {
+  //
-      fetchBlock(block);
+  // refreshDate(props: Props) {
-    }
+  //   const { block, date, fetchBlock } = props;
-  }
+  //   if (block && date === undefined) {
+  //     fetchBlock(block);
+  //   }
+  // }
 
   render() {
     const { date, formatOptions, timeAgo } = this.props;
     const show = this.props.show || DateTime.SHOW_BOTH;
     const locale = app.i18n.getLocale();
 
-    // If !date, it's currently being fetched
-
     if (timeAgo) {
       return date ? <span>{moment(date).from(moment())}</span> : <span />;
     }

src/renderer/component/transactionList/view.jsx

@@ -82,7 +82,7 @@ class TransactionList extends React.PureComponent<Props> {
         )}
         {!slim &&
           !!transactionList.length && (
-            <div className="card__actions">
+            <div className="card__actions card__actions--between">
               <FileExporter
                 data={transactionList}
                 label={__('Export')}
@@ -90,33 +90,31 @@ class TransactionList extends React.PureComponent<Props> {
                 filters={['nout']}
                 defaultPath={__('lbry-transactions-history')}
               />
+              {!slim && (
+                <FormField
+                  type="select"
+                  value={filterSetting || TRANSACTIONS.ALL}
+                  onChange={this.handleFilterChanged}
+                  affixClass="form-field--align-center"
+                  prefix={__('Show')}
+                  postfix={
+                    <Button
+                      button="link"
+                      icon={icons.HELP}
+                      href="https://lbry.io/faq/transaction-types"
+                      title={__('Help')}
+                    />
+                  }
+                >
+                  {transactionTypes.map(tt => (
+                    <option key={tt} value={tt}>
+                      {__(`${this.capitalize(tt)}`)}
+                    </option>
+                  ))}
+                </FormField>
+              )}
             </div>
           )}
-        {!slim && (
-          <div className="card__actions-top-corner">
-            <FormField
-              type="select"
-              value={filterSetting || TRANSACTIONS.ALL}
-              onChange={this.handleFilterChanged}
-              affixClass="form-field--align-center"
-              prefix={__('Show')}
-              postfix={
-                <Button
-                  button="link"
-                  icon={icons.HELP}
-                  href="https://lbry.io/faq/transaction-types"
-                  title={__('Help')}
-                />
-              }
-            >
-              {transactionTypes.map(tt => (
-                <option key={tt} value={tt}>
-                  {__(`${this.capitalize(tt)}`)}
-                </option>
-              ))}
-            </FormField>
-          </div>
-        )}
         {!!transactionList.length && (
           <table className="card__content table table--transactions table--stretch">
             <thead>

src/renderer/component/transactionListRecent/index.js

@@ -4,6 +4,7 @@ import {
   selectRecentTransactions,
   selectHasTransactions,
   selectIsFetchingTransactions,
+  doFetchClaimListMine,
 } from 'lbry-redux';
 import TransactionListRecent from './view';
 
@@ -15,6 +16,7 @@ const select = state => ({
 
 const perform = dispatch => ({
   fetchTransactions: () => dispatch(doFetchTransactions()),
+  fetchMyClaims: () => dispatch(doFetchClaimListMine()),
 });
 
 export default connect(

src/renderer/component/transactionListRecent/view.jsx

@@ -1,54 +1,62 @@
 // @flow
-import React from 'react';
+import type { Transaction } from 'component/transactionList/view';
+import React, { Fragment } from 'react';
 import BusyIndicator from 'component/common/busy-indicator';
 import Button from 'component/button';
 import TransactionList from 'component/transactionList';
 import * as icons from 'constants/icons';
-import type { Transaction } from 'component/transactionList/view';
+import RefreshTransactionButton from 'component/transactionRefreshButton';
 
 type Props = {
   fetchTransactions: () => void,
   fetchingTransactions: boolean,
   hasTransactions: boolean,
   transactions: Array<Transaction>,
+  fetchMyClaims: () => void,
 };
 
 class TransactionListRecent extends React.PureComponent<Props> {
   componentDidMount() {
-    this.props.fetchTransactions();
+    const { fetchMyClaims, fetchTransactions } = this.props;
+
+    fetchMyClaims();
+    fetchTransactions();
   }
 
   render() {
     const { fetchingTransactions, hasTransactions, transactions } = this.props;
-
     return (
       <section className="card card--section">
-        <div className="card__title">{__('Recent Transactions')}</div>
+        <div className="card__title card--space-between">
+          {__('Recent Transactions')}
+          <RefreshTransactionButton />
+        </div>
         <div className="card__subtitle">
           {__('To view all of your transactions, navigate to the')}{' '}
           <Button button="link" navigate="/history" label={__('transactions page')} />.
         </div>
-        {fetchingTransactions && (
+        {fetchingTransactions &&
-          <div className="card__content">
+          !hasTransactions && (
-            <BusyIndicator message={__('Loading transactions')} />
+            <div className="card__content">
-          </div>
+              <BusyIndicator message={__('Loading transactions')} />
-        )}
+            </div>
-        {!fetchingTransactions && (
+          )}
-          <TransactionList
-            slim
-            transactions={transactions}
-            emptyMessage={__("Looks like you don't have any recent transactions.")}
-          />
-        )}
         {hasTransactions && (
-          <div className="card__actions">
+          <Fragment>
-            <Button
+            <TransactionList
-              button="primary"
+              slim
-              navigate="/history"
+              transactions={transactions}
-              label={__('Full History')}
+              emptyMessage={__("Looks like you don't have any recent transactions.")}
-              icon={icons.CLOCK}
             />
-          </div>
+            <div className="card__actions">
+              <Button
+                button="primary"
+                navigate="/history"
+                label={__('Full History')}
+                icon={icons.CLOCK}
+              />
+            </div>
+          </Fragment>
         )}
       </section>
     );

src/renderer/component/transactionRefreshButton/index.js

@@ -0,0 +1,16 @@
+import { connect } from 'react-redux';
+import { doFetchTransactions, selectIsFetchingTransactions } from 'lbry-redux';
+import RefreshTransactionButton from './view';
+
+const select = state => ({
+  fetchingTransactions: selectIsFetchingTransactions(state),
+});
+
+const perform = dispatch => ({
+  fetchTransactions: () => dispatch(doFetchTransactions()),
+});
+
+export default connect(
+  select,
+  perform
+)(RefreshTransactionButton);

src/renderer/component/transactionRefreshButton/view.jsx

@@ -0,0 +1,51 @@
+// @flow
+import React, { PureComponent } from 'react';
+import Button from 'component/button';
+
+type Props = {
+  fetchTransactions: () => void,
+  fetchingTransactions: boolean,
+};
+
+type State = {
+  label: string,
+  disabled: boolean,
+};
+
+class TransactionListRecent extends PureComponent<Props, State> {
+  constructor() {
+    super();
+
+    this.state = { label: __('Refresh'), disabled: false };
+
+    (this: any).handleClick = this.handleClick.bind(this);
+  }
+
+  handleClick() {
+    const { fetchTransactions } = this.props;
+
+    // The fetchTransactions call will be super fast most of the time.
+    // Instead of showing a loading spinner for 100ms, change the label and show as "Refreshed!"
+    fetchTransactions();
+    this.setState({ label: __('Refreshed!'), disabled: true });
+
+    setTimeout(() => {
+      this.setState({ label: __('Refresh'), disabled: false });
+    }, 2000);
+  }
+
+  render() {
+    const { fetchingTransactions } = this.props;
+    const { label, disabled } = this.state;
+    return (
+      <Button
+        button="inverse"
+        label={label}
+        onClick={this.handleClick}
+        disabled={disabled || fetchingTransactions}
+      />
+    );
+  }
+}
+
+export default TransactionListRecent;

src/renderer/page/getCredits/view.jsx

@@ -1,13 +1,18 @@
 import React from 'react';
 import Button from 'component/button';
 import RewardSummary from 'component/rewardSummary';
-import ShapeShift from 'component/shapeShift';
+// import ShapeShift from 'component/shapeShift';
 import Page from 'component/page';
 
 const GetCreditsPage = () => (
   <Page>
     <RewardSummary />
-    <ShapeShift />
+    {/*
+      Removing Shapeshift after they switched to user accounts
+      Ideally most of the redux logic should be able to be re-used if we switch to another company
+      Or find a way to use ShapShift with an account?
+      <ShapeShift />
+    */}
     <section className="card card--section">
       <div className="card__title">{__('More ways to get LBRY Credits')}</div>
       <div className="card__content">

src/renderer/page/transactionHistory/index.js

@@ -3,6 +3,7 @@ import {
   doFetchTransactions,
   selectTransactionItems,
   selectIsFetchingTransactions,
+  doFetchClaimListMine,
 } from 'lbry-redux';
 import TransactionHistoryPage from './view';
 
@@ -13,6 +14,7 @@ const select = state => ({
 
 const perform = dispatch => ({
   fetchTransactions: () => dispatch(doFetchTransactions()),
+  fetchMyClaims: () => dispatch(doFetchClaimListMine()),
 });
 
 export default connect(

src/renderer/page/transactionHistory/view.jsx

@@ -1,11 +1,23 @@
+// @flow
 import React from 'react';
 import BusyIndicator from 'component/common/busy-indicator';
 import TransactionList from 'component/transactionList';
 import Page from 'component/page';
+import RefreshTransactionButton from 'component/transactionRefreshButton';
 
-class TransactionHistoryPage extends React.PureComponent {
+type Props = {
-  componentWillMount() {
+  fetchMyClaims: () => void,
-    this.props.fetchTransactions();
+  fetchTransactions: () => void,
+  fetchingTransactions: boolean,
+  transactions: Array<{}>,
+};
+
+class TransactionHistoryPage extends React.PureComponent<Props> {
+  componentDidMount() {
+    const { fetchMyClaims, fetchTransactions } = this.props;
+
+    fetchMyClaims();
+    fetchTransactions();
   }
 
   render() {
@@ -14,12 +26,9 @@ class TransactionHistoryPage extends React.PureComponent {
     return (
       <Page>
         <section className="card card--section">
-          <div
+          <div className="card__title card--space-between">
-            className={`card__title ${
+            {__('Transaction History')}
-              fetchingTransactions && transactions.length ? 'reloading' : ''
+            <RefreshTransactionButton />
-            }`}
-          >
-            <h3>{__('Transaction History')}</h3>
           </div>
           {fetchingTransactions && !transactions.length ? (
             <div className="card__content">

src/renderer/redux/actions/publish.js

@@ -22,7 +22,7 @@ import { selectosNotificationsEnabled } from 'redux/selectors/settings';
 import { doNavigate } from 'redux/actions/navigation';
 import fs from 'fs';
 import path from 'path';
-import { CC_LICENSES, COPYRIGHT, OTHER } from 'constants/licenses';
+import { CC_LICENSES, COPYRIGHT, OTHER, NONE, PUBLIC_DOMAIN } from 'constants/licenses';
 
 type Action = UpdatePublishFormAction | { type: ACTIONS.CLEAR_PUBLISH };
 
@@ -179,8 +179,11 @@ export const doPrepareEdit = (claim: any, uri: string) => (dispatch: Dispatch<Ac
   };
 
   // Make sure custom liscence's are mapped properly
+  // If the license isn't one of the standard licenses, map the custom license and description/url
   if (!CC_LICENSES.some(({ value }) => value === license)) {
-    if (!licenseUrl) {
+    if (!license || license === NONE || license === PUBLIC_DOMAIN) {
+      publishData.licenseType = license;
+    } else if (license && !licenseUrl && license !== NONE) {
       publishData.licenseType = COPYRIGHT;
     } else {
       publishData.licenseType = OTHER;
@@ -313,7 +316,6 @@ export const doCheckPendingPublishes = () => (dispatch: Dispatch<Action>, getSta
 
   const checkFileList = () => {
     Lbry.claim_list_mine().then(claims => {
-      console.log('check');
       claims.forEach(claim => {
         // If it's confirmed, check if it was pending previously
         if (claim.confirmations > 0 && pendingById[claim.claim_id]) {

src/renderer/scss/_gui.scss

@@ -302,7 +302,7 @@ p:not(:first-of-type) {
 }
 
 .meta {
-  color: $lbry-gray-1;
+  color: $lbry-gray-5;
   font-size: 0.8em;
 }
 

src/renderer/scss/component/_button.scss

@@ -153,6 +153,7 @@
     font-size: 1em;
     min-width: 0;
     text-align: left;
+    transition: none;
   }
 
   &.btn--no-style {

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

@@ -1,5 +1,6 @@
 .markdown-preview {
   margin: 0;
+  word-break: break-all;
 
   // Headers
   h1,

src/renderer/scss/themes/_dark.scss

@@ -96,10 +96,16 @@ html[data-theme='dark'] {
     }
   }
 
+  //
+  // SEARCH
+  //
   .search__top {
     background-color: rgba($lbry-white, 0.15);
   }
 
+  //
+  // TABLE
+  //
   table.table,
   .markdown-preview table {
     thead {
@@ -117,10 +123,18 @@ html[data-theme='dark'] {
     }
   }
 
+  //
+  // ITEM LIST
+  //
   .item-list {
     background-color: rgba($lbry-white, 0.1);
   }
 
+  .item-list__item--selected {
+    background-color: $lbry-black;
+    color: $lbry-white;
+  }
+
   .item-list__item:not(:last-of-type) {
     border-bottom: 1px solid rgba($lbry-gray-1, 0.1);
   }

yarn.lock

@@ -5670,9 +5670,9 @@ lbry-redux@lbryio/lbry-redux#2375860d6269d0369418879c2531b1d48c4e47f2:
     proxy-polyfill "0.1.6"
     reselect "^3.0.0"
 
-lbry-redux@lbryio/lbry-redux#aa10240bc1e90dff299821e31a88edcb4c5fd295:
+lbry-redux@lbryio/lbry-redux#6139cede26a5c17a8ecfc8a5c0445568ee686255:
   version "0.0.1"
-  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/aa10240bc1e90dff299821e31a88edcb4c5fd295"
+  resolved "https://codeload.github.com/lbryio/lbry-redux/tar.gz/6139cede26a5c17a8ecfc8a5c0445568ee686255"
   dependencies:
     proxy-polyfill "0.1.6"
     reselect "^3.0.0"