improve flow when a user has no channels/no publishes on a channel

ui/component/channelCreate/index.js

@@ -1,16 +1,15 @@
 import { connect } from 'react-redux';
 import ChannelCreate from './view';
-import { selectBalance, doCreateChannel } from 'lbry-redux';
+import { selectBalance, doCreateChannel, selectCreatingChannel, selectCreateChannelError } from 'lbry-redux';
 
 const select = state => ({
   balance: selectBalance(state),
+  creatingChannel: selectCreatingChannel(state),
+  createChannelError: selectCreateChannelError(state),
 });
 
 const perform = dispatch => ({
   createChannel: (name, amount) => dispatch(doCreateChannel(name, amount)),
 });
 
-export default connect(
+export default connect(select, perform)(ChannelCreate);
-  select,
-  perform
-)(ChannelCreate);

ui/component/channelCreate/view.jsx

@@ -11,15 +11,15 @@ type Props = {
   balance: number,
   createChannel: (string, number) => Promise<any>,
   onSuccess?: ({}) => void,
+  creatingChannel: boolean,
+  createChannelError: ?string,
 };
 
 type State = {
   newChannelName: string,
   newChannelBid: number,
-  creatingChannel: boolean,
   newChannelNameError: string,
   newChannelBidError: string,
-  createChannelError: ?string,
 };
 
 class ChannelCreate extends React.PureComponent<Props, State> {
@@ -29,10 +29,8 @@ class ChannelCreate extends React.PureComponent<Props, State> {
     this.state = {
       newChannelName: '',
       newChannelBid: 0.01,
-      creatingChannel: false,
       newChannelNameError: '',
       newChannelBidError: '',
-      createChannelError: undefined,
     };
 
     (this: any).handleNewChannelNameChange = this.handleNewChannelNameChange.bind(this);
@@ -78,24 +76,12 @@ class ChannelCreate extends React.PureComponent<Props, State> {
   }
 
   handleCreateChannel() {
-    const { balance, createChannel, onSuccess } = this.props;
+    const { createChannel, onSuccess } = this.props;
     const { newChannelBid, newChannelName } = this.state;
 
     const channelName = `@${newChannelName.trim()}`;
 
-    if (newChannelBid > balance) {
-      return;
-    }
-
-    this.setState({
-      creatingChannel: true,
-      createChannelError: undefined,
-    });
-
     const success = channelClaim => {
-      this.setState({
-        creatingChannel: false,
-      });
       analytics.apiLogPublish(channelClaim);
 
       if (onSuccess !== undefined) {
@@ -103,25 +89,12 @@ class ChannelCreate extends React.PureComponent<Props, State> {
       }
     };
 
-    const failure = () => {
+    createChannel(channelName, newChannelBid).then(success);
-      this.setState({
-        creatingChannel: false,
-        createChannelError: __('Unable to create channel due to an internal error.'),
-      });
-    };
-
-    createChannel(channelName, newChannelBid).then(success, failure);
   }
 
   render() {
-    const {
+    const { newChannelName, newChannelNameError, newChannelBid, newChannelBidError } = this.state;
-      newChannelName,
+    const { creatingChannel, createChannelError } = this.props;
-      newChannelNameError,
-      newChannelBid,
-      newChannelBidError,
-      creatingChannel,
-      createChannelError,
-    } = this.state;
 
     return (
       <Form onSubmit={this.handleCreateChannel}>

ui/component/creatorAnalytics/view.jsx

@@ -36,7 +36,7 @@ export default function CreatorAnalytics(props: Props) {
 
   const channelForEffect = JSON.stringify(claim);
   React.useEffect(() => {
-    if (claimId && channelForEffect) {
+    if (claimId && channelForEffect && channelHasClaims) {
       setFetchingStats(true);
       Lbryio.call('reports', 'content', { claim_id: claimId })
         .then(res => {
@@ -55,7 +55,7 @@ export default function CreatorAnalytics(props: Props) {
           setFetchingStats(false);
         });
     }
-  }, [claimId, channelForEffect, setFetchingStats, setStats]);
+  }, [claimId, channelForEffect, channelHasClaims, setFetchingStats, setStats]);
 
   return (
     <React.Fragment>
@@ -174,7 +174,7 @@ export default function CreatorAnalytics(props: Props) {
               body={
                 <React.Fragment>
                   <div className="card--inline">
-                    <ClaimPreview uri={stats.VideoViewsTopNew} />
+                    <ClaimPreview uri={stats.VideoURITopNew} />
                   </div>
                   <div className="section__subtitle card__data-subtitle">
                     <span>