Update 'SyncToggle' to the new Settings style.

This commit is contained in:
infinite-persistence 2021-08-23 14:50:25 +08:00
parent 3057f70c1c
commit 2e3d9cb609
No known key found for this signature in database
GPG key ID: B9C3252EDC3D0AA0
2 changed files with 8 additions and 6 deletions

View file

@ -58,9 +58,7 @@ export default function SettingAccount(props: Props) {
)}
{/* @if TARGET='app' */}
<div className="card__main-actions">
<SyncToggle disabled={walletEncrypted && !storedPassword && storedPassword !== ''} />
</div>
<SyncToggle disabled={walletEncrypted && !storedPassword && storedPassword !== ''} />
{/* @endif */}
{/* @if TARGET='web' */}

View file

@ -2,6 +2,7 @@
import * as MODALS from 'constants/modal_types';
import React from 'react';
import Button from 'component/button';
import SettingsRow from 'component/settingsRow';
import { withRouter } from 'react-router';
import { FormField } from 'component/common/form';
@ -20,11 +21,14 @@ function SyncToggle(props: Props) {
const { verifiedEmail, openModal, syncEnabled, disabled } = props;
return (
<div>
<SettingsRow
title={__('Sync')}
subtitle={disabled || !verifiedEmail ? '' : __('Sync your balance and preferences across devices.')}
>
<FormField
type="checkbox"
name="sync_toggle"
label={__('Sync your balance and preferences across devices.')}
label={disabled || !verifiedEmail ? __('Sync your balance and preferences across devices.') : undefined}
checked={syncEnabled && verifiedEmail}
onChange={() => openModal(MODALS.SYNC_ENABLE, { mode: syncEnabled ? 'disable' : 'enable' })}
disabled={disabled || !verifiedEmail}
@ -40,7 +44,7 @@ function SyncToggle(props: Props) {
<Button requiresAuth button="primary" label={__('Add Email')} />
</div>
)}
</div>
</SettingsRow>
);
}