LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-29 15:51:14 +00:00
Code Issues Projects Releases Wiki Activity

Merge pull request #258 from LemmyNet/change_password

Browse source 
Moved ChangePassword to its own action.
This commit is contained in:
Dessalines 2021-04-08 22:12:35 -04:00 committed by GitHub
commit 2cde42a48a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 452 additions and 409 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
.drone.yml
View file

@ -36,7 +36,7 @@ steps:
dockerfile: Dockerfile dockerfile: Dockerfile
repo: dessalines/lemmy-ui repo: dessalines/lemmy-ui
tags: tags:
- dev-linux-arm64 - dev-linux-amd64
username: username:
from_secret: docker_username from_secret: docker_username
password: password:

2
lemmy-translations

@ -1 +1 @@
Subproject commit 764d35d913453d1fd8eeec6007f0d94f59c8b0ee Subproject commit f05562455f5260d266d72b6130abb6f633e88a02

2
package.json
View file

@ -68,7 +68,7 @@
"eslint-plugin-prettier": "^3.3.1", "eslint-plugin-prettier": "^3.3.1",
"husky": "^6.0.0", "husky": "^6.0.0",
"iso-639-1": "^2.1.9", "iso-639-1": "^2.1.9",
"lemmy-js-client": "0.10.3", "lemmy-js-client": "0.11.0-rc.4",
"lint-staged": "^10.5.4", "lint-staged": "^10.5.4",
"mini-css-extract-plugin": "^1.4.1", "mini-css-extract-plugin": "^1.4.1",
"node-fetch": "^2.6.1", "node-fetch": "^2.6.1",

4
src/shared/components/navbar.tsx
View file

@ -346,8 +346,8 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
{localUserView.person.avatar && showAvatars() && ( {localUserView.person.avatar && showAvatars() && (
<PictrsImage src={localUserView.person.avatar} icon /> <PictrsImage src={localUserView.person.avatar} icon />
)} )}
{localUserView.person.preferred_username {localUserView.person.display_name
? localUserView.person.preferred_username ? localUserView.person.display_name
: localUserView.person.name} : localUserView.person.name}
</span> </span>
</Link> </Link>

6
src/shared/components/person-listing.tsx
View file

