fix: encryption status title (#643)

* fix: encryption status title

* fix: derive encryption status directly from appState and application

* Update app/assets/javascripts/preferences/panes/Encryption.tsx

Co-authored-by: Mo Bitar <mo@standardnotes.org>

Co-authored-by: Mo Bitar <mo@standardnotes.org>
This commit is contained in:
Gorjan Petrovski
2021-09-22 17:23:15 +02:00
committed by GitHub
parent 30deea79b2
commit 52ddb49bd7
2 changed files with 18 additions and 6 deletions

View File

@@ -1,5 +1,6 @@
import { DecoratedInput } from "@/components/DecoratedInput";
import { Icon } from "@/components/Icon";
import { STRING_E2E_ENABLED, STRING_ENC_NOT_ENABLED, STRING_LOCAL_ENC_ENABLED } from "@/strings";
import { AppState } from "@/ui_models/app_state";
import { observer } from "mobx-react-lite";
import { FunctionComponent } from "preact";
@@ -35,14 +36,25 @@ const EncryptionEnabled: FunctionComponent<{ appState: AppState }> = observer(({
);
});
export const EndToEndEncryption: FunctionComponent<{ appState: AppState }> = observer(({ appState }) => {
export const Encryption: FunctionComponent<{ appState: AppState }> = observer(({ appState }) => {
const app = appState.application;
const hasUser = app.hasAccount();
const hasPasscode = app.hasPasscode();
const isEncryptionEnabled = app.isEncryptionAvailable();
const encryptionStatusString = hasUser
? STRING_E2E_ENABLED
: hasPasscode
? STRING_LOCAL_ENC_ENABLED
: STRING_ENC_NOT_ENABLED;
return (
<PreferencesGroup>
<PreferencesSegment>
<Title>End-to-end encryption</Title>
<Text>{appState.accountMenu.encryptionStatusString}</Text>
<Title>Encryption</Title>
<Text>{encryptionStatusString}</Text>
{appState.accountMenu.isEncryptionEnabled &&
{isEncryptionEnabled &&
<EncryptionEnabled appState={appState} />}
</PreferencesSegment>
</PreferencesGroup>

View File

@@ -1,7 +1,7 @@
import { AppState } from '@/ui_models/app_state';
import { FunctionComponent } from 'preact';
import { PreferencesPane } from '../components';
import { EndToEndEncryption } from './EndToEndEncryption';
import { Encryption } from './Encryption';
import { TwoFactorAuthWrapper } from './two-factor-auth';
import { MfaProps } from './two-factor-auth/MfaProps';
@@ -11,7 +11,7 @@ interface SecurityProps extends MfaProps {
export const Security: FunctionComponent<SecurityProps> = (props) => (
<PreferencesPane>
<EndToEndEncryption appState={props.appState} />
<Encryption appState={props.appState} />
<TwoFactorAuthWrapper
mfaProvider={props.mfaProvider}
userProvider={props.userProvider}