]> Untitled Git - lemmy.git/blobdiff - ui/src/components/modlog.tsx
routes.api: fix get_captcha endpoint (#1135)
[lemmy.git] / ui / src / components / modlog.tsx
index e03f1ff754bacd3439a59f9e5b3585dbd2048453..106015a4ab74550d01f5a4810916de2ca4373382 100644 (file)
@@ -1,4 +1,5 @@
 import { Component, linkEvent } from 'inferno';
+import { Helmet } from 'inferno-helmet';
 import { Link } from 'inferno-router';
 import { Subscription } from 'rxjs';
 import { retryWhen, delay, take } from 'rxjs/operators';
@@ -15,7 +16,10 @@ import {
   ModBan,
   ModAddCommunity,
   ModAdd,
-} from '../interfaces';
+  WebSocketJsonResponse,
+  GetSiteResponse,
+  Site,
+} from 'lemmy-js-client';
 import { WebSocketService } from '../services';
 import { wsJsonToRes, addTypeInfo, fetchLimit, toast } from '../utils';
 import { MomentTime } from './moment-time';
@@ -36,6 +40,7 @@ interface ModlogState {
   communityId?: number;
   communityName?: string;
   page: number;
+  site: Site;
   loading: boolean;
 }
 
@@ -45,6 +50,7 @@ export class Modlog extends Component<any, ModlogState> {
     combined: [],
     page: 1,
     loading: true,
+    site: undefined,
   };
 
   constructor(props: any, context: any) {
@@ -63,16 +69,13 @@ export class Modlog extends Component<any, ModlogState> {
       );
 
     this.refetch();
+    WebSocketService.Instance.getSite();
   }
 
   componentWillUnmount() {
     this.subscription.unsubscribe();
   }
 
-  componentDidMount() {
-    document.title = `Modlog - ${WebSocketService.Instance.site.name}`;
-  }
-
   setCombined(res: GetModlogResponse) {
     let removed_posts = addTypeInfo(res.removed_posts, 'removed_posts');
     let locked_posts = addTypeInfo(res.locked_posts, 'locked_posts');
@@ -339,9 +342,18 @@ export class Modlog extends Component<any, ModlogState> {
     );
   }
 
+  get documentTitle(): string {
+    if (this.state.site) {
+      return `Modlog - ${this.state.site.name}`;
+    } else {
+      return 'Lemmy';
+    }
+  }
+
   render() {
     return (
       <div class="container">
+        <Helmet title={this.documentTitle} />
         {this.state.loading ? (
           <h5 class="">
             <svg class="icon icon-spinner spin">
@@ -353,21 +365,21 @@ export class Modlog extends Component<any, ModlogState> {
             <h5>
               {this.state.communityName && (
                 <Link
-                  className="text-white"
+                  className="text-body"
                   to={`/c/${this.state.communityName}`}
                 >
                   /c/{this.state.communityName}{' '}
                 </Link>
               )}
-              <span>Modlog</span>
+              <span>{i18n.t('modlog')}</span>
             </h5>
             <div class="table-responsive">
               <table id="modlog_table" class="table table-sm table-hover">
                 <thead class="pointer">
                   <tr>
-                    <th>Time</th>
-                    <th>Mod</th>
-                    <th>Action</th>
+                    <th> {i18n.t('time')}</th>
+                    <th>{i18n.t('mod')}</th>
+                    <th>{i18n.t('action')}</th>
                   </tr>
                 </thead>
                 {this.combined()}
@@ -385,17 +397,17 @@ export class Modlog extends Component<any, ModlogState> {
       <div class="mt-2">
         {this.state.page > 1 && (
           <button
-            class="btn btn-sm btn-secondary mr-1"
+            class="btn btn-secondary mr-1"
             onClick={linkEvent(this, this.prevPage)}
           >
-            Prev
+            {i18n.t('prev')}
           </button>
         )}
         <button
-          class="btn btn-sm btn-secondary"
+          class="btn btn-secondary"
           onClick={linkEvent(this, this.nextPage)}
         >
-          Next
+          {i18n.t('next')}
         </button>
       </div>
     );
@@ -433,6 +445,10 @@ export class Modlog extends Component<any, ModlogState> {
       this.state.loading = false;
       window.scrollTo(0, 0);
       this.setCombined(data);
+    } else if (res.op == UserOperation.GetSite) {
+      let data = res.data as GetSiteResponse;
+      this.state.site = data.site;
+      this.setState(this.state);
     }
   }
 }