[web] Streamline the name of components

This commit is contained in:
Alain Nussbaumer 2025-05-13 18:37:26 +02:00
parent d010f8f655
commit f830949af1
42 changed files with 134 additions and 144 deletions

File diff suppressed because one or more lines are too long

View File

@ -20,7 +20,7 @@
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
export default { export default {
name: 'HeadingHero', name: 'PaneHero',
components: { ControlButton }, components: { ControlButton },
props: { content: { required: true, type: Object } } props: { content: { required: true, type: Object } }
} }

View File

@ -18,7 +18,7 @@
<script> <script>
export default { export default {
name: 'HeadingTitle', name: 'PaneTitle',
props: { content: { required: true, type: Object } } props: { content: { required: true, type: Object } }
} }
</script> </script>

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="{ title: $t('page.about.library') }" /> <pane-title :content="{ title: $t('page.about.library') }" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -83,14 +83,14 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import { useConfigurationStore } from '@/stores/configuration' import { useConfigurationStore } from '@/stores/configuration'
import { useLibraryStore } from '@/stores/library' import { useLibraryStore } from '@/stores/library'
import { useUIStore } from '@/stores/ui' import { useUIStore } from '@/stores/ui'
export default { export default {
name: 'PageAbout', name: 'PageAbout',
components: { ContentWithHeading, ControlButton, HeadingTitle }, components: { ContentWithHeading, ControlButton, PaneTitle },
setup() { setup() {
return { return {
configurationStore: useConfigurationStore(), configurationStore: useConfigurationStore(),

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-hero> <content-with-hero>
<template #heading> <template #heading>
<heading-hero :content="heading" /> <pane-hero :content="heading" />
</template> </template>
<template #image> <template #image>
<control-image <control-image
@ -26,7 +26,7 @@
import ContentWithHero from '@/templates/ContentWithHero.vue' import ContentWithHero from '@/templates/ContentWithHero.vue'
import ControlImage from '@/components/ControlImage.vue' import ControlImage from '@/components/ControlImage.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingHero from '@/components/HeadingHero.vue' import PaneHero from '@/components/PaneHero.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import ModalDialogAlbum from '@/components/ModalDialogAlbum.vue' import ModalDialogAlbum from '@/components/ModalDialogAlbum.vue'
import library from '@/api/library' import library from '@/api/library'
@ -37,7 +37,7 @@ export default {
components: { components: {
ContentWithHero, ContentWithHero,
ControlImage, ControlImage,
HeadingHero, PaneHero,
ListTracks, ListTracks,
ModalDialogAlbum ModalDialogAlbum
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-hero> <content-with-hero>
<template #heading> <template #heading>
<heading-hero :content="heading" /> <pane-hero :content="heading" />
</template> </template>
<template #image> <template #image>
<control-image <control-image
@ -25,7 +25,7 @@
<script> <script>
import ContentWithHero from '@/templates/ContentWithHero.vue' import ContentWithHero from '@/templates/ContentWithHero.vue'
import ControlImage from '@/components/ControlImage.vue' import ControlImage from '@/components/ControlImage.vue'
import HeadingHero from '@/components/HeadingHero.vue' import PaneHero from '@/components/PaneHero.vue'
import ListTracksSpotify from '@/components/ListTracksSpotify.vue' import ListTracksSpotify from '@/components/ListTracksSpotify.vue'
import ModalDialogAlbumSpotify from '@/components/ModalDialogAlbumSpotify.vue' import ModalDialogAlbumSpotify from '@/components/ModalDialogAlbumSpotify.vue'
import SpotifyWebApi from 'spotify-web-api-js' import SpotifyWebApi from 'spotify-web-api-js'
@ -38,7 +38,7 @@ export default {
components: { components: {
ContentWithHero, ContentWithHero,
ControlImage, ControlImage,
HeadingHero, PaneHero,
ListTracksSpotify, ListTracksSpotify,
ModalDialogAlbumSpotify ModalDialogAlbumSpotify
}, },

View File

@ -34,7 +34,7 @@
</list-options> </list-options>
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-albums :items="albums" /> <list-albums :items="albums" />
@ -47,10 +47,10 @@ import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlDropdown from '@/components/ControlDropdown.vue' import ControlDropdown from '@/components/ControlDropdown.vue'
import ControlSwitch from '@/components/ControlSwitch.vue' import ControlSwitch from '@/components/ControlSwitch.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import ListOptions from '@/components/ListOptions.vue' import ListOptions from '@/components/ListOptions.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
import library from '@/api/library' import library from '@/api/library'
import { useServicesStore } from '@/stores/services' import { useServicesStore } from '@/stores/services'
@ -62,10 +62,10 @@ export default {
ContentWithHeading, ContentWithHeading,
ControlDropdown, ControlDropdown,
ControlSwitch, ControlSwitch,
HeadingTitle,
ListIndexButtons, ListIndexButtons,
ListAlbums, ListAlbums,
ListOptions, ListOptions,
PaneTitle,
TabsMusic TabsMusic
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {

View File

@ -24,7 +24,7 @@
</list-options> </list-options>
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -51,10 +51,10 @@ import ControlButton from '@/components/ControlButton.vue'
import ControlDropdown from '@/components/ControlDropdown.vue' import ControlDropdown from '@/components/ControlDropdown.vue'
import ControlSwitch from '@/components/ControlSwitch.vue' import ControlSwitch from '@/components/ControlSwitch.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ListOptions from '@/components/ListOptions.vue' import ListOptions from '@/components/ListOptions.vue'
import ModalDialogArtist from '@/components/ModalDialogArtist.vue' import ModalDialogArtist from '@/components/ModalDialogArtist.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import library from '@/api/library' import library from '@/api/library'
import queue from '@/api/queue' import queue from '@/api/queue'
import { useServicesStore } from '@/stores/services' import { useServicesStore } from '@/stores/services'
@ -67,10 +67,10 @@ export default {
ControlButton, ControlButton,
ControlDropdown, ControlDropdown,
ControlSwitch, ControlSwitch,
HeadingTitle,
ListAlbums, ListAlbums,
ListOptions, ListOptions,
ModalDialogArtist ModalDialogArtist,
PaneTitle
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {
Promise.all([ Promise.all([

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -25,7 +25,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListAlbumsSpotify from '@/components/ListAlbumsSpotify.vue' import ListAlbumsSpotify from '@/components/ListAlbumsSpotify.vue'
import ModalDialogArtistSpotify from '@/components/ModalDialogArtistSpotify.vue' import ModalDialogArtistSpotify from '@/components/ModalDialogArtistSpotify.vue'
import SpotifyWebApi from 'spotify-web-api-js' import SpotifyWebApi from 'spotify-web-api-js'
@ -40,7 +40,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListAlbumsSpotify, ListAlbumsSpotify,
ModalDialogArtistSpotify ModalDialogArtistSpotify
}, },

View File

@ -25,7 +25,7 @@
</list-options> </list-options>
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -52,11 +52,11 @@ import ControlButton from '@/components/ControlButton.vue'
import ControlDropdown from '@/components/ControlDropdown.vue' import ControlDropdown from '@/components/ControlDropdown.vue'
import ControlSwitch from '@/components/ControlSwitch.vue' import ControlSwitch from '@/components/ControlSwitch.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import ListOptions from '@/components/ListOptions.vue' import ListOptions from '@/components/ListOptions.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import ModalDialogArtist from '@/components/ModalDialogArtist.vue' import ModalDialogArtist from '@/components/ModalDialogArtist.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import library from '@/api/library' import library from '@/api/library'
import queue from '@/api/queue' import queue from '@/api/queue'
import { useServicesStore } from '@/stores/services' import { useServicesStore } from '@/stores/services'
@ -69,11 +69,11 @@ export default {
ControlButton, ControlButton,
ControlDropdown, ControlDropdown,
ControlSwitch, ControlSwitch,
HeadingTitle,
ListIndexButtons, ListIndexButtons,
ListOptions, ListOptions,
ListTracks, ListTracks,
ModalDialogArtist ModalDialogArtist,
PaneTitle
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {
Promise.all([ Promise.all([

View File

@ -34,7 +34,7 @@
</list-options> </list-options>
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-artists :items="artists" /> <list-artists :items="artists" />
@ -47,10 +47,10 @@ import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlDropdown from '@/components/ControlDropdown.vue' import ControlDropdown from '@/components/ControlDropdown.vue'
import ControlSwitch from '@/components/ControlSwitch.vue' import ControlSwitch from '@/components/ControlSwitch.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListArtists from '@/components/ListArtists.vue' import ListArtists from '@/components/ListArtists.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import ListOptions from '@/components/ListOptions.vue' import ListOptions from '@/components/ListOptions.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
import library from '@/api/library' import library from '@/api/library'
import { useServicesStore } from '@/stores/services' import { useServicesStore } from '@/stores/services'
@ -62,10 +62,10 @@ export default {
ContentWithHeading, ContentWithHeading,
ControlDropdown, ControlDropdown,
ControlSwitch, ControlSwitch,
HeadingTitle,
ListIndexButtons, ListIndexButtons,
ListArtists, ListArtists,
ListOptions, ListOptions,
PaneTitle,
TabsMusic TabsMusic
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-hero> <content-with-hero>
<template #heading> <template #heading>
<heading-hero :content="heading" /> <pane-hero :content="heading" />
</template> </template>
<template #image> <template #image>
<control-image <control-image
@ -27,7 +27,7 @@
import ContentWithHero from '@/templates/ContentWithHero.vue' import ContentWithHero from '@/templates/ContentWithHero.vue'
import ControlImage from '@/components/ControlImage.vue' import ControlImage from '@/components/ControlImage.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingHero from '@/components/HeadingHero.vue' import PaneHero from '@/components/PaneHero.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import ModalDialogAlbum from '@/components/ModalDialogAlbum.vue' import ModalDialogAlbum from '@/components/ModalDialogAlbum.vue'
import library from '@/api/library' import library from '@/api/library'
@ -38,7 +38,7 @@ export default {
components: { components: {
ContentWithHero, ContentWithHero,
ControlImage, ControlImage,
HeadingHero, PaneHero,
ListTracks, ListTracks,
ModalDialogAlbum ModalDialogAlbum
}, },

View File

@ -5,7 +5,7 @@
<list-index-buttons :indices="albums.indices" /> <list-index-buttons :indices="albums.indices" />
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-albums :items="albums" /> <list-albums :items="albums" />
@ -16,9 +16,9 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import TabsAudiobooks from '@/components/TabsAudiobooks.vue' import TabsAudiobooks from '@/components/TabsAudiobooks.vue'
import library from '@/api/library' import library from '@/api/library'
@ -26,9 +26,9 @@ export default {
name: 'PageAudiobooksAlbums', name: 'PageAudiobooksAlbums',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle,
ListIndexButtons, ListIndexButtons,
ListAlbums, ListAlbums,
PaneTitle,
TabsAudiobooks TabsAudiobooks
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -26,9 +26,9 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ModalDialogArtist from '@/components/ModalDialogArtist.vue' import ModalDialogArtist from '@/components/ModalDialogArtist.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import library from '@/api/library' import library from '@/api/library'
import queue from '@/api/queue' import queue from '@/api/queue'
@ -37,9 +37,9 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle,
ListAlbums, ListAlbums,
ModalDialogArtist ModalDialogArtist,
PaneTitle
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {
Promise.all([ Promise.all([

View File

@ -5,7 +5,7 @@
<list-index-buttons :indices="artists.indices" /> <list-index-buttons :indices="artists.indices" />
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-artists :items="artists" /> <list-artists :items="artists" />
@ -16,9 +16,9 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListArtists from '@/components/ListArtists.vue' import ListArtists from '@/components/ListArtists.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import TabsAudiobooks from '@/components/TabsAudiobooks.vue' import TabsAudiobooks from '@/components/TabsAudiobooks.vue'
import library from '@/api/library' import library from '@/api/library'
@ -26,9 +26,9 @@ export default {
name: 'PageAudiobooksArtists', name: 'PageAudiobooksArtists',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle,
ListIndexButtons, ListIndexButtons,
ListArtists, ListArtists,
PaneTitle,
TabsAudiobooks TabsAudiobooks
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {

View File

@ -5,7 +5,7 @@
<list-index-buttons :indices="genres.indices" /> <list-index-buttons :indices="genres.indices" />
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-genres :items="genres" media-kind="audiobook" /> <list-genres :items="genres" media-kind="audiobook" />
@ -16,7 +16,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListGenres from '@/components/ListGenres.vue' import ListGenres from '@/components/ListGenres.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import TabsAudiobooks from '@/components/TabsAudiobooks.vue' import TabsAudiobooks from '@/components/TabsAudiobooks.vue'
@ -26,7 +26,7 @@ export default {
name: 'PageAudiobooksGenres', name: 'PageAudiobooksGenres',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle, PaneTitle,
ListIndexButtons, ListIndexButtons,
ListGenres, ListGenres,
TabsAudiobooks TabsAudiobooks

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -26,7 +26,7 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ModalDialogComposer from '@/components/ModalDialogComposer.vue' import ModalDialogComposer from '@/components/ModalDialogComposer.vue'
import library from '@/api/library' import library from '@/api/library'
@ -37,7 +37,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListAlbums, ListAlbums,
ModalDialogComposer ModalDialogComposer
}, },

View File

@ -12,7 +12,7 @@
</list-options> </list-options>
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -38,7 +38,7 @@ import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import ControlDropdown from '@/components/ControlDropdown.vue' import ControlDropdown from '@/components/ControlDropdown.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import ListOptions from '@/components/ListOptions.vue' import ListOptions from '@/components/ListOptions.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
@ -53,7 +53,7 @@ export default {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
ControlDropdown, ControlDropdown,
HeadingTitle, PaneTitle,
ListIndexButtons, ListIndexButtons,
ListOptions, ListOptions,
ListTracks, ListTracks,

View File

@ -5,7 +5,7 @@
<list-index-buttons :indices="composers.indices" /> <list-index-buttons :indices="composers.indices" />
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-composers :items="composers" /> <list-composers :items="composers" />
@ -16,7 +16,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListComposers from '@/components/ListComposers.vue' import ListComposers from '@/components/ListComposers.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
@ -26,7 +26,7 @@ export default {
name: 'PageComposers', name: 'PageComposers',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle, PaneTitle,
ListIndexButtons, ListIndexButtons,
ListComposers, ListComposers,
TabsMusic TabsMusic

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="{ title: name }" /> <pane-title :content="{ title: name }" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -28,7 +28,7 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListDirectories from '@/components/ListDirectories.vue' import ListDirectories from '@/components/ListDirectories.vue'
import ListPlaylists from '@/components/ListPlaylists.vue' import ListPlaylists from '@/components/ListPlaylists.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
@ -43,7 +43,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListDirectories, ListDirectories,
ListPlaylists, ListPlaylists,
ListTracks, ListTracks,

View File

@ -4,7 +4,7 @@
<list-index-buttons :indices="albums.indices" /> <list-index-buttons :indices="albums.indices" />
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -30,7 +30,7 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import ModalDialogGenre from '@/components/ModalDialogGenre.vue' import ModalDialogGenre from '@/components/ModalDialogGenre.vue'
@ -42,7 +42,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListIndexButtons, ListIndexButtons,
ListAlbums, ListAlbums,
ModalDialogGenre ModalDialogGenre

View File

@ -12,7 +12,7 @@
</list-options> </list-options>
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -39,7 +39,7 @@ import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import ControlDropdown from '@/components/ControlDropdown.vue' import ControlDropdown from '@/components/ControlDropdown.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import ListOptions from '@/components/ListOptions.vue' import ListOptions from '@/components/ListOptions.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
@ -54,7 +54,7 @@ export default {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
ControlDropdown, ControlDropdown,
HeadingTitle, PaneTitle,
ListIndexButtons, ListIndexButtons,
ListOptions, ListOptions,
ListTracks, ListTracks,

View File

@ -5,7 +5,7 @@
<list-index-buttons :indices="genres.indices" /> <list-index-buttons :indices="genres.indices" />
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-genres :items="genres" media-kind="music" /> <list-genres :items="genres" media-kind="music" />
@ -16,7 +16,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListGenres from '@/components/ListGenres.vue' import ListGenres from '@/components/ListGenres.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
@ -26,7 +26,7 @@ export default {
name: 'PageGenres', name: 'PageGenres',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle, PaneTitle,
ListIndexButtons, ListIndexButtons,
ListGenres, ListGenres,
TabsMusic TabsMusic

View File

@ -2,9 +2,7 @@
<tabs-music /> <tabs-music />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title :content="{ title: $t('page.music.recently-added.title') }" />
:content="{ title: $t('page.music.recently-added.title') }"
/>
</template> </template>
<template #content> <template #content>
<list-albums :items="albums" /> <list-albums :items="albums" />
@ -20,7 +18,7 @@
</content-with-heading> </content-with-heading>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.music.recently-played.title') }" :content="{ title: $t('page.music.recently-played.title') }"
/> />
</template> </template>
@ -41,9 +39,9 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
import library from '@/api/library' import library from '@/api/library'
@ -51,9 +49,9 @@ export default {
name: 'PageMusic', name: 'PageMusic',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle,
ListAlbums, ListAlbums,
ListTracks, ListTracks,
PaneTitle,
TabsMusic TabsMusic
}, },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {

View File

@ -2,9 +2,7 @@
<tabs-music /> <tabs-music />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title :content="{ title: $t('page.music.recently-added.title') }" />
:content="{ title: $t('page.music.recently-added.title') }"
/>
</template> </template>
<template #content> <template #content>
<list-albums :items="albums" /> <list-albums :items="albums" />
@ -15,15 +13,15 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import PaneTitle from '@/components/PaneTitle.vue'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
import library from '@/api/library' import library from '@/api/library'
import { useSettingsStore } from '@/stores/settings' import { useSettingsStore } from '@/stores/settings'
export default { export default {
name: 'PageMusicRecentlyAdded', name: 'PageMusicRecentlyAdded',
components: { ContentWithHeading, HeadingTitle, ListAlbums, TabsMusic }, components: { ContentWithHeading, ListAlbums, PaneTitle, TabsMusic },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {
const limit = useSettingsStore().recentlyAddedLimit const limit = useSettingsStore().recentlyAddedLimit
library library

View File

@ -2,7 +2,7 @@
<tabs-music /> <tabs-music />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.music.recently-played.title') }" :content="{ title: $t('page.music.recently-played.title') }"
/> />
</template> </template>
@ -15,14 +15,14 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
import library from '@/api/library' import library from '@/api/library'
export default { export default {
name: 'PageMusicRecentlyPlayed', name: 'PageMusicRecentlyPlayed',
components: { ContentWithHeading, HeadingTitle, ListTracks, TabsMusic }, components: { ContentWithHeading, PaneTitle, ListTracks, TabsMusic },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {
library library
.search({ .search({

View File

@ -2,9 +2,7 @@
<tabs-music /> <tabs-music />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title :content="{ title: $t('page.spotify.music.new-releases') }" />
:content="{ title: $t('page.spotify.music.new-releases') }"
/>
</template> </template>
<template #content> <template #content>
<list-albums-spotify :items="albums" /> <list-albums-spotify :items="albums" />
@ -20,7 +18,7 @@
</content-with-heading> </content-with-heading>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.spotify.music.featured-playlists') }" :content="{ title: $t('page.spotify.music.featured-playlists') }"
/> />
</template> </template>
@ -40,7 +38,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListAlbumsSpotify from '@/components/ListAlbumsSpotify.vue' import ListAlbumsSpotify from '@/components/ListAlbumsSpotify.vue'
import ListPlaylistsSpotify from '@/components/ListPlaylistsSpotify.vue' import ListPlaylistsSpotify from '@/components/ListPlaylistsSpotify.vue'
import SpotifyWebApi from 'spotify-web-api-js' import SpotifyWebApi from 'spotify-web-api-js'
@ -51,7 +49,7 @@ export default {
name: 'PageMusicSpotify', name: 'PageMusicSpotify',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle, PaneTitle,
ListAlbumsSpotify, ListAlbumsSpotify,
ListPlaylistsSpotify, ListPlaylistsSpotify,
TabsMusic TabsMusic

View File

@ -2,7 +2,7 @@
<tabs-music /> <tabs-music />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-playlists-spotify :items="playlists" /> <list-playlists-spotify :items="playlists" />
@ -12,7 +12,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListPlaylistsSpotify from '@/components/ListPlaylistsSpotify.vue' import ListPlaylistsSpotify from '@/components/ListPlaylistsSpotify.vue'
import SpotifyWebApi from 'spotify-web-api-js' import SpotifyWebApi from 'spotify-web-api-js'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
@ -22,7 +22,7 @@ export default {
name: 'PageMusicSpotifyFeaturedPlaylists', name: 'PageMusicSpotifyFeaturedPlaylists',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle, PaneTitle,
ListPlaylistsSpotify, ListPlaylistsSpotify,
TabsMusic TabsMusic
}, },

View File

@ -2,7 +2,7 @@
<tabs-music /> <tabs-music />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-albums-spotify :items="albums" /> <list-albums-spotify :items="albums" />
@ -12,7 +12,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListAlbumsSpotify from '@/components/ListAlbumsSpotify.vue' import ListAlbumsSpotify from '@/components/ListAlbumsSpotify.vue'
import SpotifyWebApi from 'spotify-web-api-js' import SpotifyWebApi from 'spotify-web-api-js'
import TabsMusic from '@/components/TabsMusic.vue' import TabsMusic from '@/components/TabsMusic.vue'
@ -22,7 +22,7 @@ export default {
name: 'PageMusicSpotifyNewReleases', name: 'PageMusicSpotifyNewReleases',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle, PaneTitle,
ListAlbumsSpotify, ListAlbumsSpotify,
TabsMusic TabsMusic
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-playlists :items="playlists" /> <list-playlists :items="playlists" />
@ -12,14 +12,14 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListPlaylists from '@/components/ListPlaylists.vue' import ListPlaylists from '@/components/ListPlaylists.vue'
import library from '@/api/library' import library from '@/api/library'
import { useConfigurationStore } from '@/stores/configuration' import { useConfigurationStore } from '@/stores/configuration'
export default { export default {
name: 'PagePlaylistFolder', name: 'PagePlaylistFolder',
components: { ContentWithHeading, HeadingTitle, ListPlaylists }, components: { ContentWithHeading, PaneTitle, ListPlaylists },
beforeRouteEnter(to, from, next) { beforeRouteEnter(to, from, next) {
next(async (vm) => { next(async (vm) => {
await vm.fetchData(to.params.id) await vm.fetchData(to.params.id)

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -32,7 +32,7 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import ModalDialogPlaylist from '@/components/ModalDialogPlaylist.vue' import ModalDialogPlaylist from '@/components/ModalDialogPlaylist.vue'
import library from '@/api/library' import library from '@/api/library'
@ -43,7 +43,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListTracks, ListTracks,
ModalDialogPlaylist ModalDialogPlaylist
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -35,7 +35,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListTracksSpotify from '@/components/ListTracksSpotify.vue' import ListTracksSpotify from '@/components/ListTracksSpotify.vue'
import ModalDialogPlaylistSpotify from '@/components/ModalDialogPlaylistSpotify.vue' import ModalDialogPlaylistSpotify from '@/components/ModalDialogPlaylistSpotify.vue'
import SpotifyWebApi from 'spotify-web-api-js' import SpotifyWebApi from 'spotify-web-api-js'
@ -49,7 +49,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListTracksSpotify, ListTracksSpotify,
ModalDialogPlaylistSpotify ModalDialogPlaylistSpotify
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-hero> <content-with-hero>
<template #heading> <template #heading>
<heading-hero :content="heading" /> <pane-hero :content="heading" />
</template> </template>
<template #image> <template #image>
<control-image <control-image
@ -33,7 +33,7 @@
import ContentWithHero from '@/templates/ContentWithHero.vue' import ContentWithHero from '@/templates/ContentWithHero.vue'
import ControlImage from '@/components/ControlImage.vue' import ControlImage from '@/components/ControlImage.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingHero from '@/components/HeadingHero.vue' import PaneHero from '@/components/PaneHero.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import ModalDialogAlbum from '@/components/ModalDialogAlbum.vue' import ModalDialogAlbum from '@/components/ModalDialogAlbum.vue'
import library from '@/api/library' import library from '@/api/library'
@ -44,7 +44,7 @@ export default {
components: { components: {
ContentWithHero, ContentWithHero,
ControlImage, ControlImage,
HeadingHero, PaneHero,
ListTracks, ListTracks,
ModalDialogAlbum ModalDialogAlbum
}, },

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading v-if="episodes.items.length > 0"> <content-with-heading v-if="episodes.items.length > 0">
<template #heading> <template #heading>
<heading-title :content="{ title: $t('page.podcasts.new-episodes') }" /> <pane-title :content="{ title: $t('page.podcasts.new-episodes') }" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -22,7 +22,7 @@
</content-with-heading> </content-with-heading>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -60,7 +60,7 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import ModalDialogAddRss from '@/components/ModalDialogAddRss.vue' import ModalDialogAddRss from '@/components/ModalDialogAddRss.vue'
@ -73,7 +73,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListAlbums, ListAlbums,
ListTracks, ListTracks,
ModalDialogAddRss ModalDialogAddRss

View File

@ -1,7 +1,7 @@
<template> <template>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #actions> <template #actions>
<control-button <control-button
@ -95,7 +95,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListItemQueueItem from '@/components/ListItemQueueItem.vue' import ListItemQueueItem from '@/components/ListItemQueueItem.vue'
import ModalDialogAddStream from '@/components/ModalDialogAddStream.vue' import ModalDialogAddStream from '@/components/ModalDialogAddStream.vue'
import ModalDialogPlaylistSave from '@/components/ModalDialogPlaylistSave.vue' import ModalDialogPlaylistSave from '@/components/ModalDialogPlaylistSave.vue'
@ -112,7 +112,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListItemQueueItem, ListItemQueueItem,
ModalDialogAddStream, ModalDialogAddStream,
ModalDialogPlaylistSave, ModalDialogPlaylistSave,

View File

@ -4,7 +4,7 @@
<list-index-buttons :indices="tracks.indices" /> <list-index-buttons :indices="tracks.indices" />
</template> </template>
<template #heading> <template #heading>
<heading-title :content="heading" /> <pane-title :content="heading" />
</template> </template>
<template #content> <template #content>
<list-tracks :items="tracks" /> <list-tracks :items="tracks" />
@ -15,7 +15,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListIndexButtons from '@/components/ListIndexButtons.vue' import ListIndexButtons from '@/components/ListIndexButtons.vue'
import ListTracks from '@/components/ListTracks.vue' import ListTracks from '@/components/ListTracks.vue'
import library from '@/api/library' import library from '@/api/library'
@ -24,7 +24,7 @@ export default {
name: 'PageRadioStreams', name: 'PageRadioStreams',
components: { components: {
ContentWithHeading, ContentWithHeading,
HeadingTitle, PaneTitle,
ListIndexButtons, ListIndexButtons,
ListTracks ListTracks
}, },

View File

@ -49,7 +49,7 @@
<tabs-search @search-library="search" @search-spotify="searchSpotify" /> <tabs-search @search-library="search" @search-spotify="searchSpotify" />
<content-with-heading v-for="[type, items] in results" :key="type"> <content-with-heading v-for="[type, items] in results" :key="type">
<template #heading> <template #heading>
<heading-title :content="{ title: $t(`page.search.${type}s`) }" /> <pane-title :content="{ title: $t(`page.search.${type}s`) }" />
</template> </template>
<template #content> <template #content>
<component :is="components[type]" :items="items" /> <component :is="components[type]" :items="items" />
@ -77,7 +77,7 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import { GroupedList } from '@/lib/GroupedList' import { GroupedList } from '@/lib/GroupedList'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListAlbums from '@/components/ListAlbums.vue' import ListAlbums from '@/components/ListAlbums.vue'
import ListArtists from '@/components/ListArtists.vue' import ListArtists from '@/components/ListArtists.vue'
import ListComposers from '@/components/ListComposers.vue' import ListComposers from '@/components/ListComposers.vue'
@ -103,7 +103,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlButton, ControlButton,
HeadingTitle, PaneTitle,
ListAlbums, ListAlbums,
ListArtists, ListArtists,
ListComposers, ListComposers,

View File

@ -32,7 +32,7 @@
<tabs-search @search-library="searchLibrary" @search-spotify="search" /> <tabs-search @search-library="searchLibrary" @search-spotify="search" />
<content-with-heading v-for="[type, items] in results" :key="type"> <content-with-heading v-for="[type, items] in results" :key="type">
<template #heading> <template #heading>
<heading-title :content="{ title: $t(`page.search.${type}s`) }" /> <pane-title :content="{ title: $t(`page.search.${type}s`) }" />
</template> </template>
<template #content> <template #content>
<component <component
@ -64,7 +64,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlButton from '@/components/ControlButton.vue' import ControlButton from '@/components/ControlButton.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import ListAlbumsSpotify from '@/components/ListAlbumsSpotify.vue' import ListAlbumsSpotify from '@/components/ListAlbumsSpotify.vue'
import ListArtistsSpotify from '@/components/ListArtistsSpotify.vue' import ListArtistsSpotify from '@/components/ListArtistsSpotify.vue'
import ListPlaylistsSpotify from '@/components/ListPlaylistsSpotify.vue' import ListPlaylistsSpotify from '@/components/ListPlaylistsSpotify.vue'
@ -83,7 +83,7 @@ export default {
components: { components: {
ControlButton, ControlButton,
ContentWithHeading, ContentWithHeading,
HeadingTitle, PaneTitle,
ListAlbumsSpotify, ListAlbumsSpotify,
ListArtistsSpotify, ListArtistsSpotify,
ListPlaylistsSpotify, ListPlaylistsSpotify,

View File

@ -2,7 +2,7 @@
<tabs-settings /> <tabs-settings />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title :content="{ title: $t('page.settings.artwork.title') }" /> <pane-title :content="{ title: $t('page.settings.artwork.title') }" />
</template> </template>
<template #content> <template #content>
<div class="content" v-text="$t('page.settings.artwork.explanation-1')" /> <div class="content" v-text="$t('page.settings.artwork.explanation-1')" />
@ -71,7 +71,7 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlSettingSwitch from '@/components/ControlSettingSwitch.vue' import ControlSettingSwitch from '@/components/ControlSettingSwitch.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import TabsSettings from '@/components/TabsSettings.vue' import TabsSettings from '@/components/TabsSettings.vue'
import { useServicesStore } from '@/stores/services' import { useServicesStore } from '@/stores/services'
@ -80,7 +80,7 @@ export default {
components: { components: {
ContentWithHeading, ContentWithHeading,
ControlSettingSwitch, ControlSettingSwitch,
HeadingTitle, PaneTitle,
TabsSettings TabsSettings
}, },
setup() { setup() {

View File

@ -2,9 +2,7 @@
<tabs-settings /> <tabs-settings />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title :content="{ title: $t('page.settings.devices.pairing') }" />
:content="{ title: $t('page.settings.devices.pairing') }"
/>
</template> </template>
<template #content> <template #content>
<form v-if="remotesStore.active" @submit.prevent="pairRemote"> <form v-if="remotesStore.active" @submit.prevent="pairRemote">
@ -31,7 +29,7 @@
</content-with-heading> </content-with-heading>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.settings.devices.speaker-pairing') }" :content="{ title: $t('page.settings.devices.speaker-pairing') }"
/> />
</template> </template>
@ -79,7 +77,7 @@
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import ControlPinField from '@/components/ControlPinField.vue' import ControlPinField from '@/components/ControlPinField.vue'
import ControlSwitch from '@/components/ControlSwitch.vue' import ControlSwitch from '@/components/ControlSwitch.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import TabsSettings from '@/components/TabsSettings.vue' import TabsSettings from '@/components/TabsSettings.vue'
import outputs from '@/api/outputs' import outputs from '@/api/outputs'
import { useOutputsStore } from '@/stores/outputs' import { useOutputsStore } from '@/stores/outputs'
@ -91,7 +89,7 @@ export default {
ContentWithHeading, ContentWithHeading,
ControlPinField, ControlPinField,
ControlSwitch, ControlSwitch,
HeadingTitle, PaneTitle,
TabsSettings TabsSettings
}, },
setup() { setup() {

View File

@ -2,7 +2,7 @@
<tabs-settings /> <tabs-settings />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.settings.services.spotify.title') }" :content="{ title: $t('page.settings.services.spotify.title') }"
/> />
</template> </template>
@ -57,7 +57,7 @@
</content-with-heading> </content-with-heading>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.settings.services.lastfm.title') }" :content="{ title: $t('page.settings.services.lastfm.title') }"
/> />
</template> </template>
@ -127,14 +127,14 @@
<script> <script>
import ContentWithHeading from '@/templates/ContentWithHeading.vue' import ContentWithHeading from '@/templates/ContentWithHeading.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import TabsSettings from '@/components/TabsSettings.vue' import TabsSettings from '@/components/TabsSettings.vue'
import services from '@/api/services' import services from '@/api/services'
import { useServicesStore } from '@/stores/services' import { useServicesStore } from '@/stores/services'
export default { export default {
name: 'PageSettingsOnlineServices', name: 'PageSettingsOnlineServices',
components: { ContentWithHeading, HeadingTitle, TabsSettings }, components: { ContentWithHeading, PaneTitle, TabsSettings },
setup() { setup() {
return { servicesStore: useServicesStore() } return { servicesStore: useServicesStore() }
}, },

View File

@ -2,9 +2,7 @@
<tabs-settings /> <tabs-settings />
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title :content="{ title: $t('page.settings.general.language') }" />
:content="{ title: $t('page.settings.general.language') }"
/>
</template> </template>
<template #content> <template #content>
<control-dropdown <control-dropdown
@ -15,7 +13,7 @@
</content-with-heading> </content-with-heading>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.settings.general.navigation-items') }" :content="{ title: $t('page.settings.general.navigation-items') }"
/> />
</template> </template>
@ -85,7 +83,7 @@
</content-with-heading> </content-with-heading>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.settings.general.now-playing-page') }" :content="{ title: $t('page.settings.general.now-playing-page') }"
/> />
</template> </template>
@ -133,7 +131,7 @@
</content-with-heading> </content-with-heading>
<content-with-heading> <content-with-heading>
<template #heading> <template #heading>
<heading-title <pane-title
:content="{ title: $t('page.settings.general.recently-added-page') }" :content="{ title: $t('page.settings.general.recently-added-page') }"
/> />
</template> </template>
@ -156,7 +154,7 @@ import ControlDropdown from '@/components/ControlDropdown.vue'
import ControlSettingIntegerField from '@/components/ControlSettingIntegerField.vue' import ControlSettingIntegerField from '@/components/ControlSettingIntegerField.vue'
import ControlSettingSwitch from '@/components/ControlSettingSwitch.vue' import ControlSettingSwitch from '@/components/ControlSettingSwitch.vue'
import ControlSettingTextField from '@/components/ControlSettingTextField.vue' import ControlSettingTextField from '@/components/ControlSettingTextField.vue'
import HeadingTitle from '@/components/HeadingTitle.vue' import PaneTitle from '@/components/PaneTitle.vue'
import TabsSettings from '@/components/TabsSettings.vue' import TabsSettings from '@/components/TabsSettings.vue'
import { useSettingsStore } from '@/stores/settings' import { useSettingsStore } from '@/stores/settings'
@ -168,7 +166,7 @@ export default {
ControlSettingIntegerField, ControlSettingIntegerField,
ControlSettingSwitch, ControlSettingSwitch,
ControlSettingTextField, ControlSettingTextField,
HeadingTitle, PaneTitle,
TabsSettings TabsSettings
}, },
setup() { setup() {