From 65703793f6ed3f0d56d4e7faac9791b62431eccd Mon Sep 17 00:00:00 2001 From: Jay Sitter Date: Wed, 21 Jun 2023 00:01:31 -0400 Subject: [PATCH 1/6] fix: Fix Communities search/filter header #1417 --- .../components/community/communities.tsx | 28 +++++++++---------- 1 file changed, 13 insertions(+), 15 deletions(-) diff --git a/src/shared/components/community/communities.tsx b/src/shared/components/community/communities.tsx index 7cf072ef..bf897823 100644 --- a/src/shared/components/community/communities.tsx +++ b/src/shared/components/community/communities.tsx @@ -100,19 +100,17 @@ export class Communities extends Component { const { listingType, page } = this.getCommunitiesQueryParams(); return (
-
-
-

{i18n.t("list_of_communities")}

- - - +

{i18n.t("list_of_communities")}

+
+
+
-
{this.searchForm()}
+
{this.searchForm()}
@@ -220,14 +218,14 @@ export class Communities extends Component { searchForm() { return (
{ -
From deed524a7f7ac9b3e8ebd9dcfe3e22809ad4f8f5 Mon Sep 17 00:00:00 2001 From: Jay Sitter Date: Wed, 21 Jun 2023 00:20:05 -0400 Subject: [PATCH 2/6] fix: Small adjustments to create post form --- .../components/common/language-select.tsx | 7 ++-- src/shared/components/post/create-post.tsx | 2 +- src/shared/components/post/post-form.tsx | 38 ++++++++----------- 3 files changed, 20 insertions(+), 27 deletions(-) diff --git a/src/shared/components/common/language-select.tsx b/src/shared/components/common/language-select.tsx index 619e1a5a..02deb434 100644 --- a/src/shared/components/common/language-select.tsx +++ b/src/shared/components/common/language-select.tsx @@ -66,10 +66,9 @@ export class LanguageSelect extends Component { {i18n.t(this.props.multiple ? "language_plural" : "language")}
{this.selectBtn} {this.props.multiple && ( diff --git a/src/shared/components/post/create-post.tsx b/src/shared/components/post/create-post.tsx index ebdf9995..ff136c2f 100644 --- a/src/shared/components/post/create-post.tsx +++ b/src/shared/components/post/create-post.tsx @@ -178,7 +178,7 @@ export class CreatePost extends Component< id="createPostForm" className="col-12 col-lg-6 offset-lg-3 mb-4" > -
{i18n.t("create_post")}
+

{i18n.t("create_post")}

{ />
+ {!this.props.post_view && (
)} {this.props.enableNsfw && ( -
- - {i18n.t("nsfw")} - -
-
- -
-
+
+ +
)} - Date: Wed, 21 Jun 2023 11:52:32 +0000 Subject: [PATCH 3/6] Com create post (#1431) * Fix create post for community not having community selected by default * Fix issue where fields would reset when creating post * Run prettier and lint --- lemmy-translations | 2 +- src/shared/components/post/create-post.tsx | 2 +- src/shared/components/post/post-form.tsx | 316 ++++++++++----------- tsconfig.json | 2 +- 4 files changed, 155 insertions(+), 167 deletions(-) diff --git a/lemmy-translations b/lemmy-translations index 7fc71d08..a241fe12 160000 --- a/lemmy-translations +++ b/lemmy-translations @@ -1 +1 @@ -Subproject commit 7fc71d0860bbe5c6d620ec27112350ffe5b9229c +Subproject commit a241fe1255a6363c7ae1ec5a09520c066745e6ce diff --git a/src/shared/components/post/create-post.tsx b/src/shared/components/post/create-post.tsx index ebdf9995..8c74c341 100644 --- a/src/shared/components/post/create-post.tsx +++ b/src/shared/components/post/create-post.tsx @@ -114,7 +114,7 @@ export class CreatePost extends Component< if (res.state === "success") { this.setState({ selectedCommunityChoice: { - label: res.data.community_view.community.name, + label: res.data.community_view.community.title, value: res.data.community_view.community.id.toString(), }, loading: false, diff --git a/src/shared/components/post/post-form.tsx b/src/shared/components/post/post-form.tsx index 4b74e07f..8224683b 100644 --- a/src/shared/components/post/post-form.tsx +++ b/src/shared/components/post/post-form.tsx @@ -79,6 +79,143 @@ interface PostFormState { submitted: boolean; } +function handlePostSubmit(i: PostForm, event: any) { + event.preventDefault(); + // Coerce empty url string to undefined + if ((i.state.form.url ?? "") === "") { + i.setState(s => ((s.form.url = undefined), s)); + } + i.setState({ loading: true, submitted: true }); + const auth = myAuthRequired(); + + const pForm = i.state.form; + const pv = i.props.post_view; + + if (pv) { + i.props.onEdit?.({ + name: pForm.name, + url: pForm.url, + body: pForm.body, + nsfw: pForm.nsfw, + post_id: pv.post.id, + language_id: pForm.language_id, + auth, + }); + } else if (pForm.name && pForm.community_id) { + i.props.onCreate?.({ + name: pForm.name, + community_id: pForm.community_id, + url: pForm.url, + body: pForm.body, + nsfw: pForm.nsfw, + language_id: pForm.language_id, + honeypot: pForm.honeypot, + auth, + }); + } +} + +function copySuggestedTitle(d: { i: PostForm; suggestedTitle?: string }) { + const sTitle = d.suggestedTitle; + if (sTitle) { + d.i.setState( + s => ((s.form.name = sTitle?.substring(0, MAX_POST_TITLE_LENGTH)), s) + ); + d.i.setState({ suggestedPostsRes: { state: "empty" } }); + setTimeout(() => { + const textarea: any = document.getElementById("post-title"); + autosize.update(textarea); + }, 10); + } +} + +function handlePostUrlChange(i: PostForm, event: any) { + const url = event.target.value; + + i.setState(prev => ({ + ...prev, + form: { + ...prev.form, + url, + }, + imageDeleteUrl: "", + })); + + i.fetchPageTitle(); +} + +function handlePostNsfwChange(i: PostForm, event: any) { + i.setState(s => ((s.form.nsfw = event.target.checked), s)); +} + +function handleHoneyPotChange(i: PostForm, event: any) { + i.setState(s => ((s.form.honeypot = event.target.value), s)); +} + +function handleCancel(i: PostForm) { + i.props.onCancel?.(); +} + +function handleImageUploadPaste(i: PostForm, event: any) { + const image = event.clipboardData.files[0]; + if (image) { + handleImageUpload(i, image); + } +} + +function handleImageUpload(i: PostForm, event: any) { + let file: any; + if (event.target) { + event.preventDefault(); + file = event.target.files[0]; + } else { + file = event; + } + + i.setState({ imageLoading: true }); + + HttpService.client.uploadImage({ image: file }).then(res => { + console.log("pictrs upload:"); + console.log(res); + if (res.state === "success") { + if (res.data.msg === "ok") { + i.state.form.url = res.data.url; + 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 }); + } + }); +} + +function handlePostNameChange(i: PostForm, event: any) { + i.setState(s => ((s.form.name = event.target.value), s)); + i.fetchSimilarPosts(); +} + +function handleImageDelete(i: PostForm) { + const { imageDeleteUrl } = i.state; + + fetch(imageDeleteUrl); + + i.setState(prev => ({ + ...prev, + imageDeleteUrl: "", + imageLoading: false, + form: { + ...prev.form, + url: "", + }, + })); +} + export class PostForm extends Component { state: PostFormState = { suggestedPostsRes: { state: "empty" }, @@ -123,16 +260,16 @@ export class PostForm extends Component { ...this.state.form, community_id: getIdFromString(selectedCommunityChoice.value), }, - communitySearchOptions: [selectedCommunityChoice] - .concat( + communitySearchOptions: [selectedCommunityChoice].concat( + ( this.props.initialCommunities?.map( ({ community: { id, title } }) => ({ label: title, value: id.toString(), }) ) ?? [] - ) - .filter(option => option.value !== selectedCommunityChoice.value), + ).filter(option => option.value !== selectedCommunityChoice.value) + ), }; } else { this.state = { @@ -188,15 +325,8 @@ export class PostForm extends Component { const url = this.state.form.url; - // TODO - // const promptCheck = - // !!this.state.form.name || !!this.state.form.url || !!this.state.form.body; - // return ( - + { type="url" id="post-url" className="form-control" - value={this.state.form.url} - onInput={linkEvent(this, this.handlePostUrlChange)} - onPaste={linkEvent(this, this.handleImageUploadPaste)} + value={url} + onInput={linkEvent(this, handlePostUrlChange)} + onPaste={linkEvent(this, handleImageUploadPaste)} /> {this.renderSuggestedTitleCopy()} @@ -237,7 +367,7 @@ export class PostForm extends Component { name="file" className="d-none" disabled={!UserService.Instance.myUserInfo} - onChange={linkEvent(this, this.handleImageUpload)} + onChange={linkEvent(this, handleImageUpload)} /> {url && validURL(url) && ( @@ -276,7 +406,7 @@ export class PostForm extends Component { {this.state.imageDeleteUrl && (