MirrorMirror
/
funkwhale
mirror of https://dev.funkwhale.audio/funkwhale/funkwhale.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(front): explore page according to mockups

This commit is contained in:
ArneBo 2025-02-25 10:42:58 +01:00
parent e18b193cec
commit 058f178a63
1 changed files with 23 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
front/src/components/library/Home.vue
View File

@ -10,8 +10,10 @@ import ChannelsWidget from '~/components/audio/ChannelsWidget.vue'
import PlaylistWidget from '~/components/playlists/Widget.vue' import PlaylistWidget from '~/components/playlists/Widget.vue'
import TrackWidget from '~/components/audio/track/Widget.vue' import TrackWidget from '~/components/audio/track/Widget.vue'
import AlbumWidget from '~/components/album/Widget.vue' import AlbumWidget from '~/components/album/Widget.vue'
import ArtistWidget from '~/components/artist/Widget.vue'
import Header from '~/components/ui/Header.vue' import Header from '~/components/ui/Header.vue'
import Layout from '~/components/ui/Layout.vue' import Layout from '~/components/ui/Layout.vue'
import Spacer from '~/components/ui/Spacer.vue'
import useErrorHandler from '~/composables/useErrorHandler' import useErrorHandler from '~/composables/useErrorHandler'
import useLogger from '~/composables/useLogger' import useLogger from '~/composables/useLogger'
@ -69,19 +71,10 @@ fetchData()
stack stack
> >
<Header :h1="t('components.Sidebar.header.explore')" /> <Header :h1="t('components.Sidebar.header.explore')" />
<playlist-widget <album-widget
:url="'playlists/'" :filters="{scope: scope, playable: true, ordering: '-creation_date', ...qualityFilters}"
:filters="{scope: scope, playable: true, ordering: '-modification_date'}" :limit="4"
:title="t('components.library.Home.header.playlists')" :title="t('components.library.Home.header.recentlyAdded')"
:limit="12"
/>
<Spacer />
<channels-widget
v-if="scope === 'all'"
:show-modification-date="true"
:filters="{ordering: '-creation_date'}"
:limit="8"
:title="t('components.library.Home.header.newChannels')"
/> />
<Spacer /> <Spacer />
<track-widget <track-widget
@ -91,16 +84,29 @@ fetchData()
:websocket-handlers="['Listen']" :websocket-handlers="['Listen']"
/> />
<Spacer /> <Spacer />
<playlist-widget
:url="'playlists/'"
:filters="{scope: scope, playable: true, ordering: '-modification_date'}"
:title="t('components.library.Home.header.playlists')"
:limit="4"
/>
<Spacer />
<track-widget <track-widget
:title="t('components.library.Home.header.recentlyFavorited')" :title="t('components.library.Home.header.recentlyFavorited')"
:url="'favorites/tracks/'" :url="'favorites/tracks/'"
:filters="{scope: scope, ordering: '-creation_date'}" :filters="{scope: scope, ordering: '-creation_date'}"
/> />
<Spacer /> <Spacer />
<album-widget <artist-widget
:filters="{scope: scope, playable: true, ordering: '-creation_date', ...qualityFilters}" :limit="4"
:limit="12" :filters="{playable: true, ordering: '-creation_date', include_channels: true, content_category: 'music'}"
:title="t('components.library.Home.header.recentlyAdded')" :title="t('components.library.Home.header.newChannels')"
/>
<Spacer />
<artist-widget
:limit="4"
:filters="{playable: true, ordering: '-creation_date', include_channels: true, content_category: 'podcast'}"
title="Podcasts hosted on Funkwhale"
/> />
</Layout> </Layout>
</template> </template>