Files
Automata/packages/editor-ui/src/components/banners/V1Banner.vue
कारतोफ्फेलस्क्रिप्ट™ 68cff4c59e refactor(editor): Improve linting for component and prop names (no-changelog) (#8169)
2023-12-28 09:49:58 +01:00

42 lines
1.0 KiB
Vue

<script lang="ts" setup>
import { computed } from 'vue';
import BaseBanner from '@/components/banners/BaseBanner.vue';
import { i18n as locale } from '@/plugins/i18n';
import { hasPermission } from '@/rbac/permissions';
import { useUIStore } from '@/stores/ui.store';
const uiStore = useUIStore();
async function dismissPermanently() {
await uiStore.dismissBanner('V1', 'permanent');
}
const hasOwnerPermission = computed(() => hasPermission(['instanceOwner']));
</script>
<template>
<BaseBanner custom-icon="info-circle" theme="warning" name="V1" :class="$style.v1container">
<template #mainContent>
<span v-html="locale.baseText('banners.v1.message')"></span>
<a
v-if="hasOwnerPermission"
:class="$style.link"
data-test-id="banner-confirm-v1"
@click="dismissPermanently"
>
<span v-html="locale.baseText('generic.dontShowAgain')"></span>
</a>
</template>
</BaseBanner>
</template>
<style lang="scss" module>
.v1container {
a,
.link {
font-weight: var(--font-weight-bold);
text-decoration: underline;
}
}
</style>