diff --git a/src/assets/css/main.css b/src/assets/css/main.css index 1c45341d..3ff70e47 100644 --- a/src/assets/css/main.css +++ b/src/assets/css/main.css @@ -75,6 +75,11 @@ font-size: 1.2rem; } +.md-div pre { + white-space: pre; + overflow-x: auto; +} + .md-div table { border-collapse: collapse; width: 100%; diff --git a/src/shared/components/home/login.tsx b/src/shared/components/home/login.tsx index 87ef234e..94915542 100644 --- a/src/shared/components/home/login.tsx +++ b/src/shared/components/home/login.tsx @@ -195,7 +195,7 @@ export class Login extends Component { } handleLoginUsernameChange(i: Login, event: any) { - i.state.form.username_or_email = event.target.value; + i.state.form.username_or_email = event.target.value.trim(); i.setState(i.state); } diff --git a/src/shared/components/home/setup.tsx b/src/shared/components/home/setup.tsx index 581c1c56..14350a58 100644 --- a/src/shared/components/home/setup.tsx +++ b/src/shared/components/home/setup.tsx @@ -221,7 +221,7 @@ export class Setup extends Component { } handleRegisterUsernameChange(i: Setup, event: any) { - i.state.form.username = event.target.value; + i.state.form.username = event.target.value.trim(); i.setState(i.state); } diff --git a/src/shared/components/home/signup.tsx b/src/shared/components/home/signup.tsx index 3efeac62..16a3cc6d 100644 --- a/src/shared/components/home/signup.tsx +++ b/src/shared/components/home/signup.tsx @@ -496,7 +496,7 @@ export class Signup extends Component { } handleRegisterUsernameChange(i: Signup, event: any) { - i.state.form.username = event.target.value; + i.state.form.username = event.target.value.trim(); i.setState(i.state); } diff --git a/src/shared/components/post/post-form.tsx b/src/shared/components/post/post-form.tsx index 3ce96bb0..4640922d 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 }); diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx index f1f06c58..d5fc785c 100644 --- a/src/shared/components/post/post-listing.tsx +++ b/src/shared/components/post/post-listing.tsx @@ -835,6 +835,8 @@ export class PostListing extends Component { search: "", }} title={i18n.t("cross_post")} + data-tippy-content={i18n.t("cross_post")} + aria-label={i18n.t("cross_post")} >