import { Component, linkEvent } from "inferno"; import { pictrsUri } from "../env"; import { UserService } from "../services"; import { toast, randomStr } from "../utils"; import { i18n } from "../i18next"; import { Icon } from "./icon"; interface ImageUploadFormProps { uploadTitle: string; imageSrc: string; onUpload(url: string): any; onRemove(): any; rounded?: boolean; } interface ImageUploadFormState { loading: boolean; } export class ImageUploadForm extends Component< ImageUploadFormProps, ImageUploadFormState > { private id = `image-upload-form-${randomStr()}`; private emptyState: ImageUploadFormState = { loading: false, }; constructor(props: any, context: any) { super(props, context); this.state = this.emptyState; } render() { return (
); } handleImageUpload(i: ImageUploadForm, event: any) { event.preventDefault(); let file = event.target.files[0]; const formData = new FormData(); formData.append("images[]", file); i.state.loading = true; i.setState(i.state); fetch(pictrsUri, { method: "POST", body: formData, }) .then(res => res.json()) .then(res => { console.log("pictrs upload:"); console.log(res); if (res.msg == "ok") { let hash = res.files[0].file; let url = `${pictrsUri}/${hash}`; i.state.loading = false; i.setState(i.state); i.props.onUpload(url); } else { i.state.loading = false; i.setState(i.state); toast(JSON.stringify(res), "danger"); } }) .catch(error => { i.state.loading = false; i.setState(i.state); toast(error, "danger"); }); } handleRemoveImage(i: ImageUploadForm, event: any) { event.preventDefault(); i.state.loading = true; i.setState(i.state); i.props.onRemove(); } }