From 7ebb96e608097e3a55b98f0c3f4b38888ac273bf Mon Sep 17 00:00:00 2001 From: Dessalines Date: Thu, 8 Apr 2021 21:59:34 -0400 Subject: [PATCH] Moved ChangePassword to its own action. - Fixes #246 - Changing preferred to display_name. Fixes #243 - Fixing a drone issue --- .drone.yml | 2 +- package.json | 2 +- src/shared/components/navbar.tsx | 4 +- src/shared/components/person-listing.tsx | 6 +- src/shared/components/person.tsx | 825 ++++++++++++----------- src/shared/components/sidebar.tsx | 8 +- yarn.lock | 8 +- 7 files changed, 449 insertions(+), 406 deletions(-) diff --git a/.drone.yml b/.drone.yml index 7f7aef2..7c4cea8 100644 --- a/.drone.yml +++ b/.drone.yml @@ -36,7 +36,7 @@ steps: dockerfile: Dockerfile repo: dessalines/lemmy-ui tags: - - dev-linux-arm64 + - dev-linux-amd64 username: from_secret: docker_username password: diff --git a/package.json b/package.json index d9b4dc1..293d531 100644 --- a/package.json +++ b/package.json @@ -68,7 +68,7 @@ "eslint-plugin-prettier": "^3.3.1", "husky": "^6.0.0", "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", "mini-css-extract-plugin": "^1.4.1", "node-fetch": "^2.6.1", diff --git a/src/shared/components/navbar.tsx b/src/shared/components/navbar.tsx index 04061a1..35ed041 100644 --- a/src/shared/components/navbar.tsx +++ b/src/shared/components/navbar.tsx @@ -346,8 +346,8 @@ export class Navbar extends Component { {localUserView.person.avatar && showAvatars() && ( )} - {localUserView.person.preferred_username - ? localUserView.person.preferred_username + {localUserView.person.display_name + ? localUserView.person.display_name : localUserView.person.name} diff --git a/src/shared/components/person-listing.tsx b/src/shared/components/person-listing.tsx index 493147a..fda388d 100644 --- a/src/shared/components/person-listing.tsx +++ b/src/shared/components/person-listing.tsx @@ -34,11 +34,11 @@ export class PersonListing extends Component { let displayName = this.props.useApubName ? apubName - : person.preferred_username - ? person.preferred_username + : person.display_name + ? person.display_name : apubName; - if (this.props.showApubName && !local && person.preferred_username) { + if (this.props.showApubName && !local && person.display_name) { displayName = `${displayName} (${apubName})`; } diff --git a/src/shared/components/person.tsx b/src/shared/components/person.tsx index 6df2fef..211b229 100644 --- a/src/shared/components/person.tsx +++ b/src/shared/components/person.tsx @@ -16,6 +16,7 @@ import { CommentResponse, PostResponse, BanPersonResponse, + ChangePassword, } from "lemmy-js-client"; import { InitialFetchRequest, PersonDetailsView } from "../interfaces"; import { WebSocketService, UserService } from "../services"; @@ -71,8 +72,10 @@ interface PersonState { sort: SortType; page: number; loading: boolean; - userSettingsForm: SaveUserSettings; - userSettingsLoading: boolean; + saveUserSettingsForm: SaveUserSettings; + changePasswordForm: ChangePassword; + saveUserSettingsLoading: boolean; + changePasswordLoading: boolean; deleteAccountLoading: boolean; deleteAccountShowConfirm: boolean; deleteAccountForm: DeleteAccount; @@ -104,7 +107,7 @@ export class Person extends Component { view: Person.getViewFromProps(this.props.match.view), sort: Person.getSortTypeFromProps(this.props.match.sort), page: Person.getPageFromProps(this.props.match.page), - userSettingsForm: { + saveUserSettingsForm: { show_nsfw: null, theme: null, default_sort_type: null, @@ -113,10 +116,17 @@ export class Person extends Component { show_avatars: null, send_notifications_to_email: null, bio: null, - preferred_username: null, + display_name: null, 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, deleteAccountShowConfirm: false, deleteAccountForm: { @@ -408,8 +418,8 @@ export class Person extends Component {
- {pv.person.preferred_username && ( -
{pv.person.preferred_username}
+ {pv.person.display_name && ( +
{pv.person.display_name}
)}
  • @@ -502,354 +512,368 @@ export class Person extends Component {
    -
    {i18n.t("settings")}
    -
    -
    - - -
    -
    - - -
    -
    - - -
    -
    - - -
    - - - 0 - } - onChange={this.handleUserSettingsListingTypeChange} - /> - -
    - - + {this.changePasswordHtmlForm()} +
    +
    +
    + ); + } + + changePasswordHtmlForm() { + return ( + <> +
    {i18n.t("change_password")}
    + +
    + +
    + +
    +
    +
    + +
    + +
    +
    +
    + +
    + +
    +
    +
    + +
    + + + ); + } + + saveUserSettingsHtmlForm() { + return ( + <> +
    {i18n.t("settings")}
    +
    +
    + + +
    +
    + + +
    +
    + + +
    +
    + + +
    + + + 0 + } + onChange={this.handleUserSettingsListingTypeChange} + /> + +
    + + + +
    + +
    + +
    +
    +
    + +
    + +
    +
    +
    + +
    + +
    +
    +
    + +
    + +
    +
    + {this.state.siteRes.site_view.site.enable_nsfw && ( +
    +
    + - -
    - -
    - -
    -
    -
    - -
    - -
    -
    -
    - -
    - -
    -
    -
    - -
    - -
    -
    -
    - -
    - -
    -
    -
    - -
    - -
    -
    -
    -
    - {this.state.siteRes.site_view.site.enable_nsfw && ( -
    -
    - - -
    -
    +
    + )} +
    +
    + + +
    +
    +
    +
    + + +
    +
    +
    + +
    +
    +
    + + {this.state.deleteAccountShowConfirm && ( + <> + -
    -
    - -
    -
    -
    - {this.state.deleteAccountShowConfirm && ( - <> - - - - - - )} -
    - + + )}
    -
-
+ + ); } @@ -928,125 +952,136 @@ export class Person extends Component { } 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); } 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 = event.target.checked; // Just for instant updates i.setState(i.state); } 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); } handleUserSettingsThemeChange(i: Person, event: any) { - i.state.userSettingsForm.theme = event.target.value; + i.state.saveUserSettingsForm.theme = event.target.value; setTheme(event.target.value, true); i.setState(i.state); } handleUserSettingsLangChange(i: Person, event: any) { - i.state.userSettingsForm.lang = event.target.value; - i18n.changeLanguage(getLanguage(i.state.userSettingsForm.lang)); + i.state.saveUserSettingsForm.lang = event.target.value; + i18n.changeLanguage(getLanguage(i.state.saveUserSettingsForm.lang)); i.setState(i.state); } handleUserSettingsSortTypeChange(val: SortType) { - this.state.userSettingsForm.default_sort_type = Object.keys( + this.state.saveUserSettingsForm.default_sort_type = Object.keys( SortType ).indexOf(val); this.setState(this.state); } handleUserSettingsListingTypeChange(val: ListingType) { - this.state.userSettingsForm.default_listing_type = Object.keys( + this.state.saveUserSettingsForm.default_listing_type = Object.keys( ListingType ).indexOf(val); this.setState(this.state); } handleUserSettingsEmailChange(i: Person, event: any) { - i.state.userSettingsForm.email = event.target.value; + i.state.saveUserSettingsForm.email = event.target.value; i.setState(i.state); } handleUserSettingsBioChange(val: string) { - this.state.userSettingsForm.bio = val; + this.state.saveUserSettingsForm.bio = val; this.setState(this.state); } handleAvatarUpload(url: string) { - this.state.userSettingsForm.avatar = url; + this.state.saveUserSettingsForm.avatar = url; this.setState(this.state); } handleAvatarRemove() { - this.state.userSettingsForm.avatar = ""; + this.state.saveUserSettingsForm.avatar = ""; this.setState(this.state); } handleBannerUpload(url: string) { - this.state.userSettingsForm.banner = url; + this.state.saveUserSettingsForm.banner = url; this.setState(this.state); } handleBannerRemove() { - this.state.userSettingsForm.banner = ""; + this.state.saveUserSettingsForm.banner = ""; this.setState(this.state); } 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); } handleUserSettingsMatrixUserIdChange(i: Person, event: any) { - i.state.userSettingsForm.matrix_user_id = event.target.value; + i.state.saveUserSettingsForm.matrix_user_id = event.target.value; if ( - i.state.userSettingsForm.matrix_user_id == "" && + i.state.saveUserSettingsForm.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); } - handleUserSettingsNewPasswordChange(i: Person, event: any) { - i.state.userSettingsForm.new_password = event.target.value; - if (i.state.userSettingsForm.new_password == "") { - i.state.userSettingsForm.new_password = undefined; + handleNewPasswordChange(i: Person, event: any) { + i.state.changePasswordForm.new_password = event.target.value; + if (i.state.changePasswordForm.new_password == "") { + i.state.changePasswordForm.new_password = undefined; } i.setState(i.state); } - handleUserSettingsNewPasswordVerifyChange(i: Person, event: any) { - i.state.userSettingsForm.new_password_verify = event.target.value; - if (i.state.userSettingsForm.new_password_verify == "") { - i.state.userSettingsForm.new_password_verify = undefined; + handleNewPasswordVerifyChange(i: Person, event: any) { + i.state.changePasswordForm.new_password_verify = event.target.value; + if (i.state.changePasswordForm.new_password_verify == "") { + i.state.changePasswordForm.new_password_verify = undefined; } i.setState(i.state); } - handleUserSettingsOldPasswordChange(i: Person, event: any) { - i.state.userSettingsForm.old_password = event.target.value; - if (i.state.userSettingsForm.old_password == "") { - i.state.userSettingsForm.old_password = undefined; + handleOldPasswordChange(i: Person, event: any) { + i.state.changePasswordForm.old_password = event.target.value; + if (i.state.changePasswordForm.old_password == "") { + i.state.changePasswordForm.old_password = undefined; } i.setState(i.state); } - handleUserSettingsSubmit(i: Person, event: any) { + handleSaveUserSettingsSubmit(i: Person, event: any) { event.preventDefault(); - i.state.userSettingsLoading = true; + i.state.saveUserSettingsLoading = true; i.setState(i.state); 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 { setUserInfo() { if (this.isCurrentUser) { - this.state.userSettingsForm.show_nsfw = + this.state.saveUserSettingsForm.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 ? UserService.Instance.localUserView.local_user.theme : "browser"; - this.state.userSettingsForm.default_sort_type = + this.state.saveUserSettingsForm.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; - this.state.userSettingsForm.lang = + this.state.saveUserSettingsForm.lang = UserService.Instance.localUserView.local_user.lang; - this.state.userSettingsForm.avatar = + this.state.saveUserSettingsForm.avatar = UserService.Instance.localUserView.person.avatar; - this.state.userSettingsForm.banner = + this.state.saveUserSettingsForm.banner = UserService.Instance.localUserView.person.banner; - this.state.userSettingsForm.preferred_username = - UserService.Instance.localUserView.person.preferred_username; - this.state.userSettingsForm.show_avatars = + this.state.saveUserSettingsForm.display_name = + UserService.Instance.localUserView.person.display_name; + this.state.saveUserSettingsForm.show_avatars = UserService.Instance.localUserView.local_user.show_avatars; - this.state.userSettingsForm.email = + this.state.saveUserSettingsForm.email = UserService.Instance.localUserView.local_user.email; - this.state.userSettingsForm.bio = + this.state.saveUserSettingsForm.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; - this.state.userSettingsForm.matrix_user_id = + this.state.saveUserSettingsForm.matrix_user_id = UserService.Instance.localUserView.person.matrix_user_id; } } @@ -1120,7 +1155,8 @@ export class Person extends Component { } this.setState({ deleteAccountLoading: false, - userSettingsLoading: false, + saveUserSettingsLoading: false, + changePasswordLoading: false, }); return; } else if (msg.reconnect) { @@ -1139,14 +1175,21 @@ export class Person extends Component { } else if (op == UserOperation.SaveUserSettings) { let data = wsJsonToRes(msg).data; UserService.Instance.login(data); - this.state.personRes.person_view.person.bio = this.state.userSettingsForm.bio; - this.state.personRes.person_view.person.preferred_username = this.state.userSettingsForm.preferred_username; - this.state.personRes.person_view.person.banner = this.state.userSettingsForm.banner; - this.state.personRes.person_view.person.avatar = this.state.userSettingsForm.avatar; - this.state.userSettingsLoading = false; + this.state.personRes.person_view.person.bio = this.state.saveUserSettingsForm.bio; + this.state.personRes.person_view.person.display_name = this.state.saveUserSettingsForm.display_name; + this.state.personRes.person_view.person.banner = this.state.saveUserSettingsForm.banner; + this.state.personRes.person_view.person.avatar = this.state.saveUserSettingsForm.avatar; + this.state.saveUserSettingsLoading = false; this.setState(this.state); window.scrollTo(0, 0); + } else if (op == UserOperation.ChangePassword) { + let data = wsJsonToRes(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) { this.setState({ deleteAccountLoading: false, diff --git a/src/shared/components/sidebar.tsx b/src/shared/components/sidebar.tsx index 3eeb92f..29b1523 100644 --- a/src/shared/components/sidebar.tsx +++ b/src/shared/components/sidebar.tsx @@ -299,7 +299,7 @@ export class Sidebar extends Component { - {!this.amCreator && + {!this.amTopMod && (!this.state.showConfirmLeaveModTeam ? (
  • {
    • ))} - {this.amCreator && ( + {this.amTopMod && (
  • { WebSocketService.Instance.send(wsClient.followCommunity(form)); } - private get amCreator(): boolean { + private get amTopMod(): boolean { return ( - this.props.community_view.creator.id == + this.props.moderators[0].moderator.id == UserService.Instance.localUserView.person.id ); } diff --git a/yarn.lock b/yarn.lock index b5135e0..642b04a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5125,10 +5125,10 @@ lcid@^1.0.0: dependencies: invert-kv "^1.0.0" -lemmy-js-client@0.10.3: - version "0.10.3" - resolved "https://registry.yarnpkg.com/lemmy-js-client/-/lemmy-js-client-0.10.3.tgz#815fe3f49b696c010858331aafc3850318b9e15d" - integrity sha512-ay5RQZSfoErLYh+b3aHpjA34dH/8rlNUcZF3L5nN+1cp4UWC4qWl97XjUM52QFyRzHslFPeP8D99fpgVe4USIQ== +lemmy-js-client@0.11.0-rc.4: + version "0.11.0-rc.4" + resolved "https://registry.yarnpkg.com/lemmy-js-client/-/lemmy-js-client-0.11.0-rc.4.tgz#bd5652538309efac686aa10329b3a04fac6f85c2" + integrity sha512-7pCEEWkmaOoxxJ9+QSTVQFwThdjIWFp/mSs4c82TYs6tKAJsmfqzBkvSK9QVpSA2OOeYVWoThklKcrlmNV2d6A== levn@^0.4.1: version "0.4.1" -- 2.44.1