2019-06-28 09:27:55 +02:00
|
|
|
// @flow
|
2020-08-26 18:24:07 +02:00
|
|
|
import React from 'react';
|
2017-12-21 22:08:54 +01:00
|
|
|
import PublishForm from 'component/publishForm';
|
2018-03-26 23:32:43 +02:00
|
|
|
import Page from 'component/page';
|
2020-08-26 19:19:03 +02:00
|
|
|
import YrblWalletEmpty from 'component/yrblWalletEmpty';
|
2021-02-11 06:12:41 +01:00
|
|
|
import Spinner from 'component/spinner';
|
2016-11-22 21:19:08 +01:00
|
|
|
|
2019-06-28 09:27:55 +02:00
|
|
|
type Props = {
|
|
|
|
balance: number,
|
2021-02-11 06:12:41 +01:00
|
|
|
fetchingChannels: boolean,
|
2019-06-28 09:27:55 +02:00
|
|
|
};
|
|
|
|
|
|
|
|
function PublishPage(props: Props) {
|
2021-02-11 06:12:41 +01:00
|
|
|
const { balance, fetchingChannels } = props;
|
2019-06-28 09:27:55 +02:00
|
|
|
|
|
|
|
function scrollToTop() {
|
2019-04-03 06:17:00 +02:00
|
|
|
const mainContent = document.querySelector('main');
|
2018-03-26 23:32:43 +02:00
|
|
|
if (mainContent) {
|
2021-02-01 19:31:15 +01:00
|
|
|
// $FlowFixMe
|
2021-01-26 02:21:32 +01:00
|
|
|
mainContent.scrollTo({
|
|
|
|
top: 0,
|
|
|
|
behavior: 'smooth',
|
|
|
|
});
|
2018-03-26 23:32:43 +02:00
|
|
|
}
|
|
|
|
}
|
2019-06-28 09:27:55 +02:00
|
|
|
|
|
|
|
return (
|
2020-09-16 21:36:01 +02:00
|
|
|
<Page
|
|
|
|
noFooter
|
|
|
|
noSideNavigation
|
|
|
|
backout={{
|
|
|
|
title: __('Upload'),
|
|
|
|
backLabel: __('Back'),
|
|
|
|
}}
|
|
|
|
>
|
2020-08-26 19:19:03 +02:00
|
|
|
{balance === 0 && <YrblWalletEmpty />}
|
2021-02-11 06:12:41 +01:00
|
|
|
{balance !== 0 && fetchingChannels ? (
|
|
|
|
<div className="main--empty">
|
|
|
|
<Spinner />
|
|
|
|
</div>
|
|
|
|
) : (
|
|
|
|
<PublishForm scrollToTop={scrollToTop} disabled={balance === 0} />
|
|
|
|
)}
|
2019-06-28 09:27:55 +02:00
|
|
|
</Page>
|
|
|
|
);
|
2018-03-26 23:32:43 +02:00
|
|
|
}
|
2017-06-17 19:59:18 +02:00
|
|
|
|
2016-11-22 21:19:08 +01:00
|
|
|
export default PublishPage;
|