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:
@@ -1,5 +1,6 @@
|
|||||||
import { DecoratedInput } from "@/components/DecoratedInput";
|
import { DecoratedInput } from "@/components/DecoratedInput";
|
||||||
import { Icon } from "@/components/Icon";
|
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 { AppState } from "@/ui_models/app_state";
|
||||||
import { observer } from "mobx-react-lite";
|
import { observer } from "mobx-react-lite";
|
||||||
import { FunctionComponent } from "preact";
|
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 (
|
return (
|
||||||
<PreferencesGroup>
|
<PreferencesGroup>
|
||||||
<PreferencesSegment>
|
<PreferencesSegment>
|
||||||
<Title>End-to-end encryption</Title>
|
<Title>Encryption</Title>
|
||||||
<Text>{appState.accountMenu.encryptionStatusString}</Text>
|
<Text>{encryptionStatusString}</Text>
|
||||||
|
|
||||||
{appState.accountMenu.isEncryptionEnabled &&
|
{isEncryptionEnabled &&
|
||||||
<EncryptionEnabled appState={appState} />}
|
<EncryptionEnabled appState={appState} />}
|
||||||
</PreferencesSegment>
|
</PreferencesSegment>
|
||||||
</PreferencesGroup>
|
</PreferencesGroup>
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
import { AppState } from '@/ui_models/app_state';
|
import { AppState } from '@/ui_models/app_state';
|
||||||
import { FunctionComponent } from 'preact';
|
import { FunctionComponent } from 'preact';
|
||||||
import { PreferencesPane } from '../components';
|
import { PreferencesPane } from '../components';
|
||||||
import { EndToEndEncryption } from './EndToEndEncryption';
|
import { Encryption } from './Encryption';
|
||||||
import { TwoFactorAuthWrapper } from './two-factor-auth';
|
import { TwoFactorAuthWrapper } from './two-factor-auth';
|
||||||
import { MfaProps } from './two-factor-auth/MfaProps';
|
import { MfaProps } from './two-factor-auth/MfaProps';
|
||||||
|
|
||||||
@@ -11,7 +11,7 @@ interface SecurityProps extends MfaProps {
|
|||||||
|
|
||||||
export const Security: FunctionComponent<SecurityProps> = (props) => (
|
export const Security: FunctionComponent<SecurityProps> = (props) => (
|
||||||
<PreferencesPane>
|
<PreferencesPane>
|
||||||
<EndToEndEncryption appState={props.appState} />
|
<Encryption appState={props.appState} />
|
||||||
<TwoFactorAuthWrapper
|
<TwoFactorAuthWrapper
|
||||||
mfaProvider={props.mfaProvider}
|
mfaProvider={props.mfaProvider}
|
||||||
userProvider={props.userProvider}
|
userProvider={props.userProvider}
|
||||||
|
|||||||
Reference in New Issue
Block a user