]> Untitled Git - lemmy-ui.git/blobdiff - src/shared/components/modlog.tsx
First pass at v2_api
[lemmy-ui.git] / src / shared / components / modlog.tsx
index ded9a30a096526f3940541a4d94663f435952963..fcd18e59f6d28f1b896ce166c7017b732e8d80ce 100644 (file)
@@ -3,51 +3,71 @@ import { Link } from 'inferno-router';
 import { Subscription } from 'rxjs';
 import {
   UserOperation,
-  GetModlogForm,
+  GetModlog,
   GetModlogResponse,
-  ModRemovePost,
-  ModLockPost,
-  ModStickyPost,
-  ModRemoveComment,
-  ModRemoveCommunity,
-  ModBanFromCommunity,
-  ModBan,
-  ModAddCommunity,
-  ModAdd,
-  WebSocketJsonResponse,
-  Site,
+  SiteView,
+  ModRemovePostView,
+  ModLockPostView,
+  ModStickyPostView,
+  ModRemoveCommentView,
+  ModRemoveCommunityView,
+  ModBanFromCommunityView,
+  ModBanView,
+  ModAddCommunityView,
+  ModAddView,
 } from 'lemmy-js-client';
 import { WebSocketService } from '../services';
 import {
   wsJsonToRes,
-  addTypeInfo,
   fetchLimit,
   toast,
   setIsoData,
   wsSubscribe,
   isBrowser,
+  wsUserOp,
 } from '../utils';
 import { MomentTime } from './moment-time';
 import { HtmlTags } from './html-tags';
 import moment from 'moment';
 import { i18n } from '../i18next';
 import { InitialFetchRequest } from 'shared/interfaces';
+import { UserListing } from './user-listing';
+import { CommunityLink } from './community-link';
+
+enum ModlogEnum {
+  ModRemovePost,
+  ModLockPost,
+  ModStickyPost,
+  ModRemoveComment,
+  ModRemoveCommunity,
+  ModBanFromCommunity,
+  ModAddCommunity,
+  ModAdd,
+  ModBan,
+}
+
+type ModlogType = {
+  id: number;
+  type_: ModlogEnum;
+  view:
+    | ModRemovePostView
+    | ModLockPostView
+    | ModStickyPostView
+    | ModRemoveCommentView
+    | ModRemoveCommunityView
+    | ModBanFromCommunityView
+    | ModBanView
+    | ModAddCommunityView
+    | ModAddView;
+  when_: string;
+};
 
 interface ModlogState {
-  combined: {
-    type_: string;
-    data:
-      | ModRemovePost
-      | ModLockPost
-      | ModStickyPost
-      | ModRemoveCommunity
-      | ModAdd
-      | ModBan;
-  }[];
+  res: GetModlogResponse;
   communityId?: number;
   communityName?: string;
   page: number;
-  site: Site;
+  site_view: SiteView;
   loading: boolean;
 }
 
