lbry-desktop/ui/component/settingDataHosting/view.jsx
2022-06-01 18:06:59 -04:00

116 lines
3.5 KiB
JavaScript

// @flow
import React from 'react';
import { FormField } from 'component/common/form';
import Button from 'component/button';
import * as DAEMON_SETTINGS from 'constants/daemon_settings';
import { isTrulyANumber } from 'util/number';
import * as ICONS from 'constants/icons';
import * as KEYCODES from 'constants/keycodes';
import { convertGbToMbStr, isValidHostingAmount } from 'util/hosting';
type SetDaemonSettingArg = boolean | string | number;
type DaemonSettings = {
save_blobs: boolean,
};
type Props = {
// --- select ---
daemonSettings: DaemonSettings,
// --- perform ---
setDaemonSetting: (string, ?SetDaemonSettingArg) => void,
cleanBlobs: () => string,
getDaemonStatus: () => void,
isSetting: boolean,
};
function SettingDataHosting(props: Props) {
const { daemonSettings, setDaemonSetting, cleanBlobs, getDaemonStatus, isSetting } = props;
const networkLimitSetting = daemonSettings[DAEMON_SETTINGS.NETWORK_STORAGE_LIMIT_MB] || 0;
const [networkBlobSpaceLimitGB, setNetworkBlobSpaceLimit] = React.useState(
networkLimitSetting ? String(networkLimitSetting / 1024) : 0
);
function handleNetworkLimitChange(gb) {
if (gb === '') {
setNetworkBlobSpaceLimit('');
} else {
const numberGb = Number(gb);
if (isTrulyANumber(numberGb)) {
setNetworkBlobSpaceLimit(gb);
}
}
}
function handleKeyDown(e) {
if (e.keyCode === KEYCODES.ESCAPE) {
e.preventDefault();
setNetworkBlobSpaceLimit(String(networkLimitSetting / 1024));
} else if (e.keyCode === KEYCODES.ENTER) {
e.preventDefault();
handleApply();
}
}
async function handleApply() {
await setDaemonSetting(
DAEMON_SETTINGS.NETWORK_STORAGE_LIMIT_MB,
String(convertGbToMbStr(Number(networkBlobSpaceLimitGB)))
);
await cleanBlobs();
getDaemonStatus();
}
return (
<>
<div className={'fieldset-section'}>
<FormField
name="network_blob_limit_gb"
type="number"
label={__(`Automatic Hosting (GB)`)}
disabled={!daemonSettings.save_blobs || isSetting}
onKeyDown={handleKeyDown}
inputButton={
<>
<Button
disabled={
// disabled if settings are equal or not valid amounts
String(networkLimitSetting) === convertGbToMbStr(networkBlobSpaceLimitGB) ||
!isValidHostingAmount(String(networkBlobSpaceLimitGB)) ||
isSetting ||
!daemonSettings.save_blobs
}
type="button"
button="alt"
onClick={handleApply}
aria-label={__('Apply')}
icon={ICONS.COMPLETE}
/>
<Button
disabled={
// disabled if settings are equal or not valid amounts
String(networkLimitSetting) === convertGbToMbStr(networkBlobSpaceLimitGB) ||
!isValidHostingAmount(String(networkBlobSpaceLimitGB)) ||
isSetting ||
!daemonSettings.save_blobs
}
type="button"
button="alt"
onClick={() => setNetworkBlobSpaceLimit(String(networkLimitSetting / 1024))}
aria-label={__('Reset')}
icon={ICONS.REMOVE}
/>
</>
}
onChange={(e) => handleNetworkLimitChange(e.target.value)}
value={networkBlobSpaceLimitGB}
/>
</div>
</>
);
}
export default SettingDataHosting;