fix: apply ESLint rule vue/padding-line-between-blocks

2024-07-26 11:52:27 +05:30
parent 1b045c499c
commit 29007de112
218 changed files with 247 additions and 0 deletions
@@ -343,6 +343,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .folder-input {
  @apply w-[50%];
@@ -99,6 +99,7 @@ const staticElements = computed(() =>
    />
  </div>
 </template>
+
 <style scoped lang="scss">
 .conversation--attribute {
  @apply border-slate-50 dark:border-slate-700/50 border-b border-solid;
@@ -228,6 +228,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .dropdown-pane {
  @apply box-border top-8 w-full;
@@ -254,6 +254,7 @@ export default {
    </woot-modal>
  </section>
 </template>
+
 <style lang="scss" scoped>
 .conversation-page {
  display: flex;
@@ -25,6 +25,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div>
    <div
@@ -59,6 +60,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style scoped lang="scss">
 .macros-list {
  padding: var(--space-smaller);
@@ -167,6 +167,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="relative items-center w-full p-4 bg-white dark:bg-slate-900">
    <div class="flex flex-col w-full gap-2 text-left rtl:text-right">
@@ -38,6 +38,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="w-full h-5 ltr:-ml-1 rtl:-mr-1">
    <a
@@ -65,6 +65,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .search-link {
  &:hover {
@@ -134,6 +134,7 @@ export default {
    </form>
  </Modal>
 </template>
+
 <style scoped lang="scss">
 .input-container::v-deep {
  margin: 0 0 var(--space-normal);
@@ -68,6 +68,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style scoped>
 .empty-state-message {
  @apply text-center flex items-center justify-center px-4 py-8 text-slate-500 text-sm;
@@ -155,6 +155,7 @@ export default {
    />
  </div>
 </template>
+
 <style lang="scss" scoped>
 /*
 The .article-ghost-class class is maintained as the vueDraggable doesn't allow multiple classes
@@ -283,6 +283,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-grow-0 w-full h-full min-h-0 app-wrapper">
    <Sidebar
@@ -178,6 +178,7 @@ export default {
    </form>
  </woot-modal>
 </template>
+
 <style scoped lang="scss">
 .input-container::v-deep {
  @apply mt-0 mb-4 mx-0;
@@ -189,6 +189,7 @@ export default {
    </form>
  </woot-modal>
 </template>
+
 <style scoped lang="scss">
 .article-info {
  width: 100%;
@@ -99,6 +99,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style scoped lang="scss">
 .wrapper {
  flex: 1;
@@ -21,6 +21,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    class="inline-flex items-center rounded-[4px] border border-slate-100 dark:border-slate-700/50 divide-x divide-slate-100 dark:divide-slate-700/50 bg-none"
@@ -12,6 +12,7 @@ const onMenuItemClick = () => {
  emits('click');
 };
 </script>
+
 <template>
  <div
    role="button"
@@ -32,6 +32,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex gap-2 items-center">
    <div class="flex gap-1 items-center">
@@ -55,6 +55,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    class="flex justify-between items-center h-14 min-h-[3.5rem] px-4 py-2 bg-white dark:bg-slate-900 border-b border-slate-50 dark:border-slate-800/50"
@@ -10,6 +10,7 @@ defineProps({
  },
 });
 </script>
+
 <template>
  <div class="flex flex-col w-full h-full gap-10 font-inter">
    <slot name="header" />
@@ -89,6 +89,7 @@ export default {
    />
  </div>
 </template>
+
 <style scoped>
 .bots-list {
  list-style: none;
@@ -22,6 +22,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <tr class="space-x-2">
    <td class="agent-bot--details">
@@ -54,6 +55,7 @@ export default {
    </td>
  </tr>
 </template>
+
 <style scoped lang="scss">
 .agent-bot--link {
  align-items: center;
@@ -22,6 +22,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <span class="inline-flex items-center gap-1">
    <img
@@ -33,6 +34,7 @@ export default {
    <span>{{ botTypeConfig[botType].label }}</span>
  </span>
 </template>
+
 <style scoped>
 .agent-bot-type--thumbnail {
  width: auto;
@@ -45,6 +45,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="csml-editor--container">
    <LoadingState
@@ -33,6 +33,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <CsmlBotEditor v-if="agentBot.id" :agent-bot="agentBot" @submit="updateBot" />
  <div v-else class="flex flex-col h-auto overflow-auto no-padding">
@@ -122,6 +122,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 p-4 overflow-auto">
    <woot-button
@@ -274,6 +274,7 @@ export default {
    </div>
  </woot-modal>
 </template>
+
 <style lang="scss" scoped>
 .key-value {
  padding: 0 var(--space-small) var(--space-small) 0;
@@ -276,6 +276,7 @@ export default {
    </form>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .key-value {
  padding: 0 var(--space-small) var(--space-small) 0;
@@ -70,6 +70,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-col justify-between flex-1 p-4 overflow-auto">
    <!-- List Audit Logs -->
@@ -207,6 +207,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .event_wrapper {
  select {
@@ -157,6 +157,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 p-4 overflow-auto">
    <woot-button
@@ -21,6 +21,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="manage-subscription">
    <div>
@@ -370,6 +370,7 @@ export default {
    </form>
  </div>
 </template>
+
 <style lang="scss" scoped>
 ::v-deep .ProseMirror-woot-style {
  height: 5rem;
@@ -68,6 +68,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 overflow-auto">
    <CampaignsTable
@@ -285,6 +285,7 @@ export default {
    </form>
  </div>
 </template>
+
 <style lang="scss" scoped>
 ::v-deep .ProseMirror-woot-style {
  height: 5rem;
@@ -139,6 +139,7 @@ export default {
    </div>
  </Modal>
 </template>
+
 <style scoped lang="scss">
 ::v-deep {
  .ProseMirror-menubar {
@@ -114,6 +114,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 overflow-auto">
    <woot-button
@@ -10,6 +10,7 @@ defineProps({
  },
 });
 </script>
+
 <template>
  <div
    class="flex relative flex-col sm:flex-row p-4 gap-4 sm:p-6 justify-between shadow-sm group bg-white border border-solid rounded-xl dark:bg-slate-800 border-slate-75 dark:border-slate-700/50 w-full"
@@ -90,6 +90,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 overflow-auto">
    <div class="flex flex-row gap-4 p-8">
@@ -74,6 +74,7 @@ export default {
    </tr>
  </Draggable>
 </template>
+
 <style scoped lang="scss">
 .pre-chat-field {
  @apply py-4 px-2 text-slate-700 dark:text-slate-100;
@@ -91,6 +91,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="mx-8 my-2 text-base">
    <div class="mx-0 mt-6 mb-3">
@@ -170,6 +171,7 @@ export default {
    </form>
  </div>
 </template>
+
 <style scoped lang="scss">
 .message-editor {
  @apply px-3;
@@ -51,6 +51,7 @@ function onClick(emailProvider) {
  }
 }
 </script>
+
 <template>
  <div
    v-if="!provider"
@@ -201,6 +201,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    class="border border-slate-25 dark:border-slate-800/60 bg-white dark:bg-slate-900 h-full p-6 w-full max-w-full md:w-3/4 md:max-w-[75%] flex-shrink-0 flex-grow-0"
@@ -243,6 +243,7 @@ export default {
    </div>
  </form>
 </template>
+
 <style lang="scss" scoped>
 .messagingServiceHelptext {
  margin-top: -10px;
@@ -24,6 +24,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    class="border border-slate-25 dark:border-slate-800/60 bg-white dark:bg-slate-900 h-full p-6 w-full max-w-full md:w-3/4 md:max-w-[75%] flex-shrink-0 flex-grow-0"
@@ -41,6 +42,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style scoped lang="scss">
 .login-init {
  @apply pt-[30%] text-center;
@@ -6,6 +6,7 @@ defineComponent({
  name: 'GoogleOAuthChannel',
 });
 </script>
+
 <template>
  <OAuthChannel
    provider="google"
@@ -64,6 +64,7 @@ async function requestAuthorization() {
  }
 }
 </script>
+
 <template>
  <div
    class="border border-slate-25 dark:border-slate-800/60 bg-white dark:bg-slate-900 h-full p-6 w-full max-w-full md:w-3/4 md:max-w-[75%] flex-shrink-0 flex-grow-0"
@@ -200,6 +200,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .day-wrap::v-deep .multiselect {
  @apply m-0 w-[7.5rem];
@@ -25,6 +25,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div>
    <label for="dropdown-select">
@@ -194,6 +194,7 @@ export default {
    </SettingsSection>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .timezone-input-wrap {
  @apply max-w-[37.5rem];
@@ -236,6 +236,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .whatsapp-settings--content {
  ::v-deep input {
@@ -60,6 +60,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    class="flex flex-col md:flex-row justify-between items-start md:items-center"
@@ -105,6 +105,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="overflow-auto p-4 max-w-full my-auto flex flex-wrap h-full">
    <woot-button
@@ -44,6 +44,7 @@ const actionURL = computed(() =>
  frontendURL(`accounts/${accountId.value}/settings/integrations/${props.id}`)
 );
 </script>
+
 <template>
  <div
    class="flex flex-col flex-1 p-6 bg-white border border-solid rounded-md dark:bg-slate-800 border-slate-50 dark:border-slate-700/50"
@@ -38,6 +38,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-row gap-4">
    <div class="w-full lg:w-3/5">
@@ -99,6 +99,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-col h-auto overflow-auto integration-hooks">
    <woot-modal-header
@@ -52,6 +52,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-shrink flex-grow overflow-auto p-4">
    <div class="flex flex-col">
@@ -10,6 +10,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-shrink flex-grow overflow-auto p-4">
    <div class="flex flex-col">
@@ -77,6 +77,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    v-if="integrationLoaded && !uiFlags.isCreatingSlack"
@@ -51,6 +51,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    class="px-6 py-4 mb-4 border border-yellow-200 rounded-md bg-yellow-50 dark:border-slate-700 dark:bg-slate-800"
@@ -10,6 +10,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    class="flex-1 w-full p-6 bg-white rounded-md border border-slate-50 dark:border-slate-700 dark:bg-slate-800 dark:text-slate-200"
@@ -73,6 +73,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 p-4 overflow-auto">
    <woot-button
@@ -129,6 +129,7 @@ export default {
    </div>
  </form>
 </template>
+
 <style lang="scss" scoped>
 .checkbox {
  @apply mr-2;
@@ -23,6 +23,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <tr class="space-x-2">
    <td class="max-w-2xl">
@@ -116,6 +116,7 @@ export default {
    </form>
  </div>
 </template>
+
 <style lang="scss" scoped>
 // Label API supports only lowercase letters
 .label-name--input {
@@ -119,6 +119,7 @@ export default {
    </form>
  </div>
 </template>
+
 <style lang="scss" scoped>
 // Label API supports only lowercase letters
 .label-name--input {
@@ -83,6 +83,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 overflow-auto">
    <woot-button
@@ -21,6 +21,7 @@ const onClick = () => {
  emit('onCopy', props.value);
 };
 </script>
+
 <template>
  <div class="flex flex-row justify-between gap-4">
    <woot-input
@@ -15,6 +15,7 @@ const onChange = (id, value) => {
  emit('change', id, value);
 };
 </script>
+
 <template>
  <div>
    <label
@@ -34,6 +34,7 @@ const selectedValue = computed({
  },
 });
 </script>
+
 <template>
  <FormSelect
    v-model="selectedValue"
@@ -173,6 +173,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="grid py-16 px-5 font-inter mx-auto gap-16 sm:max-w-[720px]">
    <div class="flex flex-col gap-6">
@@ -25,6 +25,7 @@ const updateSignature = () => {
  emit('updateSignature', signature.value);
 };
 </script>
+
 <template>
  <form class="flex flex-col gap-6" @submit.prevent="updateSignature()">
    <WootMessageEditor
@@ -88,6 +88,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <form class="flex flex-col gap-4" @submit.prevent="updateUser('profile')">
    <woot-input
@@ -25,6 +25,7 @@ const deleteProfilePicture = () => {
  emits('delete');
 };
 </script>
+
 <template>
  <div class="flex flex-col gap-2">
    <span class="text-sm font-medium text-ash-900">
@@ -88,6 +88,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 p-4 overflow-auto">
    <ReportFilterSelector
@@ -106,6 +106,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 p-4 overflow-auto">
    <ReportFilterSelector
@@ -118,6 +118,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 p-4 overflow-auto">
    <div class="flex flex-col items-center md:flex-row">
@@ -75,6 +75,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-col flex-1 gap-6 px-4 pt-4 overflow-auto">
    <SLAReportFilters @filterChange="onFilterChange" />
@@ -22,6 +22,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="text-slate-900 dark:text-slate-100">
    <span class="text-sm">
@@ -126,6 +126,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="csat--table-container">
    <VeTable
@@ -149,6 +150,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .csat--table-container {
  display: flex;
@@ -179,6 +179,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-col justify-between gap-3 mb-4 md:flex-row">
    <div
@@ -23,6 +23,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="multiselect-wrap--small">
    <multiselect
@@ -23,6 +23,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="multiselect-wrap--small">
    <multiselect
@@ -23,6 +23,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="multiselect-wrap--small">
    <multiselect
@@ -23,6 +23,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="multiselect-wrap--small">
    <multiselect
@@ -139,6 +139,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-col md:flex-row">
    <div class="flex flex-col items-center w-full md:flex-row">
@@ -20,6 +20,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-col gap-2 items-start justify-center min-w-[10rem]">
    <span
@@ -63,6 +63,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex flex-col flex-wrap w-full gap-3 md:flex-row">
    <woot-date-picker @dateRangeChanged="onDateRangeChange" />
@@ -22,6 +22,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div
    class="metric-card flex flex-col m-2 p-4 border border-solid overflow-hidden rounded-md flex-grow shadow-sm text-slate-700 dark:text-slate-100 bg-white dark:bg-slate-800 border-slate-75 dark:border-slate-700 min-h-[10rem]"
@@ -67,6 +68,7 @@ export default {
    </div>
  </div>
 </template>
+
 <style lang="scss" scoped>
 .metric-card {
  @apply flex flex-col mb-2 p-4 border border-solid overflow-hidden rounded-md flex-grow shadow-sm text-slate-700 dark:text-slate-100 bg-white dark:bg-slate-800 border-slate-75 dark:border-slate-700 min-h-[10rem];
@@ -113,6 +113,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <SettingsLayout
    :is-loading="uiFlags.isFetching"
@@ -6,6 +6,7 @@ defineProps({
  },
 });
 </script>
+
 <template>
  <div
    class="inline-flex items-center min-w-0 gap-1 px-1.5 sm:px-2 py-1 border border-solid rounded-lg border-slate-75 dark:border-slate-700/50"
@@ -10,6 +10,7 @@ defineProps({

 defineEmits(['click']);
 </script>
+
 <template>
  <BaseSettingsHeader
    :title="$t('SLA.HEADER')"
@@ -34,6 +34,7 @@ defineProps({
  },
 });
 </script>
+
 <template>
  <BaseSettingsListItem
    class="sm:divide-x sm:divide-slate-75 sm:dark:divide-slate-700/50"
@@ -1,6 +1,7 @@
 <script setup>
 import BaseSettingsListItem from '../../components/BaseSettingsListItem.vue';
 </script>
+
 <template>
  <BaseSettingsListItem class="opacity-50">
    <template #title>
@@ -10,6 +10,7 @@ defineProps({
  },
 });
 </script>
+
 <template>
  <div
    class="flex flex-row items-start w-full h-full gap-1 sm:items-end sm:px-6 sm:py-2 sm:gap-2 sm:flex-col"
@@ -70,6 +70,7 @@ export default {
  },
 };
 </script>
+
 <template>
  <div class="flex-1 overflow-auto">
    <div class="flex flex-row gap-4 p-8">
@@ -152,6 +153,7 @@ export default {
    />
  </div>
 </template>
+
 <style lang="scss" scoped>
 .button-wrapper {
  min-width: unset;