feat: Eslint rules (#9839)
# Pull Request Template ## Description This PR adds new eslint rules to the code base. **Error rules** | Rule name | Type | Files updated | | ----------------- | --- | - | | `vue/block-order` | error | ✅ | | `vue/component-name-in-template-casing` | error | ✅ | | `vue/component-options-name-casing` | error | ✅ | | `vue/custom-event-name-casing` | error | ✅ | | `vue/define-emits-declaration` | error | ✅ | | `vue/no-unused-properties` | error | ✅ | | `vue/define-macros-order` | error | ✅ | | `vue/define-props-declaration` | error | ✅ | | `vue/match-component-import-name` | error | ✅ | | `vue/next-tick-style` | error | ✅ | | `vue/no-bare-strings-in-template` | error | ✅ | | `vue/no-empty-component-block` | error | ✅ | | `vue/no-multiple-objects-in-class` | error | ✅ | | `vue/no-required-prop-with-default` | error | ✅ | | `vue/no-static-inline-styles` | error | ✅ | | `vue/no-template-target-blank` | error | ✅ | | `vue/no-this-in-before-route-enter` | error | ✅ | | `vue/no-undef-components` | error | ✅ | | `vue/no-unused-emit-declarations` | error | ✅ | | `vue/no-unused-refs` | error | ✅ | | `vue/no-use-v-else-with-v-for` | error | ✅ | | `vue/no-useless-v-bind` | error | ✅ | | `vue/no-v-text` | error | ✅ | | `vue/padding-line-between-blocks` | error | ✅ | | ~`vue/prefer-prop-type-boolean-first`~ | ~error~ | ❌ (removed this rule, cause a bug in displaying custom attributes) | | `vue/prefer-separate-static-class` | error | ✅ | | `vue/prefer-true-attribute-shorthand` | error | ✅ | | `vue/require-explicit-slots` | error | ✅ | | `vue/require-macro-variable-name` | error | ✅ | **Warn rules** | Rule name | Type | Files updated | | ---- | ------------- | ------------- | | `vue/no-root-v-if` | warn | ❎ | Fixes https://linear.app/chatwoot/issue/CW-3492/vue-eslint-rules ## Type of change - [x] New feature (non-breaking change which adds functionality) ## Checklist: - [x] My code follows the style guidelines of this project - [x] I have performed a self-review of my code - [x] I have commented on my code, particularly in hard-to-understand areas - [ ] I have made corresponding changes to the documentation - [x] My changes generate no new warnings - [x] I have added tests that prove my fix is effective or that my feature works - [x] New and existing unit tests pass locally with my changes - [ ] Any dependent changes have been merged and published in downstream modules --------- Co-authored-by: Fayaz Ahmed <fayazara@gmail.com> Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com> Co-authored-by: Shivam Mishra <scm.mymail@gmail.com> Co-authored-by: Pranav <pranav@chatwoot.com>
This commit is contained in:
Sivin Varghese
@@ -1,9 +1,3 @@
|
||||
<template>
|
||||
<div id="app" class="woot-survey-wrap">
|
||||
<response />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Response from './views/Response.vue';
|
||||
|
||||
@@ -15,6 +9,12 @@ export default {
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div id="app" class="woot-survey-wrap">
|
||||
<Response />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
@import '~survey/assets/scss/woot.scss';
|
||||
</style>
|
||||
|
||||
@@ -1,16 +1,3 @@
|
||||
<template>
|
||||
<div class="flex items-center">
|
||||
<i
|
||||
v-if="showSuccess"
|
||||
class="ion-checkmark-circled text-3xl text-green-500 mr-1"
|
||||
/>
|
||||
<i v-if="showError" class="ion-android-alert text-3xl text-red-600 mr-1" />
|
||||
<label class="text-base font-medium text-black-800 mt-4 mb-4">
|
||||
{{ message }}
|
||||
</label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
@@ -29,3 +16,16 @@ export default {
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex items-center">
|
||||
<i
|
||||
v-if="showSuccess"
|
||||
class="ion-checkmark-circled text-3xl text-green-500 mr-1"
|
||||
/>
|
||||
<i v-if="showError" class="ion-android-alert text-3xl text-red-600 mr-1" />
|
||||
<label class="text-base font-medium text-black-800 mt-4 mb-4">
|
||||
{{ message }}
|
||||
</label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,22 +1,3 @@
|
||||
<template>
|
||||
<div class="mt-6">
|
||||
<label class="text-base font-medium text-black-800">
|
||||
{{ $t('SURVEY.FEEDBACK.LABEL') }}
|
||||
</label>
|
||||
<text-area
|
||||
v-model="feedback"
|
||||
class="my-5"
|
||||
:placeholder="$t('SURVEY.FEEDBACK.PLACEHOLDER')"
|
||||
/>
|
||||
<div class="flex items-center font-medium float-right">
|
||||
<custom-button @click="onClick">
|
||||
<spinner v-if="feedback" class="p-0" />
|
||||
{{ $t('SURVEY.FEEDBACK.BUTTON_TEXT') }}
|
||||
</custom-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CustomButton from 'shared/components/Button.vue';
|
||||
import TextArea from 'shared/components/TextArea.vue';
|
||||
@@ -29,16 +10,6 @@ export default {
|
||||
TextArea,
|
||||
Spinner,
|
||||
},
|
||||
props: {
|
||||
isUpdating: {
|
||||
type: Boolean,
|
||||
default: null,
|
||||
},
|
||||
isButtonDisabled: {
|
||||
type: Boolean,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
feedback: '',
|
||||
@@ -52,3 +23,22 @@ export default {
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="mt-6">
|
||||
<label class="text-base font-medium text-black-800">
|
||||
{{ $t('SURVEY.FEEDBACK.LABEL') }}
|
||||
</label>
|
||||
<TextArea
|
||||
v-model="feedback"
|
||||
class="my-5"
|
||||
:placeholder="$t('SURVEY.FEEDBACK.PLACEHOLDER')"
|
||||
/>
|
||||
<div class="flex items-center float-right font-medium">
|
||||
<CustomButton @click="onClick">
|
||||
<Spinner v-if="feedback" class="p-0" />
|
||||
{{ $t('SURVEY.FEEDBACK.BUTTON_TEXT') }}
|
||||
</CustomButton>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -1,18 +1,3 @@
|
||||
<template>
|
||||
<div class="customer-satisfcation mb-2">
|
||||
<div class="ratings flex py-5 px-0">
|
||||
<button
|
||||
v-for="rating in ratings"
|
||||
:key="rating.key"
|
||||
:class="buttonClass(rating)"
|
||||
@click="onClick(rating)"
|
||||
>
|
||||
{{ rating.emoji }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { CSAT_RATINGS } from 'shared/constants/messages';
|
||||
|
||||
@@ -45,6 +30,21 @@ export default {
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="customer-satisfcation mb-2">
|
||||
<div class="ratings flex py-5 px-0">
|
||||
<button
|
||||
v-for="rating in ratings"
|
||||
:key="rating.key"
|
||||
:class="buttonClass(rating)"
|
||||
@click="onClick(rating)"
|
||||
>
|
||||
{{ rating.emoji }}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.emoji-button {
|
||||
filter: grayscale(100%);
|
||||
|
||||
@@ -1,56 +1,3 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="isLoading"
|
||||
class="flex items-center justify-center flex-1 h-full bg-black-25"
|
||||
>
|
||||
<spinner size="" />
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
class="flex items-center justify-center w-full h-full overflow-auto bg-slate-50"
|
||||
>
|
||||
<div
|
||||
class="flex flex-col w-full h-full bg-white rounded-lg shadow-lg lg:w-2/5 lg:h-auto"
|
||||
>
|
||||
<div class="w-full px-12 pt-12 pb-6 m-auto my-0">
|
||||
<img v-if="logo" :src="logo" alt="Chatwoot logo" class="mb-6 logo" />
|
||||
<p
|
||||
v-if="!isRatingSubmitted"
|
||||
class="mb-8 text-lg leading-relaxed text-black-700"
|
||||
>
|
||||
{{ $t('SURVEY.DESCRIPTION', { inboxName }) }}
|
||||
</p>
|
||||
<banner
|
||||
v-if="shouldShowBanner"
|
||||
:show-success="shouldShowSuccessMesage"
|
||||
:show-error="shouldShowErrorMesage"
|
||||
:message="message"
|
||||
/>
|
||||
<label
|
||||
v-if="!isRatingSubmitted"
|
||||
class="mb-4 text-base font-medium text-black-800"
|
||||
>
|
||||
{{ $t('SURVEY.RATING.LABEL') }}
|
||||
</label>
|
||||
<rating
|
||||
:selected-rating="selectedRating"
|
||||
@selectRating="selectRating"
|
||||
/>
|
||||
<feedback
|
||||
v-if="enableFeedbackForm"
|
||||
:is-updating="isUpdating"
|
||||
:is-button-disabled="isButtonDisabled"
|
||||
:selected-rating="selectedRating"
|
||||
@sendFeedback="sendFeedback"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<branding />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { useAlert } from 'dashboard/composables';
|
||||
import Branding from 'shared/components/Branding.vue';
|
||||
@@ -71,12 +18,6 @@ export default {
|
||||
Feedback,
|
||||
},
|
||||
mixins: [configMixin],
|
||||
props: {
|
||||
showHomePage: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
@@ -188,6 +129,59 @@ export default {
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
v-if="isLoading"
|
||||
class="flex items-center justify-center flex-1 h-full bg-black-25"
|
||||
>
|
||||
<Spinner size="" />
|
||||
</div>
|
||||
<div
|
||||
v-else
|
||||
class="flex items-center justify-center w-full h-full overflow-auto bg-slate-50"
|
||||
>
|
||||
<div
|
||||
class="flex flex-col w-full h-full bg-white rounded-lg shadow-lg lg:w-2/5 lg:h-auto"
|
||||
>
|
||||
<div class="w-full px-12 pt-12 pb-6 m-auto my-0">
|
||||
<img v-if="logo" :src="logo" alt="Chatwoot logo" class="mb-6 logo" />
|
||||
<p
|
||||
v-if="!isRatingSubmitted"
|
||||
class="mb-8 text-lg leading-relaxed text-black-700"
|
||||
>
|
||||
{{ $t('SURVEY.DESCRIPTION', { inboxName }) }}
|
||||
</p>
|
||||
<Banner
|
||||
v-if="shouldShowBanner"
|
||||
:show-success="shouldShowSuccessMesage"
|
||||
:show-error="shouldShowErrorMesage"
|
||||
:message="message"
|
||||
/>
|
||||
<label
|
||||
v-if="!isRatingSubmitted"
|
||||
class="mb-4 text-base font-medium text-black-800"
|
||||
>
|
||||
{{ $t('SURVEY.RATING.LABEL') }}
|
||||
</label>
|
||||
<Rating
|
||||
:selected-rating="selectedRating"
|
||||
@selectRating="selectRating"
|
||||
/>
|
||||
<Feedback
|
||||
v-if="enableFeedbackForm"
|
||||
:is-updating="isUpdating"
|
||||
:is-button-disabled="isButtonDisabled"
|
||||
:selected-rating="selectedRating"
|
||||
@sendFeedback="sendFeedback"
|
||||
/>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<Branding />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import '~widget/assets/scss/variables.scss';
|
||||
|
||||
|
||||
Reference in New Issue
Block a user