diff --git a/components/MessageActions.vue b/components/MessageActions.vue
index ddd6287..6fe77fc 100644
--- a/components/MessageActions.vue
+++ b/components/MessageActions.vue
@@ -41,7 +41,7 @@ const deleteMessage = async () => {
     method: 'DELETE'
   })
   if (!error.value) {
-    this.$emit('deleteMessage', props.messageIndex)
+    props.deleteMessage(props.messageIndex)
     showSnackbar('Deleted!')
   }
   showSnackbar('Delete failed')
diff --git a/components/MsgContent.vue b/components/MsgContent.vue
index 86e3e14..e5e6e0a 100644
--- a/components/MsgContent.vue
+++ b/components/MsgContent.vue
@@ -12,14 +12,19 @@ const md = new MarkdownIt({
   },
 })
 
-const props = defineProps(['content'])
+const props = defineProps({
+  message: {
+    type: Object,
+    required: true
+  }
+})
 
 const contentHtml = ref('')
 
 const contentElm = ref(null)
 
 watchEffect(() => {
-  contentHtml.value = props.content ? md.render(props.content) : ''
+  contentHtml.value = props.message.message ? md.render(props.message.message) : ''
 })
 
 const bindCopyCodeToButtons = () => {
@@ -54,11 +59,19 @@ onUpdated(() => {
 </script>
 
 <template>
-  <div
-      ref="contentElm"
-      v-html="contentHtml"
-      class="chat-msg-content"
-  ></div>
+  <v-card
+      :color="message.is_bot ? '' : 'primary'"
+      rounded="lg"
+      elevation="2"
+  >
+    <v-card-text>
+      <div
+          ref="contentElm"
+          v-html="contentHtml"
+          class="chat-msg-content"
+      ></div>
+    </v-card-text>
+  </v-card>
 </template>
 
 <style>
diff --git a/pages/index.vue b/pages/index.vue
index b6cc558..99acc95 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -56,7 +56,7 @@ const fetchReply = async (message, parentMessageId) => {
   const data = Object.assign({}, currentModel.value, {
     openaiApiKey: openaiApiKey.value,
     message: message,
-    parentMessageId: parentMessageId,
+    // parentMessageId: parentMessageId,
     conversationId: currentConversation.value.id
   })
 
@@ -93,6 +93,13 @@ const fetchReply = async (message, parentMessageId) => {
           throw new Error(data.error);
         }
 
+        if (event === 'userMessageId') {
+          console.log(currentConversation.value.messages[currentConversation.value.messages.length - 1])
+          currentConversation.value.messages[currentConversation.value.messages.length - 1].id = data.userMessageId
+          console.log(currentConversation.value.messages[currentConversation.value.messages.length - 1])
+          return;
+        }
+
         if (event === 'done') {
           if (currentConversation.value.id === null) {
             currentConversation.value.id = data.conversationId
@@ -184,15 +191,7 @@ const deleteMessage = (index) => {
                 :use-prompt="usePrompt"
                 :delete-message="deleteMessage"
             />
-            <v-card
-                :color="message.is_bot ? '' : 'primary'"
-                rounded="lg"
-                elevation="2"
-            >
-              <v-card-text>
-                <MsgContent :content="message.message" />
-              </v-card-text>
-            </v-card>
+            <MsgContent :message="message" />
             <MessageActions
                 v-if="message.is_bot"
                 :message="message"