routes.api: fix get_captcha endpoint (#1135)

[lemmy.git] / ui / src / components / search.tsx

diff --git a/ui/src/components/search.tsx b/ui/src/components/search.tsx
index 751c700790ade738662afc0ec93d303d393730b2..8ab7f599b16426ad42f17838df719e32c9dadfb7 100644 (file)
--- a/ui/src/components/search.tsx
+++ b/ui/src/components/search.tsx
@@ -17,7 +17,7 @@ import {
   WebSocketJsonResponse,
   GetSiteResponse,
   Site,
-} from '../interfaces';
+} from 'lemmy-js-client';
 import { WebSocketService } from '../services';
 import {
   wsJsonToRes,
@@ -57,8 +57,8 @@ interface SearchProps {
 
 interface UrlParams {
   q?: string;
-  type_?: string;
-  sort?: string;
+  type_?: SearchType;
+  sort?: SortType;
   page?: number;
 }
 
@@ -196,14 +196,14 @@ export class Search extends Component<any, SearchState> {
       >
         <input
           type="text"
-          class="form-control mr-2"
+          class="form-control mr-2 mb-2"
           value={this.state.searchText}
           placeholder={`${i18n.t('search')}...`}
           onInput={linkEvent(this, this.handleQChange)}
           required
           minLength={3}
         />
-        <button type="submit" class="btn btn-secondary mr-2">
+        <button type="submit" class="btn btn-secondary mr-2 mb-2">
           {this.state.loading ? (
             <svg class="icon icon-spinner spin">
               <use xlinkHref="#icon-spinner"></use>
@@ -222,7 +222,7 @@ export class Search extends Component<any, SearchState> {
         <select
           value={this.state.type_}
           onChange={linkEvent(this, this.handleTypeChange)}
-          class="custom-select w-auto"
+          class="custom-select w-auto mb-2"
         >
           <option disabled>{i18n.t('type')}</option>
           <option value={SearchType.All}>{i18n.t('all')}</option>
@@ -289,6 +289,7 @@ export class Search extends Component<any, SearchState> {
             <div class="col-12">
               {i.type_ == 'posts' && (
                 <PostListing
+                  key={(i.data as Post).id}
                   post={i.data as Post}
                   showCommunity
                   enableDownvotes={this.state.site.enable_downvotes}
@@ -297,6 +298,7 @@ export class Search extends Component<any, SearchState> {
               )}
               {i.type_ == 'comments' && (
                 <CommentNodes
+                  key={(i.data as Comment).id}
                   nodes={[{ comment: i.data as Comment }]}
                   locked
                   noIndent
@@ -309,10 +311,11 @@ export class Search extends Component<any, SearchState> {
               {i.type_ == 'users' && (
                 <div>
                   <span>
-                    @
                     <UserListing
                       user={{
                         name: (i.data as UserView).name,
+                        preferred_username: (i.data as UserView)
+                          .preferred_username,
                         avatar: (i.data as UserView).avatar,
                       }}
                     />
@@ -394,11 +397,11 @@ export class Search extends Component<any, SearchState> {
           <div class="row">
             <div class="col-12">
               <span>
-                @
                 <UserListing
                   user={{
                     name: user.name,
                     avatar: user.avatar,
+                    preferred_username: user.preferred_username,
                   }}
                 />
               </span>
@@ -457,8 +460,8 @@ export class Search extends Component<any, SearchState> {
   search() {
     let form: SearchForm = {
       q: this.state.q,
-      type_: SearchType[this.state.type_],
-      sort: SortType[this.state.sort],
+      type_: this.state.type_,
+      sort: this.state.sort,
       page: this.state.page,
       limit: fetchLimit,
     };
@@ -469,12 +472,12 @@ export class Search extends Component<any, SearchState> {
   }
 
   handleSortChange(val: SortType) {
-    this.updateUrl({ sort: SortType[val].toLowerCase(), page: 1 });
+    this.updateUrl({ sort: val, page: 1 });
   }
 
   handleTypeChange(i: Search, event: any) {
     i.updateUrl({
-      type_: SearchType[Number(event.target.value)].toLowerCase(),
+      type_: SearchType[event.target.value],
       page: 1,
     });
   }
@@ -483,8 +486,8 @@ export class Search extends Component<any, SearchState> {
     event.preventDefault();
     i.updateUrl({
       q: i.state.searchText,
-      type_: SearchType[i.state.type_].toLowerCase(),
-      sort: SortType[i.state.sort].toLowerCase(),
+      type_: i.state.type_,
+      sort: i.state.sort,
       page: i.state.page,
     });
   }
@@ -495,10 +498,8 @@ export class Search extends Component<any, SearchState> {
 
   updateUrl(paramUpdates: UrlParams) {
     const qStr = paramUpdates.q || this.state.q;
-    const typeStr =
-      paramUpdates.type_ || SearchType[this.state.type_].toLowerCase();
-    const sortStr =
-      paramUpdates.sort || SortType[this.state.sort].toLowerCase();
+    const typeStr = paramUpdates.type_ || this.state.type_;
+    const sortStr = paramUpdates.sort || this.state.sort;
     const page = paramUpdates.page || this.state.page;
     this.props.history.push(
       `/search/q/${qStr}/type/${typeStr}/sort/${sortStr}/page/${page}`