feat: Update locales page UI (#13053)

This commit is contained in:
Sivin Varghese
2026-01-07 10:59:00 +05:30
committed by GitHub
parent dd426d69eb
commit d1fb816243
3 changed files with 20 additions and 18 deletions
@@ -1,9 +1,9 @@
<script setup>
import { computed, ref } from 'vue';
import { useMapGetter } from 'dashboard/composables/store.js';
import { useI18n } from 'vue-i18n';
import HelpCenterLayout from 'dashboard/components-next/HelpCenter/HelpCenterLayout.vue';
import Button from 'dashboard/components-next/button/Button.vue';
import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
import LocaleList from 'dashboard/components-next/HelpCenter/Pages/LocalePage/LocaleList.vue';
import AddLocaleDialog from 'dashboard/components-next/HelpCenter/Pages/LocalePage/AddLocaleDialog.vue';
@@ -19,6 +19,8 @@ const props = defineProps({
},
});
const { t } = useI18n();
const addLocaleDialogRef = ref(null);
const isSwitchingPortal = useMapGetter('portals/isSwitchingPortal');
@@ -31,20 +33,17 @@ const localeCount = computed(() => props.locales?.length);
</script>
<template>
<HelpCenterLayout :show-pagination-footer="false">
<HelpCenterLayout
:header-title="t('HELP_CENTER.LOCALES_PAGE.HEADER')"
:create-button-label="t('HELP_CENTER.LOCALES_PAGE.NEW_LOCALE_BUTTON_TEXT')"
:show-pagination-footer="false"
@create="openAddLocaleDialog"
>
<template #header-actions>
<div class="flex items-center justify-between">
<div class="flex items-center gap-4">
<span class="text-sm font-medium text-n-slate-12">
{{ $t('HELP_CENTER.LOCALES_PAGE.LOCALES_COUNT', localeCount) }}
</span>
</div>
<Button
:label="$t('HELP_CENTER.LOCALES_PAGE.NEW_LOCALE_BUTTON_TEXT')"
icon="i-lucide-plus"
size="sm"
@click="openAddLocaleDialog"
/>
<div class="flex items-start h-8 ltr:ml-1 rtl:mr-1">
<span class="text-sm font-medium text-n-slate-12">
{{ $t('HELP_CENTER.LOCALES_PAGE.LOCALES_COUNT', localeCount) }}
</span>
</div>
</template>
<template #content>