fix: apply ESLint rule vue/define-macros-order

2024-07-25 23:58:58 +05:30
parent b92f7536d2
commit a3229cee99
23 changed files with 80 additions and 78 deletions
@@ -31,6 +31,7 @@ import CalendarMonth from './components/CalendarMonth.vue';
 import CalendarWeek from './components/CalendarWeek.vue';
 import CalendarFooter from './components/CalendarFooter.vue';

+const emit = defineEmits(['change']);
 const { LAST_7_DAYS, LAST_30_DAYS, CUSTOM_RANGE } = DATE_RANGE_TYPES;
 const { START_CALENDAR, END_CALENDAR } = CALENDAR_TYPES;
 const { WEEK, MONTH, YEAR } = CALENDAR_PERIODS;
@@ -54,8 +55,6 @@ const hoveredEndDate = ref(null);
 const manualStartDate = ref(selectedStartDate.value);
 const manualEndDate = ref(selectedEndDate.value);

-const emit = defineEmits(['change']);
-
 // Watcher will set the start and end dates based on the selected range
 watch(selectedRange, newRange => {
  if (newRange !== CUSTOM_RANGE) {
@@ -18,6 +18,7 @@ const props = defineProps({
  endCurrentDate: Date,
 });

+const emit = defineEmits(['selectMonth', 'prev', 'next', 'setView']);
 const { START_CALENDAR } = CALENDAR_TYPES;
 const { MONTH, YEAR } = CALENDAR_PERIODS;

@@ -33,8 +34,6 @@ const activeMonthIndex = computed(() => {
  return getMonth(date);
 });

-const emit = defineEmits(['selectMonth', 'prev', 'next', 'setView']);
-
 const setViewMode = (type, mode) => {
  emit('setView', type, mode);
 };
@@ -14,6 +14,8 @@ const props = defineProps({
  endCurrentDate: Date,
 });

+const emit = defineEmits(['selectYear']);
+
 const { START_CALENDAR } = CALENDAR_TYPES;

 const calculateStartYear = date => {
@@ -52,8 +54,6 @@ const onClickNext = () => {
  startYear.value = addYears(new Date(startYear.value, 0, 1), 10).getFullYear();
 };

-const emit = defineEmits(['selectYear']);
-
 const selectYear = year => {
  emit('selectYear', year);
 };
@@ -12,6 +12,8 @@ const props = defineProps({
  },
 });

+const emit = defineEmits(['open']);
+
 const formatDateRange = computed(() => {
  const startDate = props.selectedStartDate;
  const endDate = props.selectedEndDate;
@@ -39,8 +41,6 @@ const activeDateRange = computed(
  () => dateRanges.find(range => range.value === props.selectedRange).label
 );

-const emit = defineEmits(['open']);
-
 const openDatePicker = () => {
  emit('open');
 };
@@ -17,6 +17,7 @@ const props = defineProps({
  },
 });

+const emit = defineEmits(['pageChange']);
 const hasLastPage = computed(
  () => props.currentPage === props.totalPages || props.totalPages === 1
 );
@@ -24,8 +25,6 @@ const hasFirstPage = computed(() => props.currentPage === 1);
 const hasNextPage = computed(() => props.currentPage === props.totalPages);
 const hasPrevPage = computed(() => props.currentPage === 1);

-const emit = defineEmits(['pageChange']);
-
 function buttonClass(hasPage) {
  if (hasPage) {
    return 'hover:!bg-slate-50 dark:hover:!bg-slate-800';
@@ -4,8 +4,6 @@ import { ref, computed } from 'vue';
 import wootConstants from 'dashboard/constants/globals';
 import SLAEventItem from './SLAEventItem.vue';

-const { SLA_MISS_TYPES } = wootConstants;
-
 const props = defineProps({
  slaMissedEvents: {
    type: Array,
@@ -13,6 +11,8 @@ const props = defineProps({
  },
 });

+const { SLA_MISS_TYPES } = wootConstants;
+
 const shouldShowAllNrts = ref(false);

 const frtMisses = computed(() =>
@@ -5,10 +5,6 @@ import { ref } from 'vue';
 import WootDropdownItem from 'shared/components/ui/dropdown/DropdownItem.vue';
 import WootDropdownMenu from 'shared/components/ui/dropdown/DropdownMenu.vue';

-const { t } = useI18n();
-
-const emits = defineEmits(['update', 'close']);
-
 const props = defineProps({
  selectedInboxes: {
    type: Array,
@@ -32,6 +28,10 @@ const props = defineProps({
  },
 });

+const emits = defineEmits(['update', 'close']);
+
+const { t } = useI18n();
+
 const actions = ref([
  { icon: 'checkmark', key: 'resolved' },
  { icon: 'arrow-redo', key: 'open' },
@@ -15,6 +15,8 @@ const props = defineProps({
  },
 });

+const emits = defineEmits(['close']);
+
 const { t } = useI18n();

 const selectedTabIndex = ref(0);
@@ -27,8 +29,6 @@ const title = computed(() => {
  });
 });

-const emits = defineEmits(['close']);
-
 const tabs = ref([
  {
    key: 0,
@@ -4,13 +4,6 @@ import UserAvatarWithName from 'dashboard/components/widgets/UserAvatarWithName.
 import IssueHeader from './IssueHeader.vue';
 import { computed } from 'vue';

-const priorityMap = {
-  1: 'Urgent',
-  2: 'High',
-  3: 'Medium',
-  4: 'Low',
-};
-
 const props = defineProps({
  issue: {
    type: Object,
@@ -24,6 +17,13 @@ const props = defineProps({

 const emit = defineEmits(['unlinkIssue']);

+const priorityMap = {
+  1: 'Urgent',
+  2: 'High',
+  3: 'Medium',
+  4: 'Low',
+};
+
 const formattedDate = computed(() => {
  const { createdAt } = props.issue;
  return format(new Date(createdAt), 'hh:mm a, MMM dd');
@@ -11,10 +11,10 @@ const props = defineProps({
  },
 });

-const isUnlinking = inject('isUnlinking');
-
 const emit = defineEmits(['unlinkIssue']);

+const isUnlinking = inject('isUnlinking');
+
 const unlinkIssue = () => {
  emit('unlinkIssue');
 };
@@ -3,10 +3,6 @@ import { ref, computed, defineComponent } from 'vue';
 import FilterButton from 'dashboard/components/ui/Dropdown/DropdownButton.vue';
 import FilterListDropdown from 'dashboard/components/ui/Dropdown/DropdownList.vue';

-defineComponent({
-  name: 'SearchableDropdown',
-});
-
 const props = defineProps({
  type: { type: String, required: true },
  label: { type: String, default: null },
@@ -17,6 +13,11 @@ const props = defineProps({
 });

 const emit = defineEmits(['change']);
+
+defineComponent({
+  name: 'SearchableDropdown',
+});
+
 const shouldShowDropdown = ref(false);

 const toggleDropdown = () => {
@@ -8,10 +8,6 @@ import CreateOrLinkIssue from './CreateOrLinkIssue.vue';
 import Issue from './Issue.vue';
 import { parseLinearAPIErrorResponse } from 'dashboard/store/utils/api';

-defineComponent({
-  name: 'Linear',
-});
-
 const props = defineProps({
  conversationId: {
    type: [Number, String],
@@ -19,6 +15,10 @@ const props = defineProps({
  },
 });

+defineComponent({
+  name: 'Linear',
+});
+
 const getters = useStoreGetters();
 const { t } = useI18n();

@@ -15,15 +15,6 @@ import { uploadFile } from 'dashboard/helper/uploadHelper';
 import { isDomain } from 'shared/helpers/Validators';
 import SettingsLayout from './Layout/SettingsLayout.vue';

-const { EXAMPLE_URL } = wootConstants;
-const MAXIMUM_FILE_UPLOAD_SIZE = 4; // in MB
-
-const { t } = useI18n();
-
-defineComponent({
-  name: 'PortalSettingsBasicForm',
-});
-
 const props = defineProps({
  portal: {
    type: Object,
@@ -38,6 +29,16 @@ const props = defineProps({
    default: '',
  },
 });
+const emit = defineEmits(['submit', 'deleteLogo']);
+
+defineComponent({
+  name: 'PortalSettingsBasicForm',
+});
+
+const { EXAMPLE_URL } = wootConstants;
+const MAXIMUM_FILE_UPLOAD_SIZE = 4; // in MB
+
+const { t } = useI18n();

 const state = reactive({
  name: '',
@@ -97,8 +98,6 @@ const showDeleteButton = computed(() => {
  return hasValidAvatarUrl(state.logoUrl);
 });

-const emit = defineEmits(['submit', 'deleteLogo']);
-
 onMounted(() => {
  const portal = props.portal || {};
  state.name = portal.name || '';
@@ -2,20 +2,11 @@
 import { getRandomColor } from 'dashboard/helper/labelColor';
 import SettingsLayout from './Layout/SettingsLayout.vue';
 import wootConstants from 'dashboard/constants/globals';
-const { EXAMPLE_URL } = wootConstants;
-
 import { useVuelidate } from '@vuelidate/core';
 import { url } from '@vuelidate/validators';

 import { defineComponent, reactive, computed, onMounted } from 'vue';
 import { useI18n } from 'dashboard/composables/useI18n';
-
-defineComponent({
-  name: 'PortalSettingsCustomizationForm',
-});
-
-const { t } = useI18n();
-
 const props = defineProps({
  portal: {
    type: Object,
@@ -29,6 +20,14 @@ const props = defineProps({

 const emit = defineEmits(['submit']);

+defineComponent({
+  name: 'PortalSettingsCustomizationForm',
+});
+
+const { t } = useI18n();
+
+const { EXAMPLE_URL } = wootConstants;
+
 const state = reactive({
  color: getRandomColor(),
  pageTitle: '',
@@ -6,8 +6,6 @@ import microsoftClient from 'dashboard/api/channel/microsoftClient';
 import { useI18n } from 'dashboard/composables/useI18n';
 import { useAlert } from 'dashboard/composables';

-const { t } = useI18n();
-
 const props = defineProps({
  inbox: {
    type: Object,
@@ -15,6 +13,8 @@ const props = defineProps({
  },
 });

+const { t } = useI18n();
+
 const isRequestingAuthorization = ref(false);

 async function requestAuthorization() {
@@ -13,10 +13,10 @@ const props = defineProps({
  },
 });

-const alertEvents = ALERT_EVENTS;
-
 const emit = defineEmits(['update']);

+const alertEvents = ALERT_EVENTS;
+
 const selectedValue = computed({
  get: () => props.value,
  set: value => {
@@ -14,6 +14,8 @@ const props = defineProps({
  },
 });

+const emit = defineEmits(['change']);
+
 const alertTones = computed(() => [
  {
    value: 'ding',
@@ -25,8 +27,6 @@ const alertTones = computed(() => [
  },
 ]);

-const emit = defineEmits(['change']);
-
 const selectedValue = computed({
  get: () => props.value,
  set: value => {
@@ -11,10 +11,9 @@ const props = defineProps({
  },
 });

+const emit = defineEmits(['updateSignature']);
 const customEditorMenuList = MESSAGE_SIGNATURE_EDITOR_MENU_OPTIONS;
 const signature = ref(props.messageSignature);
-const emit = defineEmits(['updateSignature']);
-
 watch(
  () => props.messageSignature ?? '',
  newValue => {
@@ -33,6 +33,8 @@ defineProps({
  },
 });

+const emit = defineEmits(['toggleDropdown', 'addFilter', 'closeDropdown']);
+
 const hoveredItemId = ref(null);

 const showSubMenu = id => {
@@ -45,7 +47,6 @@ const hideSubMenu = () => {

 const isHovered = id => hoveredItemId.value === id;

-const emit = defineEmits(['toggleDropdown', 'addFilter', 'closeDropdown']);
 const toggleDropdown = () => emit('toggleDropdown');
 const addFilter = item => {
  emit('addFilter', item);
@@ -9,7 +9,6 @@ import { getQuantileIntervals } from '@chatwoot/utils';
 import { groupHeatmapByDay } from 'helpers/ReportsDataHelper';
 import { useI18n } from 'dashboard/composables/useI18n';

-const { t } = useI18n();
 const props = defineProps({
  heatData: {
    type: Array,
@@ -20,7 +19,7 @@ const props = defineProps({
    default: false,
  },
 });
-
+const { t } = useI18n();
 const processedData = computed(() => {
  return groupHeatmapByDay(props.heatData);
 });
@@ -27,6 +27,8 @@ const props = defineProps({
  },
 });

+const emit = defineEmits(['click']);
+
 const attrs = useAttrs();

 const baseClasses = {
@@ -72,8 +74,6 @@ const sizeClass = computed(() => {

 const buttonClasses = computed(() => [colorClass.value, sizeClass.value]);

-const emit = defineEmits(['click']);
-
 const onClick = () => {
  if (props.disabled) {
    return;
@@ -1,16 +1,6 @@
 <script setup>
 import { computed } from 'vue';
 import { userInitial } from 'v3/helpers/CommonHelper';
-const colors = {
-  1: 'bg-ash-200 text-ash-900',
-  2: 'bg-amber-200 text-amber-900',
-  3: 'bg-pink-100 text-pink-800',
-  4: 'bg-purple-100 text-purple-800',
-  5: 'bg-indigo-100 text-indigo-800',
-  6: 'bg-grass-100 text-grass-800',
-  7: 'bg-mint-100 text-mint-800',
-  8: 'bg-orange-100 text-orange-800',
-};
 const props = defineProps({
  name: {
    type: String,
@@ -21,6 +11,16 @@ const props = defineProps({
    default: 72,
  },
 });
+const colors = {
+  1: 'bg-ash-200 text-ash-900',
+  2: 'bg-amber-200 text-amber-900',
+  3: 'bg-pink-100 text-pink-800',
+  4: 'bg-purple-100 text-purple-800',
+  5: 'bg-indigo-100 text-indigo-800',
+  6: 'bg-grass-100 text-grass-800',
+  7: 'bg-mint-100 text-mint-800',
+  8: 'bg-orange-100 text-orange-800',
+};
 const style = computed(() => ({
  fontSize: `${Math.floor(props.size / 2.5)}px`,
 }));