1 import { getRecipientIdFromProps, myAuth, setIsoData } from "@utils/app";
2 import { RouteDataResponse } from "@utils/types";
3 import { Component } from "inferno";
5 CreatePrivateMessage as CreatePrivateMessageI,
7 GetPersonDetailsResponse,
9 } from "lemmy-js-client";
10 import { InitialFetchRequest } from "../../interfaces";
11 import { FirstLoadService, I18NextService } from "../../services";
12 import { HttpService, RequestState } from "../../services/HttpService";
13 import { toast } from "../../toast";
14 import { HtmlTags } from "../common/html-tags";
15 import { Spinner } from "../common/icon";
16 import { PrivateMessageForm } from "./private-message-form";
18 type CreatePrivateMessageData = RouteDataResponse<{
19 recipientDetailsResponse: GetPersonDetailsResponse;
22 interface CreatePrivateMessageState {
23 siteRes: GetSiteResponse;
24 recipientRes: RequestState<GetPersonDetailsResponse>;
26 isIsomorphic: boolean;
29 export class CreatePrivateMessage extends Component<
31 CreatePrivateMessageState
33 private isoData = setIsoData<CreatePrivateMessageData>(this.context);
34 state: CreatePrivateMessageState = {
35 siteRes: this.isoData.site_res,
36 recipientRes: { state: "empty" },
37 recipientId: getRecipientIdFromProps(this.props),
41 constructor(props: any, context: any) {
42 super(props, context);
43 this.handlePrivateMessageCreate =
44 this.handlePrivateMessageCreate.bind(this);
46 // Only fetch the data if coming from another route
47 if (FirstLoadService.isFirstLoad) {
50 recipientRes: this.isoData.routeData.recipientDetailsResponse,
56 async componentDidMount() {
57 if (!this.state.isIsomorphic) {
58 await this.fetchPersonDetails();
62 static async fetchInitialData({
66 }: InitialFetchRequest): Promise<CreatePrivateMessageData> {
67 const person_id = Number(path.split("/").pop());
69 const form: GetPersonDetails = {
77 recipientDetailsResponse: await client.getPersonDetails(form),
81 async fetchPersonDetails() {
83 recipientRes: { state: "loading" },
87 recipientRes: await HttpService.client.getPersonDetails({
88 person_id: this.state.recipientId,
96 get documentTitle(): string {
97 if (this.state.recipientRes.state == "success") {
98 const name_ = this.state.recipientRes.data.person_view.person.name;
99 return `${I18NextService.i18n.t("create_private_message")} - ${name_}`;
105 renderRecipientRes() {
106 switch (this.state.recipientRes.state) {
114 const res = this.state.recipientRes.data;
116 <div className="row">
117 <div className="col-12 col-lg-6 offset-lg-3 mb-4">
118 <h5>{I18NextService.i18n.t("create_private_message")}</h5>
120 onCreate={this.handlePrivateMessageCreate}
121 recipient={res.person_view.person}
132 <div className="create-private-message container-lg">
134 title={this.documentTitle}
135 path={this.context.router.route.match.url}
137 {this.renderRecipientRes()}
142 async handlePrivateMessageCreate(form: CreatePrivateMessageI) {
143 const res = await HttpService.client.createPrivateMessage(form);
145 if (res.state == "success") {
146 toast(I18NextService.i18n.t("message_sent"));
148 // Navigate to the front
149 this.context.router.history.push("/");