From 897fbb017d657b5f5eed5ba517f4df6ab7625a93 Mon Sep 17 00:00:00 2001
From: vitorvargasdev <instalando@protonmail.com>
Date: Wed, 27 Sep 2023 10:56:17 -0300
Subject: [PATCH] feat: open and close comments function

---
 src/components/comments/index.test.ts | 23 +++++++++++++++++++++++
 src/components/comments/index.ts      | 17 +++++++++++++++++
 2 files changed, 40 insertions(+)

diff --git a/src/components/comments/index.test.ts b/src/components/comments/index.test.ts
index fe959c15..e4d1c57e 100644
--- a/src/components/comments/index.test.ts
+++ b/src/components/comments/index.test.ts
@@ -80,6 +80,29 @@ describe('CommentsComponent', () => {
     expect(document.body.contains(commentsComponent['element'])).toBe(false);
   });
 
+  // test('should open component', () => {
+  //   commentsComponent['closeComments']();
+  //   expect(commentsComponent['element'].hasAttribute('open')).toBe(false);
+  //   commentsComponent['openComments']();
+  //   expect(commentsComponent['element'].hasAttribute('open')).toBe(true);
+  // });
+
+  // test('should close component', () => {
+  //   commentsComponent['openComments']();
+  //   expect(commentsComponent['element'].hasAttribute('open')).toBe(true);
+  //   commentsComponent['closeComments']();
+  //   expect(commentsComponent['element'].hasAttribute('open')).toBe(false);
+  // });
+
+  test('should toggle component', () => {
+    commentsComponent['toggle'](); // TODO: Remove it when toggle is implemented!
+
+    commentsComponent['toggle']();
+    expect(commentsComponent['element'].hasAttribute('open')).toBe(true);
+    commentsComponent['toggle']();
+    expect(commentsComponent['element'].hasAttribute('open')).toBe(false);
+  });
+
   test('should call apiService when fetch annotation', async () => {
     const spy = jest.spyOn(ApiService, 'fetchAnnotation');
 
diff --git a/src/components/comments/index.ts b/src/components/comments/index.ts
index b2c1fa03..a414a70e 100644
--- a/src/components/comments/index.ts
+++ b/src/components/comments/index.ts
@@ -102,6 +102,23 @@ export class CommentsComponent extends BaseComponent {
     this.realtime.commentsObserver.unsubscribe(this.onAnnotationListUpdate);
   }
 
+  // openComments(): void {
+  //   this.element.setAttributeNode(document.createAttribute('open'));
+  // }
+
+  // closeComments(): void {
+  //   this.element.removeAttribute('open');
+  // }
+
+  toggle(): void {
+    if (this.element.hasAttribute('open')) {
+      this.element.removeAttribute('open');
+      return;
+    }
+
+    this.element.setAttributeNode(document.createAttribute('open'));
+  }
+
   /**
    * @function createAnnotation
    * @description Creates a new annotation and comment and adds them to the Comments component