@@ -55,10 +75,20 @@ export class Modlog extends Component<any, ModlogState> {
   private isoData = setIsoData(this.context);
   private subscription: Subscription;
   private emptyState: ModlogState = {
-    combined: [],
+    res: {
+      removed_posts: [],
+      locked_posts: [],
+      stickied_posts: [],
+      removed_comments: [],
+      removed_communities: [],
+      banned_from_community: [],
+      banned: [],
+      added_to_community: [],
+      added: [],
+    },
     page: 1,
     loading: true,
-    site: this.isoData.site.site,
+    site_view: this.isoData.site_res.site_view,
   };
 
   constructor(props: any, context: any) {
@@ -75,7 +105,7 @@ export class Modlog extends Component<any, ModlogState> {
     // Only fetch the data if coming from another route
     if (this.isoData.path == this.context.router.route.match.url) {
       let data = this.isoData.routeData[0];
-      this.setCombined(data);
+      this.state.res = data;
       this.state.loading = false;
     } else {
       this.refetch();
@@ -88,264 +118,233 @@ export class Modlog extends Component<any, ModlogState> {
     }
   }
 
-  setCombined(res: GetModlogResponse) {
-    let removed_posts = addTypeInfo(res.removed_posts, 'removed_posts');
-    let locked_posts = addTypeInfo(res.locked_posts, 'locked_posts');
-    let stickied_posts = addTypeInfo(res.stickied_posts, 'stickied_posts');
-    let removed_comments = addTypeInfo(
-      res.removed_comments,
-      'removed_comments'
-    );
-    let removed_communities = addTypeInfo(
-      res.removed_communities,
-      'removed_communities'
-    );
-    let banned_from_community = addTypeInfo(
-      res.banned_from_community,
-      'banned_from_community'
-    );
-    let added_to_community = addTypeInfo(
-      res.added_to_community,
-      'added_to_community'
+  buildCombined(res: GetModlogResponse): ModlogType[] {
+    let removed_posts: ModlogType[] = res.removed_posts.map(r => ({
+      id: r.mod_remove_post.id,
+      type_: ModlogEnum.ModRemovePost,
+      view: r,
+      when_: r.mod_remove_post.when_,
+    }));
+
+    let locked_posts: ModlogType[] = res.locked_posts.map(r => ({
+      id: r.mod_lock_post.id,
+      type_: ModlogEnum.ModLockPost,
+      view: r,
+      when_: r.mod_lock_post.when_,
+    }));
+
+    let stickied_posts: ModlogType[] = res.stickied_posts.map(r => ({
+      id: r.mod_sticky_post.id,
+      type_: ModlogEnum.ModStickyPost,
+      view: r,
+      when_: r.mod_sticky_post.when_,
+    }));
+
+    let removed_comments: ModlogType[] = res.removed_comments.map(r => ({
+      id: r.mod_remove_comment.id,
+      type_: ModlogEnum.ModRemoveComment,
+      view: r,
+      when_: r.mod_remove_comment.when_,
+    }));
+
+    let removed_communities: ModlogType[] = res.removed_communities.map(r => ({
+      id: r.mod_remove_community.id,
+      type_: ModlogEnum.ModRemoveCommunity,
+      view: r,
+      when_: r.mod_remove_community.when_,
+    }));
+
+    let banned_from_community: ModlogType[] = res.banned_from_community.map(
+      r => ({
+        id: r.mod_ban_from_community.id,
+        type_: ModlogEnum.ModBanFromCommunity,
+        view: r,
+        when_: r.mod_ban_from_community.when_,
+      })
     );
-    let added = addTypeInfo(res.added, 'added');
-    let banned = addTypeInfo(res.banned, 'banned');
-    this.state.combined = [];
-
-    this.state.combined.push(...removed_posts);
-    this.state.combined.push(...locked_posts);
-    this.state.combined.push(...stickied_posts);
-    this.state.combined.push(...removed_comments);
-    this.state.combined.push(...removed_communities);
-    this.state.combined.push(...banned_from_community);
-    this.state.combined.push(...added_to_community);
-    this.state.combined.push(...added);
-    this.state.combined.push(...banned);
-
-    if (this.state.communityId && this.state.combined.length > 0) {
-      this.state.communityName = (this.state.combined[0]
-        .data as ModRemovePost).community_name;
+
+    let added_to_community: ModlogType[] = res.added_to_community.map(r => ({
+      id: r.mod_add_community.id,
+      type_: ModlogEnum.ModAddCommunity,
+      view: r,
+      when_: r.mod_add_community.when_,
+    }));
+
+    let added: ModlogType[] = res.added.map(r => ({
+      id: r.mod_add.id,
+      type_: ModlogEnum.ModAdd,
+      view: r,
+      when_: r.mod_add.when_,
+    }));
+
+    let banned: ModlogType[] = res.banned.map(r => ({
+      id: r.mod_ban.id,
+      type_: ModlogEnum.ModBan,
+      view: r,
+      when_: r.mod_ban.when_,
+    }));
+
+    let combined: ModlogType[] = [];
+
+    combined.push(...removed_posts);
+    combined.push(...locked_posts);
+    combined.push(...stickied_posts);
+    combined.push(...removed_comments);
+    combined.push(...removed_communities);
+    combined.push(...banned_from_community);
+    combined.push(...added_to_community);
+    combined.push(...added);
+    combined.push(...banned);
+
+    if (this.state.communityId && combined.length > 0) {
+      this.state.communityName = (combined[0]
+        .view as ModRemovePostView).community.name;
     }
 
     // Sort them by time
-    this.state.combined.sort((a, b) =>
-      b.data.when_.localeCompare(a.data.when_)
-    );
+    combined.sort((a, b) => b.when_.localeCompare(a.when_));
+
+    return combined;
+  }
+
+  renderModlogType(i: ModlogType) {
+    switch (i.type_) {
+      case ModlogEnum.ModRemovePost:
+        let mrpv = i.view as ModRemovePostView;
+        return [
+          mrpv.mod_remove_post.removed ? 'Removed ' : 'Restored ',
+          <span>
+            Post <Link to={`/post/${mrpv.post.id}`}>{mrpv.post.name}</Link>
+          </span>,
+          mrpv.mod_remove_post.reason &&
+            ` reason: ${mrpv.mod_remove_post.reason}`,
+        ];
+      case ModlogEnum.ModLockPost:
+        let mlpv = i.view as ModLockPostView;
+        return [
+          mlpv.mod_lock_post.locked ? 'Locked ' : 'Unlocked ',
+          <span>
+            Post <Link to={`/post/${mlpv.post.id}`}>{mlpv.post.name}</Link>
+          </span>,
+        ];
+      case ModlogEnum.ModStickyPost:
+        let mspv = i.view as ModStickyPostView;
+        return [
+          mspv.mod_sticky_post.stickied ? 'Stickied ' : 'Unstickied ',
+          <span>
+            Post <Link to={`/post/${mspv.post.id}`}>{mspv.post.name}</Link>
+          </span>,
+        ];
+      case ModlogEnum.ModRemoveComment:
+        let mrc = i.view as ModRemoveCommentView;
+        return [
+          mrc.mod_remove_comment.removed ? 'Removed ' : 'Restored ',
+          <span>
+            Comment{' '}
+            <Link to={`/post/${mrc.post.id}/comment/${mrc.comment.id}`}>
+              {mrc.comment.content}
+            </Link>
+          </span>,
+          <span>
+            {' '}
+            by <UserListing user={mrc.commenter} />
+          </span>,
+          mrc.mod_remove_comment.reason &&
+            ` reason: ${mrc.mod_remove_comment.reason}`,
+        ];
+      case ModlogEnum.ModRemoveCommunity:
+        let mrco = i.view as ModRemoveCommunityView;
+        return [
+          mrco.mod_remove_community.removed ? 'Removed ' : 'Restored ',
+          <span>
+            Community <CommunityLink community={mrco.community} />
+          </span>,
+          mrco.mod_remove_community.reason &&
+            ` reason: ${mrco.mod_remove_community.reason}`,
+          mrco.mod_remove_community.expires &&
+            ` expires: ${moment
+              .utc(mrco.mod_remove_community.expires)
+              .fromNow()}`,
+        ];
+      case ModlogEnum.ModBanFromCommunity:
+        let mbfc = i.view as ModBanFromCommunityView;
+        return [
+          <span>
+            {mbfc.mod_ban_from_community.banned ? 'Banned ' : 'Unbanned '}{' '}
+          </span>,
+          <span>
+            <UserListing user={mbfc.banned_user} />
+          </span>,
+          <span> from the community </span>,
+          <span>
+            <CommunityLink community={mbfc.community} />
+          </span>,
+          <div>
+            {mbfc.mod_ban_from_community.reason &&
+              ` reason: ${mbfc.mod_ban_from_community.reason}`}
+          </div>,
+          <div>
+            {mbfc.mod_ban_from_community.expires &&
+              ` expires: ${moment
+                .utc(mbfc.mod_ban_from_community.expires)
+                .fromNow()}`}
+          </div>,
+        ];
+      case ModlogEnum.ModAddCommunity:
+        let mac = i.view as ModAddCommunityView;
+        return [
+          <span>
+            {mac.mod_add_community.removed ? 'Removed ' : 'Appointed '}{' '}
+          </span>,
+          <span>
+            <UserListing user={mac.modded_user} />
+          </span>,
+          <span> as a mod to the community </span>,
+          <span>
+            <CommunityLink community={mac.community} />
+          </span>,
+        ];
+      case ModlogEnum.ModBan:
+        let mb = i.view as ModBanView;
+        return [
+          <span>{mb.mod_ban.banned ? 'Banned ' : 'Unbanned '} </span>,
+          <span>
+            <UserListing user={mb.banned_user} />
+          </span>,
+          <div>{mb.mod_ban.reason && ` reason: ${mb.mod_ban.reason}`}</div>,
+          <div>
+            {mb.mod_ban.expires &&
+              ` expires: ${moment.utc(mb.mod_ban.expires).fromNow()}`}
+          </div>,
+        ];
+      case ModlogEnum.ModAdd:
+        let ma = i.view as ModAddView;
+        return [
+          <span>{ma.mod_add.removed ? 'Removed ' : 'Appointed '} </span>,
+          <span>
+            <UserListing user={ma.modded_user} />
+          </span>,
+          <span> as an admin </span>,
+        ];
+      default:
+        return <div />;
+    }
   }
 
   combined() {
+    let combined = this.buildCombined(this.state.res);
+
     return (
       <tbody>
-        {this.state.combined.map(i => (
+        {combined.map(i => (
           <tr>
             <td>
-              <MomentTime data={i.data} />
-            </td>
-            <td>
-              <Link to={`/u/${i.data.mod_user_name}`}>
-                {i.data.mod_user_name}
-              </Link>
+              <MomentTime data={i} />
             </td>
             <td>
-              {i.type_ == 'removed_posts' && (
-                <>
-                  {(i.data as ModRemovePost).removed ? 'Removed' : 'Restored'}
-                  <span>
-                    {' '}
-                    Post{' '}
-                    <Link to={`/post/${(i.data as ModRemovePost).post_id}`}>
-                      {(i.data as ModRemovePost).post_name}
-                    </Link>
-                  </span>
-                  <div>
-                    {(i.data as ModRemovePost).reason &&
-                      ` reason: ${(i.data as ModRemovePost).reason}`}
-                  </div>
-                </>
-              )}
-              {i.type_ == 'locked_posts' && (
-                <>
-                  {(i.data as ModLockPost).locked ? 'Locked' : 'Unlocked'}
-                  <span>
-                    {' '}
-                    Post{' '}
-                    <Link to={`/post/${(i.data as ModLockPost).post_id}`}>
-                      {(i.data as ModLockPost).post_name}
-                    </Link>
-                  </span>
-                </>
-              )}
-              {i.type_ == 'stickied_posts' && (
-                <>
-                  {(i.data as ModStickyPost).stickied
-                    ? 'Stickied'
-                    : 'Unstickied'}
-                  <span>
-                    {' '}
-                    Post{' '}
-                    <Link to={`/post/${(i.data as ModStickyPost).post_id}`}>
-                      {(i.data as ModStickyPost).post_name}
-                    </Link>
-                  </span>
-                </>
-              )}
-              {i.type_ == 'removed_comments' && (
-                <>
-                  {(i.data as ModRemoveComment).removed
-                    ? 'Removed'
-                    : 'Restored'}
-                  <span>
-                    {' '}
-                    Comment{' '}
-                    <Link
-                      to={`/post/${
-                        (i.data as ModRemoveComment).post_id
-                      }/comment/${(i.data as ModRemoveComment).comment_id}`}
-                    >
-                      {(i.data as ModRemoveComment).comment_content}
-                    </Link>
-                  </span>
-                  <span>
-                    {' '}
-                    by{' '}
-                    <Link
-                      to={`/u/${
-                        (i.data as ModRemoveComment).comment_user_name
-                      }`}
-                    >
-                      {(i.data as ModRemoveComment).comment_user_name}
-                    </Link>
-                  </span>
-                  <div>
-                    {(i.data as ModRemoveComment).reason &&
-                      ` reason: ${(i.data as ModRemoveComment).reason}`}
-                  </div>
-                </>
-              )}
-              {i.type_ == 'removed_communities' && (
-                <>
-                  {(i.data as ModRemoveCommunity).removed
-                    ? 'Removed'
-                    : 'Restored'}
-                  <span>
-                    {' '}
-                    Community{' '}
-                    <Link
-                      to={`/c/${(i.data as ModRemoveCommunity).community_name}`}
-                    >
-                      {(i.data as ModRemoveCommunity).community_name}
-                    </Link>
-                  </span>
-                  <div>
-                    {(i.data as ModRemoveCommunity).reason &&
-                      ` reason: ${(i.data as ModRemoveCommunity).reason}`}
-                  </div>
-                  <div>
-                    {(i.data as ModRemoveCommunity).expires &&
-                      ` expires: ${moment
-                        .utc((i.data as ModRemoveCommunity).expires)
-                        .fromNow()}`}
-                  </div>
-                </>
-              )}
-              {i.type_ == 'banned_from_community' && (
-                <>
-                  <span>
-                    {(i.data as ModBanFromCommunity).banned
-                      ? 'Banned '
-                      : 'Unbanned '}{' '}
-                  </span>
-                  <span>
-                    <Link
-                      to={`/u/${
-                        (i.data as ModBanFromCommunity).other_user_name
-                      }`}
-                    >
-                      {(i.data as ModBanFromCommunity).other_user_name}
-                    </Link>
-                  </span>
-                  <span> from the community </span>
-                  <span>
-                    <Link
-                      to={`/c/${
-                        (i.data as ModBanFromCommunity).community_name
-                      }`}
-                    >
-                      {(i.data as ModBanFromCommunity).community_name}
-                    </Link>
-                  </span>
-                  <div>
-                    {(i.data as ModBanFromCommunity).reason &&
-                      ` reason: ${(i.data as ModBanFromCommunity).reason}`}
-                  </div>
-                  <div>
-                    {(i.data as ModBanFromCommunity).expires &&
-                      ` expires: ${moment
-                        .utc((i.data as ModBanFromCommunity).expires)
-                        .fromNow()}`}
-                  </div>
-                </>
-              )}
-              {i.type_ == 'added_to_community' && (
-                <>
-                  <span>
-                    {(i.data as ModAddCommunity).removed
-                      ? 'Removed '
-                      : 'Appointed '}{' '}
-                  </span>
-                  <span>
-                    <Link
-                      to={`/u/${(i.data as ModAddCommunity).other_user_name}`}
-                    >
-                      {(i.data as ModAddCommunity).other_user_name}
-                    </Link>
-                  </span>
-                  <span> as a mod to the community </span>
-                  <span>
-                    <Link
-                      to={`/c/${(i.data as ModAddCommunity).community_name}`}
-                    >
-                      {(i.data as ModAddCommunity).community_name}
-                    </Link>
-                  </span>
-                </>
-              )}
-              {i.type_ == 'banned' && (
-                <>
-                  <span>
-                    {(i.data as ModBan).banned ? 'Banned ' : 'Unbanned '}{' '}
-                  </span>
-                  <span>
-                    <Link to={`/u/${(i.data as ModBan).other_user_name}`}>
-                      {(i.data as ModBan).other_user_name}
-                    </Link>
-                  </span>
-                  <div>
-                    {(i.data as ModBan).reason &&
-                      ` reason: ${(i.data as ModBan).reason}`}
-                  </div>
-                  <div>
-                    {(i.data as ModBan).expires &&
-                      ` expires: ${moment
-                        .utc((i.data as ModBan).expires)
-                        .fromNow()}`}
-                  </div>
-                </>
-              )}
-              {i.type_ == 'added' && (
-                <>
-                  <span>
-                    {(i.data as ModAdd).removed ? 'Removed ' : 'Appointed '}{' '}
-                  </span>
-                  <span>
-                    <Link to={`/u/${(i.data as ModAdd).other_user_name}`}>
-                      {(i.data as ModAdd).other_user_name}
-                    </Link>
-                  </span>
-                  <span> as an admin </span>
-                </>
-              )}
+              <UserListing user={i.view.moderator} />
             </td>
+            <td>{this.renderModlogType(i)}</td>
           </tr>
         ))}
       </tbody>
@@ -353,7 +352,7 @@ export class Modlog extends Component<any, ModlogState> {
   }
 
   get documentTitle(): string {
-    return `Modlog - ${this.state.site.name}`;
+    return `Modlog - ${this.state.site_view.site.name}`;
   }
 
   render() {
@@ -435,12 +434,12 @@ export class Modlog extends Component<any, ModlogState> {
   }
 
   refetch() {
-    let modlogForm: GetModlogForm = {
+    let modlogForm: GetModlog = {
       community_id: this.state.communityId,
       page: this.state.page,
       limit: fetchLimit,
     };
-    WebSocketService.Instance.getModlog(modlogForm);
+    WebSocketService.Instance.client.getModlog(modlogForm);
   }
 
   static fetchInitialData(req: InitialFetchRequest): Promise<any>[] {
@@ -448,7 +447,7 @@ export class Modlog extends Component<any, ModlogState> {
     let communityId = pathSplit[3];
     let promises: Promise<any>[] = [];
 
-    let modlogForm: GetModlogForm = {
+    let modlogForm: GetModlog = {
       page: 1,
       limit: fetchLimit,
     };
@@ -461,17 +460,16 @@ export class Modlog extends Component<any, ModlogState> {
     return promises;
   }
 
-  parseMessage(msg: WebSocketJsonResponse) {
-    console.log(msg);
-    let res = wsJsonToRes(msg);
+  parseMessage(msg: any) {
+    let op = wsUserOp(msg);
     if (msg.error) {
       toast(i18n.t(msg.error), 'danger');
       return;
-    } else if (res.op == UserOperation.GetModlog) {
-      let data = res.data as GetModlogResponse;
+    } else if (op == UserOperation.GetModlog) {
+      let data = wsJsonToRes<GetModlogResponse>(msg).data;
       this.state.loading = false;
       window.scrollTo(0, 0);
-      this.setCombined(data);
+      this.state.res = data;
       this.setState(this.state);
     }
   }