X-Git-Url: http://these/git/?a=blobdiff_plain;f=src%2Fshared%2Fcomponents%2Fperson%2Fsettings.tsx;h=4caef458bbe84600baa0906672b36867bb92ca09;hb=c3ab9e74f8775f4b811866d2675b00f9702bde3d;hp=477cd6d85133a544c4d912d6a5205eb8c0141c5f;hpb=65fc02327e98b501f318e8310ba7136c9a841f01;p=lemmy-ui.git diff --git a/src/shared/components/person/settings.tsx b/src/shared/components/person/settings.tsx index 477cd6d..4caef45 100644 --- a/src/shared/components/person/settings.tsx +++ b/src/shared/components/person/settings.tsx @@ -1,51 +1,39 @@ -import { NoOptionI18nKeys } from "i18next"; -import { Component, linkEvent } from "inferno"; -import { - BlockCommunity, - BlockCommunityResponse, - BlockPerson, - BlockPersonResponse, - ChangePassword, - CommunityBlockView, - DeleteAccount, - GetSiteResponse, - ListingType, - LoginResponse, - PersonBlockView, - SaveUserSettings, - SortType, - UserOperation, - wsJsonToRes, - wsUserOp, -} from "lemmy-js-client"; -import { Subscription } from "rxjs"; -import { i18n, languages } from "../../i18next"; -import { UserService, WebSocketService } from "../../services"; import { - Choice, - capitalizeFirstLetter, communityToChoice, - debounce, - elementUrl, - emDash, - enableNsfw, fetchCommunities, fetchThemeList, fetchUsers, - getLanguages, myAuth, + myAuthRequired, personToChoice, - relTags, setIsoData, setTheme, - setupTippy, showLocal, - toast, updateCommunityBlock, updatePersonBlock, - wsClient, - wsSubscribe, -} from "../../utils"; +} from "@utils/app"; +import { capitalizeFirstLetter, debounce } from "@utils/helpers"; +import { Choice } from "@utils/types"; +import classNames from "classnames"; +import { NoOptionI18nKeys } from "i18next"; +import { Component, linkEvent } from "inferno"; +import { + BlockCommunityResponse, + BlockPersonResponse, + CommunityBlockView, + DeleteAccountResponse, + GetSiteResponse, + ListingType, + LoginResponse, + PersonBlockView, + SortType, +} from "lemmy-js-client"; +import { elementUrl, emDash, relTags } from "../../config"; +import { UserService } from "../../services"; +import { HttpService, RequestState } from "../../services/HttpService"; +import { I18NextService, languages } from "../../services/I18NextService"; +import { setupTippy } from "../../tippy"; +import { toast } from "../../toast"; import { HtmlTags } from "../common/html-tags"; import { Icon, Spinner } from "../common/icon"; import { ImageUploadForm } from "../common/image-upload-form"; @@ -54,10 +42,14 @@ import { ListingTypeSelect } from "../common/listing-type-select"; import { MarkdownTextArea } from "../common/markdown-textarea"; import { SearchableSelect } from "../common/searchable-select"; import { SortSelect } from "../common/sort-select"; +import Tabs from "../common/tabs"; import { CommunityLink } from "../community/community-link"; import { PersonListing } from "./person-listing"; interface SettingsState { + saveRes: RequestState; + changePasswordRes: RequestState; + deleteAccountRes: RequestState; // TODO redo these forms saveUserSettingsForm: { show_nsfw?: boolean; @@ -93,9 +85,6 @@ interface SettingsState { communityBlocks: CommunityBlockView[]; currentTab: string; themeList: string[]; - saveUserSettingsLoading: boolean; - changePasswordLoading: boolean; - deleteAccountLoading: boolean; deleteAccountShowConfirm: boolean; siteRes: GetSiteResponse; searchCommunityLoading: boolean; @@ -119,12 +108,12 @@ const Filter = ({ onChange: (choice: Choice) => void; loading: boolean; }) => ( -
+
{ private isoData = setIsoData(this.context); - private subscription?: Subscription; state: SettingsState = { + saveRes: { state: "empty" }, + deleteAccountRes: { state: "empty" }, + changePasswordRes: { state: "empty" }, saveUserSettingsForm: {}, changePasswordForm: {}, - saveUserSettingsLoading: false, - changePasswordLoading: false, - deleteAccountLoading: false, deleteAccountShowConfirm: false, deleteAccountForm: {}, personBlocks: [], @@ -176,9 +164,11 @@ export class Settings extends Component { this.handleBannerUpload = this.handleBannerUpload.bind(this); this.handleBannerRemove = this.handleBannerRemove.bind(this); + this.userSettings = this.userSettings.bind(this); + this.blockCards = this.blockCards.bind(this); - this.parseMessage = this.parseMessage.bind(this); - this.subscription = wsSubscribe(this.parseMessage); + this.handleBlockPerson = this.handleBlockPerson.bind(this); + this.handleBlockCommunity = this.handleBlockCommunity.bind(this); const mui = UserService.Instance.myUserInfo; if (mui) { @@ -242,87 +232,81 @@ export class Settings extends Component { this.setState({ themeList: await fetchThemeList() }); } - componentWillUnmount() { - this.subscription?.unsubscribe(); - } - get documentTitle(): string { - return i18n.t("settings"); + return I18NextService.i18n.t("settings"); } render() { return ( -
- <> - -
    -
  • - -
    • -
  • - -
    • -
- {this.state.currentTab == "settings" && this.userSettings()} - {this.state.currentTab == "blocks" && this.blockCards()} - +
+ +
); } - userSettings() { + userSettings(isSelected) { return ( -
-
-
-
{this.saveUserSettingsHtmlForm()}
+
+
+
+
+
{this.saveUserSettingsHtmlForm()}
+
-
-
-
-
{this.changePasswordHtmlForm()}
+
+
+
{this.changePasswordHtmlForm()}
+
); } - blockCards() { + blockCards(isSelected) { return ( -
-
-
-
{this.blockUserCard()}
+
+
+
+
+
{this.blockUserCard()}
+
-
-
-
-
{this.blockCommunityCard()}
+
+
+
{this.blockCommunityCard()}
+
@@ -332,11 +316,11 @@ export class Settings extends Component { changePasswordHtmlForm() { return ( <> -
{i18n.t("change_password")}
+

{I18NextService.i18n.t("change_password")}

-
+
{ />
-
+
{ />
-
+
{ />
-
-
@@ -422,7 +409,7 @@ export class Settings extends Component { blockedUsersList() { return ( <> -
{i18n.t("blocked_users")}
+

{I18NextService.i18n.t("blocked_users")}

    {this.state.personBlocks.map(pb => (
  • @@ -434,7 +421,7 @@ export class Settings extends Component { { ctx: this, recipientId: pb.target.id }, this.handleUnblockPerson )} - data-tippy-content={i18n.t("unblock_user")} + data-tippy-content={I18NextService.i18n.t("unblock_user")} > @@ -466,7 +453,7 @@ export class Settings extends Component { blockedCommunitiesList() { return ( <> -
    {i18n.t("blocked_communities")}
    +

    {I18NextService.i18n.t("blocked_communities")}

      {this.state.communityBlocks.map(cb => (
    • @@ -478,7 +465,9 @@ export class Settings extends Component { { ctx: this, communityId: cb.community.id }, this.handleUnblockCommunity )} - data-tippy-content={i18n.t("unblock_community")} + data-tippy-content={I18NextService.i18n.t( + "unblock_community" + )} > @@ -491,22 +480,22 @@ export class Settings extends Component { } saveUserSettingsHtmlForm() { - let selectedLangs = this.state.saveUserSettingsForm.discussion_languages; + const selectedLangs = this.state.saveUserSettingsForm.discussion_languages; return ( <> -
      {i18n.t("settings")}
      +

      {I18NextService.i18n.t("settings")}

      -
      -