src/shared/components/post/post-form.tsx

   1 import { None, Option, Some } from "@sniptt/monads";
   2 import autosize from "autosize";
   3 import { Component, linkEvent } from "inferno";
   4 import { Prompt } from "inferno-router";
   5 import {
   6   CommunityView,
   7   CreatePost,
   8   EditPost,
   9   Language,
  10   ListingType,
  11   PostResponse,
  12   PostView,
  13   Search,
  14   SearchResponse,
  15   SearchType,
  16   SortType,
  17   toUndefined,
  18   UserOperation,
  19   wsJsonToRes,
  20   wsUserOp,
  21 } from "lemmy-js-client";
  22 import { Subscription } from "rxjs";
  23 import { pictrsUri } from "../../env";
  24 import { i18n } from "../../i18next";
  25 import { PostFormParams } from "../../interfaces";
  26 import { UserService, WebSocketService } from "../../services";
  27 import {
  28   archiveTodayUrl,
  29   auth,
  30   capitalizeFirstLetter,
  31   choicesConfig,
  32   communitySelectName,
  33   communityToChoice,
  34   debounce,
  35   fetchCommunities,
  36   getSiteMetadata,
  37   ghostArchiveUrl,
  38   isBrowser,
  39   isImage,
  40   myFirstDiscussionLanguageId,
  41   pictrsDeleteToast,
  42   relTags,
  43   setupTippy,
  44   toast,
  45   trendingFetchLimit,
  46   validTitle,
  47   validURL,
  48   webArchiveUrl,
  49   wsClient,
  50   wsSubscribe,
  51 } from "../../utils";
  52 import { Icon, Spinner } from "../common/icon";
  53 import { LanguageSelect } from "../common/language-select";
  54 import { MarkdownTextArea } from "../common/markdown-textarea";
  55 import { PostListings } from "./post-listings";
  56
  57 var Choices: any;
  58 if (isBrowser()) {
  59   Choices = require("choices.js");
  60 }
  61
  62 const MAX_POST_TITLE_LENGTH = 200;
  63
  64 interface PostFormProps {
  65   post_view: Option<PostView>; // If a post is given, that means this is an edit
  66   allLanguages: Language[];
  67   communities: Option<CommunityView[]>;
  68   params: Option<PostFormParams>;
  69   onCancel?(): any;
  70   onCreate?(post: PostView): any;
  71   onEdit?(post: PostView): any;
  72   enableNsfw?: boolean;
  73   enableDownvotes?: boolean;
  74 }
  75
  76 interface PostFormState {
  77   postForm: CreatePost;
  78   suggestedTitle: Option<string>;
  79   suggestedPosts: Option<PostView[]>;
  80   crossPosts: Option<PostView[]>;
  81   loading: boolean;
  82   imageLoading: boolean;
  83   communitySearchLoading: boolean;
  84   previewMode: boolean;
  85 }
  86
  87 export class PostForm extends Component<PostFormProps, PostFormState> {
  88   private subscription: Subscription;
  89   private choices: any;
  90   private emptyState: PostFormState = {
  91     postForm: new CreatePost({
  92       community_id: undefined,
  93       name: undefined,
  94       nsfw: Some(false),
  95       url: None,
  96       body: None,
  97       honeypot: None,
  98       language_id: None,
  99       auth: undefined,
 100     }),
 101     loading: false,
 102     imageLoading: false,
 103     communitySearchLoading: false,
 104     previewMode: false,
 105     suggestedTitle: None,
 106     suggestedPosts: None,
 107     crossPosts: None,
 108   };
 109
 110   constructor(props: any, context: any) {
 111     super(props, context);
 112     this.fetchSimilarPosts = debounce(this.fetchSimilarPosts.bind(this));
 113     this.fetchPageTitle = debounce(this.fetchPageTitle.bind(this));
 114     this.handlePostBodyChange = this.handlePostBodyChange.bind(this);
 115     this.handleLanguageChange = this.handleLanguageChange.bind(this);
 116
 117     this.state = this.emptyState;
 118
 119     this.parseMessage = this.parseMessage.bind(this);
 120     this.subscription = wsSubscribe(this.parseMessage);
 121
 122     // Means its an edit
 123     if (this.props.post_view.isSome()) {
 124       let pv = this.props.post_view.unwrap();
 125
 126       this.state = {
 127         ...this.state,
 128         postForm: new CreatePost({
 129           body: pv.post.body,
 130           name: pv.post.name,
 131           community_id: pv.community.id,
 132           url: pv.post.url,
 133           nsfw: Some(pv.post.nsfw),
 134           honeypot: None,
 135           language_id: Some(pv.post.language_id),
 136           auth: auth().unwrap(),
 137         }),
 138       };
 139     }
 140
 141     if (this.props.params.isSome()) {
 142       let params = this.props.params.unwrap();
 143       this.state = {
 144         ...this.state,
 145         postForm: {
 146           ...this.state.postForm,
 147           name: toUndefined(params.name),
 148           url: params.url,
 149           body: params.body,
 150         },
 151       };
 152     }
 153   }
 154
 155   componentDidMount() {
 156     setupTippy();
 157     this.setupCommunities();
 158     let textarea: any = document.getElementById("post-title");
 159     if (textarea) {
 160       autosize(textarea);
 161     }
 162   }
 163
 164   componentDidUpdate() {
 165     if (
 166       !this.state.loading &&
 167       (this.state.postForm.name ||
 168         this.state.postForm.url.isSome() ||
 169         this.state.postForm.body.isSome())
 170     ) {
 171       window.onbeforeunload = () => true;
 172     } else {
 173       window.onbeforeunload = undefined;
 174     }
 175   }
 176
 177   componentWillUnmount() {
 178     this.subscription.unsubscribe();
 179     /* this.choices && this.choices.destroy(); */
 180     window.onbeforeunload = null;
 181   }
 182
 183   render() {
 184     let selectedLangs = this.state.postForm.language_id
 185       .or(myFirstDiscussionLanguageId(UserService.Instance.myUserInfo))
 186       .map(Array.of);
 187
 188     return (
 189       <div>
 190         <Prompt
 191           when={
 192             !this.state.loading &&
 193             (this.state.postForm.name ||
 194               this.state.postForm.url.isSome() ||
 195               this.state.postForm.body.isSome())
 196           }
 197           message={i18n.t("block_leaving")}
 198         />
 199         <form onSubmit={linkEvent(this, this.handlePostSubmit)}>
 200           <div className="form-group row">
 201             <label className="col-sm-2 col-form-label" htmlFor="post-url">
 202               {i18n.t("url")}
 203             </label>
 204             <div className="col-sm-10">
 205               <input
 206                 type="url"
 207                 id="post-url"
 208                 className="form-control"
 209                 value={toUndefined(this.state.postForm.url)}
 210                 onInput={linkEvent(this, this.handlePostUrlChange)}
 211                 onPaste={linkEvent(this, this.handleImageUploadPaste)}
 212               />
 213               {this.state.suggestedTitle.match({
 214                 some: title => (
 215                   <div
 216                     className="mt-1 text-muted small font-weight-bold pointer"
 217                     role="button"
 218                     onClick={linkEvent(this, this.copySuggestedTitle)}
 219                   >
 220                     {i18n.t("copy_suggested_title", { title: "" })} {title}
 221                   </div>
 222                 ),
 223                 none: <></>,
 224               })}
 225               <form>
 226                 <label
 227                   htmlFor="file-upload"
 228                   className={`${
 229                     UserService.Instance.myUserInfo.isSome() && "pointer"
 230                   } d-inline-block float-right text-muted font-weight-bold`}
 231                   data-tippy-content={i18n.t("upload_image")}
 232                 >
 233                   <Icon icon="image" classes="icon-inline" />
 234                 </label>
 235                 <input
 236                   id="file-upload"
 237                   type="file"
 238                   accept="image/*,video/*"
 239                   name="file"
 240                   className="d-none"
 241                   disabled={UserService.Instance.myUserInfo.isNone()}
 242                   onChange={linkEvent(this, this.handleImageUpload)}
 243                 />
 244               </form>
 245               {this.state.postForm.url.match({
 246                 some: url =>
 247                   validURL(url) && (
 248                     <div>
 249                       <a
 250                         href={`${webArchiveUrl}/save/${encodeURIComponent(
 251                           url
 252                         )}`}
 253                         className="mr-2 d-inline-block float-right text-muted small font-weight-bold"
 254                         rel={relTags}
 255                       >
 256                         archive.org {i18n.t("archive_link")}
 257                       </a>
 258                       <a
 259                         href={`${ghostArchiveUrl}/search?term=${encodeURIComponent(
 260                           url
 261                         )}`}
 262                         className="mr-2 d-inline-block float-right text-muted small font-weight-bold"
 263                         rel={relTags}
 264                       >
 265                         ghostarchive.org {i18n.t("archive_link")}
 266                       </a>
 267                       <a
 268                         href={`${archiveTodayUrl}/?run=1&url=${encodeURIComponent(
 269                           url
 270                         )}`}
 271                         className="mr-2 d-inline-block float-right text-muted small font-weight-bold"
 272                         rel={relTags}
 273                       >
 274                         archive.today {i18n.t("archive_link")}
 275                       </a>
 276                     </div>
 277                   ),
 278                 none: <></>,
 279               })}
 280               {this.state.imageLoading && <Spinner />}
 281               {this.state.postForm.url.match({
 282                 some: url =>
 283                   isImage(url) && (
 284                     <img src={url} className="img-fluid" alt="" />
 285                   ),
 286                 none: <></>,
 287               })}
 288               {this.state.crossPosts.match({
 289                 some: xPosts =>
 290                   xPosts.length > 0 && (
 291                     <>
 292                       <div className="my-1 text-muted small font-weight-bold">
 293                         {i18n.t("cross_posts")}
 294                       </div>
 295                       <PostListings
 296                         showCommunity
 297                         posts={xPosts}
 298                         enableDownvotes={this.props.enableDownvotes}
 299                         enableNsfw={this.props.enableNsfw}
 300                         allLanguages={this.props.allLanguages}
 301                       />
 302                     </>
 303                   ),
 304                 none: <></>,
 305               })}
 306             </div>
 307           </div>
 308           <div className="form-group row">
 309             <label className="col-sm-2 col-form-label" htmlFor="post-title">
 310               {i18n.t("title")}
 311             </label>
 312             <div className="col-sm-10">
 313               <textarea
 314                 value={this.state.postForm.name}
 315                 id="post-title"
 316                 onInput={linkEvent(this, this.handlePostNameChange)}
 317                 className={`form-control ${
 318                   !validTitle(this.state.postForm.name) && "is-invalid"
 319                 }`}
 320                 required
 321                 rows={1}
 322                 minLength={3}
 323                 maxLength={MAX_POST_TITLE_LENGTH}
 324               />
 325               {!validTitle(this.state.postForm.name) && (
 326                 <div className="invalid-feedback">
 327                   {i18n.t("invalid_post_title")}
 328                 </div>
 329               )}
 330               {this.state.suggestedPosts.match({
 331                 some: sPosts =>
 332                   sPosts.length > 0 && (
 333                     <>
 334                       <div className="my-1 text-muted small font-weight-bold">
 335                         {i18n.t("related_posts")}
 336                       </div>
 337                       <PostListings
 338                         showCommunity
 339                         posts={sPosts}
 340                         enableDownvotes={this.props.enableDownvotes}
 341                         enableNsfw={this.props.enableNsfw}
 342                         allLanguages={this.props.allLanguages}
 343                       />
 344                     </>
 345                   ),
 346                 none: <></>,
 347               })}
 348             </div>
 349           </div>
 350
 351           <div className="form-group row">
 352             <label className="col-sm-2 col-form-label">{i18n.t("body")}</label>
 353             <div className="col-sm-10">
 354               <MarkdownTextArea
 355                 initialContent={this.state.postForm.body}
 356                 initialLanguageId={None}
 357                 onContentChange={this.handlePostBodyChange}
 358                 placeholder={None}
 359                 buttonTitle={None}
 360                 maxLength={None}
 361                 allLanguages={this.props.allLanguages}
 362               />
 363             </div>
 364           </div>
 365           {this.props.post_view.isNone() && (
 366             <div className="form-group row">
 367               <label
 368                 className="col-sm-2 col-form-label"
 369                 htmlFor="post-community"
 370               >
 371                 {this.state.communitySearchLoading ? (
 372                   <Spinner />
 373                 ) : (
 374                   i18n.t("community")
 375                 )}
 376               </label>
 377               <div className="col-sm-10">
 378                 <select
 379                   className="form-control"
 380                   id="post-community"
 381                   value={this.state.postForm.community_id}
 382                   onInput={linkEvent(this, this.handlePostCommunityChange)}
 383                 >
 384                   <option>{i18n.t("select_a_community")}</option>
 385                   {this.props.communities.unwrapOr([]).map(cv => (
 386                     <option key={cv.community.id} value={cv.community.id}>
 387                       {communitySelectName(cv)}
 388                     </option>
 389                   ))}
 390                 </select>
 391               </div>
 392             </div>
 393           )}
 394           {this.props.enableNsfw && (
 395             <div className="form-group row">
 396               <legend className="col-form-label col-sm-2 pt-0">
 397                 {i18n.t("nsfw")}
 398               </legend>
 399               <div className="col-sm-10">
 400                 <div className="form-check">
 401                   <input
 402                     className="form-check-input position-static"
 403                     id="post-nsfw"
 404                     type="checkbox"
 405                     checked={toUndefined(this.state.postForm.nsfw)}
 406                     onChange={linkEvent(this, this.handlePostNsfwChange)}
 407                   />
 408                 </div>
 409               </div>
 410             </div>
 411           )}
 412           <LanguageSelect
 413             allLanguages={this.props.allLanguages}
 414             selectedLanguageIds={selectedLangs}
 415             multiple={false}
 416             onChange={this.handleLanguageChange}
 417           />
 418           <input
 419             tabIndex={-1}
 420             autoComplete="false"
 421             name="a_password"
 422             type="text"
 423             className="form-control honeypot"
 424             id="register-honey"
 425             value={toUndefined(this.state.postForm.honeypot)}
 426             onInput={linkEvent(this, this.handleHoneyPotChange)}
 427           />
 428           <div className="form-group row">
 429             <div className="col-sm-10">
 430               <button
 431                 disabled={
 432                   !this.state.postForm.community_id || this.state.loading
 433                 }
 434                 type="submit"
 435                 className="btn btn-secondary mr-2"
 436               >
 437                 {this.state.loading ? (
 438                   <Spinner />
 439                 ) : this.props.post_view.isSome() ? (
 440                   capitalizeFirstLetter(i18n.t("save"))
 441                 ) : (
 442                   capitalizeFirstLetter(i18n.t("create"))
 443                 )}
 444               </button>
 445               {this.props.post_view.isSome() && (
 446                 <button
 447                   type="button"
 448                   className="btn btn-secondary"
 449                   onClick={linkEvent(this, this.handleCancel)}
 450                 >
 451                   {i18n.t("cancel")}
 452                 </button>
 453               )}
 454             </div>
 455           </div>
 456         </form>
 457       </div>
 458     );
 459   }
 460
 461   handlePostSubmit(i: PostForm, event: any) {
 462     event.preventDefault();
 463
 464     i.setState({ loading: true });
 465
 466     // Coerce empty url string to undefined
 467     if (
 468       i.state.postForm.url.isSome() &&
 469       i.state.postForm.url.unwrapOr("blank") === ""
 470     ) {
 471       i.setState(s => ((s.postForm.url = None), s));
 472     }
 473
 474     let pForm = i.state.postForm;
 475     i.props.post_view.match({
 476       some: pv => {
 477         let form = new EditPost({
 478           name: Some(pForm.name),
 479           url: pForm.url,
 480           body: pForm.body,
 481           nsfw: pForm.nsfw,
 482           post_id: pv.post.id,
 483           language_id: Some(pv.post.language_id),
 484           auth: auth().unwrap(),
 485         });
 486         WebSocketService.Instance.send(wsClient.editPost(form));
 487       },
 488       none: () => {
 489         i.setState(s => ((s.postForm.auth = auth().unwrap()), s));
 490         let form = new CreatePost({ ...i.state.postForm });
 491         WebSocketService.Instance.send(wsClient.createPost(form));
 492       },
 493     });
 494   }
 495
 496   copySuggestedTitle(i: PostForm) {
 497     i.state.suggestedTitle.match({
 498       some: sTitle => {
 499         i.setState(
 500           s => (
 501             (s.postForm.name = sTitle.substring(0, MAX_POST_TITLE_LENGTH)), s
 502           )
 503         );
 504         i.setState({ suggestedTitle: None });
 505         setTimeout(() => {
 506           let textarea: any = document.getElementById("post-title");
 507           autosize.update(textarea);
 508         }, 10);
 509       },
 510       none: void 0,
 511     });
 512   }
 513
 514   handlePostUrlChange(i: PostForm, event: any) {
 515     i.setState(s => ((s.postForm.url = Some(event.target.value)), s));
 516     i.fetchPageTitle();
 517   }
 518
 519   fetchPageTitle() {
 520     this.state.postForm.url.match({
 521       some: url => {
 522         if (validURL(url)) {
 523           let form = new Search({
 524             q: url,
 525             community_id: None,
 526             community_name: None,
 527             creator_id: None,
 528             type_: Some(SearchType.Url),
 529             sort: Some(SortType.TopAll),
 530             listing_type: Some(ListingType.All),
 531             page: Some(1),
 532             limit: Some(trendingFetchLimit),
 533             auth: auth(false).ok(),
 534           });
 535
 536           WebSocketService.Instance.send(wsClient.search(form));
 537
 538           // Fetch the page title
 539           getSiteMetadata(url).then(d => {
 540             this.setState({ suggestedTitle: d.metadata.title });
 541           });
 542         } else {
 543           this.setState({ suggestedTitle: None, crossPosts: None });
 544         }
 545       },
 546       none: void 0,
 547     });
 548   }
 549
 550   handlePostNameChange(i: PostForm, event: any) {
 551     i.setState(s => ((s.postForm.name = event.target.value), s));
 552     i.fetchSimilarPosts();
 553   }
 554
 555   fetchSimilarPosts() {
 556     let form = new Search({
 557       q: this.state.postForm.name,
 558       type_: Some(SearchType.Posts),
 559       sort: Some(SortType.TopAll),
 560       listing_type: Some(ListingType.All),
 561       community_id: Some(this.state.postForm.community_id),
 562       community_name: None,
 563       creator_id: None,
 564       page: Some(1),
 565       limit: Some(trendingFetchLimit),
 566       auth: auth(false).ok(),
 567     });
 568
 569     if (this.state.postForm.name !== "") {
 570       WebSocketService.Instance.send(wsClient.search(form));
 571     } else {
 572       this.setState({ suggestedPosts: None });
 573     }
 574   }
 575
 576   handlePostBodyChange(val: string) {
 577     this.setState(s => ((s.postForm.body = Some(val)), s));
 578   }
 579
 580   handlePostCommunityChange(i: PostForm, event: any) {
 581     i.setState(
 582       s => ((s.postForm.community_id = Number(event.target.value)), s)
 583     );
 584   }
 585
 586   handlePostNsfwChange(i: PostForm, event: any) {
 587     i.setState(s => ((s.postForm.nsfw = Some(event.target.checked)), s));
 588   }
 589
 590   handleLanguageChange(val: number[]) {
 591     this.setState(s => ((s.postForm.language_id = Some(val[0])), s));
 592   }
 593
 594   handleHoneyPotChange(i: PostForm, event: any) {
 595     i.setState(s => ((s.postForm.honeypot = Some(event.target.value)), s));
 596   }
 597
 598   handleCancel(i: PostForm) {
 599     i.props.onCancel();
 600   }
 601
 602   handlePreviewToggle(i: PostForm, event: any) {
 603     event.preventDefault();
 604     i.setState({ previewMode: !i.state.previewMode });
 605   }
 606
 607   handleImageUploadPaste(i: PostForm, event: any) {
 608     let image = event.clipboardData.files[0];
 609     if (image) {
 610       i.handleImageUpload(i, image);
 611     }
 612   }
 613
 614   handleImageUpload(i: PostForm, event: any) {
 615     let file: any;
 616     if (event.target) {
 617       event.preventDefault();
 618       file = event.target.files[0];
 619     } else {
 620       file = event;
 621     }
 622
 623     const formData = new FormData();
 624     formData.append("images[]", file);
 625
 626     i.setState({ imageLoading: true });
 627
 628     fetch(pictrsUri, {
 629       method: "POST",
 630       body: formData,
 631     })
 632       .then(res => res.json())
 633       .then(res => {
 634         console.log("pictrs upload:");
 635         console.log(res);
 636         if (res.msg == "ok") {
 637           let hash = res.files[0].file;
 638           let url = `${pictrsUri}/${hash}`;
 639           let deleteToken = res.files[0].delete_token;
 640           let deleteUrl = `${pictrsUri}/delete/${deleteToken}/${hash}`;
 641           i.state.postForm.url = Some(url);
 642           i.setState({ imageLoading: false });
 643           pictrsDeleteToast(
 644             i18n.t("click_to_delete_picture"),
 645             i18n.t("picture_deleted"),
 646             deleteUrl
 647           );
 648         } else {
 649           i.setState({ imageLoading: false });
 650           toast(JSON.stringify(res), "danger");
 651         }
 652       })
 653       .catch(error => {
 654         i.setState({ imageLoading: false });
 655         console.error(error);
 656         toast(error, "danger");
 657       });
 658   }
 659
 660   setupCommunities() {
 661     // Set up select searching
 662     if (isBrowser()) {
 663       let selectId: any = document.getElementById("post-community");
 664       if (selectId) {
 665         this.choices = new Choices(selectId, choicesConfig);
 666         this.choices.passedElement.element.addEventListener(
 667           "choice",
 668           (e: any) => {
 669             this.setState(
 670               s => (
 671                 (s.postForm.community_id = Number(e.detail.choice.value)), s
 672               )
 673             );
 674           },
 675           false
 676         );
 677         this.choices.passedElement.element.addEventListener("search", () => {
 678           this.setState({ communitySearchLoading: true });
 679         });
 680         this.choices.passedElement.element.addEventListener(
 681           "search",
 682           debounce(async (e: any) => {
 683             try {
 684               let communities = (await fetchCommunities(e.detail.value))
 685                 .communities;
 686               this.choices.setChoices(
 687                 communities.map(cv => communityToChoice(cv)),
 688                 "value",
 689                 "label",
 690                 true
 691               );
 692               this.setState({ communitySearchLoading: false });
 693             } catch (err) {
 694               console.log(err);
 695             }
 696           }),
 697           false
 698         );
 699       }
 700     }
 701
 702     this.props.post_view.match({
 703       some: pv =>
 704         this.setState(s => ((s.postForm.community_id = pv.community.id), s)),
 705       none: void 0,
 706     });
 707     this.props.params.match({
 708       some: params =>
 709         params.nameOrId.match({
 710           some: nameOrId =>
 711             nameOrId.match({
 712               left: name => {
 713                 let foundCommunityId = this.props.communities
 714                   .unwrapOr([])
 715                   .find(r => r.community.name == name).community.id;
 716                 this.setState(
 717                   s => ((s.postForm.community_id = foundCommunityId), s)
 718                 );
 719               },
 720               right: id =>
 721                 this.setState(s => ((s.postForm.community_id = id), s)),
 722             }),
 723           none: void 0,
 724         }),
 725       none: void 0,
 726     });
 727
 728     if (isBrowser() && this.state.postForm.community_id) {
 729       this.choices.setChoiceByValue(
 730         this.state.postForm.community_id.toString()
 731       );
 732     }
 733     this.setState(this.state);
 734   }
 735
 736   parseMessage(msg: any) {
 737     let op = wsUserOp(msg);
 738     console.log(msg);
 739     if (msg.error) {
 740       // Errors handled by top level pages
 741       // toast(i18n.t(msg.error), "danger");
 742       this.setState({ loading: false });
 743       return;
 744     } else if (op == UserOperation.CreatePost) {
 745       let data = wsJsonToRes<PostResponse>(msg, PostResponse);
 746       UserService.Instance.myUserInfo.match({
 747         some: mui => {
 748           if (data.post_view.creator.id == mui.local_user_view.person.id) {
 749             this.props.onCreate(data.post_view);
 750           }
 751         },
 752         none: void 0,
 753       });
 754     } else if (op == UserOperation.EditPost) {
 755       let data = wsJsonToRes<PostResponse>(msg, PostResponse);
 756       UserService.Instance.myUserInfo.match({
 757         some: mui => {
 758           if (data.post_view.creator.id == mui.local_user_view.person.id) {
 759             this.setState({ loading: false });
 760             this.props.onEdit(data.post_view);
 761           }
 762         },
 763         none: void 0,
 764       });
 765     } else if (op == UserOperation.Search) {
 766       let data = wsJsonToRes<SearchResponse>(msg, SearchResponse);
 767
 768       if (data.type_ == SearchType[SearchType.Posts]) {
 769         this.setState({ suggestedPosts: Some(data.posts) });
 770       } else if (data.type_ == SearchType[SearchType.Url]) {
 771         this.setState({ crossPosts: Some(data.posts) });
 772       }
 773     }
 774   }
 775 }