1 import { Component } from "inferno";
2 import { T } from "inferno-i18next-dess";
3 import { Link } from "inferno-router";
4 import { CreateComment, EditComment, Language } from "lemmy-js-client";
5 import { i18n } from "../../i18next";
6 import { CommentNodeI } from "../../interfaces";
7 import { UserService } from "../../services";
8 import { capitalizeFirstLetter, myAuthRequired } from "../../utils";
9 import { Icon } from "../common/icon";
10 import { MarkdownTextArea } from "../common/markdown-textarea";
12 interface CommentFormProps {
14 * Can either be the parent, or the editable comment. The right side is a postId.
16 node: CommentNodeI | number;
21 onReplyCancel?(): void;
22 allLanguages: Language[];
23 siteLanguages: number[];
24 onUpsertComment(form: EditComment | CreateComment): void;
27 export class CommentForm extends Component<CommentFormProps, any> {
28 constructor(props: any, context: any) {
29 super(props, context);
31 this.handleCommentSubmit = this.handleCommentSubmit.bind(this);
35 const initialContent =
36 typeof this.props.node !== "number"
38 ? this.props.node.comment_view.comment.content
43 <div className="mb-3">
44 {UserService.Instance.myUserInfo ? (
46 initialContent={initialContent}
48 buttonTitle={this.buttonTitle}
49 finished={this.props.finished}
50 replyType={typeof this.props.node !== "number"}
51 focus={this.props.focus}
52 disabled={this.props.disabled}
53 onSubmit={this.handleCommentSubmit}
54 onReplyCancel={this.props.onReplyCancel}
55 placeholder={i18n.t("comment_here")}
56 allLanguages={this.props.allLanguages}
57 siteLanguages={this.props.siteLanguages}
60 <div className="alert alert-warning" role="alert">
61 <Icon icon="alert-triangle" classes="icon-inline mr-2" />
62 <T i18nKey="must_login" class="d-inline">
64 <Link className="alert-link" to="/login">
74 get buttonTitle(): string {
75 return typeof this.props.node === "number"
76 ? capitalizeFirstLetter(i18n.t("post"))
78 ? capitalizeFirstLetter(i18n.t("save"))
79 : capitalizeFirstLetter(i18n.t("reply"));
82 handleCommentSubmit(content: string, form_id: string, language_id?: number) {
83 const { node, onUpsertComment, edit } = this.props;
84 if (typeof node === "number") {
91 auth: myAuthRequired(),
95 const comment_id = node.comment_view.comment.id;
101 auth: myAuthRequired(),
104 const post_id = node.comment_view.post.id;
105 const parent_id = node.comment_view.comment.id;
106 this.props.onUpsertComment({
112 auth: myAuthRequired(),