lbry-desktop/ui/component/yrblWalletEmpty/view.jsx

54 lines
1.7 KiB
JavaScript

// @flow
import type { Node } from 'react';
import * as MODALS from 'constants/modal_types';
import * as ICONS from 'constants/icons';
import * as PAGES from 'constants/pages';
import React from 'react';
import Button from 'component/button';
import Yrbl from 'component/yrbl';
type Props = {
includeWalletLink: boolean,
type?: string,
actions?: Node,
doOpenModal: string => void,
};
export default function YrblHelp(props: Props) {
const { includeWalletLink = false, type = 'sad', doOpenModal } = props;
return (
<div className="main--empty">
<Yrbl
type={type}
title={__('Your wallet is empty')}
subtitle={
<div>
<p>{__('You need LBC to create a channel and upload content.')}</p>
<p>
{__(
'Never fear though, there are tons of ways to earn LBC! You can earn or purchase LBC, or you can have your friends send you some.'
)}
</p>
<div className="section__actions">
<Button
button="primary"
icon={ICONS.REWARDS}
label={__('Earn Rewards')}
navigate={`/$/${PAGES.REWARDS}`}
/>
<Button button="secondary" icon={ICONS.BUY} label={__('Buy Credits')} navigate={`/$/${PAGES.BUY}`} />
{includeWalletLink && (
<Button
icon={ICONS.RECEIVE}
button="secondary"
label={__('Your Address')}
onClick={() => doOpenModal(MODALS.WALLET_RECEIVE)}
/>
)}
</div>
</div>
}
/>
</div>
);
}