chore: Update buttons in canned response page (#11121)

This commit is contained in:
Sivin Varghese
2025-03-20 19:03:53 +05:30
committed by GitHub
parent 46297ce85e
commit b2debdc912
3 changed files with 42 additions and 33 deletions

View File

@@ -3,14 +3,14 @@ import { useVuelidate } from '@vuelidate/core';
import { required, minLength } from '@vuelidate/validators';
import { useAlert } from 'dashboard/composables';
import WootSubmitButton from '../../../../components/buttons/FormSubmitButton.vue';
import NextButton from 'dashboard/components-next/button/Button.vue';
import Modal from '../../../../components/Modal.vue';
import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor.vue';
export default {
name: 'AddCanned',
components: {
WootSubmitButton,
NextButton,
Modal,
WootMessageEditor,
},
@@ -118,18 +118,23 @@ export default {
</div>
</div>
<div class="flex flex-row justify-end w-full gap-2 px-0 py-2">
<WootSubmitButton
<NextButton
faded
slate
type="reset"
:label="$t('CANNED_MGMT.ADD.CANCEL_BUTTON_TEXT')"
@click.prevent="onClose"
/>
<NextButton
type="submit"
:label="$t('CANNED_MGMT.ADD.FORM.SUBMIT')"
:disabled="
v$.content.$invalid ||
v$.shortCode.$invalid ||
addCanned.showLoading
"
:button-text="$t('CANNED_MGMT.ADD.FORM.SUBMIT')"
:loading="addCanned.showLoading"
:is-loading="addCanned.showLoading"
/>
<button class="button clear" @click.prevent="onClose">
{{ $t('CANNED_MGMT.ADD.CANCEL_BUTTON_TEXT') }}
</button>
</div>
</form>
</div>

View File

@@ -4,12 +4,12 @@ import { useVuelidate } from '@vuelidate/core';
import { required, minLength } from '@vuelidate/validators';
import { useAlert } from 'dashboard/composables';
import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor.vue';
import WootSubmitButton from '../../../../components/buttons/FormSubmitButton.vue';
import NextButton from 'dashboard/components-next/button/Button.vue';
import Modal from '../../../../components/Modal.vue';
export default {
components: {
WootSubmitButton,
NextButton,
Modal,
WootMessageEditor,
},
@@ -122,18 +122,23 @@ export default {
</div>
</div>
<div class="flex flex-row justify-end w-full gap-2 px-0 py-2">
<WootSubmitButton
<NextButton
faded
slate
type="reset"
:label="$t('CANNED_MGMT.EDIT.CANCEL_BUTTON_TEXT')"
@click.prevent="onClose"
/>
<NextButton
type="submit"
:label="$t('CANNED_MGMT.EDIT.FORM.SUBMIT')"
:disabled="
v$.content.$invalid ||
v$.shortCode.$invalid ||
editCanned.showLoading
"
:button-text="$t('CANNED_MGMT.EDIT.FORM.SUBMIT')"
:loading="editCanned.showLoading"
:is-loading="editCanned.showLoading"
/>
<button class="button clear" @click.prevent="onClose">
{{ $t('CANNED_MGMT.EDIT.CANCEL_BUTTON_TEXT') }}
</button>
</div>
</form>
</div>

View File

@@ -7,6 +7,8 @@ import { computed, onMounted, ref, defineOptions } from 'vue';
import { useI18n } from 'vue-i18n';
import { useStoreGetters, useStore } from 'dashboard/composables/store';
import Button from 'dashboard/components-next/button/Button.vue';
defineOptions({
name: 'CannedResponseSettings',
});
@@ -124,13 +126,11 @@ const tableHeaders = computed(() => {
feature-name="canned_responses"
>
<template #actions>
<woot-button
class="button nice rounded-md"
icon="add-circle"
<Button
icon="i-lucide-circle-plus"
:label="$t('CANNED_MGMT.HEADER_BTN_TXT')"
@click="openAddPopup"
>
{{ $t('CANNED_MGMT.HEADER_BTN_TXT') }}
</woot-button>
/>
</template>
</BaseSettingsHeader>
@@ -188,21 +188,20 @@ const tableHeaders = computed(() => {
{{ cannedItem.content }}
</td>
<td class="py-4 flex justify-end gap-1">
<woot-button
<Button
v-tooltip.top="$t('CANNED_MGMT.EDIT.BUTTON_TEXT')"
variant="smooth"
size="tiny"
color-scheme="secondary"
icon="edit"
icon="i-lucide-pen"
slate
xs
faded
@click="openEditPopup(cannedItem)"
/>
<woot-button
<Button
v-tooltip.top="$t('CANNED_MGMT.DELETE.BUTTON_TEXT')"
variant="smooth"
color-scheme="alert"
size="tiny"
icon="dismiss-circle"
class-names="grey-btn"
icon="i-lucide-trash-2"
xs
ruby
faded
:is-loading="loading[cannedItem.id]"
@click="openDeletePopup(cannedItem, index)"
/>