funkwhale/front/src/components/ui/Tab.vue

30 lines
639 B
Vue

<script setup lang="ts">
import { type RouterLinkProps } from 'vue-router'
import { TABS_INJECTION_KEY } from '~/injection-keys'
import { whenever } from '@vueuse/core'
import { inject, ref } from 'vue'
export type Props = {
title: string,
to?: RouterLinkProps['to']
icon?: string
}
const props = defineProps<Props>()
const { currentTitle, tabs } = inject(TABS_INJECTION_KEY, {
currentTitle: ref(props.title),
tabs: [],
})
whenever(() => !tabs.includes(props), () => {
tabs.push(props)
}, { immediate: true })
</script>
<template>
<div v-if="currentTitle === title" class="tab-content">
<slot />
</div>
</template>