@ -34,11 +34,11 @@ export class PersonListing extends Component<PersonListingProps, any> {
let displayName = this.props.useApubName let displayName = this.props.useApubName
? apubName ? apubName
: person.preferred_username : person.display_name
? person.preferred_username ? person.display_name
: apubName; : apubName;
if (this.props.showApubName && !local && person.preferred_username) { if (this.props.showApubName && !local && person.display_name) {
displayName = `${displayName} (${apubName})`; displayName = `${displayName} (${apubName})`;
} }

337
src/shared/components/person.tsx
View file

@ -16,6 +16,7 @@ import {
CommentResponse, CommentResponse,
PostResponse, PostResponse,
BanPersonResponse, BanPersonResponse,
ChangePassword,
} from "lemmy-js-client"; } from "lemmy-js-client";
import { InitialFetchRequest, PersonDetailsView } from "../interfaces"; import { InitialFetchRequest, PersonDetailsView } from "../interfaces";
import { WebSocketService, UserService } from "../services"; import { WebSocketService, UserService } from "../services";
@ -71,8 +72,10 @@ interface PersonState {
sort: SortType; sort: SortType;
page: number; page: number;
loading: boolean; loading: boolean;
userSettingsForm: SaveUserSettings; saveUserSettingsForm: SaveUserSettings;
userSettingsLoading: boolean; changePasswordForm: ChangePassword;
saveUserSettingsLoading: boolean;
changePasswordLoading: boolean;
deleteAccountLoading: boolean; deleteAccountLoading: boolean;
deleteAccountShowConfirm: boolean; deleteAccountShowConfirm: boolean;
deleteAccountForm: DeleteAccount; deleteAccountForm: DeleteAccount;
@ -104,7 +107,7 @@ export class Person extends Component<any, PersonState> {
view: Person.getViewFromProps(this.props.match.view), view: Person.getViewFromProps(this.props.match.view),
sort: Person.getSortTypeFromProps(this.props.match.sort), sort: Person.getSortTypeFromProps(this.props.match.sort),
page: Person.getPageFromProps(this.props.match.page), page: Person.getPageFromProps(this.props.match.page),
userSettingsForm: { saveUserSettingsForm: {
show_nsfw: null, show_nsfw: null,
theme: null, theme: null,
default_sort_type: null, default_sort_type: null,
@ -113,10 +116,17 @@ export class Person extends Component<any, PersonState> {
show_avatars: null, show_avatars: null,
send_notifications_to_email: null, send_notifications_to_email: null,
bio: null, bio: null,
preferred_username: null, display_name: null,
auth: authField(false), auth: authField(false),
}, },
userSettingsLoading: null, changePasswordForm: {
new_password: null,
new_password_verify: null,
old_password: null,
auth: authField(false),
},
saveUserSettingsLoading: null,
changePasswordLoading: false,
deleteAccountLoading: null, deleteAccountLoading: null,
deleteAccountShowConfirm: false, deleteAccountShowConfirm: false,
deleteAccountForm: { deleteAccountForm: {
@ -408,8 +418,8 @@ export class Person extends Component<any, PersonState> {
<div class=""> <div class="">
<div class="mb-0 d-flex flex-wrap"> <div class="mb-0 d-flex flex-wrap">
<div> <div>
{pv.person.preferred_username && ( {pv.person.display_name && (
<h5 class="mb-0">{pv.person.preferred_username}</h5> <h5 class="mb-0">{pv.person.display_name}</h5>
)} )}
<ul class="list-inline mb-2"> <ul class="list-inline mb-2">
<li className="list-inline-item"> <li className="list-inline-item">
@ -502,13 +512,95 @@ export class Person extends Component<any, PersonState> {
<div> <div>
<div class="card border-secondary mb-3"> <div class="card border-secondary mb-3">
<div class="card-body"> <div class="card-body">
{this.saveUserSettingsHtmlForm()}
<br />
{this.changePasswordHtmlForm()}
</div>
</div>
</div>
);
}
changePasswordHtmlForm() {
return (
<>
<h5>{i18n.t("change_password")}</h5>
<form onSubmit={linkEvent(this, this.handleChangePasswordSubmit)}>
<div class="form-group row">
<label class="col-lg-5 col-form-label" htmlFor="user-password">
{i18n.t("new_password")}
</label>
<div class="col-lg-7">
<input
type="password"
id="user-password"
class="form-control"
value={this.state.changePasswordForm.new_password}
autoComplete="new-password"
maxLength={60}
onInput={linkEvent(this, this.handleNewPasswordChange)}
/>
</div>
</div>
<div class="form-group row">
<label
class="col-lg-5 col-form-label"
htmlFor="user-verify-password"
>
{i18n.t("verify_password")}
</label>
<div class="col-lg-7">
<input
type="password"
id="user-verify-password"
class="form-control"
value={this.state.changePasswordForm.new_password_verify}
autoComplete="new-password"
maxLength={60}
onInput={linkEvent(this, this.handleNewPasswordVerifyChange)}
/>
</div>
</div>
<div class="form-group row">
<label class="col-lg-5 col-form-label" htmlFor="user-old-password">
{i18n.t("old_password")}
</label>
<div class="col-lg-7">
<input
type="password"
id="user-old-password"
class="form-control"
value={this.state.changePasswordForm.old_password}
autoComplete="new-password"
maxLength={60}
onInput={linkEvent(this, this.handleOldPasswordChange)}
/>
</div>
</div>
<div class="form-group">
<button type="submit" class="btn btn-block btn-secondary mr-4">
{this.state.changePasswordLoading ? (
<Spinner />
) : (
capitalizeFirstLetter(i18n.t("save"))
)}
</button>
</div>
</form>
</>
);
}
saveUserSettingsHtmlForm() {
return (
<>
<h5>{i18n.t("settings")}</h5> <h5>{i18n.t("settings")}</h5>
<form onSubmit={linkEvent(this, this.handleUserSettingsSubmit)}> <form onSubmit={linkEvent(this, this.handleSaveUserSettingsSubmit)}>
<div class="form-group"> <div class="form-group">
<label>{i18n.t("avatar")}</label> <label>{i18n.t("avatar")}</label>
<ImageUploadForm <ImageUploadForm
uploadTitle={i18n.t("upload_avatar")} uploadTitle={i18n.t("upload_avatar")}
imageSrc={this.state.userSettingsForm.avatar} imageSrc={this.state.saveUserSettingsForm.avatar}
onUpload={this.handleAvatarUpload} onUpload={this.handleAvatarUpload}
onRemove={this.handleAvatarRemove} onRemove={this.handleAvatarRemove}
rounded rounded
@ -518,7 +610,7 @@ export class Person extends Component<any, PersonState> {
<label>{i18n.t("banner")}</label> <label>{i18n.t("banner")}</label>
<ImageUploadForm <ImageUploadForm
uploadTitle={i18n.t("upload_banner")} uploadTitle={i18n.t("upload_banner")}
imageSrc={this.state.userSettingsForm.banner} imageSrc={this.state.saveUserSettingsForm.banner}
onUpload={this.handleBannerUpload} onUpload={this.handleBannerUpload}
onRemove={this.handleBannerRemove} onRemove={this.handleBannerRemove}
/> />
@ -527,7 +619,7 @@ export class Person extends Component<any, PersonState> {
<label htmlFor="user-language">{i18n.t("language")}</label> <label htmlFor="user-language">{i18n.t("language")}</label>
<select <select
id="user-language" id="user-language"
value={this.state.userSettingsForm.lang} value={this.state.saveUserSettingsForm.lang}
onChange={linkEvent(this, this.handleUserSettingsLangChange)} onChange={linkEvent(this, this.handleUserSettingsLangChange)}
class="ml-2 custom-select w-auto" class="ml-2 custom-select w-auto"
> >
@ -549,7 +641,7 @@ export class Person extends Component<any, PersonState> {
<label htmlFor="user-theme">{i18n.t("theme")}</label> <label htmlFor="user-theme">{i18n.t("theme")}</label>
<select <select
id="user-theme" id="user-theme"
value={this.state.userSettingsForm.theme} value={this.state.saveUserSettingsForm.theme}
onChange={linkEvent(this, this.handleUserSettingsThemeChange)} onChange={linkEvent(this, this.handleUserSettingsThemeChange)}
class="ml-2 custom-select w-auto" class="ml-2 custom-select w-auto"
> >
@ -569,7 +661,7 @@ export class Person extends Component<any, PersonState> {
<ListingTypeSelect <ListingTypeSelect
type_={ type_={
Object.values(ListingType)[ Object.values(ListingType)[
this.state.userSettingsForm.default_listing_type this.state.saveUserSettingsForm.default_listing_type
] ]
} }
showLocal={ showLocal={
@ -585,7 +677,7 @@ export class Person extends Component<any, PersonState> {
<SortSelect <SortSelect
sort={ sort={
Object.values(SortType)[ Object.values(SortType)[
this.state.userSettingsForm.default_sort_type this.state.saveUserSettingsForm.default_sort_type
] ]
} }
onChange={this.handleUserSettingsSortTypeChange} onChange={this.handleUserSettingsSortTypeChange}
@ -601,7 +693,7 @@ export class Person extends Component<any, PersonState> {
type="text" type="text"
class="form-control" class="form-control"
placeholder={i18n.t("optional")} placeholder={i18n.t("optional")}
value={this.state.userSettingsForm.preferred_username} value={this.state.saveUserSettingsForm.display_name}
onInput={linkEvent( onInput={linkEvent(
this, this,
this.handleUserSettingsPreferredUsernameChange this.handleUserSettingsPreferredUsernameChange
@ -618,7 +710,7 @@ export class Person extends Component<any, PersonState> {
</label> </label>
<div class="col-lg-9"> <div class="col-lg-9">
<MarkdownTextArea <MarkdownTextArea
initialContent={this.state.userSettingsForm.bio} initialContent={this.state.saveUserSettingsForm.bio}
onContentChange={this.handleUserSettingsBioChange} onContentChange={this.handleUserSettingsBioChange}
maxLength={300} maxLength={300}
hideNavigationWarnings hideNavigationWarnings
@ -635,11 +727,8 @@ export class Person extends Component<any, PersonState> {
id="user-email" id="user-email"
class="form-control" class="form-control"
placeholder={i18n.t("optional")} placeholder={i18n.t("optional")}
value={this.state.userSettingsForm.email} value={this.state.saveUserSettingsForm.email}
onInput={linkEvent( onInput={linkEvent(this, this.handleUserSettingsEmailChange)}
this,
this.handleUserSettingsEmailChange
)}
minLength={3} minLength={3}
/> />
</div> </div>
@ -656,7 +745,7 @@ export class Person extends Component<any, PersonState> {
type="text" type="text"
class="form-control" class="form-control"
placeholder="@user:example.com" placeholder="@user:example.com"
value={this.state.userSettingsForm.matrix_user_id} value={this.state.saveUserSettingsForm.matrix_user_id}
onInput={linkEvent( onInput={linkEvent(
this, this,
this.handleUserSettingsMatrixUserIdChange this.handleUserSettingsMatrixUserIdChange
@ -665,69 +754,6 @@ export class Person extends Component<any, PersonState> {
/> />
</div> </div>
</div> </div>
<div class="form-group row">
<label class="col-lg-5 col-form-label" htmlFor="user-password">
{i18n.t("new_password")}
</label>
<div class="col-lg-7">
<input
type="password"
id="user-password"
class="form-control"
value={this.state.userSettingsForm.new_password}
autoComplete="new-password"
maxLength={60}
onInput={linkEvent(
this,
this.handleUserSettingsNewPasswordChange
)}
/>
</div>
</div>
<div class="form-group row">
<label
class="col-lg-5 col-form-label"
htmlFor="user-verify-password"
>
{i18n.t("verify_password")}
</label>
<div class="col-lg-7">
<input
type="password"
id="user-verify-password"
class="form-control"
value={this.state.userSettingsForm.new_password_verify}
autoComplete="new-password"
maxLength={60}
onInput={linkEvent(
this,
this.handleUserSettingsNewPasswordVerifyChange
)}
/>
</div>
</div>
<div class="form-group row">
<label
class="col-lg-5 col-form-label"
htmlFor="user-old-password"
>
{i18n.t("old_password")}
</label>
<div class="col-lg-7">
<input
type="password"
id="user-old-password"
class="form-control"
value={this.state.userSettingsForm.old_password}
autoComplete="new-password"
maxLength={60}
onInput={linkEvent(
this,
this.handleUserSettingsOldPasswordChange
)}
/>
</div>
</div>
{this.state.siteRes.site_view.site.enable_nsfw && ( {this.state.siteRes.site_view.site.enable_nsfw && (
<div class="form-group"> <div class="form-group">
<div class="form-check"> <div class="form-check">
@ -735,7 +761,7 @@ export class Person extends Component<any, PersonState> {
class="form-check-input" class="form-check-input"
id="user-show-nsfw" id="user-show-nsfw"
type="checkbox" type="checkbox"
checked={this.state.userSettingsForm.show_nsfw} checked={this.state.saveUserSettingsForm.show_nsfw}
onChange={linkEvent( onChange={linkEvent(
this, this,
this.handleUserSettingsShowNsfwChange this.handleUserSettingsShowNsfwChange
@ -753,7 +779,7 @@ export class Person extends Component<any, PersonState> {
class="form-check-input" class="form-check-input"
id="user-show-avatars" id="user-show-avatars"
type="checkbox" type="checkbox"
checked={this.state.userSettingsForm.show_avatars} checked={this.state.saveUserSettingsForm.show_avatars}
onChange={linkEvent( onChange={linkEvent(
this, this,
this.handleUserSettingsShowAvatarsChange this.handleUserSettingsShowAvatarsChange
@ -770,9 +796,9 @@ export class Person extends Component<any, PersonState> {
class="form-check-input" class="form-check-input"
id="user-send-notifications-to-email" id="user-send-notifications-to-email"
type="checkbox" type="checkbox"
disabled={!this.state.userSettingsForm.email} disabled={!this.state.saveUserSettingsForm.email}
checked={ checked={
this.state.userSettingsForm.send_notifications_to_email this.state.saveUserSettingsForm.send_notifications_to_email
} }
onChange={linkEvent( onChange={linkEvent(
this, this,
@ -789,7 +815,7 @@ export class Person extends Component<any, PersonState> {
</div> </div>
<div class="form-group"> <div class="form-group">
<button type="submit" class="btn btn-block btn-secondary mr-4"> <button type="submit" class="btn btn-block btn-secondary mr-4">
{this.state.userSettingsLoading ? ( {this.state.saveUserSettingsLoading ? (
<Spinner /> <Spinner />
) : ( ) : (
capitalizeFirstLetter(i18n.t("save")) capitalizeFirstLetter(i18n.t("save"))
@ -797,7 +823,7 @@ export class Person extends Component<any, PersonState> {
</button> </button>
</div> </div>
<hr /> <hr />
<div class="form-group mb-0"> <div class="form-group">
<button <button
class="btn btn-block btn-danger" class="btn btn-block btn-danger"
onClick={linkEvent( onClick={linkEvent(
@ -847,9 +873,7 @@ export class Person extends Component<any, PersonState> {
)} )}
</div> </div>
</form> </form>
</div> </>
</div>
</div>
); );
} }
@ -928,125 +952,136 @@ export class Person extends Component<any, PersonState> {
} }
handleUserSettingsShowNsfwChange(i: Person, event: any) { handleUserSettingsShowNsfwChange(i: Person, event: any) {
i.state.userSettingsForm.show_nsfw = event.target.checked; i.state.saveUserSettingsForm.show_nsfw = event.target.checked;
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsShowAvatarsChange(i: Person, event: any) { handleUserSettingsShowAvatarsChange(i: Person, event: any) {
i.state.userSettingsForm.show_avatars = event.target.checked; i.state.saveUserSettingsForm.show_avatars = event.target.checked;
UserService.Instance.localUserView.local_user.show_avatars = UserService.Instance.localUserView.local_user.show_avatars =
event.target.checked; // Just for instant updates event.target.checked; // Just for instant updates
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsSendNotificationsToEmailChange(i: Person, event: any) { handleUserSettingsSendNotificationsToEmailChange(i: Person, event: any) {
i.state.userSettingsForm.send_notifications_to_email = event.target.checked; i.state.saveUserSettingsForm.send_notifications_to_email =
event.target.checked;
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsThemeChange(i: Person, event: any) { handleUserSettingsThemeChange(i: Person, event: any) {
i.state.userSettingsForm.theme = event.target.value; i.state.saveUserSettingsForm.theme = event.target.value;
setTheme(event.target.value, true); setTheme(event.target.value, true);
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsLangChange(i: Person, event: any) { handleUserSettingsLangChange(i: Person, event: any) {
i.state.userSettingsForm.lang = event.target.value; i.state.saveUserSettingsForm.lang = event.target.value;
i18n.changeLanguage(getLanguage(i.state.userSettingsForm.lang)); i18n.changeLanguage(getLanguage(i.state.saveUserSettingsForm.lang));
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsSortTypeChange(val: SortType) { handleUserSettingsSortTypeChange(val: SortType) {
this.state.userSettingsForm.default_sort_type = Object.keys( this.state.saveUserSettingsForm.default_sort_type = Object.keys(
SortType SortType
).indexOf(val); ).indexOf(val);
this.setState(this.state); this.setState(this.state);
} }
handleUserSettingsListingTypeChange(val: ListingType) { handleUserSettingsListingTypeChange(val: ListingType) {
this.state.userSettingsForm.default_listing_type = Object.keys( this.state.saveUserSettingsForm.default_listing_type = Object.keys(
ListingType ListingType
).indexOf(val); ).indexOf(val);
this.setState(this.state); this.setState(this.state);
} }
handleUserSettingsEmailChange(i: Person, event: any) { handleUserSettingsEmailChange(i: Person, event: any) {
i.state.userSettingsForm.email = event.target.value; i.state.saveUserSettingsForm.email = event.target.value;
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsBioChange(val: string) { handleUserSettingsBioChange(val: string) {
this.state.userSettingsForm.bio = val; this.state.saveUserSettingsForm.bio = val;
this.setState(this.state); this.setState(this.state);
} }
handleAvatarUpload(url: string) { handleAvatarUpload(url: string) {
this.state.userSettingsForm.avatar = url; this.state.saveUserSettingsForm.avatar = url;
this.setState(this.state); this.setState(this.state);
} }
handleAvatarRemove() { handleAvatarRemove() {
this.state.userSettingsForm.avatar = ""; this.state.saveUserSettingsForm.avatar = "";
this.setState(this.state); this.setState(this.state);
} }
handleBannerUpload(url: string) { handleBannerUpload(url: string) {
this.state.userSettingsForm.banner = url; this.state.saveUserSettingsForm.banner = url;
this.setState(this.state); this.setState(this.state);
} }
handleBannerRemove() { handleBannerRemove() {
this.state.userSettingsForm.banner = ""; this.state.saveUserSettingsForm.banner = "";
this.setState(this.state); this.setState(this.state);
} }
handleUserSettingsPreferredUsernameChange(i: Person, event: any) { handleUserSettingsPreferredUsernameChange(i: Person, event: any) {
i.state.userSettingsForm.preferred_username = event.target.value; i.state.saveUserSettingsForm.display_name = event.target.value;
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsMatrixUserIdChange(i: Person, event: any) { handleUserSettingsMatrixUserIdChange(i: Person, event: any) {
i.state.userSettingsForm.matrix_user_id = event.target.value; i.state.saveUserSettingsForm.matrix_user_id = event.target.value;
if ( if (
i.state.userSettingsForm.matrix_user_id == "" && i.state.saveUserSettingsForm.matrix_user_id == "" &&
!UserService.Instance.localUserView.person.matrix_user_id !UserService.Instance.localUserView.person.matrix_user_id
) { ) {
i.state.userSettingsForm.matrix_user_id = undefined; i.state.saveUserSettingsForm.matrix_user_id = undefined;
} }
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsNewPasswordChange(i: Person, event: any) { handleNewPasswordChange(i: Person, event: any) {
i.state.userSettingsForm.new_password = event.target.value; i.state.changePasswordForm.new_password = event.target.value;
if (i.state.userSettingsForm.new_password == "") { if (i.state.changePasswordForm.new_password == "") {
i.state.userSettingsForm.new_password = undefined; i.state.changePasswordForm.new_password = undefined;
} }
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsNewPasswordVerifyChange(i: Person, event: any) { handleNewPasswordVerifyChange(i: Person, event: any) {
i.state.userSettingsForm.new_password_verify = event.target.value; i.state.changePasswordForm.new_password_verify = event.target.value;
if (i.state.userSettingsForm.new_password_verify == "") { if (i.state.changePasswordForm.new_password_verify == "") {
i.state.userSettingsForm.new_password_verify = undefined; i.state.changePasswordForm.new_password_verify = undefined;
} }
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsOldPasswordChange(i: Person, event: any) { handleOldPasswordChange(i: Person, event: any) {
i.state.userSettingsForm.old_password = event.target.value; i.state.changePasswordForm.old_password = event.target.value;
if (i.state.userSettingsForm.old_password == "") { if (i.state.changePasswordForm.old_password == "") {
i.state.userSettingsForm.old_password = undefined; i.state.changePasswordForm.old_password = undefined;
} }
i.setState(i.state); i.setState(i.state);
} }
handleUserSettingsSubmit(i: Person, event: any) { handleSaveUserSettingsSubmit(i: Person, event: any) {
event.preventDefault(); event.preventDefault();
i.state.userSettingsLoading = true; i.state.saveUserSettingsLoading = true;
i.setState(i.state); i.setState(i.state);
WebSocketService.Instance.send( WebSocketService.Instance.send(
wsClient.saveUserSettings(i.state.userSettingsForm) wsClient.saveUserSettings(i.state.saveUserSettingsForm)
);
}
handleChangePasswordSubmit(i: Person, event: any) {
event.preventDefault();
i.state.changePasswordLoading = true;
i.setState(i.state);
WebSocketService.Instance.send(
wsClient.changePassword(i.state.changePasswordForm)
); );
} }
@ -1079,33 +1114,33 @@ export class Person extends Component<any, PersonState> {
setUserInfo() { setUserInfo() {
if (this.isCurrentUser) { if (this.isCurrentUser) {
this.state.userSettingsForm.show_nsfw = this.state.saveUserSettingsForm.show_nsfw =
UserService.Instance.localUserView.local_user.show_nsfw; UserService.Instance.localUserView.local_user.show_nsfw;
this.state.userSettingsForm.theme = UserService.Instance.localUserView this.state.saveUserSettingsForm.theme = UserService.Instance.localUserView
.local_user.theme .local_user.theme
? UserService.Instance.localUserView.local_user.theme ? UserService.Instance.localUserView.local_user.theme
: "browser"; : "browser";
this.state.userSettingsForm.default_sort_type = this.state.saveUserSettingsForm.default_sort_type =
UserService.Instance.localUserView.local_user.default_sort_type; UserService.Instance.localUserView.local_user.default_sort_type;
this.state.userSettingsForm.default_listing_type = this.state.saveUserSettingsForm.default_listing_type =
UserService.Instance.localUserView.local_user.default_listing_type; UserService.Instance.localUserView.local_user.default_listing_type;
this.state.userSettingsForm.lang = this.state.saveUserSettingsForm.lang =
UserService.Instance.localUserView.local_user.lang; UserService.Instance.localUserView.local_user.lang;
this.state.userSettingsForm.avatar = this.state.saveUserSettingsForm.avatar =
UserService.Instance.localUserView.person.avatar; UserService.Instance.localUserView.person.avatar;
this.state.userSettingsForm.banner = this.state.saveUserSettingsForm.banner =
UserService.Instance.localUserView.person.banner; UserService.Instance.localUserView.person.banner;
this.state.userSettingsForm.preferred_username = this.state.saveUserSettingsForm.display_name =
UserService.Instance.localUserView.person.preferred_username; UserService.Instance.localUserView.person.display_name;
this.state.userSettingsForm.show_avatars = this.state.saveUserSettingsForm.show_avatars =
UserService.Instance.localUserView.local_user.show_avatars; UserService.Instance.localUserView.local_user.show_avatars;
this.state.userSettingsForm.email = this.state.saveUserSettingsForm.email =
UserService.Instance.localUserView.local_user.email; UserService.Instance.localUserView.local_user.email;
this.state.userSettingsForm.bio = this.state.saveUserSettingsForm.bio =
UserService.Instance.localUserView.person.bio; UserService.Instance.localUserView.person.bio;
this.state.userSettingsForm.send_notifications_to_email = this.state.saveUserSettingsForm.send_notifications_to_email =
UserService.Instance.localUserView.local_user.send_notifications_to_email; UserService.Instance.localUserView.local_user.send_notifications_to_email;
this.state.userSettingsForm.matrix_user_id = this.state.saveUserSettingsForm.matrix_user_id =
UserService.Instance.localUserView.person.matrix_user_id; UserService.Instance.localUserView.person.matrix_user_id;
} }
} }
@ -1120,7 +1155,8 @@ export class Person extends Component<any, PersonState> {
} }
this.setState({ this.setState({
deleteAccountLoading: false, deleteAccountLoading: false,
userSettingsLoading: false, saveUserSettingsLoading: false,
changePasswordLoading: false,
}); });
return; return;
} else if (msg.reconnect) { } else if (msg.reconnect) {
@ -1139,14 +1175,21 @@ export class Person extends Component<any, PersonState> {
} else if (op == UserOperation.SaveUserSettings) { } else if (op == UserOperation.SaveUserSettings) {
let data = wsJsonToRes<LoginResponse>(msg).data; let data = wsJsonToRes<LoginResponse>(msg).data;
UserService.Instance.login(data); UserService.Instance.login(data);
this.state.personRes.person_view.person.bio = this.state.userSettingsForm.bio; this.state.personRes.person_view.person.bio = this.state.saveUserSettingsForm.bio;
this.state.personRes.person_view.person.preferred_username = this.state.userSettingsForm.preferred_username; this.state.personRes.person_view.person.display_name = this.state.saveUserSettingsForm.display_name;
this.state.personRes.person_view.person.banner = this.state.userSettingsForm.banner; this.state.personRes.person_view.person.banner = this.state.saveUserSettingsForm.banner;
this.state.personRes.person_view.person.avatar = this.state.userSettingsForm.avatar; this.state.personRes.person_view.person.avatar = this.state.saveUserSettingsForm.avatar;
this.state.userSettingsLoading = false; this.state.saveUserSettingsLoading = false;
this.setState(this.state); this.setState(this.state);
window.scrollTo(0, 0); window.scrollTo(0, 0);
} else if (op == UserOperation.ChangePassword) {
let data = wsJsonToRes<LoginResponse>(msg).data;
UserService.Instance.login(data);
this.state.changePasswordLoading = false;
this.setState(this.state);
window.scrollTo(0, 0);
toast(i18n.t("password_changed"));
} else if (op == UserOperation.DeleteAccount) { } else if (op == UserOperation.DeleteAccount) {
this.setState({ this.setState({
deleteAccountLoading: false, deleteAccountLoading: false,

8
src/shared/components/sidebar.tsx
View file

@ -299,7 +299,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
<Icon icon="edit" classes="icon-inline" /> <Icon icon="edit" classes="icon-inline" />
</span> </span>
</li> </li>
{!this.amCreator && {!this.amTopMod &&
(!this.state.showConfirmLeaveModTeam ? ( (!this.state.showConfirmLeaveModTeam ? (
<li className="list-inline-item-action"> <li className="list-inline-item-action">
<span <span
@ -341,7 +341,7 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
</li> </li>
</> </>
))} ))}
{this.amCreator && ( {this.amTopMod && (
<li className="list-inline-item-action"> <li className="list-inline-item-action">
<span <span
class="pointer" class="pointer"
@ -488,9 +488,9 @@ export class Sidebar extends Component<SidebarProps, SidebarState> {
WebSocketService.Instance.send(wsClient.followCommunity(form)); WebSocketService.Instance.send(wsClient.followCommunity(form));
} }
private get amCreator(): boolean { private get amTopMod(): boolean {
return ( return (
this.props.community_view.creator.id == this.props.moderators[0].moderator.id ==
UserService.Instance.localUserView.person.id UserService.Instance.localUserView.person.id
); );
} }

8
yarn.lock
View file

@ -5125,10 +5125,10 @@ lcid@^1.0.0:
dependencies: dependencies:
invert-kv "^1.0.0" invert-kv "^1.0.0"
lemmy-js-client@0.10.3: lemmy-js-client@0.11.0-rc.4:
version "0.10.3" version "0.11.0-rc.4"
resolved "https://registry.yarnpkg.com/lemmy-js-client/-/lemmy-js-client-0.10.3.tgz#815fe3f49b696c010858331aafc3850318b9e15d" resolved "https://registry.yarnpkg.com/lemmy-js-client/-/lemmy-js-client-0.11.0-rc.4.tgz#bd5652538309efac686aa10329b3a04fac6f85c2"
integrity sha512-ay5RQZSfoErLYh+b3aHpjA34dH/8rlNUcZF3L5nN+1cp4UWC4qWl97XjUM52QFyRzHslFPeP8D99fpgVe4USIQ== integrity sha512-7pCEEWkmaOoxxJ9+QSTVQFwThdjIWFp/mSs4c82TYs6tKAJsmfqzBkvSK9QVpSA2OOeYVWoThklKcrlmNV2d6A==
levn@^0.4.1: levn@^0.4.1:
version "0.4.1" version "0.4.1"