lbry-desktop/ui/page/creatorDashboard/view.jsx
jessopb ca0cd2ca75
Use 'selectHasChannel' instead of the full 'selectMyChannelClaims' (#7427)
- selectMyChannelClaims depends on `byId`, which currently is always invalidated per update, so it is not memoized.

- Most of the use-cases just needs the ID or the length of the array anyways, so avoid generating a Claim array (in selectMyChannelClaims) unnecessarily -- the client need to reduce it back down to IDs again :/

- The simpler boolean also removes the need to memoize the selector, which saves a bit of memory.

Co-authored-by: infinite-persistence <inf.persistence@gmail.com>
2022-01-21 12:38:11 -05:00

48 lines
1.3 KiB
JavaScript

// @flow
import * as PAGES from 'constants/pages';
import React from 'react';
import Page from 'component/page';
import Spinner from 'component/spinner';
import Button from 'component/button';
import CreatorAnalytics from 'component/creatorAnalytics';
import ChannelSelector from 'component/channelSelector';
import Yrbl from 'component/yrbl';
type Props = {
hasChannels: boolean,
fetchingChannels: boolean,
activeChannelClaim: ?ChannelClaim,
};
export default function CreatorDashboardPage(props: Props) {
const { hasChannels, fetchingChannels, activeChannelClaim } = props;
return (
<Page>
{fetchingChannels && (
<div className="main--empty">
<Spinner delayed />
</div>
)}
{!fetchingChannels && !hasChannels && (
<Yrbl
type="happy"
title={__("You haven't created a channel yet, let's fix that!")}
actions={
<div className="section__actions">
<Button button="primary" navigate={`/$/${PAGES.CHANNEL_NEW}`} label={__('Create A Channel')} />
</div>
}
/>
)}
{!fetchingChannels && activeChannelClaim && (
<React.Fragment>
<ChannelSelector hideAnon />
<CreatorAnalytics uri={activeChannelClaim.canonical_url} />
</React.Fragment>
)}
</Page>
);
}