diff --git a/ui/page/channelCreate/index.js b/ui/page/channelCreate/index.js new file mode 100644 index 000000000..9770f416f --- /dev/null +++ b/ui/page/channelCreate/index.js @@ -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); diff --git a/ui/page/channelCreate/view.jsx b/ui/page/channelCreate/view.jsx new file mode 100644 index 000000000..62b6446b2 --- /dev/null +++ b/ui/page/channelCreate/view.jsx @@ -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 ( + + {balance === 0 && ( + + +

+ {__( + 'LBRY uses a blockchain, which is a fancy way of saying that users (you) are in control of your data.' + )} +

+

+ {__('Because of the blockchain, some actions require LBRY credits')} ( + + ). +

+

+ {' '} + {__( + 'allows you to do some neat things, like paying your favorite creators for their content. And no company can stop you.' + )} +

+
+ } + /> + + )} + +
+ ); +} + +export default ChannelCreatePage;