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 { i18n } from "../../i18next";
11 import { InitialFetchRequest } from "../../interfaces";
12 import { FirstLoadService } from "../../services/FirstLoadService";
13 import { HttpService, RequestState } from "../../services/HttpService";
14 import { toast } from "../../toast";
15 import { HtmlTags } from "../common/html-tags";
16 import { Spinner } from "../common/icon";
17 import { PrivateMessageForm } from "./private-message-form";
19 type CreatePrivateMessageData = RouteDataResponse<{
20 recipientDetailsResponse: GetPersonDetailsResponse;
23 interface CreatePrivateMessageState {
24 siteRes: GetSiteResponse;
25 recipientRes: RequestState<GetPersonDetailsResponse>;
27 isIsomorphic: boolean;
30 export class CreatePrivateMessage extends Component<
32 CreatePrivateMessageState
34 private isoData = setIsoData<CreatePrivateMessageData>(this.context);
35 state: CreatePrivateMessageState = {
36 siteRes: this.isoData.site_res,
37 recipientRes: { state: "empty" },
38 recipientId: getRecipientIdFromProps(this.props),
42 constructor(props: any, context: any) {
43 super(props, context);
44 this.handlePrivateMessageCreate =
45 this.handlePrivateMessageCreate.bind(this);
47 // Only fetch the data if coming from another route
48 if (FirstLoadService.isFirstLoad) {
51 recipientRes: this.isoData.routeData.recipientDetailsResponse,
57 async componentDidMount() {
58 if (!this.state.isIsomorphic) {
59 await this.fetchPersonDetails();
63 static async fetchInitialData({
67 }: InitialFetchRequest): Promise<CreatePrivateMessageData> {
68 const person_id = Number(path.split("/").pop());
70 const form: GetPersonDetails = {
78 recipientDetailsResponse: await client.getPersonDetails(form),
82 async fetchPersonDetails() {
84 recipientRes: { state: "loading" },
88 recipientRes: await HttpService.client.getPersonDetails({
89 person_id: this.state.recipientId,
97 get documentTitle(): string {
98 if (this.state.recipientRes.state == "success") {
99 const name_ = this.state.recipientRes.data.person_view.person.name;
100 return `${i18n.t("create_private_message")} - ${name_}`;
106 renderRecipientRes() {
107 switch (this.state.recipientRes.state) {
115 const res = this.state.recipientRes.data;
117 <div className="row">
118 <div className="col-12 col-lg-6 offset-lg-3 mb-4">
119 <h5>{i18n.t("create_private_message")}</h5>
121 onCreate={this.handlePrivateMessageCreate}
122 recipient={res.person_view.person}
133 <div className="create-private-message container-lg">
135 title={this.documentTitle}
136 path={this.context.router.route.match.url}
138 {this.renderRecipientRes()}
143 async handlePrivateMessageCreate(form: CreatePrivateMessageI) {
144 const res = await HttpService.client.createPrivateMessage(form);
146 if (res.state == "success") {
147 toast(i18n.t("message_sent"));
149 // Navigate to the front
150 this.context.router.history.push("/");