94 lines
3.1 KiB
JavaScript
94 lines
3.1 KiB
JavaScript
// @flow
|
|
import { SETTINGS_GRP } from 'constants/settings';
|
|
import React from 'react';
|
|
import Button from 'component/button';
|
|
import Card from 'component/common/card';
|
|
import SettingDataHosting from 'component/settingDataHosting';
|
|
import SettingViewHosting from 'component/settingViewHosting';
|
|
import SettingSaveBlobs from 'component/settingSaveBlobs';
|
|
import SettingsRow from 'component/settingsRow';
|
|
import AppStorageViz from 'component/appStorageVisualization';
|
|
import Spinner from 'component/spinner';
|
|
import classnames from 'classnames';
|
|
|
|
type DaemonSettings = {
|
|
save_blobs: boolean,
|
|
};
|
|
|
|
type Props = {
|
|
daemonSettings: DaemonSettings,
|
|
isSetting: boolean,
|
|
isWelcome?: boolean,
|
|
cleanBlobs: () => Promise<any>,
|
|
};
|
|
|
|
export default function SettingStorage(props: Props) {
|
|
const { daemonSettings, isSetting, isWelcome, cleanBlobs } = props;
|
|
|
|
const saveBlobs = daemonSettings && daemonSettings.save_blobs;
|
|
const [isCleaning, setCleaning] = React.useState(false);
|
|
|
|
// currently, it seems, blob space statistics are only updated during clean
|
|
React.useEffect(() => {
|
|
setCleaning(true);
|
|
cleanBlobs().then(() => {
|
|
setCleaning(false);
|
|
});
|
|
}, []);
|
|
|
|
return (
|
|
<>
|
|
<div className="card__title-section">
|
|
<h2 className={classnames('card__title', { 'section__title--large': isWelcome })}>
|
|
{isWelcome ? __('Custom Hosting') : __('Hosting')}
|
|
{(isSetting || isCleaning) && <Spinner type={'small'} />}
|
|
</h2>
|
|
</div>
|
|
<Card
|
|
id={SETTINGS_GRP.SYSTEM}
|
|
isBodyList
|
|
body={
|
|
<>
|
|
<SettingsRow
|
|
title={__('Enable Data Hosting')}
|
|
subtitle={
|
|
<React.Fragment>
|
|
{__('Help improve the P2P data network (and make LBRY users happy) by hosting data.')}
|
|
</React.Fragment>
|
|
}
|
|
footer={<AppStorageViz />}
|
|
>
|
|
<SettingSaveBlobs />
|
|
</SettingsRow>
|
|
<SettingsRow
|
|
title={__('Viewed Hosting')}
|
|
multirow
|
|
disabled={!saveBlobs}
|
|
subtitle={
|
|
<React.Fragment>
|
|
{__("View History Hosting lets you choose how much storage to use hosting content you've consumed.")}{' '}
|
|
<Button button="link" label={__('Learn more')} href="https://lbry.com/faq/host-content" />
|
|
</React.Fragment>
|
|
}
|
|
>
|
|
<SettingViewHosting disabled={!saveBlobs} />
|
|
</SettingsRow>
|
|
<SettingsRow
|
|
title={__('Auto Hosting')}
|
|
multirow
|
|
disabled={!saveBlobs}
|
|
subtitle={
|
|
<React.Fragment>
|
|
{__('Automatic Hosting downloads a small portion of content active on the network.')}{' '}
|
|
<Button button="link" label={__('Learn more')} href="https://lbry.com/faq/host-content" />
|
|
</React.Fragment>
|
|
}
|
|
>
|
|
<SettingDataHosting />
|
|
</SettingsRow>
|
|
</>
|
|
}
|
|
/>
|
|
</>
|
|
);
|
|
}
|