083bc27b1a
* chore: exclude inbox_id from webhook update parameters * feat: display inbox label in webhook settings * feat: add inbox selection to webhook form * feat: prevent updating inbox_id in webhook update * feat: integrate MultiselectDropdown for inbox selection in webhook form * feat: add inbox matching logic to webhook event delivery * feat: remove unused inbox input placeholder from webhook form * fix: MultiselectDropdown component submiting form * feat: refine webhook parameters for create and update actions * feat: disable URL input field when editing webhook * chore: remove unnecessary parentheses * chore: update webhook controller spec to ignore inbox_id and url updates * fix: clean up JSON formatting * fix: standardize inbox_id to inboxId in WebhookForm component * refactor: replace LabelItem with InboxName component in WebhookRow * chore: enhance MultiselectDropdown with button variant prop and update styling in WebhookForm * chore: simplify MultiselectDropdown wrapper in WebhookForm component * chore: update selectedInbox initialization to null and reorder form fields * refactor: simplify InboxName * chore: add dark variant styling for buttons in SCSS * test: add inbox filtering for webhook event triggers in WebhookListener * test: refactor webhook controller spec to use a variable for URL and improve update expectations * feat(webhook): all inboxes option * chore: remove dark variant styling for buttons in SCSS * fix: bad interaction multiselectdropdown inside label * chore: invert if * chore: rename to assignedInbox and drop inboxId * refactor(WebhookForm): restore div separating fields from buttons * test: improve description --------- Co-authored-by: gabrieljablonski <contact@gabrieljablonski.com>
84 lines
2.2 KiB
Vue
84 lines
2.2 KiB
Vue
<script setup>
|
|
import { computed } from 'vue';
|
|
import { getI18nKey } from 'dashboard/routes/dashboard/settings/helper/settingsHelper';
|
|
import ShowMore from 'dashboard/components/widgets/ShowMore.vue';
|
|
import { useI18n } from 'vue-i18n';
|
|
import InboxName from 'components/widgets/InboxName.vue';
|
|
|
|
import Button from 'dashboard/components-next/button/Button.vue';
|
|
|
|
const props = defineProps({
|
|
webhook: {
|
|
type: Object,
|
|
required: true,
|
|
},
|
|
index: {
|
|
type: Number,
|
|
required: true,
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(['edit', 'delete']);
|
|
const { t } = useI18n();
|
|
const subscribedEvents = computed(() => {
|
|
const { subscriptions } = props.webhook;
|
|
return subscriptions
|
|
.map(event =>
|
|
t(
|
|
getI18nKey(
|
|
'INTEGRATION_SETTINGS.WEBHOOK.FORM.SUBSCRIPTIONS.EVENTS',
|
|
event
|
|
)
|
|
)
|
|
)
|
|
.join(', ');
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<tr>
|
|
<td class="py-4 ltr:pr-4 rtl:pl-4">
|
|
<InboxName v-if="webhook.inbox" class="!mx-0" :inbox="webhook.inbox" />
|
|
<div
|
|
class="flex gap-2 font-medium break-words text-slate-700 dark:text-slate-100"
|
|
>
|
|
<template v-if="webhook.name">
|
|
{{ webhook.name }}
|
|
<span class="text-slate-500 dark:text-slate-400">
|
|
{{ webhook.url }}
|
|
</span>
|
|
</template>
|
|
<template v-else>
|
|
{{ webhook.url }}
|
|
</template>
|
|
</div>
|
|
<div class="block mt-1 text-sm text-slate-500 dark:text-slate-400">
|
|
<span class="font-medium">
|
|
{{ $t('INTEGRATION_SETTINGS.WEBHOOK.SUBSCRIBED_EVENTS') }}:
|
|
</span>
|
|
<ShowMore :text="subscribedEvents" :limit="60" />
|
|
</div>
|
|
</td>
|
|
<td class="py-4 min-w-xs">
|
|
<div class="flex justify-end gap-1">
|
|
<Button
|
|
v-tooltip.top="$t('INTEGRATION_SETTINGS.WEBHOOK.EDIT.BUTTON_TEXT')"
|
|
icon="i-lucide-pen"
|
|
slate
|
|
xs
|
|
faded
|
|
@click="emit('edit', webhook)"
|
|
/>
|
|
<Button
|
|
v-tooltip.top="$t('INTEGRATION_SETTINGS.WEBHOOK.DELETE.BUTTON_TEXT')"
|
|
icon="i-lucide-trash-2"
|
|
xs
|
|
ruby
|
|
faded
|
|
@click="emit('delete', webhook, index)"
|
|
/>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</template>
|