Implements ChannelCreatePage
This commit is contained in:
parent
143f17feb7
commit
ecd0055459
2 changed files with 68 additions and 0 deletions
9
ui/page/channelCreate/index.js
Normal file
9
ui/page/channelCreate/index.js
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
import { connect } from 'react-redux';
|
||||||
|
import { selectBalance } from 'lbry-redux';
|
||||||
|
import ChannelCreatePage from './view';
|
||||||
|
|
||||||
|
const select = state => ({
|
||||||
|
balance: selectBalance(state),
|
||||||
|
});
|
||||||
|
|
||||||
|
export default connect(select, null)(ChannelCreatePage);
|
59
ui/page/channelCreate/view.jsx
Normal file
59
ui/page/channelCreate/view.jsx
Normal file
|
@ -0,0 +1,59 @@
|
||||||
|
// @flow
|
||||||
|
import React, { Fragment } from 'react';
|
||||||
|
import ChannelForm from 'component/channelForm';
|
||||||
|
import * as PAGES from 'constants/pages';
|
||||||
|
import Page from 'component/page';
|
||||||
|
import Yrbl from 'component/yrbl';
|
||||||
|
import LbcSymbol from 'component/common/lbc-symbol';
|
||||||
|
import { useHistory } from 'react-router-dom';
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
balance: number,
|
||||||
|
};
|
||||||
|
|
||||||
|
function ChannelCreatePage(props: Props) {
|
||||||
|
const { balance } = props;
|
||||||
|
|
||||||
|
function scrollToTop() {
|
||||||
|
const mainContent = document.querySelector('main');
|
||||||
|
if (mainContent) {
|
||||||
|
mainContent.scrollTop = 0; // It would be nice to animate this
|
||||||
|
}
|
||||||
|
}
|
||||||
|
let history = useHistory();
|
||||||
|
const returnToChannelList = () => history.push(`/$/${PAGES.CHANNELS}`);
|
||||||
|
return (
|
||||||
|
<Page>
|
||||||
|
{balance === 0 && (
|
||||||
|
<Fragment>
|
||||||
|
<Yrbl
|
||||||
|
title={__("You can't publish things quite yet")}
|
||||||
|
subtitle={
|
||||||
|
<Fragment>
|
||||||
|
<p>
|
||||||
|
{__(
|
||||||
|
'LBRY uses a blockchain, which is a fancy way of saying that users (you) are in control of your data.'
|
||||||
|
)}
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
{__('Because of the blockchain, some actions require LBRY credits')} (
|
||||||
|
<LbcSymbol />
|
||||||
|
).
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
<LbcSymbol />{' '}
|
||||||
|
{__(
|
||||||
|
'allows you to do some neat things, like paying your favorite creators for their content. And no company can stop you.'
|
||||||
|
)}
|
||||||
|
</p>
|
||||||
|
</Fragment>
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
</Fragment>
|
||||||
|
)}
|
||||||
|
<ChannelForm scrollToTop={scrollToTop} disabled={balance === 0} onSuccess={returnToChannelList} />
|
||||||
|
</Page>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ChannelCreatePage;
|
Loading…
Add table
Reference in a new issue