<template>
	<NcAppNavigation :class="episode ? 'margin' : ''">
		<slot />
		<template #list>
			<slot name="list" />
		</template>
		<template #footer>
			<slot name="footer" />
		</template>
	</NcAppNavigation>
</template>

<script>
import { NcAppNavigation } from '@nextcloud/vue'

export default {
	name: 'AppNavigation',
	components: {
		NcAppNavigation,
	},
	computed: {
		episode() {
			return this.$store.state.player.episode
		},
	},
}
</script>

<style scoped>
	.margin {
		padding-bottom: 6rem;
	}
</style>
