From d75e4365c4ff79568d2c4b38f208e6b2b5a549d5 Mon Sep 17 00:00:00 2001 From: Alec Armbruster Date: Wed, 14 Jun 2023 16:29:04 -0400 Subject: [PATCH] remove pictrsDeleteToast usage from PostForm, add delete image button, fix infinite loading bug if upload error occured --- src/shared/components/post/post-form.tsx | 45 +++++++++++++++++++++--- 1 file changed, 41 insertions(+), 4 deletions(-) diff --git a/src/shared/components/post/post-form.tsx b/src/shared/components/post/post-form.tsx index 3ce96bb0..cef8e294 100644 --- a/src/shared/components/post/post-form.tsx +++ b/src/shared/components/post/post-form.tsx @@ -25,7 +25,6 @@ import { isImage, myAuth, myAuthRequired, - pictrsDeleteToast, relTags, setupTippy, toast, @@ -73,6 +72,7 @@ interface PostFormState { suggestedPostsRes: RequestState; metadataRes: RequestState; imageLoading: boolean; + imageDeleteUrl: string; communitySearchLoading: boolean; communitySearchOptions: Choice[]; previewMode: boolean; @@ -86,6 +86,7 @@ export class PostForm extends Component { form: {}, loading: false, imageLoading: false, + imageDeleteUrl: "", communitySearchLoading: false, previewMode: false, communitySearchOptions: [], @@ -269,6 +270,17 @@ export class PostForm extends Component { {url && isImage(url) && ( )} + {this.state.imageDeleteUrl && ( + + )} {this.props.crossPosts && this.props.crossPosts.length > 0 && ( <>
@@ -553,7 +565,15 @@ export class PostForm extends Component { } handlePostUrlChange(i: PostForm, event: any) { - i.setState(s => ((s.form.url = event.target.value), s)); + const url = event.target.value; + + i.setState({ + form: { + url, + }, + imageDeleteUrl: "", + }); + i.fetchPageTitle(); } @@ -644,18 +664,35 @@ export class PostForm extends Component { if (res.state === "success") { if (res.data.msg === "ok") { i.state.form.url = res.data.url; - pictrsDeleteToast(file.name, res.data.delete_url as string); - i.setState({ imageLoading: false }); + i.setState({ + imageLoading: false, + imageDeleteUrl: res.data.delete_url as string, + }); } else { toast(JSON.stringify(res), "danger"); } } else if (res.state === "failed") { console.error(res.msg); toast(res.msg, "danger"); + i.setState({ imageLoading: false }); } }); } + handleImageDelete(i: PostForm) { + const { imageDeleteUrl } = i.state; + + fetch(imageDeleteUrl); + + i.setState({ + imageDeleteUrl: "", + imageLoading: false, + form: { + url: "", + }, + }); + } + handleCommunitySearch = debounce(async (text: string) => { const { selectedCommunityChoice } = this.props; this.setState({ communitySearchLoading: true });