04b510d88b
Also made visual changes for the new Settings Page. ## SyncToggle: It will no longer be under a dedicated Card, so the "Sync" title is not there to give context for the case of "no verified email". Changed it such that the checkbox is always visible (it's label is self-explanatory) but disable when email is not set. The "Add Email" button will then appear below, so everything now makes sense in context.
55 lines
1.5 KiB
JavaScript
55 lines
1.5 KiB
JavaScript
// @flow
|
|
import React from 'react';
|
|
import Card from 'component/common/card';
|
|
import SettingAccountPassword from 'component/settingAccountPassword';
|
|
import SyncToggle from 'component/syncToggle';
|
|
import { getPasswordFromCookie } from 'util/saved-passwords';
|
|
|
|
type Props = {
|
|
// --- select ---
|
|
isAuthenticated: boolean,
|
|
walletEncrypted: boolean,
|
|
// --- perform ---
|
|
doWalletStatus: () => void,
|
|
};
|
|
|
|
export default function SettingAccount(props: Props) {
|
|
const { isAuthenticated, walletEncrypted, doWalletStatus } = props;
|
|
const [storedPassword, setStoredPassword] = React.useState(false);
|
|
|
|
// Determine if password is stored.
|
|
React.useEffect(() => {
|
|
if (isAuthenticated || !IS_WEB) {
|
|
doWalletStatus();
|
|
getPasswordFromCookie().then((p) => {
|
|
if (typeof p === 'string') {
|
|
setStoredPassword(true);
|
|
}
|
|
});
|
|
}
|
|
// enterSettings(); @KP need to do this at each component, or just at Settings Page?
|
|
}, []); // eslint-disable-line react-hooks/exhaustive-deps
|
|
|
|
return (
|
|
<Card
|
|
title={__('Account')}
|
|
subtitle=""
|
|
isBodyList
|
|
body={
|
|
<>
|
|
{isAuthenticated && (
|
|
<div className="card__main-actions">
|
|
<SettingAccountPassword />
|
|
</div>
|
|
)}
|
|
|
|
{/* @if TARGET='app' */}
|
|
<div className="card__main-actions">
|
|
<SyncToggle disabled={walletEncrypted && !storedPassword && storedPassword !== ''} />
|
|
</div>
|
|
{/* @endif */}
|
|
</>
|
|
}
|
|
/>
|
|
);
|
|
}
|