Files
api/web/components/UpdateOs/IgnoredRelease.vue
2024-05-16 14:13:01 -07:00

40 lines
1015 B
Vue

<script setup lang="ts">
import { XMarkIcon } from '@heroicons/vue/24/solid';
import type { ComposerTranslation } from 'vue-i18n';
import { useServerStore } from '~/store/server';
import { useThemeStore } from '~/store/theme';
export interface Props {
label: string;
t: ComposerTranslation;
}
withDefaults(defineProps<Props>(), {
label: '',
});
const serverStore = useServerStore();
const { darkMode } = storeToRefs(useThemeStore());
const evenBgColor = computed(() => {
return darkMode.value ? 'even:bg-grey-darkest' : 'even:bg-black/5';
});
</script>
<template>
<div
class="text-16px p-12px flex flex-row gap-4px sm:px-20px sm:gap-16px items-center justify-between rounded"
:class="evenBgColor"
>
<span class="font-semibold">{{ label }}</span>
<BrandButton
:btn-style="'underline'"
:icon-right="XMarkIcon"
:text="t('Remove')"
:title="t('Remove from ignore list')"
@click="serverStore.updateOsRemoveIgnoredRelease(label)"
/>
</div>
</template>