LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2025-01-15 22:45:50 +00:00
Code Issues Projects Releases Wiki Activity

Moving totp and delete account settings into their own cards. (#2907)

Browse source 
- Fixes #2896
This commit is contained in:
Dessalines 2025-01-13 20:23:45 -05:00 committed by GitHub
parent 2832f86ace
commit ebb06cdeaf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 92 additions and 84 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
src/shared/components/person/settings.tsx
View file

@ -451,7 +451,13 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
<div className="card-body">{this.changePasswordHtmlForm()}</div> <div className="card-body">{this.changePasswordHtmlForm()}</div>
</div> </div>
<div className="card border-secondary mb-3"> <div className="card border-secondary mb-3">
<div className="card-body">{this.importExport()}</div> <div className="card-body">{this.totpSection()}</div>
</div>
<div className="card border-secondary mb-3">
<div className="card-body">{this.importExportForm()}</div>
</div>
<div className="card border-secondary mb-3">
<div className="card-body">{this.deleteAccountForm()}</div>
</div> </div>
</div> </div>
</div> </div>
@ -523,10 +529,7 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
/> />
</div> </div>
<div className="input-group mb-3"> <div className="input-group mb-3">
<button <button type="submit" className="btn btn-secondary">
type="submit"
className="btn d-block btn-secondary me-4 w-100"
>
{this.state.changePasswordRes.state === "loading" ? ( {this.state.changePasswordRes.state === "loading" ? (
<Spinner /> <Spinner />
) : ( ) : (
@ -672,7 +675,7 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
); );
} }
importExport() { importExportForm() {
return ( return (
<> <>
<h2 className="h5"> <h2 className="h5">
@ -685,7 +688,7 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
) ? ( ) ? (
<> <>
<button <button
className="btn btn-secondary w-100 mb-4" className="btn btn-secondary mb-4"
onClick={linkEvent(this, this.handleExportSettings)} onClick={linkEvent(this, this.handleExportSettings)}
type="button" type="button"
> >
@ -700,7 +703,7 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
onChange={linkEvent(this, this.handleImportFileChange)} onChange={linkEvent(this, this.handleImportFileChange)}
/> />
<button <button
className="btn btn-secondary w-100 mt-3" className="btn btn-secondary mt-3"
onClick={linkEvent(this, this.handleImportSettings)} onClick={linkEvent(this, this.handleImportSettings)}
type="button" type="button"
disabled={!this.state.settingsFile} disabled={!this.state.settingsFile}
@ -1152,7 +1155,6 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
</label> </label>
</div> </div>
</div> </div>
{this.totpSection()}
<div className="input-group mb-3"> <div className="input-group mb-3">
<button type="submit" className="btn d-block btn-secondary me-4"> <button type="submit" className="btn d-block btn-secondary me-4">
{this.state.saveRes.state === "loading" ? ( {this.state.saveRes.state === "loading" ? (
@ -1162,7 +1164,15 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
)} )}
</button> </button>
</div> </div>
<hr /> </form>
</>
);
}
deleteAccountForm() {
return (
<>
<h2 className="h5">{I18NextService.i18n.t("delete_account")}</h2>
<form <form
className="mb-3" className="mb-3"
onSubmit={linkEvent(this, this.handleDeleteAccount)} onSubmit={linkEvent(this, this.handleDeleteAccount)}
@ -1170,10 +1180,7 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
<button <button
type="button" type="button"
className="btn d-block btn-danger" className="btn d-block btn-danger"
onClick={linkEvent( onClick={linkEvent(this, this.handleDeleteAccountShowConfirmToggle)}
this,
this.handleDeleteAccountShowConfirmToggle,
)}
> >
{I18NextService.i18n.t("delete_account")} {I18NextService.i18n.t("delete_account")}
</button> </button>
@ -1238,7 +1245,6 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
</> </>
)} )}
</form> </form>
</form>
</> </>
); );
} }
@ -1248,9 +1254,11 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
!!UserService.Instance.myUserInfo?.local_user_view.local_user !!UserService.Instance.myUserInfo?.local_user_view.local_user
.totp_2fa_enabled; .totp_2fa_enabled;
const { generateTotpRes } = this.state; const { generateTotpRes } = this.state;
const totpActionStr = totpEnabled ? "disable_totp" : "enable_totp";
return ( return (
<> <>
<h2 className="h5">{I18NextService.i18n.t(totpActionStr)}</h2>
<button <button
type="button" type="button"
className="btn btn-secondary my-2" className="btn btn-secondary my-2"
@ -1259,7 +1267,7 @@ export class Settings extends Component<SettingsRouteProps, SettingsState> {
totpEnabled ? handleShowTotpModal : handleGenerateTotp, totpEnabled ? handleShowTotpModal : handleGenerateTotp,
)} )}
> >
{I18NextService.i18n.t(totpEnabled ? "disable_totp" : "enable_totp")} {I18NextService.i18n.t(totpActionStr)}
</button> </button>
{totpEnabled ? ( {totpEnabled ? (
<TotpModal <TotpModal