diff --git a/front/src/components/ui/Tabs.vue b/front/src/components/ui/Tabs.vue index 9ee7af29b..3b2beb700 100644 --- a/front/src/components/ui/Tabs.vue +++ b/front/src/components/ui/Tabs.vue @@ -17,8 +17,9 @@ provide(TABS_INJECTION_KEY, { tabs: tabs, }) +/* Note that this only compares the name. Make sure to add a `name` field to identify paths in your router config! */ const actualCurrentTitle = computed(() => - tabs.find(({ to })=>currentRoute.matched.some(route => typeof to === 'string' ? route.path === to : to && 'path' in to && route.path === to.path))?.title + tabs.find(({ to })=> to && typeof to !== 'string' && 'name' in to && currentRoute.name === to?.name)?.title || currentTitle.value) const currentIndex = computed(() => diff --git a/front/src/views/auth/ProfileBase.vue b/front/src/views/auth/ProfileBase.vue index a65e5b4fc..88868fcc9 100644 --- a/front/src/views/auth/ProfileBase.vue +++ b/front/src/views/auth/ProfileBase.vue @@ -164,7 +164,7 @@ const recentActivity = ref(0) > {{ t('views.auth.ProfileOverview.link.addNew') }} diff --git a/front/ui-docs/components/ui/tabs.md b/front/ui-docs/components/ui/tabs.md index 9dd691603..fb88ba2c0 100644 --- a/front/ui-docs/components/ui/tabs.md +++ b/front/ui-docs/components/ui/tabs.md @@ -85,3 +85,5 @@ You can add a template to the right side of the tabs using the `#tabs-right` dir If the tab content covers most of the page, users will expect that they can navigate to the previous tab with the "back" button of the browser ([See Navigation](./navigation.md)). In this case, add the `:to` prop to each tab, and place a `RouterView` with the intended props of the route's component into its default slot. + +Note that this only compares the name. Make sure to add a `name` field to identify paths in your router config!