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

41 lines
1.3 KiB
JavaScript

// @flow
import * as MODALS from 'constants/modal_types';
import React from 'react';
import SettingsRow from 'component/settingsRow';
import { withRouter } from 'react-router';
import { FormField } from 'component/common/form';
type Props = {
setSyncEnabled: (boolean) => void,
syncEnabled: boolean,
history: { push: (string) => void },
location: UrlLocation,
getSyncError: ?string,
disabled: boolean,
openModal: (string, any) => void,
};
function SyncToggle(props: Props) {
// Redesign for new sync system
const { openModal, syncEnabled, disabled } = props;
return (
<SettingsRow title={__('Sync')} subtitle={disabled ? '' : __('Sync your balance and preferences across devices.')}>
<FormField
type="checkbox"
name="sync_toggle"
label={disabled ? __('Sync your balance and preferences across devices.') : undefined}
checked={syncEnabled}
onChange={() => openModal(MODALS.SYNC_ENABLE, { mode: syncEnabled ? 'disable' : 'enable' })}
disabled={disabled}
helper={
disabled
? __("To enable Sync, close LBRY completely and check 'Remember Password' during wallet unlock.")
: null
}
/>
</SettingsRow>
);
}
export default withRouter(SyncToggle);