fix: apply ESLint rule vue/component-tags-order

app/javascript/shared/components/ChatCard.vue

@@ -1,25 +1,3 @@
-<template>
-  <div
-    class="card-message chat-bubble agent"
-    :class="$dm('bg-white', 'dark:bg-slate-700')"
-  >
-    <img class="media" :src="mediaUrl" />
-    <div class="card-body">
-      <h4 class="title" :class="$dm('text-black-900', 'dark:text-slate-50')">
-        {{ title }}
-      </h4>
-      <p class="body" :class="$dm('text-black-700', 'dark:text-slate-100')">
-        {{ description }}
-      </p>
-      <card-button
-        v-for="action in actions"
-        :key="action.id"
-        :action="action"
-      />
-    </div>
-  </div>
-</template>
-
 <script>
 import CardButton from 'shared/components/CardButton.vue';
 import darkModeMixin from 'widget/mixins/darkModeMixin.js';
@@ -52,6 +30,28 @@ export default {
 };
 </script>
 
+<template>
+  <div
+    class="card-message chat-bubble agent"
+    :class="$dm('bg-white', 'dark:bg-slate-700')"
+  >
+    <img class="media" :src="mediaUrl" />
+    <div class="card-body">
+      <h4 class="title" :class="$dm('text-black-900', 'dark:text-slate-50')">
+        {{ title }}
+      </h4>
+      <p class="body" :class="$dm('text-black-700', 'dark:text-slate-100')">
+        {{ description }}
+      </p>
+      <card-button
+        v-for="action in actions"
+        :key="action.id"
+        :action="action"
+      />
+    </div>
+  </div>
+</template>
+
 <style scoped lang="scss">
 @import '~widget/assets/scss/variables.scss';
 @import '~dashboard/assets/scss/mixins.scss';