Initial Commit

resources/js/components/dredge/Messages/MessageBubble.vue

@@ -2,6 +2,8 @@
 import Avatar from '@/components/dredge/Avatar.vue';
 import MessageText from './MessageText.vue';
 import MessageShare from './MessageShare.vue';
+import MessageStoryShare from './MessageStoryShare.vue';
+import MessageMedia from './MessageMedia.vue';
 import MessageSystem from './MessageSystem.vue';
 import type { ThreadMessage } from '@/types/dredge.types';
 
@@ -26,9 +28,16 @@ defineProps<{
                 {{ message.replied_to_text }}
             </p>
 
-            <MessageShare v-if="message.shared_url" :message="message" />
-            <MessageText v-else-if="message.text" :message="message" />
-            <MessageSystem v-else :message="message" :is-own="isOwn" />
+            <!-- Text is a universal concern shown alongside whatever else the
+                 message carries, not one branch of a type dispatch — a story
+                 reply, for instance, has both a caption you typed AND a
+                 share preview, and previously only one or the other rendered. -->
+            <MessageText v-if="message.text" :message="message" />
+
+            <MessageStoryShare v-if="message.story_share" :message="message" />
+            <MessageShare v-else-if="message.shared_url" :message="message" />
+            <MessageMedia v-else-if="message.attachments?.length" :message="message" />
+            <MessageSystem v-else-if="!message.text" :message="message" :is-own="isOwn" />
 
             <div v-if="message.reactions?.length" class="bubble__reactions">
                 <span v-for="(reaction, i) in message.reactions" :key="i" class="bubble__reaction">