LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-25 13:51:13 +00:00
Code Issues Projects Releases Wiki Activity

Merge branch 'main' into mainfest-fix

Browse source
This commit is contained in:
Dessalines 2023-06-21 07:55:20 -04:00 committed by GitHub
commit 0ca1af351d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 155 additions and 167 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
lemmy-translations

@ -1 +1 @@
Subproject commit 7fc71d0860bbe5c6d620ec27112350ffe5b9229c
Subproject commit a241fe1255a6363c7ae1ec5a09520c066745e6ce

2
src/shared/components/post/create-post.tsx
View file

@ -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,

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

@ -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<PostFormProps, PostFormState> {
state: PostFormState = {
suggestedPostsRes: { state: "empty" },
@ -123,16 +260,16 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
...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<PostFormProps, PostFormState> {
const url = this.state.form.url;
// TODO
// const promptCheck =
// !!this.state.form.name || !!this.state.form.url || !!this.state.form.body;
// <Prompt when={promptCheck} message={i18n.t("block_leaving")} />
return (
<form
className="post-form"
onSubmit={linkEvent(this, this.handlePostSubmit)}
>
<form className="post-form" onSubmit={linkEvent(this, handlePostSubmit)}>
<NavigationPrompt
when={
!!(
@ -215,9 +345,9 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
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()}
<form>
@ -237,7 +367,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
name="file"
className="d-none"
disabled={!UserService.Instance.myUserInfo}
onChange={linkEvent(this, this.handleImageUpload)}
onChange={linkEvent(this, handleImageUpload)}
/>
</form>
{url && validURL(url) && (
@ -276,7 +406,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
{this.state.imageDeleteUrl && (
<button
className="btn btn-danger btn-sm mt-2"
onClick={linkEvent(this, this.handleImageDelete)}
onClick={linkEvent(this, handleImageDelete)}
aria-label={i18n.t("delete")}
data-tippy-content={i18n.t("delete")}
>
@ -327,7 +457,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
<textarea
value={this.state.form.name}
id="post-title"
onInput={linkEvent(this, this.handlePostNameChange)}
onInput={linkEvent(this, handlePostNameChange)}
className={`form-control ${
!validTitle(this.state.form.name) && "is-invalid"
}`}
@ -392,7 +522,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
id="post-nsfw"
type="checkbox"
checked={this.state.form.nsfw}
onChange={linkEvent(this, this.handlePostNsfwChange)}
onChange={linkEvent(this, handlePostNsfwChange)}
/>
</div>
</div>
@ -413,7 +543,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
className="form-control honeypot"
id="register-honey"
value={this.state.form.honeypot}
onInput={linkEvent(this, this.handleHoneyPotChange)}
onInput={linkEvent(this, handleHoneyPotChange)}
/>
<div className="mb-3 row">
<div className="col-sm-10">
@ -434,7 +564,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
<button
type="button"
className="btn btn-secondary"
onClick={linkEvent(this, this.handleCancel)}
onClick={linkEvent(this, handleCancel)}
>
{i18n.t("cancel")}
</button>
@ -459,7 +589,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
role="button"
onClick={linkEvent(
{ i: this, suggestedTitle },
this.copySuggestedTitle
copySuggestedTitle
)}
>
{i18n.t("copy_suggested_title", { title: "" })} {suggestedTitle}
@ -517,69 +647,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
}
}
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,
});
}
}
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);
}
}
handlePostUrlChange(i: PostForm, event: any) {
const url = event.target.value;
i.setState({
form: {
url,
},
imageDeleteUrl: "",
});
i.fetchPageTitle();
}
async fetchPageTitle() {
const url = this.state.form.url;
if (url && validURL(url)) {
@ -590,11 +657,6 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
}
}
handlePostNameChange(i: PostForm, event: any) {
i.setState(s => ((s.form.name = event.target.value), s));
i.fetchSimilarPosts();
}
async fetchSimilarPosts() {
const q = this.state.form.name;
if (q && q !== "") {
@ -618,84 +680,10 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
this.setState(s => ((s.form.body = val), s));
}
handlePostCommunityChange(i: PostForm, event: any) {
i.setState(s => ((s.form.community_id = Number(event.target.value)), s));
}
handlePostNsfwChange(i: PostForm, event: any) {
i.setState(s => ((s.form.nsfw = event.target.checked), s));
}
handleLanguageChange(val: number[]) {
this.setState(s => ((s.form.language_id = val.at(0)), s));
}
handleHoneyPotChange(i: PostForm, event: any) {
i.setState(s => ((s.form.honeypot = event.target.value), s));
}
handleCancel(i: PostForm) {
i.props.onCancel?.();
}
handlePreviewToggle(i: PostForm, event: any) {
event.preventDefault();
i.setState({ previewMode: !i.state.previewMode });
}
handleImageUploadPaste(i: PostForm, event: any) {
const image = event.clipboardData.files[0];
if (image) {
i.handleImageUpload(i, image);
}
}
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 });
}
});
}
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 });

2
tsconfig.json
View file

@ -21,7 +21,7 @@
"noFallthroughCasesInSwitch": true,
"paths": {
"@/*": ["/*"],
"@utils/*": ["shared/utils/*"],
"@utils/*": ["shared/utils/*"]
}
},
"include": [