fix multiple channels analytics bug

ui/component/channelSelector/index.js

@@ -1,10 +1,11 @@
 import { connect } from 'react-redux';
-import { selectMyChannelClaims } from 'lbry-redux';
+import { selectMyChannelClaims, makeSelectClaimForUri } from 'lbry-redux';
 import { selectActiveChannelClaim, selectIncognito } from 'redux/selectors/app';
 import { doSetActiveChannel, doSetIncognito } from 'redux/actions/app';
 import SelectChannel from './view';
 
-const select = state => ({
+const select = (state, props) => ({
+  claim: makeSelectClaimForUri(props.uri)(state),
   channels: selectMyChannelClaims(state),
   activeChannelClaim: selectActiveChannelClaim(state),
   incognito: selectIncognito(state),

ui/component/channelSelector/view.jsx

@@ -10,6 +10,8 @@ import Icon from 'component/common/icon';
 import { useHistory } from 'react-router';
 
 type Props = {
+  uri: string,
+  claim: ?Claim,
   selectedChannelUrl: string, // currently selected channel
   channels: ?Array<ChannelClaim>,
   onChannelSelect: (url: string) => void,
@@ -18,6 +20,8 @@ type Props = {
   doSetActiveChannel: (string) => void,
   incognito: boolean,
   doSetIncognito: (boolean) => void,
+  activeChanged: boolean,
+  setActiveChanged: (boolean) => void,
 };
 
 type ListItemProps = {
@@ -52,15 +56,19 @@ function IncognitoSelector(props: IncognitoSelectorProps) {
 }
 
 function ChannelSelector(props: Props) {
-  const { channels, activeChannelClaim, doSetActiveChannel, hideAnon = false, incognito, doSetIncognito } = props;
+  const { claim, channels, activeChannelClaim, doSetActiveChannel, hideAnon = false, incognito, doSetIncognito, activeChanged, setActiveChanged } = props;
   const {
     push,
     location: { pathname },
   } = useHistory();
+  const selectedClaimId = claim && claim.claim_id;
+  if (selectedClaimId && !activeChanged) doSetActiveChannel(selectedClaimId);
+
   const activeChannelUrl = activeChannelClaim && activeChannelClaim.permanent_url;
 
   function handleChannelSelect(channelClaim) {
     doSetIncognito(false);
+    setActiveChanged(true);
     doSetActiveChannel(channelClaim.claim_id);
   }
 

ui/component/claimMenuList/view.jsx

@@ -79,6 +79,7 @@ function ClaimMenuList(props: Props) {
   } = props;
   const incognito = channelUri && !(channelUri.includes('@'));
   const signingChannel = claim && (claim.signing_channel || claim);
+  const permanentUrl = signingChannel && signingChannel.permanent_url;
   const isChannel = !incognito && signingChannel === claim;
   const showDelete = claimIsMine || (fileInfo && (fileInfo.written_bytes > 0 || fileInfo.blobs_completed > 0));
   const subscriptionLabel = isSubscribed ? __('Unfollow') : __('Follow');
@@ -100,7 +101,6 @@ function ClaimMenuList(props: Props) {
     (claim.value.stream_type === 'audio' || claim.value.stream_type === 'video');
 
   function handleFollow() {
-    const permanentUrl = signingChannel && signingChannel.permanent_url;
     const { channelName } = parseURI(permanentUrl);
     const subscriptionHandler = isSubscribed ? doChannelUnsubscribe : doChannelSubscribe;
 
@@ -112,7 +112,7 @@ function ClaimMenuList(props: Props) {
   }
 
   function handleAnalytics() {
-    push(`/$/${PAGES.CREATOR_DASHBOARD}?channel=${encodeURIComponent(signingChannel.canonical_url)}`);
+    push(`/$/${PAGES.CREATOR_DASHBOARD}?channel=${encodeURIComponent(permanentUrl)}`);
   }
 
   function handleToggleMute() {

ui/page/creatorDashboard/view.jsx

@@ -7,6 +7,7 @@ import Button from 'component/button';
 import CreatorAnalytics from 'component/creatorAnalytics';
 import ChannelSelector from 'component/channelSelector';
 import Yrbl from 'component/yrbl';
+import { useHistory } from 'react-router';
 
 type Props = {
   channels: Array<ChannelClaim>,
@@ -17,6 +18,10 @@ type Props = {
 export default function CreatorDashboardPage(props: Props) {
   const { channels, fetchingChannels, activeChannelClaim } = props;
   const hasChannels = channels && channels.length > 0;
+  const [activeChanged, setActiveChanged] = React.useState(false);
+  const { location: { search } } = useHistory();
+  const urlParams = new URLSearchParams(search);
+  const channelParam = urlParams.get('channel');
 
   return (
     <Page>
@@ -40,8 +45,8 @@ export default function CreatorDashboardPage(props: Props) {
 
       {!fetchingChannels && activeChannelClaim && (
         <React.Fragment>
-          <ChannelSelector hideAnon />
-          <CreatorAnalytics uri={activeChannelClaim.canonical_url} />
+          <ChannelSelector hideAnon uri={channelParam} activeChanged={activeChanged} setActiveChanged={setActiveChanged} />
+          <CreatorAnalytics uri={!activeChanged && channelParam ? channelParam : activeChannelClaim.canonical_url} />
         </React.Fragment>
       )}
     </Page>