1 import { Component } from "inferno";
2 import { Redirect } from "inferno-router";
3 import { RouteComponentProps } from "inferno-router/dist/Route";
12 } from "lemmy-js-client";
13 import { Subscription } from "rxjs";
14 import { InitialFetchRequest, PostFormParams } from "shared/interfaces";
15 import { i18n } from "../../i18next";
16 import { UserService, WebSocketService } from "../../services";
32 import { HtmlTags } from "../common/html-tags";
33 import { Spinner } from "../common/icon";
34 import { PostForm } from "./post-form";
36 export interface CreatePostProps {
40 function getCreatePostQueryParams() {
41 return getQueryParams<CreatePostProps>({
42 communityId: getIdFromString,
46 interface CreatePostState {
47 siteRes: GetSiteResponse;
49 selectedCommunityChoice?: Choice;
52 export class CreatePost extends Component<
53 RouteComponentProps<Record<string, never>>,
56 private isoData = setIsoData(this.context);
57 private subscription?: Subscription;
58 state: CreatePostState = {
59 siteRes: this.isoData.site_res,
63 constructor(props: RouteComponentProps<Record<string, never>>, context: any) {
64 super(props, context);
66 this.handlePostCreate = this.handlePostCreate.bind(this);
67 this.handleSelectedCommunityChange =
68 this.handleSelectedCommunityChange.bind(this);
70 this.parseMessage = this.parseMessage.bind(this);
71 this.subscription = wsSubscribe(this.parseMessage);
73 // Only fetch the data if coming from another route
74 if (this.isoData.path === this.context.router.route.match.url) {
75 const communityRes = this.isoData.routeData[0] as
76 | GetCommunityResponse
80 const communityChoice: Choice = {
81 label: communityRes.community_view.community.name,
82 value: communityRes.community_view.community.id.toString(),
87 selectedCommunityChoice: communityChoice,
96 this.fetchCommunity();
101 const { communityId } = getCreatePostQueryParams();
102 const auth = myAuth(false);
105 const form: GetCommunity = {
110 WebSocketService.Instance.send(wsClient.getCommunity(form));
114 componentDidMount(): void {
115 const { communityId } = getCreatePostQueryParams();
117 if (communityId?.toString() !== this.state.selectedCommunityChoice?.value) {
118 this.fetchCommunity();
119 } else if (!communityId) {
121 selectedCommunityChoice: undefined,
127 componentWillUnmount() {
129 this.subscription?.unsubscribe();
133 get documentTitle(): string {
134 return `${i18n.t("create_post")} - ${
135 this.state.siteRes.site_view.site.name
140 const { selectedCommunityChoice } = this.state;
142 const locationState = this.props.history.location.state as
147 <div className="container-lg">
148 {!UserService.Instance.myUserInfo && <Redirect to="/login" />}
150 title={this.documentTitle}
151 path={this.context.router.route.match.url}
153 {this.state.loading ? (
158 <div className="row">
159 <div className="col-12 col-lg-6 offset-lg-3 mb-4">
160 <h5>{i18n.t("create_post")}</h5>
162 onCreate={this.handlePostCreate}
163 params={locationState}
164 enableDownvotes={enableDownvotes(this.state.siteRes)}
165 enableNsfw={enableNsfw(this.state.siteRes)}
166 allLanguages={this.state.siteRes.all_languages}
167 siteLanguages={this.state.siteRes.discussion_languages}
168 selectedCommunityChoice={selectedCommunityChoice}
169 onSelectCommunity={this.handleSelectedCommunityChange}
178 updateUrl({ communityId }: Partial<CreatePostProps>) {
179 const { communityId: urlCommunityId } = getCreatePostQueryParams();
181 const queryParams: QueryParams<CreatePostProps> = {
182 communityId: (communityId ?? urlCommunityId)?.toString(),
185 const locationState = this.props.history.location.state as
189 this.props.history.replace(
190 `/create_post${getQueryString(queryParams)}`,
194 this.fetchCommunity();
197 handleSelectedCommunityChange(choice: Choice) {
199 communityId: getIdFromString(choice?.value),
203 handlePostCreate(post_view: PostView) {
204 this.props.history.replace(`/post/${post_view.post.id}`);
207 static fetchInitialData({
209 query: { communityId },
211 }: InitialFetchRequest<QueryParams<CreatePostProps>>): Promise<any>[] {
212 const promises: Promise<any>[] = [];
215 const form: GetCommunity = {
217 id: getIdFromString(communityId),
220 promises.push(client.getCommunity(form));
222 promises.push(Promise.resolve());
228 parseMessage(msg: any) {
229 const op = wsUserOp(msg);
232 toast(i18n.t(msg.error), "danger");
236 if (op === UserOperation.GetCommunity) {
239 community: { name, id },
241 } = wsJsonToRes<GetCommunityResponse>(msg);
244 selectedCommunityChoice: { label: name, value: id.toString() },