Comments: Started archive display, created mode for tree node

[bookstack] / resources / js / components / page-comments.ts

diff --git a/resources/js/components/page-comments.ts b/resources/js/components/page-comments.ts
index 45f8d6a9f6d192494560386899ac1066e366002c..083919b826f34210dabce556bacd4d7bb8e9049d 100644 (file)
--- a/resources/js/components/page-comments.ts
+++ b/resources/js/components/page-comments.ts
@@ -9,6 +9,12 @@ export interface CommentReplyEvent extends Event {
     }
 }
 
+export interface ArchiveEvent extends Event {
+    detail: {
+        new_thread_dom: HTMLElement;
+    }
+}
+
 export class PageComments extends Component {
 
     private elem: HTMLElement;
@@ -17,6 +23,7 @@ export class PageComments extends Component {
     private commentCountBar: HTMLElement;
     private commentsTitle: HTMLElement;
     private addButtonContainer: HTMLElement;
+    private archiveContainer: HTMLElement;
     private replyToRow: HTMLElement;
     private formContainer: HTMLElement;
     private form: HTMLFormElement;
@@ -43,6 +50,7 @@ export class PageComments extends Component {
         this.commentCountBar = this.$refs.commentCountBar;
         this.commentsTitle = this.$refs.commentsTitle;
         this.addButtonContainer = this.$refs.addButtonContainer;
+        this.archiveContainer = this.$refs.archiveContainer;
         this.replyToRow = this.$refs.replyToRow;
         this.formContainer = this.$refs.formContainer;
         this.form = this.$refs.form as HTMLFormElement;
@@ -75,6 +83,14 @@ export class PageComments extends Component {
             this.setReply(event.detail.id, event.detail.element);
         });
 
+        this.elem.addEventListener('page-comment-archive', (event: ArchiveEvent) => {
+            this.archiveContainer.append(event.detail.new_thread_dom);
+        });
+
+        this.elem.addEventListener('page-comment-unarchive', (event: ArchiveEvent) => {
+            this.container.append(event.detail.new_thread_dom)
+        });
+
         if (this.form) {
             this.removeReplyToButton.addEventListener('click', this.removeReplyTo.bind(this));
             this.hideFormButton.addEventListener('click', this.hideForm.bind(this));