fedi/lemmy-ui
1
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-23 23:11:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

remove pictrsDeleteToast usage from PostForm, add delete image button, fix infinite loading bug if upload error occured

Browse source
This commit is contained in:
Alec Armbruster 2023-06-14 16:29:04 -04:00
parent 2b1af707c3
commit d75e4365c4
No known key found for this signature in database
GPG key ID: 0BE3206ADE0F3B3B
1 changed files with 41 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
src/shared/components/post/post-form.tsx
View file

@ -25,7 +25,6 @@ import {
isImage,
myAuth,
myAuthRequired,
pictrsDeleteToast,
relTags,
setupTippy,
toast,
@ -73,6 +72,7 @@ interface PostFormState {
suggestedPostsRes: RequestState<SearchResponse>;
metadataRes: RequestState<GetSiteMetadataResponse>;
imageLoading: boolean;
imageDeleteUrl: string;
communitySearchLoading: boolean;
communitySearchOptions: Choice[];
previewMode: boolean;
@ -86,6 +86,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
form: {},
loading: false,
imageLoading: false,
imageDeleteUrl: "",
communitySearchLoading: false,
previewMode: false,
communitySearchOptions: [],
@ -269,6 +270,17 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
{url && isImage(url) && (
<img src={url} className="img-fluid" alt="" />
)}
{this.state.imageDeleteUrl && (
<button
className="btn btn-danger mt-2"
onClick={linkEvent(this, this.handleImageDelete)}
aria-label={i18n.t("delete")}
data-tippy-content={i18n.t("delete")}
>
<Icon icon="x" classes="icon-inline mr-1" />
{capitalizeFirstLetter(i18n.t("delete"))}
</button>
)}
{this.props.crossPosts && this.props.crossPosts.length > 0 && (
<>
<div className="my-1 text-muted small font-weight-bold">
@ -553,7 +565,15 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
}
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<PostFormProps, PostFormState> {
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 });