diff --git a/src/modules/00_support/components/FormChat.vue b/src/modules/00_support/components/FormChat.vue
index 5c1a687..e60fb2b 100644
--- a/src/modules/00_support/components/FormChat.vue
+++ b/src/modules/00_support/components/FormChat.vue
@@ -1,19 +1,18 @@
 <script setup lang="ts">
 import { ref } from "vue";
+import { storeToRefs } from "pinia";
 import { useSupportStore } from "@/modules/00_support/store/Main";
 import ChatMessage from "@/modules/00_support/components/ChatMessage.vue";
 
 const store = useSupportStore();
 const content = ref<string>("");
+const { scrollContainer } = storeToRefs(store);
 
 function getOnlineStatus(option: "icon" | "status") {
   const isAdmin = store.userStatus.some((u) => u.role.includes("admin"));
   if (option === "icon") return isAdmin ? "green" : "grey";
   if (option === "status") return isAdmin ? "ออนไลน์" : "ออฟไลน์";
 }
-defineProps({
-  icon: String,
-});
 </script>
 
 <template>
@@ -24,7 +23,7 @@ defineProps({
     <div class="col row">
       <div style="border-radius: 50%; border: 1px solid teal">
         <q-avatar color="teal-1" text-color="white" size="40px">
-          <q-icon :name="icon" size="24px" color="teal" />
+          <q-icon :name="store.icon" size="24px" color="teal" />
         </q-avatar>
       </div>
       <div class="col column q-ml-md">
@@ -56,6 +55,7 @@ defineProps({
 
   <q-scroll-area
     style="background-color: #f5f4f4"
+    ref="scrollContainer"
     :style="{
       height: $q.screen.gt.md ? '600px' : '450px',
     }"