Initial Vite Commit

app/javascript/dashboard/components/index.js

@@ -1,29 +1,29 @@
 /* eslint no-plusplus: 0 */
 import AvatarUploader from './widgets/forms/AvatarUploader.vue';
 import Bar from './widgets/chart/BarChart';
-import Button from './ui/WootButton';
-import Code from './Code';
-import ColorPicker from './widgets/ColorPicker';
+import Button from './ui/WootButton.vue';
+import Code from './Code.vue';
+import ColorPicker from './widgets/ColorPicker.vue';
 import ConfirmDeleteModal from './widgets/modal/ConfirmDeleteModal.vue';
 import ConfirmModal from './widgets/modal/ConfirmationModal.vue';
 import ContextMenu from './ui/ContextMenu.vue';
 import DeleteModal from './widgets/modal/DeleteModal.vue';
-import DropdownItem from 'shared/components/ui/dropdown/DropdownItem';
-import DropdownMenu from 'shared/components/ui/dropdown/DropdownMenu';
-import FeatureToggle from './widgets/FeatureToggle';
+import DropdownItem from 'shared/components/ui/dropdown/DropdownItem.vue';
+import DropdownMenu from 'shared/components/ui/dropdown/DropdownMenu.vue';
+import FeatureToggle from './widgets/FeatureToggle.vue';
 import HorizontalBar from './widgets/chart/HorizontalBarChart';
 import Input from './widgets/forms/Input.vue';
 import PhoneInput from './widgets/forms/PhoneInput.vue';
-import Label from './ui/Label';
-import LoadingState from './widgets/LoadingState';
-import Modal from './Modal';
-import ModalHeader from './ModalHeader';
-import ReportStatsCard from './widgets/ReportStatsCard';
-import SidemenuIcon from './SidemenuIcon';
-import Spinner from 'shared/components/Spinner';
-import SubmitButton from './buttons/FormSubmitButton';
-import Tabs from './ui/Tabs/Tabs';
-import TabsItem from './ui/Tabs/TabsItem';
+import Label from './ui/Label.vue';
+import LoadingState from './widgets/LoadingState.vue';
+import Modal from './Modal.vue';
+import ModalHeader from './ModalHeader.vue';
+import ReportStatsCard from './widgets/ReportStatsCard.vue';
+import SidemenuIcon from './SidemenuIcon.vue';
+import Spinner from 'shared/components/Spinner.vue';
+import SubmitButton from './buttons/FormSubmitButton.vue';
+import Tabs from './ui/Tabs/Tabs.jsx';
+import TabsItem from './ui/Tabs/TabsItem.vue';
 import Thumbnail from './widgets/Thumbnail.vue';
 
 const WootUIKit = {

app/javascript/dashboard/components/widgets/ColorPicker.vue

@@ -53,8 +53,8 @@ export default {
 </script>
 
 <style scoped lang="scss">
-@import '~dashboard/assets/scss/variables';
-@import '~dashboard/assets/scss/mixins';
+@import 'dashboard/assets/scss/variables';
+@import 'dashboard/assets/scss/mixins';
 
 .colorpicker {
   position: relative;

app/javascript/dashboard/components/widgets/WootWriter/Editor.vue

@@ -705,10 +705,11 @@ export default {
 </script>
 
 <style lang="scss">
-@import '~@chatwoot/prosemirror-schema/src/styles/base.scss';
+@import '@chatwoot/prosemirror-schema/src/styles/base.scss';
 
 .ProseMirror-menubar-wrapper {
   @apply flex flex-col;
+
   .ProseMirror-menubar {
     min-height: var(--space-two) !important;
     @apply -ml-2.5 pb-0 bg-white dark:bg-slate-900 text-slate-700 dark:text-slate-100;
@@ -717,6 +718,7 @@ export default {
       @apply bg-slate-75 dark:bg-slate-800;
     }
   }
+
   > .ProseMirror {
     @apply p-0 break-words text-slate-800 dark:text-slate-100;
 

app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue

@@ -198,7 +198,7 @@ import {
 import { LOCAL_STORAGE_KEYS } from 'dashboard/constants/localStorage';
 import { LocalStorage } from 'shared/helpers/localStorage';
 
-const EmojiInput = () => import('shared/components/emoji/EmojiInput');
+const EmojiInput = () => import('shared/components/emoji/EmojiInput.vue');
 
 export default {
   components: {
@@ -1208,6 +1208,7 @@ export default {
     @apply bg-yellow-50 dark:bg-yellow-200;
   }
 }
+
 .send-button {
   @apply mb-0;
 }
@@ -1228,6 +1229,7 @@ export default {
 
 .emoji-dialog--rtl {
   @apply left-[unset] -right-80;
+
   &::before {
     transform: rotate(90deg);
     filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.08));

app/javascript/dashboard/components/widgets/conversation/bubble/File.vue

@@ -46,7 +46,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-@import '~dashboard/assets/scss/variables';
+@import 'dashboard/assets/scss/variables';
 
 .file {
   display: flex;