]> Untitled Git - lemmy.git/blobdiff - ui/src/components/user-details.tsx
routes.api: fix get_captcha endpoint (#1135)
[lemmy.git] / ui / src / components / user-details.tsx
index 339dc5e4a499c98b137c37d83b25eafbc761bf5f..8b6247ca359cbe812d81108ac2199a7ebb1e3856 100644 (file)
@@ -12,11 +12,11 @@ import {
   UserDetailsResponse,
   UserView,
   WebSocketJsonResponse,
-  UserDetailsView,
   CommentResponse,
   BanUserResponse,
   PostResponse,
-} from '../interfaces';
+} from 'lemmy-js-client';
+import { UserDetailsView } from '../interfaces';
 import {
   wsJsonToRes,
   toast,
@@ -35,7 +35,7 @@ interface UserDetailsProps {
   user_id?: number;
   page: number;
   limit: number;
-  sort: string;
+  sort: SortType;
   enableDownvotes: boolean;
   enableNsfw: boolean;
   view: UserDetailsView;
@@ -79,6 +79,7 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
 
   componentDidMount() {
     this.fetchUserData();
+    setupTippy();
   }
 
   componentDidUpdate(lastProps: UserDetailsProps) {
@@ -88,7 +89,6 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
         break;
       }
     }
-    setupTippy();
   }
 
   fetchUserData() {
@@ -137,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);
@@ -146,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.props.admins}
-                showCommunity
-                enableDownvotes={this.props.enableDownvotes}
-                enableNsfw={this.props.enableNsfw}
-              />
-            ) : (
-              <CommentNodes
-                nodes={[{ comment: i.data as Comment }]}
-                admins={this.props.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,6 +184,7 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
           nodes={commentsToFlatNodes(this.state.comments)}
           admins={this.props.admins}
           noIndent
+          showCommunity
           showContext
           enableDownvotes={this.props.enableDownvotes}
         />
@@ -188,13 +196,16 @@ export class UserDetails extends Component<UserDetailsProps, UserDetailsState> {
     return (
       <div>
         {this.state.posts.map(post => (
-          <PostListing
-            post={post}
-            admins={this.props.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>
     );
@@ -205,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')}
@@ -213,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')}