Running prettier on code.

- #305 , #309

1 files changed, 238 insertions, 120 deletions

diff --git a/ui/src/components/search.tsx b/ui/src/components/search.tsx
index 42e1f317..daf9aa2d 100644
--- a/ui/src/components/search.tsx
+++ b/ui/src/components/search.tsx
@@ -1,26 +1,40 @@
 import { Component, linkEvent } from 'inferno';
 import { Link } from 'inferno-router';
-import { Subscription } from "rxjs";
+import { Subscription } from 'rxjs';
 import { retryWhen, delay, take } from 'rxjs/operators';
-import { UserOperation, Post, Comment, Community, UserView, SortType, SearchForm, SearchResponse, SearchType } from '../interfaces';
+import {
+  UserOperation,
+  Post,
+  Comment,
+  Community,
+  UserView,
+  SortType,
+  SearchForm,
+  SearchResponse,
+  SearchType,
+} from '../interfaces';
 import { WebSocketService } from '../services';
-import { msgOp, fetchLimit, routeSearchTypeToEnum, routeSortTypeToEnum } from '../utils';
+import {
+  msgOp,
+  fetchLimit,
+  routeSearchTypeToEnum,
+  routeSortTypeToEnum,
+} from '../utils';
 import { PostListing } from './post-listing';
 import { CommentNodes } from './comment-nodes';
 import { i18n } from '../i18next';
 import { T } from 'inferno-i18next';
 
 interface SearchState {
-  q: string,
-  type_: SearchType,
-  sort: SortType,
-  page: number,
+  q: string;
+  type_: SearchType;
+  sort: SortType;
+  page: number;
   searchResponse: SearchResponse;
   loading: boolean;
 }
 
 export class Search extends Component<any, SearchState> {
-
   private subscription: Subscription;
   private emptyState: SearchState = {
     q: this.getSearchQueryFromProps(this.props),
@@ -36,26 +50,26 @@ export class Search extends Component<any, SearchState> {
       users: [],
     },
     loading: false,
-  }
+  };
 
   getSearchQueryFromProps(props: any): string {
-    return (props.match.params.q) ? props.match.params.q : '';
+    return props.match.params.q ? props.match.params.q : '';
   }
 
   getSearchTypeFromProps(props: any): SearchType {
-    return (props.match.params.type) ? 
-      routeSearchTypeToEnum(props.match.params.type) : 
-      SearchType.All;
+    return props.match.params.type
+      ? routeSearchTypeToEnum(props.match.params.type)
+      : SearchType.All;
   }
 
   getSortTypeFromProps(props: any): SortType {
-    return (props.match.params.sort) ? 
-      routeSortTypeToEnum(props.match.params.sort) : 
-      SortType.TopAll;
+    return props.match.params.sort
+      ? routeSortTypeToEnum(props.match.params.sort)
+      : SortType.TopAll;
   }
 
   getPageFromProps(props: any): number {
-    return (props.match.params.page) ? Number(props.match.params.page) : 1;
+    return props.match.params.page ? Number(props.match.params.page) : 1;
   }
 
   constructor(props: any, context: any) {
@@ -64,17 +78,23 @@ export class Search extends Component<any, SearchState> {
     this.state = this.emptyState;
 
     this.subscription = WebSocketService.Instance.subject
-    .pipe(retryWhen(errors => errors.pipe(delay(3000), take(10))))
-    .subscribe(
-      (msg) => this.parseMessage(msg),
-        (err) => console.error(err),
+      .pipe(
+        retryWhen(errors =>
+          errors.pipe(
+            delay(3000),
+            take(10)
+          )
+        )
+      )
+      .subscribe(
+        msg => this.parseMessage(msg),
+        err => console.error(err),
         () => console.log('complete')
-    );
-    
+      );
+
     if (this.state.q) {
       this.search();
     }
-
   }
 
   componentWillUnmount() {
@@ -83,7 +103,10 @@ export class Search extends Component<any, SearchState> {
 
   // Necessary for back button for some reason
   componentWillReceiveProps(nextProps: any) {
-    if (nextProps.history.action == 'POP' || nextProps.history.action == 'PUSH') {
+    if (
+      nextProps.history.action == 'POP' ||
+      nextProps.history.action == 'PUSH'
+    ) {
       this.state = this.emptyState;
       this.state.q = this.getSearchQueryFromProps(nextProps);
       this.state.type_ = this.getSearchTypeFromProps(nextProps);
@@ -95,7 +118,9 @@ export class Search extends Component<any, SearchState> {
   }
 
   componentDidMount() {
-    document.title = `${i18n.t('search')} - ${WebSocketService.Instance.site.name}`;
+    document.title = `${i18n.t('search')} - ${
+      WebSocketService.Instance.site.name
+    }`;
   }
 
   render() {
@@ -103,77 +128,129 @@ export class Search extends Component<any, SearchState> {
       <div class="container">
         <div class="row">
           <div class="col-12">
-            <h5><T i18nKey="search">#</T></h5>
+            <h5>
+              <T i18nKey="search">#</T>
+            </h5>
             {this.selects()}
             {this.searchForm()}
-            {this.state.type_ == SearchType.All &&
-              this.all()
-            }
-            {this.state.type_ == SearchType.Comments &&
-              this.comments()
-            }
-            {this.state.type_ == SearchType.Posts &&
-              this.posts()
-            }
-            {this.state.type_ == SearchType.Communities &&
-              this.communities()
-            }
-            {this.state.type_ == SearchType.Users &&
-              this.users()
-            }
+            {this.state.type_ == SearchType.All && this.all()}
+            {this.state.type_ == SearchType.Comments && this.comments()}
+            {this.state.type_ == SearchType.Posts && this.posts()}
+            {this.state.type_ == SearchType.Communities && this.communities()}
+            {this.state.type_ == SearchType.Users && this.users()}
             {this.noResults()}
             {this.paginator()}
           </div>
         </div>
       </div>
-    )
+    );
   }
 
   searchForm() {
     return (
-      <form class="form-inline" onSubmit={linkEvent(this, this.handleSearchSubmit)}>
-        <input type="text" class="form-control mr-2" value={this.state.q} placeholder={`${i18n.t('search')}...`} onInput={linkEvent(this, this.handleQChange)} required minLength={3} />
+      <form
+        class="form-inline"
+        onSubmit={linkEvent(this, this.handleSearchSubmit)}
+      >
+        <input
+          type="text"
+          class="form-control mr-2"
+          value={this.state.q}
+          placeholder={`${i18n.t('search')}...`}
+          onInput={linkEvent(this, this.handleQChange)}
+          required
+          minLength={3}
+        />
         <button type="submit" class="btn btn-secondary mr-2">
-          {this.state.loading ?
-          <svg class="icon icon-spinner spin"><use xlinkHref="#icon-spinner"></use></svg> :
-          <span><T i18nKey="search">#</T></span>
-          }
+          {this.state.loading ? (
+            <svg class="icon icon-spinner spin">
+              <use xlinkHref="#icon-spinner"></use>
+            </svg>
+          ) : (
+            <span>
+              <T i18nKey="search">#</T>
+            </span>
+          )}
         </button>
       </form>
-    )
+    );
   }
 
   selects() {
     return (
       <div className="mb-2">
-        <select value={this.state.type_} onChange={linkEvent(this, this.handleTypeChange)} class="custom-select custom-select-sm w-auto">
-          <option disabled><T i18nKey="type">#</T></option>
-          <option value={SearchType.All}><T i18nKey="all">#</T></option>
-          <option value={SearchType.Comments}><T i18nKey="comments">#</T></option>
-          <option value={SearchType.Posts}><T i18nKey="posts">#</T></option>
-          <option value={SearchType.Communities}><T i18nKey="communities">#</T></option>
-          <option value={SearchType.Users}><T i18nKey="users">#</T></option>
+        <select
+          value={this.state.type_}
+          onChange={linkEvent(this, this.handleTypeChange)}
+          class="custom-select custom-select-sm w-auto"
+        >
+          <option disabled>
+            <T i18nKey="type">#</T>
+          </option>
+          <option value={SearchType.All}>
+            <T i18nKey="all">#</T>
+          </option>
+          <option value={SearchType.Comments}>
+            <T i18nKey="comments">#</T>
+          </option>
+          <option value={SearchType.Posts}>
+            <T i18nKey="posts">#</T>
+          </option>
+          <option value={SearchType.Communities}>
+            <T i18nKey="communities">#</T>
+          </option>
+          <option value={SearchType.Users}>
+            <T i18nKey="users">#</T>
+          </option>
         </select>
-        <select value={this.state.sort} onChange={linkEvent(this, this.handleSortChange)} class="custom-select custom-select-sm w-auto ml-2">
-          <option disabled><T i18nKey="sort_type">#</T></option>
-          <option value={SortType.New}><T i18nKey="new">#</T></option>
-          <option value={SortType.TopDay}><T i18nKey="top_day">#</T></option>
-          <option value={SortType.TopWeek}><T i18nKey="week">#</T></option>
-          <option value={SortType.TopMonth}><T i18nKey="month">#</T></option>
-          <option value={SortType.TopYear}><T i18nKey="year">#</T></option>
-          <option value={SortType.TopAll}><T i18nKey="all">#</T></option>
+        <select
+          value={this.state.sort}
+          onChange={linkEvent(this, this.handleSortChange)}
+          class="custom-select custom-select-sm w-auto ml-2"
+        >
+          <option disabled>
+            <T i18nKey="sort_type">#</T>
+          </option>
+          <option value={SortType.New}>
+            <T i18nKey="new">#</T>
+          </option>
+          <option value={SortType.TopDay}>
+            <T i18nKey="top_day">#</T>
+          </option>
+          <option value={SortType.TopWeek}>
+            <T i18nKey="week">#</T>
+          </option>
+          <option value={SortType.TopMonth}>
+            <T i18nKey="month">#</T>
+          </option>
+          <option value={SortType.TopYear}>
+            <T i18nKey="year">#</T>
+          </option>
+          <option value={SortType.TopAll}>
+            <T i18nKey="all">#</T>
+          </option>
         </select>
       </div>
-    )
-
+    );
   }
 
   all() {
-    let combined: Array<{type_: string, data: Comment | Post | Community | UserView}> = [];
-    let comments = this.state.searchResponse.comments.map(e => {return {type_: "comments", data: e}});
-    let posts = this.state.searchResponse.posts.map(e => {return {type_: "posts", data: e}});
-    let communities = this.state.searchResponse.communities.map(e => {return {type_: "communities", data: e}});
-    let users = this.state.searchResponse.users.map(e => {return {type_: "users", data: e}});
+    let combined: Array<{
+      type_: string;
+      data: Comment | Post | Community | UserView;
+    }> = [];
+    let comments = this.state.searchResponse.comments.map(e => {
+      return { type_: 'comments', data: e };
+    });
+    let posts = this.state.searchResponse.posts.map(e => {
+      return { type_: 'posts', data: e };
+    });
+    let communities = this.state.searchResponse.communities.map(e => {
+      return { type_: 'communities', data: e };
+    });
+    let users = this.state.searchResponse.users.map(e => {
+      return { type_: 'users', data: e };
+    });
 
     combined.push(...comments);
     combined.push(...posts);
@@ -184,49 +261,68 @@ export class Search extends Component<any, SearchState> {
     if (this.state.sort == SortType.New) {
       combined.sort((a, b) => b.data.published.localeCompare(a.data.published));
     } else {
-      combined.sort((a, b) => ((b.data as Comment | Post).score 
-        | (b.data as Community).number_of_subscribers
-          | (b.data as UserView).comment_score) 
-          - ((a.data as Comment | Post).score 
-            | (a.data as Community).number_of_subscribers 
-              | (a.data as UserView).comment_score));
+      combined.sort(
+        (a, b) =>
+          ((b.data as Comment | Post).score |
+            (b.data as Community).number_of_subscribers |
+            (b.data as UserView).comment_score) -
+          ((a.data as Comment | Post).score |
+            (a.data as Community).number_of_subscribers |
+            (a.data as UserView).comment_score)
+      );
     }
 
     return (
       <div>
-        {combined.map(i =>
+        {combined.map(i => (
           <div>
-            {i.type_ == "posts" &&
+            {i.type_ == 'posts' && (
               <PostListing post={i.data as Post} showCommunity viewOnly />
-            }
-            {i.type_ == "comments" && 
-              <CommentNodes nodes={[{comment: i.data as Comment}]} viewOnly noIndent />
-            }
-            {i.type_ == "communities" && 
+            )}
+            {i.type_ == 'comments' && (
+              <CommentNodes
+                nodes={[{ comment: i.data as Comment }]}
+                viewOnly
+                noIndent
+              />
+            )}
+            {i.type_ == 'communities' && (
               <div>
-                <span><Link to={`/c/${(i.data as Community).name}`}>{`/c/${(i.data as Community).name}`}</Link></span>
-                <span>{` - ${(i.data as Community).title} - ${(i.data as Community).number_of_subscribers} subscribers`}</span>
+                <span>
+                  <Link to={`/c/${(i.data as Community).name}`}>{`/c/${
+                    (i.data as Community).name
+                  }`}</Link>
+                </span>
+                <span>{` - ${(i.data as Community).title} - ${
+                  (i.data as Community).number_of_subscribers
+                } subscribers`}</span>
               </div>
-            }
-            {i.type_ == "users" && 
+            )}
+            {i.type_ == 'users' && (
               <div>
-                <span><Link className="text-info" to={`/u/${(i.data as UserView).name}`}>{`/u/${(i.data as UserView).name}`}</Link></span>
-                <span>{` - ${(i.data as UserView).comment_score} comment karma`}</span>
+                <span>
+                  <Link
+                    className="text-info"
+                    to={`/u/${(i.data as UserView).name}`}
+                  >{`/u/${(i.data as UserView).name}`}</Link>
+                </span>
+                <span>{` - ${
+                  (i.data as UserView).comment_score
+                } comment karma`}</span>
               </div>
-            }
+            )}
           </div>
-                     )
-        }
+        ))}
       </div>
-    )
+    );
   }
 
   comments() {
     return (
       <div>
-        {this.state.searchResponse.comments.map(comment => 
-          <CommentNodes nodes={[{comment: comment}]} noIndent viewOnly />
-        )}
+        {this.state.searchResponse.comments.map(comment => (
+          <CommentNodes nodes={[{ comment: comment }]} noIndent viewOnly />
+        ))}
       </div>
     );
   }
@@ -234,9 +330,9 @@ export class Search extends Component<any, SearchState> {
   posts() {
     return (
       <div>
-        {this.state.searchResponse.posts.map(post => 
+        {this.state.searchResponse.posts.map(post => (
           <PostListing post={post} showCommunity viewOnly />
-        )}
+        ))}
       </div>
     );
   }
@@ -245,12 +341,14 @@ export class Search extends Component<any, SearchState> {
   communities() {
     return (
       <div>
-        {this.state.searchResponse.communities.map(community => 
+        {this.state.searchResponse.communities.map(community => (
           <div>
-            <span><Link to={`/c/${community.name}`}>{`/c/${community.name}`}</Link></span>
+            <span>
+              <Link to={`/c/${community.name}`}>{`/c/${community.name}`}</Link>
+            </span>
             <span>{` - ${community.title} - ${community.number_of_subscribers} subscribers`}</span>
           </div>
-        )}
+        ))}
       </div>
     );
   }
@@ -258,12 +356,17 @@ export class Search extends Component<any, SearchState> {
   users() {
     return (
       <div>
-        {this.state.searchResponse.users.map(user => 
+        {this.state.searchResponse.users.map(user => (
           <div>
-            <span><Link className="text-info" to={`/u/${user.name}`}>{`/u/${user.name}`}</Link></span>
+            <span>
+              <Link
+                className="text-info"
+                to={`/u/${user.name}`}
+              >{`/u/${user.name}`}</Link>
+            </span>
             <span>{` - ${user.comment_score} comment karma`}</span>
           </div>
-        )}
+        ))}
       </div>
     );
   }
@@ -271,10 +374,20 @@ export class Search extends Component<any, SearchState> {
   paginator() {
     return (
       <div class="mt-2">
-        {this.state.page > 1 && 
-          <button class="btn btn-sm btn-secondary mr-1" onClick={linkEvent(this, this.prevPage)}><T i18nKey="prev">#</T></button>
-        }
-        <button class="btn btn-sm btn-secondary" onClick={linkEvent(this, this.nextPage)}><T i18nKey="next">#</T></button>
+        {this.state.page > 1 && (
+          <button
+            class="btn btn-sm btn-secondary mr-1"
+            onClick={linkEvent(this, this.prevPage)}
+          >
+            <T i18nKey="prev">#</T>
+          </button>
+        )}
+        <button
+          class="btn btn-sm btn-secondary"
+          onClick={linkEvent(this, this.nextPage)}
+        >
+          <T i18nKey="next">#</T>
+        </button>
       </div>
     );
   }
@@ -283,21 +396,23 @@ export class Search extends Component<any, SearchState> {
     let res = this.state.searchResponse;
     return (
       <div>
-        {res && res.op && res.posts.length == 0 && res.comments.length == 0 && 
-          <span><T i18nKey="no_results">#</T></span>
-        }
+        {res && res.op && res.posts.length == 0 && res.comments.length == 0 && (
+          <span>
+            <T i18nKey="no_results">#</T>
+          </span>
+        )}
       </div>
-    )
+    );
   }
 
-  nextPage(i: Search) { 
+  nextPage(i: Search) {
     i.state.page++;
     i.setState(i.state);
     i.updateUrl();
     i.search();
   }
 
-  prevPage(i: Search) { 
+  prevPage(i: Search) {
     i.state.page--;
     i.setState(i.state);
     i.updateUrl();
@@ -349,7 +464,9 @@ export class Search extends Component<any, SearchState> {
   updateUrl() {
     let typeStr = SearchType[this.state.type_].toLowerCase();
     let sortStr = SortType[this.state.sort].toLowerCase();
-    this.props.history.push(`/search/q/${this.state.q}/type/${typeStr}/sort/${sortStr}/page/${this.state.page}`);
+    this.props.history.push(
+      `/search/q/${this.state.q}/type/${typeStr}/sort/${sortStr}/page/${this.state.page}`
+    );
   }
 
   parseMessage(msg: any) {
@@ -362,10 +479,11 @@ export class Search extends Component<any, SearchState> {
       let res: SearchResponse = msg;
       this.state.searchResponse = res;
       this.state.loading = false;
-      document.title = `${i18n.t('search')} - ${this.state.q} - ${WebSocketService.Instance.site.name}`;
-      window.scrollTo(0,0);
+      document.title = `${i18n.t('search')} - ${this.state.q} - ${
+        WebSocketService.Instance.site.name
+      }`;
+      window.scrollTo(0, 0);
       this.setState(this.state);
     }
   }
 }
-