diff --git a/frontend/src/components/CommentBox.vue b/frontend/src/components/CommentBox.vue
index 2f3ea28c..b74d82ec 100644
--- a/frontend/src/components/CommentBox.vue
+++ b/frontend/src/components/CommentBox.vue
@@ -2,8 +2,8 @@
   <TextEditor
     ref="textEditor"
     :editor-class="['prose-sm max-w-none', editable && 'min-h-[7rem]']"
-    :content="value"
-    @change="editable ? $emit('change', $event) : null"
+    :content="content"
+    @change="editable ? (content = $event) : null"
     :starterkit-options="{ heading: { levels: [2, 3, 4, 5, 6] } }"
     :placeholder="placeholder"
     :editable="editable"
@@ -85,10 +85,6 @@ import { EditorContent } from '@tiptap/vue-3'
 import { ref, computed, defineModel } from 'vue'
 
 const props = defineProps({
-  value: {
-    type: String,
-    default: '',
-  },
   placeholder: {
     type: String,
     default: null,
@@ -115,9 +111,9 @@ const props = defineProps({
   },
 })
 
-const emit = defineEmits(['change'])
 const modelValue = defineModel()
 const attachments = defineModel('attachments')
+const content = defineModel('content')
 
 const { users: usersList } = usersStore()
 
diff --git a/frontend/src/components/CommunicationArea.vue b/frontend/src/components/CommunicationArea.vue
index 464f9e17..7bd6b1e0 100644
--- a/frontend/src/components/CommunicationArea.vue
+++ b/frontend/src/components/CommunicationArea.vue
@@ -43,8 +43,7 @@
   >
     <EmailEditor
       ref="newEmailEditor"
-      :value="newEmail"
-      @change="onNewEmailChange"
+      v-model:content="newEmail"
       :submitButtonProps="{
         variant: 'solid',
         onClick: submitEmail,
@@ -67,8 +66,7 @@
   <div v-show="showCommentBox">
     <CommentBox
       ref="newCommentEditor"
-      :value="newComment"
-      @change="onNewCommentChange"
+      v-model:content="newComment"
       :submitButtonProps="{
         variant: 'solid',
         onClick: submitComment,
@@ -158,14 +156,6 @@ const emailEmpty = computed(() => {
   return !newEmail.value || newEmail.value === '<p></p>'
 })
 
-const onNewEmailChange = (value) => {
-  newEmail.value = value
-}
-
-const onNewCommentChange = (value) => {
-  newComment.value = value
-}
-
 async function sendMail() {
   let recipients = newEmailEditor.value.toEmails
   let subject = newEmailEditor.value.subject
@@ -187,7 +177,7 @@ async function sendMail() {
 }
 
 async function sendComment() {
-  await call("frappe.desk.form.utils.add_comment", {
+  await call('frappe.desk.form.utils.add_comment', {
     reference_doctype: props.doctype,
     reference_name: doc.value.data.name,
     content: newComment.value,