n8n/packages/editor-ui/src/views/ErrorView.vue
Ricardo Espinoza 3f9127955a
Some checks failed
Test Master / install-and-build (push) Has been cancelled
Test Master / Unit tests (18.x) (push) Has been cancelled
Test Master / Unit tests (20.x) (push) Has been cancelled
Test Master / Unit tests (22.4) (push) Has been cancelled
Test Master / Lint (push) Has been cancelled
Test Master / Notify Slack on failure (push) Has been cancelled
refactor(editor): Stop using $locale in favor of the i18n composable (#11731)
Co-authored-by: कारतोफ्फेलस्क्रिप्ट™ <aditya@netroy.in>
2024-11-15 19:11:58 -05:00

68 lines
1.4 KiB
Vue

<script setup lang="ts">
import type { BaseTextKey } from '@/plugins/i18n';
import { useRouter } from 'vue-router';
import { VIEWS } from '@/constants';
import { useI18n } from '@/composables/useI18n';
const router = useRouter();
const props = defineProps<{
messageKey: BaseTextKey;
errorCode: number;
redirectTextKey: BaseTextKey;
redirectPage?: keyof typeof VIEWS;
}>();
const i18n = useI18n();
function onButtonClick() {
void router.push({ name: props.redirectPage ?? VIEWS.HOMEPAGE });
}
</script>
<template>
<div :class="$style.container">
<font-awesome-icon icon="exclamation-triangle" :class="$style.icon" />
<div :class="$style.message">
<div>
<n8n-heading size="2xlarge">
{{ i18n.baseText(messageKey) }}
</n8n-heading>
</div>
<div>
<n8n-text v-if="errorCode" size="large">
{{ errorCode }} {{ i18n.baseText('error') }}
</n8n-text>
</div>
</div>
<n8n-button :label="i18n.baseText(redirectTextKey)" @click="onButtonClick" />
</div>
</template>
<style lang="scss" module>
.container {
height: 100%;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.icon {
min-height: 96px;
min-width: 108px;
margin-bottom: var(--spacing-2xl);
color: var(--color-foreground-base);
}
.message {
margin-bottom: var(--spacing-l);
* {
margin-bottom: var(--spacing-2xs);
display: flex;
justify-content: center;
}
}
</style>