routes.api: fix get_captcha endpoint (#1135)

[lemmy.git] / ui / src / components / user-details.tsx

diff --git a/ui/src/components/user-details.tsx b/ui/src/components/user-details.tsx
index 49b9589e73d3d759ca4ef3de966178c3620b49f0..8b6247ca359cbe812d81108ac2199a7ebb1e3856 100644 (file)
--- a/ui/src/components/user-details.tsx
+++ b/ui/src/components/user-details.tsx
@@ -1,7 +1,7 @@
 import { Component, linkEvent } from 'inferno';
 import { WebSocketService, UserService } from '../services';
 import { Subscription } from 'rxjs';
-import { retryWhen, delay, take, last } from 'rxjs/operators';
+import { retryWhen, delay, take } from 'rxjs/operators';
 import { i18n } from '../i18next';
 import {
   UserOperation,
@@ -12,12 +12,11 @@ import {
   UserDetailsResponse,
   UserView,
   WebSocketJsonResponse,
-  UserDetailsView,
   CommentResponse,
   BanUserResponse,
   PostResponse,
-  AddAdminResponse,
-} from '../interfaces';
+} from 'lemmy-js-client';
+import { UserDetailsView } from '../interfaces';
 import {
   wsJsonToRes,
   toast,
@@ -36,11 +35,12 @@ interface UserDetailsProps {
   user_id?: number;
   page: number;
   limit: number;
-  sort: string;
+  sort: SortType;
   enableDownvotes: boolean;
   enableNsfw: boolean;
   view: UserDetailsView;
   onPageChange(page: number): number | any;
+  admins: Array<UserView>;
 }
 
 interface UserDetailsState {
@@ -49,7 +49,6 @@ interface UserDetailsState {
   comments: Array<Comment>;
   posts: Array<Post>;
   saved?: Array<Post>;
-  admins: Array<UserView>;
 }
 
 export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
@@ -63,7 +62,6 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
       comments: [],
       posts: [],
       saved: [],
-      admins: [],
     };
 
     this.subscription = WebSocketService.Instance.subject
@@ -81,6 +79,7 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
 
   componentDidMount() {
     this.fetchUserData();
+    setupTippy();
   }
 
   componentDidUpdate(lastProps: UserDetailsProps) {
@@ -90,7 +89,6 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
         break;
       }
     }
-    setupTippy();
   }
 
   fetchUserData() {
@@ -139,7 +137,7 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
     ];
 
     // Sort it
-    if (SortType[this.props.sort] === SortType.New) {
+    if (this.props.sort === SortType.New) {
       combined.sort((a, b) => b.data.published.localeCompare(a.data.published));
     } else {
       combined.sort((a, b) => b.data.score - a.data.score);
@@ -148,25 +146,32 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
     return (
       <div>
         {combined.map(i => (
-          <div>
-            {i.type === 'posts' ? (
-              <PostListing
-                post={i.data as Post}
-                admins={this.state.admins}
-                showCommunity
-                enableDownvotes={this.props.enableDownvotes}
-                enableNsfw={this.props.enableNsfw}
-              />
-            ) : (
-              <CommentNodes
-                nodes={[{ comment: i.data as Comment }]}
-                admins={this.state.admins}
-                noIndent
-                showContext
-                enableDownvotes={this.props.enableDownvotes}
-              />
-            )}
-          </div>
+          <>
+            <div>
+              {i.type === 'posts' ? (
+                <PostListing
+                  key={(i.data as Post).id}
+                  post={i.data as Post}
+                  admins={this.props.admins}
+                  showCommunity
+                  enableDownvotes={this.props.enableDownvotes}
+                  enableNsfw={this.props.enableNsfw}
+                />
+              ) : (
+                <CommentNodes
+                  key={(i.data as Comment).id}
+                  nodes={[{ comment: i.data as Comment }]}
+                  admins={this.props.admins}
+                  noBorder
+                  noIndent
+                  showCommunity
+                  showContext
+                  enableDownvotes={this.props.enableDownvotes}
+                />
+              )}
+            </div>
+            <hr class="my-3" />
+          </>
         ))}
       </div>
     );
@@ -177,8 +182,9 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
       <div>
         <CommentNodes
           nodes={commentsToFlatNodes(this.state.comments)}
-          admins={this.state.admins}
+          admins={this.props.admins}
           noIndent
+          showCommunity
           showContext
           enableDownvotes={this.props.enableDownvotes}
         />
@@ -190,13 +196,16 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
     return (
       <div>
         {this.state.posts.map(post => (
-          <PostListing
-            post={post}
-            admins={this.state.admins}
-            showCommunity
-            enableDownvotes={this.props.enableDownvotes}
-            enableNsfw={this.props.enableNsfw}
-          />
+          <>
+            <PostListing
+              post={post}
+              admins={this.props.admins}
+              showCommunity
+              enableDownvotes={this.props.enableDownvotes}
+              enableNsfw={this.props.enableNsfw}
+            />
+            <hr class="my-3" />
+          </>
         ))}
       </div>
     );
@@ -207,7 +216,7 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
       <div class="my-2">
         {this.props.page > 1 && (
           <button
-            class="btn btn-sm btn-secondary mr-1"
+            class="btn btn-secondary mr-1"
             onClick={linkEvent(this, this.prevPage)}
           >
             {i18n.t('prev')}
@@ -215,7 +224,7 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
         )}
         {this.state.comments.length + this.state.posts.length > 0 && (
           <button
-            class="btn btn-sm btn-secondary"
+            class="btn btn-secondary"
             onClick={linkEvent(this, this.nextPage)}
           >
             {i18n.t('next')}
@@ -252,7 +261,6 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
         follows: data.follows,
         moderates: data.moderates,
         posts: data.posts,
-        admins: data.admins,
       });
     } else if (res.op == UserOperation.CreateCommentLike) {
       const data = res.data as CommentResponse;
@@ -260,7 +268,11 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
       this.setState({
         comments: this.state.comments,
       });
-    } else if (res.op == UserOperation.EditComment) {
+    } else if (
+      res.op == UserOperation.EditComment ||
+      res.op == UserOperation.DeleteComment ||
+      res.op == UserOperation.RemoveComment
+    ) {
       const data = res.data as CommentResponse;
       editCommentRes(data, this.state.comments);
       this.setState({
@@ -298,11 +310,6 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
         posts: this.state.posts,
         comments: this.state.comments,
       });
-    } else if (res.op == UserOperation.AddAdmin) {
-      const data = res.data as AddAdminResponse;
-      this.setState({
-        admins: data.admins,
-      });
     }
   }
 }