From 88cef88d80da44ec2783ceea7f6420c1aaf4fbb1 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Thu, 25 May 2023 12:20:42 +0530
Subject: [PATCH] fix: Instagram story with video not rendering (#7184)

* fix: instagram story with video not rendering

* chore: Minor fixes

---------

Co-authored-by: Tejaswini Chile <tejaswini@chatwoot.com>
---
 .../components/widgets/conversation/Message.vue    | 14 +++++++++-----
 1 file changed, 9 insertions(+), 5 deletions(-)

diff --git a/app/javascript/dashboard/components/widgets/conversation/Message.vue b/app/javascript/dashboard/components/widgets/conversation/Message.vue
index 6f20cac7c..dd51ea838 100644
--- a/app/javascript/dashboard/components/widgets/conversation/Message.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/Message.vue
@@ -25,10 +25,14 @@
         <blockquote v-if="storyReply" class="story-reply-quote">
           <span>{{ $t('CONVERSATION.REPLIED_TO_STORY') }}</span>
           <bubble-image
-            v-if="!hasStoryError"
+            v-if="!hasImgStoryError && storyUrl"
             :url="storyUrl"
             @error="onStoryLoadError"
           />
+          <bubble-video
+            v-else-if="hasImgStoryError && storyUrl"
+            :url="storyUrl"
+          />
         </blockquote>
         <bubble-text
           v-if="data.content"
@@ -200,7 +204,7 @@ export default {
       hasImageError: false,
       contextMenuPosition: {},
       showBackgroundHighlight: false,
-      hasStoryError: false,
+      hasImgStoryError: false,
     };
   },
   computed: {
@@ -429,12 +433,12 @@ export default {
   watch: {
     data() {
       this.hasImageError = false;
-      this.hasStoryError = false;
+      this.hasImgStoryError = false;
     },
   },
   mounted() {
     this.hasImageError = false;
-    this.hasStoryError = false;
+    this.hasImgStoryError = false;
     bus.$on(BUS_EVENTS.ON_MESSAGE_LIST_SCROLL, this.closeContextMenu);
     this.setupHighlightTimer();
   },
@@ -464,7 +468,7 @@ export default {
       this.hasImageError = true;
     },
     onStoryLoadError() {
-      this.hasStoryError = true;
+      this.hasImgStoryError = true;
     },
     openContextMenu(e) {
       const shouldSkipContextMenu =