Fix Language not allowed infinite loading on failed post (#2457)

* Fix language not allowed bug

* Add translations

lemmy-translations

@@ -1 +1 @@
-Subproject commit f0ab81deea347c433277a90ae752b10f68473719
+Subproject commit ba69ae03d856a9947c54a872dd6e7fb0ed92ea84

src/shared/components/post/create-post.tsx

@@ -32,6 +32,7 @@ import { PostForm } from "./post-form";
 import { getHttpBaseInternal } from "../../utils/env";
 import { IRoutePropsWithFetch } from "../../routes";
 import { simpleScrollMixin } from "../mixins/scroll-mixin";
+import { toast } from "../../toast";
 
 export interface CreatePostProps {
   communityId?: number;
@@ -164,7 +165,7 @@ export class CreatePost extends Component<
   }
 
   render() {
-    const { selectedCommunityChoice, siteRes } = this.state;
+    const { selectedCommunityChoice, siteRes, loading } = this.state;
 
     const locationState = this.props.history.location.state as
       | PostFormParams
@@ -204,6 +205,7 @@ export class CreatePost extends Component<
                     ? this.state.initialCommunitiesRes.data.communities
                     : []
                 }
+                loading={loading}
               />
             </div>
           </div>
@@ -245,10 +247,11 @@ export class CreatePost extends Component<
     if (res.state === "success") {
       const postId = res.data.post_view.post.id;
       this.props.history.replace(`/post/${postId}`);
-    } else {
+    } else if (res.state === "failed") {
       this.setState({
         loading: false,
       });
+      toast(I18NextService.i18n.t(res.err.message), "danger");
     }
   }
 

src/shared/components/post/post-form.tsx

@@ -62,6 +62,7 @@ interface PostFormProps {
   selectedCommunityChoice?: Choice;
   onSelectCommunity?: (choice: Choice) => void;
   initialCommunities?: CommunityView[];
+  loading: boolean;
 }
 
 interface PostFormState {
@@ -76,7 +77,6 @@ interface PostFormState {
     custom_thumbnail?: string;
     alt_text?: string;
   };
-  loading: boolean;
   suggestedPostsRes: RequestState<SearchResponse>;
   metadataRes: RequestState<GetSiteMetadataResponse>;
   imageLoading: boolean;
@@ -93,7 +93,7 @@ function handlePostSubmit(i: PostForm, event: any) {
   if ((i.state.form.url ?? "") === "") {
     i.setState(s => ((s.form.url = undefined), s));
   }
-  i.setState({ loading: true, submitted: true });
+  i.setState({ submitted: true });
 
   const pForm = i.state.form;
   const pv = i.props.post_view;
@@ -240,7 +240,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
     suggestedPostsRes: EMPTY_REQUEST,
     metadataRes: EMPTY_REQUEST,
     form: {},
-    loading: false,
     imageLoading: false,
     imageDeleteUrl: "",
     communitySearchLoading: false,
@@ -597,11 +596,11 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
         <div className="mb-3 row">
           <div className="col-sm-10">
             <button
-              disabled={!this.state.form.community_id || this.state.loading}
+              disabled={!this.state.form.community_id || this.props.loading}
               type="submit"
               className="btn btn-secondary me-2"
             >
-              {this.state.loading ? (
+              {this.props.loading ? (
                 <Spinner />
               ) : this.props.post_view ? (
                 capitalizeFirstLetter(I18NextService.i18n.t("save"))

src/shared/components/post/post-listing.tsx

@@ -51,6 +51,7 @@ import { BanUpdateForm } from "../common/mod-action-form-modal";
 import PostActionDropdown from "../common/content-actions/post-action-dropdown";
 import { CrossPostParams } from "@utils/types";
 import { RequestState } from "../../services/HttpService";
+import { toast } from "../../toast";
 
 type PostListingState = {
   showEdit: boolean;
@@ -58,6 +59,7 @@ type PostListingState = {
   viewSource: boolean;
   showAdvanced: boolean;
   showBody: boolean;
+  loading: boolean;
 };
 
 interface PostListingProps {
@@ -107,6 +109,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
     viewSource: false,
     showAdvanced: false,
     showBody: false,
+    loading: false,
   };
 
   constructor(props: any, context: any) {
@@ -176,6 +179,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
             voteDisplayMode={this.props.voteDisplayMode}
             allLanguages={this.props.allLanguages}
             siteLanguages={this.props.siteLanguages}
+            loading={this.state.loading}
           />
         )}
       </div>
@@ -812,9 +816,15 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
   }
 
   // The actual editing is done in the receive for post
-  handleEditPost(form: EditPost) {
-    this.setState({ showEdit: false });
-    return this.props.onPostEdit(form);
+  async handleEditPost(form: EditPost) {
+    this.setState({ showEdit: false, loading: true });
+    const res = await this.props.onPostEdit(form);
+
+    if (res.state === "success") {
+      toast(I18NextService.i18n.t("edited_post"));
+    } else if (res.state === "failed") {
+      toast(I18NextService.i18n.t(res.err.message), "danger");
+    }
   }
 
   handleShare(i: PostListing) {