From 96302f67a3e0bccfd3ec56856be8b5fb374f8e8c Mon Sep 17 00:00:00 2001
From: Sami Mazouz <sychocouldy@gmail.com>
Date: Wed, 8 Mar 2023 15:16:36 +0100
Subject: [PATCH] fix(qa): JS issues when adding flag feature

Signed-off-by: Sami Mazouz <sychocouldy@gmail.com>
---
 extensions/flags/js/src/@types/shims.d.ts     |  9 ++++---
 ...addFlagsToPosts.js => addFlagsToPosts.tsx} | 27 ++++++++++++++-----
 .../js/src/forum/states/FlagListState.js      |  2 ++
 3 files changed, 28 insertions(+), 10 deletions(-)
 rename extensions/flags/js/src/forum/{addFlagsToPosts.js => addFlagsToPosts.tsx} (80%)

diff --git a/extensions/flags/js/src/@types/shims.d.ts b/extensions/flags/js/src/@types/shims.d.ts
index 6fd28d422..0cbdbeaff 100644
--- a/extensions/flags/js/src/@types/shims.d.ts
+++ b/extensions/flags/js/src/@types/shims.d.ts
@@ -1,6 +1,7 @@
-import Flag from '../forum/models/Flag';
-import FlagListState from '../forum/states/FlagListState';
-import Mithril from 'mithril';
+import type Flag from '../forum/models/Flag';
+import type FlagListState from '../forum/states/FlagListState';
+import type Mithril from 'mithril';
+import type ItemList from 'flarum/common/utils/ItemList';
 
 declare module 'flarum/common/models/Post' {
   export default interface Post {
@@ -17,6 +18,8 @@ declare module 'flarum/forum/ForumApplication' {
 
 declare module 'flarum/forum/components/Post' {
   export default interface Post {
+    dismissFlag: (body: any) => Promise<any>;
+    flagActionItems: () => ItemList<Mithril.Children>;
     flagReason: (flag: Flag) => Mithril.Children;
   }
 }
diff --git a/extensions/flags/js/src/forum/addFlagsToPosts.js b/extensions/flags/js/src/forum/addFlagsToPosts.tsx
similarity index 80%
rename from extensions/flags/js/src/forum/addFlagsToPosts.js
rename to extensions/flags/js/src/forum/addFlagsToPosts.tsx
index f053a21f5..b9ee239a2 100644
--- a/extensions/flags/js/src/forum/addFlagsToPosts.js
+++ b/extensions/flags/js/src/forum/addFlagsToPosts.tsx
@@ -1,10 +1,14 @@
 import { extend } from 'flarum/common/extend';
 import app from 'flarum/forum/app';
 import Post from 'flarum/forum/components/Post';
+import CommentPost from 'flarum/forum/components/CommentPost';
 import Button from 'flarum/common/components/Button';
 import ItemList from 'flarum/common/utils/ItemList';
 import PostControls from 'flarum/forum/utils/PostControls';
 import humanTime from 'flarum/common/utils/humanTime';
+import isObject from 'flarum/common/utils/isObject';
+import type Flag from './models/Flag';
+import type Mithril from 'mithril';
 
 export default function () {
   extend(Post.prototype, 'elementAttrs', function (attrs) {
@@ -21,7 +25,7 @@ export default function () {
     this.subtree.invalidate();
 
     if (app.flags.cache) {
-      app.flags.cache.some((flag, i) => {
+      app.flags.cache.some((flag: Flag, i: number) => {
         if (flag.post() === post) {
           app.flags.cache.splice(i, 1);
 
@@ -39,6 +43,8 @@ export default function () {
 
           return true;
         }
+
+        return false;
       });
     }
 
@@ -50,16 +56,17 @@ export default function () {
   };
 
   Post.prototype.flagActionItems = function () {
-    const items = new ItemList();
+    const items = new ItemList<Mithril.Children>();
 
-    const controls = PostControls.destructiveControls(this.attrs.post);
+    const controls = PostControls.destructiveControls(this.attrs.post, this);
 
     Object.keys(controls.items).forEach((k) => {
-      const attrs = controls.get(k).attrs;
+      const item = controls.get(k);
+      const attrs = isObject(item) && 'attrs' in item ? item.attrs : {};
 
       attrs.className = 'Button';
 
-      extend(attrs, 'onclick', () => this.dismissFlag());
+      extend(attrs, 'onclick', () => this.dismissFlag({}));
     });
 
     items.add('controls', <div className="ButtonGroup">{controls.toArray()}</div>);
@@ -81,12 +88,16 @@ export default function () {
 
     if (!flags.length) return;
 
-    if (post.isHidden()) this.revealContent = true;
+    if (post.isHidden() && this instanceof CommentPost) {
+      this.revealContent = true;
+    }
+
+    if (!isObject(vdom) || !('unshift' in vdom)) return;
 
     vdom.unshift(
       <div className="Post-flagged">
         <div className="Post-flagged-flags">
-          {flags.map((flag) => (
+          {flags.map((flag: Flag) => (
             <div className="Post-flagged-flag">{this.flagReason(flag)}</div>
           ))}
         </div>
@@ -111,5 +122,7 @@ export default function () {
         detail ? <span className="Post-flagged-detail">{detail}</span> : '',
       ];
     }
+
+    return null;
   };
 }
diff --git a/extensions/flags/js/src/forum/states/FlagListState.js b/extensions/flags/js/src/forum/states/FlagListState.js
index 94c011b4e..0a648cc58 100644
--- a/extensions/flags/js/src/forum/states/FlagListState.js
+++ b/extensions/flags/js/src/forum/states/FlagListState.js
@@ -1,4 +1,6 @@
 export default class FlagListState {
+  index = 0;
+
   constructor(app) {
     this.app = app;