From 8241badf0cfa35212ce2245b415f8893ef1a047b Mon Sep 17 00:00:00 2001
From: Admin <admin@MacBook-Air.local>
Date: Thu, 7 Aug 2025 08:47:24 +0700
Subject: [PATCH] set height input

---
 composer-bot-extensions/src/content.ts        |  5 +-
 .../src/services/content.service.ts           | 64 +++++++++++++++++++
 .../src/services/teams-chat.service.ts        |  2 +
 3 files changed, 69 insertions(+), 2 deletions(-)

diff --git a/composer-bot-extensions/src/content.ts b/composer-bot-extensions/src/content.ts
index 3f79ced..599aed5 100644
--- a/composer-bot-extensions/src/content.ts
+++ b/composer-bot-extensions/src/content.ts
@@ -6,11 +6,12 @@ const port = chrome.runtime.connect({ name: "message" });
 
 const contentService = new ContentService(port);
 
-console.log({ a: import.meta.env.VITE_API_URL });
-
 port.onMessage.addListener((msg: IMsg<any>) => {
   console.log({ msg });
 
+  // Set height input chat tager cho nó ra dễ click
+  contentService.fixedHeightChatInput();
+
   if (msg.type !== "socket") return;
 
   switch (msg.event) {
diff --git a/composer-bot-extensions/src/services/content.service.ts b/composer-bot-extensions/src/services/content.service.ts
index 5c1de86..87330e7 100644
--- a/composer-bot-extensions/src/services/content.service.ts
+++ b/composer-bot-extensions/src/services/content.service.ts
@@ -13,6 +13,48 @@ export class ContentService {
     this.service = new TeamsChatService();
     this.port = port;
   }
+  _forceHeightObserver: any;
+
+  getElementByXPath(xpath: string) {
+    return document.evaluate(
+      xpath,
+      document,
+      null,
+      XPathResult.FIRST_ORDERED_NODE_TYPE,
+      null
+    ).singleNodeValue;
+  }
+
+  forceHeight(el: HTMLElement, height = "100px") {
+    if (!el) return;
+
+    el.style.setProperty("height", height, "important");
+
+    // Gỡ bỏ auto-resize (nếu là textarea)
+    el.style.setProperty("resize", "none", "important");
+
+    // Lặp lại khi element bị focus/input
+    const keepHeight = () => {
+      el.style.setProperty("height", height, "important");
+    };
+
+    el.addEventListener("focus", keepHeight);
+    el.addEventListener("input", keepHeight);
+    el.addEventListener("blur", keepHeight);
+
+    // Thêm mutation observer nếu bị script khác chỉnh sửa
+    const observer = new MutationObserver(() => {
+      el.style.setProperty("height", height, "important");
+    });
+
+    observer.observe(el, {
+      attributes: true,
+      attributeFilter: ["style"],
+    });
+
+    // Lưu lại để debug nếu cần
+    this._forceHeightObserver = observer;
+  }
 
   private _clickToConversation(id: string) {
     const el = document.getElementById(`chat-list-item_${id}`);
@@ -270,4 +312,26 @@ export class ContentService {
       await typeingService.send(message);
     });
   }
+
+  fixedHeightChatInput(retry = 20, interval = 1000) {
+    const tryFind = () => {
+      const el = this.getElementByXPath(
+        this.service.elTags.chat_input
+      ) as HTMLElement;
+
+      if (el) {
+        this.forceHeight(el, "100px");
+        console.log("✔ Fixed height applied to chat input");
+      } else if (retry > 0) {
+        setTimeout(
+          () => this.fixedHeightChatInput(retry - 1, interval),
+          interval
+        );
+      } else {
+        console.warn("✘ Element not found with provided XPath after retries");
+      }
+    };
+
+    tryFind();
+  }
 }
diff --git a/composer-bot-extensions/src/services/teams-chat.service.ts b/composer-bot-extensions/src/services/teams-chat.service.ts
index 376a156..b29af13 100644
--- a/composer-bot-extensions/src/services/teams-chat.service.ts
+++ b/composer-bot-extensions/src/services/teams-chat.service.ts
@@ -17,6 +17,8 @@ export class TeamsChatService {
     close_reply_btn:
       "/html/body/div[1]/div/div/div/div[6]/div[4]/div/div[1]/div/div[3]/div/div[3]/div/div[2]/div/div[2]/div/div/card/div/div/div[2]/div/div[1]/button",
     reply_btn: '[aria-label="Reply"]',
+    chat_input:
+      "/html/body/div[1]/div/div/div/div[6]/div[4]/div/div[1]/div/div[3]/div/div[3]/div/div[2]/div/div[2]/div[1]/div",
   };
 
   public getCurrentRoomInfo(): { room_id?: string; room_name?: string } {