michael/cinny
1
0
Fork 0
Code Issues 8 Pull requests Projects Releases Packages Wiki Activity

Fixed more code style

Browse source
This commit is contained in:
Dylan 2022-07-16 23:39:12 +09:30
parent 41ff8db2f5
commit 1ce26a7acc
3 changed files with 46 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/app/organisms/settings/AuthRequest.jsx
View file

@ -2,6 +2,7 @@ import React, { useState } from 'react';
import PropTypes from 'prop-types';
import './AuthRequest.scss';
import { useTranslation } from 'react-i18next';
import initMatrix from '../../../client/initMatrix';
import { openReusableDialog } from '../../../client/action/navigation';
@ -13,7 +14,6 @@ import Spinner from '../../atoms/spinner/Spinner';
import { useStore } from '../../hooks/useStore';
import '../../i18n';
import { useTranslation } from 'react-i18next';
let lastUsedPassword;
const getAuthId = (password) => ({
@ -45,10 +45,10 @@ function AuthRequest({ onComplete, makeRequest }) {
lastUsedPassword = undefined;
if (!mountStore.getItem()) return;
if (err.errcode === 'M_FORBIDDEN') {
setStatus({ error: t("Organisms.AuthRequest.wrong_password") });
setStatus({ error: t('Organisms.AuthRequest.wrong_password') });
return;
}
setStatus({ error: t("Organisms.AuthRequest.request_failed") });
setStatus({ error: t('Organisms.AuthRequest.request_failed') });
}
};
@ -61,14 +61,14 @@ function AuthRequest({ onComplete, makeRequest }) {
<form onSubmit={handleForm}>
<Input
name="password"
label={t("Organisms.AuthRequest.password_label")}
label={t('Organisms.AuthRequest.password_label')}
type="password"
onChange={handleChange}
required
/>
{status.ongoing && <Spinner size="small" />}
{status.error && <Text variant="b3">{status.error}</Text>}
{(status === false || status.error) && <Button variant="primary" type="submit" disabled={!!status.error}>{t("common.continue")}</Button>}
{(status === false || status.error) && <Button variant="primary" type="submit" disabled={!!status.error}>{t('common.continue')}</Button>}
</form>
</div>
);

53
src/app/organisms/settings/CrossSigning.jsx
View file

@ -3,6 +3,7 @@ import React, { useState } from 'react';
import './CrossSigning.scss';
import FileSaver from 'file-saver';
import { Formik } from 'formik';
import { useTranslation } from 'react-i18next';
import { twemojify } from '../../../util/twemojify';
import initMatrix from '../../../client/initMatrix';
@ -19,13 +20,9 @@ import SettingTile from '../../molecules/setting-tile/SettingTile';
import { authRequest } from './AuthRequest';
import { useCrossSigningStatus } from '../../hooks/useCrossSigningStatus';
import '../../i18n';
import { useTranslation } from 'react-i18next';
function CrossSigningSetup() {
const { t } = useTranslation();
const initialValues = { phrase: '', confirmPhrase: '' };
@ -35,13 +32,13 @@ function CrossSigningSetup() {
const renderFailure = (requestClose) => (
<div className="cross-signing__failure">
<Text variant="h1">{twemojify('❌')}</Text>
<Text weight="medium">{t("Organisms.CrossSigning.setup_failed")}</Text>
<Button onClick={requestClose}>{t("common.close")}</Button>
<Text weight="medium">{t('Organisms.CrossSigning.setup_failed')}</Text>
<Button onClick={requestClose}>{t('common.close')}</Button>
</div>
);
openReusableDialog(
<Text variant="s1" weight="medium">{t("Organisms.CrossSigning.setup")}</Text>,
<Text variant="s1" weight="medium">{t('Organisms.CrossSigning.setup')}</Text>,
renderFailure,
);
};
@ -59,13 +56,13 @@ function CrossSigningSetup() {
const renderSecurityKey = () => (
<div className="cross-signing__key">
<Text weight="medium">{t("Organisms.CrossSigning.save_security_key_message")}</Text>
<Text weight="medium">{t('Organisms.CrossSigning.save_security_key_message')}</Text>
<Text className="cross-signing__key-text">
{key.encodedPrivateKey}
</Text>
<div className="cross-signing__key-btn">
<Button variant="primary" onClick={() => copyKey(key)}>{t("common.copy")}</Button>
<Button onClick={() => downloadKey(key)}>{t("common.download")}</Button>
<Button variant="primary" onClick={() => copyKey(key)}>{t('common.copy')}</Button>
<Button onClick={() => downloadKey(key)}>{t('common.download')}</Button>
</div>
</div>
);
@ -74,12 +71,11 @@ function CrossSigningSetup() {
downloadKey();
openReusableDialog(
<Text variant="s1" weight="medium">{t("Organisms.CrossSigning.security_key_dialog_title")}</Text>,
<Text variant="s1" weight="medium">{t('Organisms.CrossSigning.security_key_dialog_title')}</Text>,
() => renderSecurityKey(),
);
};
const setup = async (securityPhrase = undefined) => {
const mx = initMatrix.matrixClient;
setGenWithPhrase(typeof securityPhrase === 'string');
@ -130,12 +126,12 @@ function CrossSigningSetup() {
<div className="cross-signing__setup">
<div className="cross-signing__setup-entry">
<Text>
{t("Organisms.CrossSigning.security_key_generation_message")}
{t('Organisms.CrossSigning.security_key_generation_message')}
</Text>
{genWithPhrase !== false && <Button variant="primary" onClick={() => setup()} disabled={genWithPhrase !== undefined}>{t("Organisms.CrossSigning.security_key_generation_button")}</Button>}
{genWithPhrase !== false && <Button variant="primary" onClick={() => setup()} disabled={genWithPhrase !== undefined}>{t('Organisms.CrossSigning.security_key_generation_button')}</Button>}
{genWithPhrase === false && <Spinner size="small" />}
</div>
<Text className="cross-signing__setup-divider">{t("common.or")}</Text>
<Text className="cross-signing__setup-divider">{t('common.or')}</Text>
<Formik
initialValues={initialValues}
onSubmit={(values) => setup(values.phrase)}
@ -150,13 +146,13 @@ function CrossSigningSetup() {
disabled={genWithPhrase !== undefined}
>
<Text>
{t("Organisms.CrossSigning.security_phrase_message")}
{t('Organisms.CrossSigning.security_phrase_message')}
</Text>
<Input
name="phrase"
value={values.phrase}
onChange={handleChange}
label={t("Organisms.CrossSigning.security_phrase_label")}
label={t('Organisms.CrossSigning.security_phrase_label')}
type="password"
required
disabled={genWithPhrase !== undefined}
@ -166,13 +162,13 @@ function CrossSigningSetup() {
name="confirmPhrase"
value={values.confirmPhrase}
onChange={handleChange}
label={t("Organisms.CrossSigning.security_phrase_confirm_label")}
label={t('Organisms.CrossSigning.security_phrase_confirm_label')}
type="password"
required
disabled={genWithPhrase !== undefined}
/>
{errors.confirmPhrase && <Text variant="b3" className="cross-signing__error">{errors.confirmPhrase}</Text>}
{genWithPhrase !== true && <Button variant="primary" type="submit" disabled={genWithPhrase !== undefined}>{t("Organisms.CrossSigning.security_phrase_set_button")}</Button>}
{genWithPhrase !== true && <Button variant="primary" type="submit" disabled={genWithPhrase !== undefined}>{t('Organisms.CrossSigning.security_phrase_set_button')}</Button>}
{genWithPhrase === true && <Spinner size="small" />}
</form>
)}
@ -186,41 +182,40 @@ const setupDialog = () => {
<Text variant="s1" weight="medium">Setup cross signing</Text>,
() => <CrossSigningSetup />,
);
}
};
function CrossSigningReset() {
const { t } = useTranslation();
return (
<div className="cross-signing__reset">
<Text variant="h1">{twemojify('✋🧑‍🚒🤚')}</Text>
<Text weight="medium">{t("Organisms.CrossSigning.reset_keys_subtitle")}</Text>
<Text weight="medium">{t('Organisms.CrossSigning.reset_keys_subtitle')}</Text>
<Text>
{t("Organisms.CrossSigning.reset_keys_message")}
{t('Organisms.CrossSigning.reset_keys_message')}
</Text>
<Button variant="danger" onClick={setupDialog}>{t("common.reset")}</Button>
<Button variant="danger" onClick={setupDialog}>{t('common.reset')}</Button>
</div>
);
}
const resetDialog = () => {
openReusableDialog(
<Text variant="s1" weight="medium">Reset cross signing</Text>,
() => <CrossSigningReset />,
);
}
};
function CrossSignin() {
const { t } = useTranslation();
const isCSEnabled = useCrossSigningStatus();
return (
<SettingTile
title={t("Organisms.CrossSigning.title")}
content={<Text variant="b3">{t("Organisms.CrossSigning.setup_message")}</Text>}
title={t('Organisms.CrossSigning.title')}
content={<Text variant="b3">{t('Organisms.CrossSigning.setup_message')}</Text>}
options={(
isCSEnabled
? <Button variant="danger" onClick={resetDialog}>{t("common.reset")}</Button>
: <Button variant="primary" onClick={setupDialog}>{t("common.setup")}</Button>
? <Button variant="danger" onClick={resetDialog}>{t('common.reset')}</Button>
: <Button variant="primary" onClick={setupDialog}>{t('common.setup')}</Button>
)}
/>
);

36
src/app/organisms/settings/KeyBackup.jsx
View file

@ -2,6 +2,7 @@
import React, { useState, useEffect } from 'react';
import PropTypes from 'prop-types';
import './KeyBackup.scss';
import { useTranslation } from 'react-i18next';
import { twemojify } from '../../../util/twemojify';
import initMatrix from '../../../client/initMatrix';
@ -25,8 +26,6 @@ import { useStore } from '../../hooks/useStore';
import { useCrossSigningStatus } from '../../hooks/useCrossSigningStatus';
import '../../i18n';
import { useTranslation } from 'react-i18next';
function CreateKeyBackupDialog({ keyData }) {
const [done, setDone] = useState(false);
@ -66,19 +65,19 @@ function CreateKeyBackupDialog({ keyData }) {
{done === false && (
<div>
<Spinner size="small" />
<Text>{t("Organisms.KeyBackup.creating_backup")}</Text>
<Text>{t('Organisms.KeyBackup.creating_backup')}</Text>
</div>
)}
{done === true && (
<>
<Text variant="h1">{twemojify('✅')}</Text>
<Text>{t("Organisms.KeyBackup.backup_created")}</Text>
<Text>{t('Organisms.KeyBackup.backup_created')}</Text>
</>
)}
{done === null && (
<>
<Text>{t("Organisms.KeyBackup.backup_failed")}</Text>
<Button onClick={doBackup}>{t("common.retry")}</Button>
<Text>{t('Organisms.KeyBackup.backup_failed')}</Text>
<Button onClick={doBackup}>{t('common.retry')}</Button>
</>
)}
</div>
@ -89,7 +88,6 @@ CreateKeyBackupDialog.propTypes = {
};
function RestoreKeyBackupDialog({ keyData }) {
const { t } = useTranslation();
const [status, setStatus] = useState(false);
@ -108,7 +106,7 @@ function RestoreKeyBackupDialog({ keyData }) {
meBreath = true;
}, 200);
setStatus({ message: t("Organisms.KeyBackup.restoring_progress", {progress: progress.successes, total: progress.total}) });
setStatus({ message: t('Organisms.KeyBackup.restoring_progress', { progress: progress.successes, total: progress.total }) });
};
try {
@ -120,14 +118,14 @@ function RestoreKeyBackupDialog({ keyData }) {
{ progressCallback },
);
if (!mountStore.getItem()) return;
setStatus({ done: t("Organisms.KeyBackup.restore_complete", {progress: info.imported, total: info.total})});
setStatus({ done: t('Organisms.KeyBackup.restore_complete', { progress: info.imported, total: info.total }) });
} catch (e) {
if (!mountStore.getItem()) return;
if (e.errcode === 'RESTORE_BACKUP_ERROR_BAD_KEY') {
deletePrivateKey(keyData.keyId);
setStatus({ error: t("Organisms.KeyBackup.restore_failed_bad_key"), errorCode: 'BAD_KEY' });
setStatus({ error: t('Organisms.KeyBackup.restore_failed_bad_key'), errorCode: 'BAD_KEY' });
} else {
setStatus({ error: t("Organisms.KeyBackup.restore_failed_unknown"), errCode: 'UNKNOWN' });
setStatus({ error: t('Organisms.KeyBackup.restore_failed_unknown'), errCode: 'UNKNOWN' });
}
}
};
@ -142,7 +140,7 @@ function RestoreKeyBackupDialog({ keyData }) {
{(status === false || status.message) && (
<div>
<Spinner size="small" />
<Text>{status.message ?? t("Organisms.KeyBackup.restoring")}</Text>
<Text>{status.message ?? t('Organisms.KeyBackup.restoring')}</Text>
</div>
)}
{status.done && (
@ -154,7 +152,7 @@ function RestoreKeyBackupDialog({ keyData }) {
{status.error && (
<>
<Text>{status.error}</Text>
<Button onClick={restoreBackup}>{t("common.retry")}}</Button>
<Button onClick={restoreBackup}>{t('common.retry')}</Button>
</>
)}
</div>
@ -187,12 +185,12 @@ function DeleteKeyBackupDialog({ requestClose }) {
return (
<div className="key-backup__delete">
<Text variant="h1">{twemojify('🗑')}</Text>
<Text weight="medium">{t("Organisms.KeyBackup.delete_key_backup_subtitle")}</Text>
<Text>{t("Organisms.KeyBackup.delete_key_backup_message")}</Text>
<Text weight="medium">{t('Organisms.KeyBackup.delete_key_backup_subtitle')}</Text>
<Text>{t('Organisms.KeyBackup.delete_key_backup_message')}</Text>
{
isDeleting
? <Spinner size="small" />
: <Button variant="danger" onClick={deleteBackup}>{t("common.delete")}</Button>
: <Button variant="danger" onClick={deleteBackup}>{t('common.delete')}</Button>
}
</div>
);
@ -276,17 +274,17 @@ function KeyBackup() {
return (
<SettingTile
title={t("Organisms.KeyBackup.encrypted_messages_backup_title")}
title={t('Organisms.KeyBackup.encrypted_messages_backup_title')}
content={(
<>
<Text variant="b3">{t("Organisms.KeyBackup.encrypted_messages_backup_description")}</Text>
<Text variant="b3">{t('Organisms.KeyBackup.encrypted_messages_backup_description')}</Text>
{!isCSEnabled && (
<InfoCard
style={{ marginTop: 'var(--sp-ultra-tight)' }}
rounded
variant="caution"
iconSrc={InfoIC}
title={t("Organisms.KeyBackup.encrypted_messages_backup_cross_signing_disabled")}
title={t('Organisms.KeyBackup.encrypted_messages_backup_cross_signing_disabled')}
/>
)}
</>