fix(front): clean up and fix errors
This commit is contained in:
parent
822c1bfdf0
commit
988f735a97
|
@ -125,7 +125,7 @@ watch(() => props.id, fetchData, { immediate: true })
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<Layout stack main>
|
<Layout stack main v-title="labels.title">
|
||||||
<Loader v-if="isLoading" />
|
<Loader v-if="isLoading" />
|
||||||
<template v-if="object && !isLoading">
|
<template v-if="object && !isLoading">
|
||||||
<Layout flex>
|
<Layout flex>
|
||||||
|
|
|
@ -4,7 +4,7 @@ import type { Artist, BackendResponse } from '~/types'
|
||||||
import type { RouteRecordName } from 'vue-router'
|
import type { RouteRecordName } from 'vue-router'
|
||||||
import type { OrderingField } from '~/store/ui'
|
import type { OrderingField } from '~/store/ui'
|
||||||
|
|
||||||
import { computed, ref, watch, onMounted } from 'vue'
|
import { computed, ref, watch } from 'vue'
|
||||||
import { useRouteQuery } from '@vueuse/router'
|
import { useRouteQuery } from '@vueuse/router'
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
import { syncRef } from '@vueuse/core'
|
import { syncRef } from '@vueuse/core'
|
||||||
|
@ -242,7 +242,7 @@ const paginateOptions = computed(() => sortedUniq([12, 30, 50, paginateBy.value]
|
||||||
small
|
small
|
||||||
primary
|
primary
|
||||||
@click="store.commit('ui/toggleModal', 'upload')"
|
@click="store.commit('ui/toggleModal', 'upload')"
|
||||||
:aria-pressed="store.state.ui.modalsOpen.has('upload') || undefine"
|
:aria-pressed="store.state.ui.modalsOpen.has('upload') || undefined"
|
||||||
>
|
>
|
||||||
<template #image>
|
<template #image>
|
||||||
<i class="bi bi-upload" style="font-size: 100px; position: relative; top: 50px;" />
|
<i class="bi bi-upload" style="font-size: 100px; position: relative; top: 50px;" />
|
||||||
|
|
|
@ -4,7 +4,7 @@ import type { Artist, BackendResponse } from '~/types'
|
||||||
import type { RouteRecordName } from 'vue-router'
|
import type { RouteRecordName } from 'vue-router'
|
||||||
import type { OrderingField } from '~/store/ui'
|
import type { OrderingField } from '~/store/ui'
|
||||||
|
|
||||||
import { computed, ref, watch, onMounted } from 'vue'
|
import { computed, ref, watch } from 'vue'
|
||||||
import { useRouteQuery } from '@vueuse/router'
|
import { useRouteQuery } from '@vueuse/router'
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
import { syncRef } from '@vueuse/core'
|
import { syncRef } from '@vueuse/core'
|
||||||
|
@ -59,7 +59,6 @@ const query = ref(q.value)
|
||||||
syncRef(q, query, { direction: 'ltr' })
|
syncRef(q, query, { direction: 'ltr' })
|
||||||
|
|
||||||
const result = ref<BackendResponse<Artist>>()
|
const result = ref<BackendResponse<Artist>>()
|
||||||
const showSubscribeModal = ref(false)
|
|
||||||
|
|
||||||
const orderingOptions: [OrderingField, keyof typeof sharedLabels.filters][] = [
|
const orderingOptions: [OrderingField, keyof typeof sharedLabels.filters][] = [
|
||||||
['creation_date', 'creation_date'],
|
['creation_date', 'creation_date'],
|
||||||
|
@ -115,8 +114,6 @@ const search = () => {
|
||||||
q.value = query.value
|
q.value = query.value
|
||||||
}
|
}
|
||||||
|
|
||||||
const artistOrdering = ref(false)
|
|
||||||
|
|
||||||
onOrderingUpdate(() => {
|
onOrderingUpdate(() => {
|
||||||
page.value = 1
|
page.value = 1
|
||||||
fetchData()
|
fetchData()
|
||||||
|
|
|
@ -4,7 +4,7 @@ import type { Radio, BackendResponse } from '~/types'
|
||||||
import type { RouteRecordName } from 'vue-router'
|
import type { RouteRecordName } from 'vue-router'
|
||||||
import type { OrderingField } from '~/store/ui'
|
import type { OrderingField } from '~/store/ui'
|
||||||
|
|
||||||
import { computed, onMounted, ref, watch } from 'vue'
|
import { computed, ref, watch } from 'vue'
|
||||||
import { useRouteQuery } from '@vueuse/router'
|
import { useRouteQuery } from '@vueuse/router'
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
import { syncRef } from '@vueuse/core'
|
import { syncRef } from '@vueuse/core'
|
||||||
|
|
|
@ -341,24 +341,12 @@ export interface UserRequest {
|
||||||
}
|
}
|
||||||
|
|
||||||
// Notification stuff
|
// Notification stuff
|
||||||
export type Activity = {
|
|
||||||
actor: Actor
|
|
||||||
creation_date: string
|
|
||||||
related_object: LibraryFollow | UserFollow
|
|
||||||
type: 'Follow' | 'Accept'
|
|
||||||
object: LibraryFollow | UserFollow
|
|
||||||
}
|
|
||||||
export interface Notification {
|
export interface Notification {
|
||||||
id: number
|
id: number
|
||||||
is_read: boolean
|
is_read: boolean
|
||||||
activity: Activity
|
activity: Activity
|
||||||
}
|
}
|
||||||
|
|
||||||
// Tags stuff
|
|
||||||
export interface Tag {
|
|
||||||
name: string
|
|
||||||
}
|
|
||||||
|
|
||||||
// Application stuff
|
// Application stuff
|
||||||
export interface Application {
|
export interface Application {
|
||||||
client_id: string
|
client_id: string
|
||||||
|
|
|
@ -20,7 +20,6 @@ import Tabs from '~/components/ui/Tabs.vue'
|
||||||
import Tab from '~/components/ui/Tab.vue'
|
import Tab from '~/components/ui/Tab.vue'
|
||||||
import LibraryWidget from '~/components/federation/LibraryWidget.vue'
|
import LibraryWidget from '~/components/federation/LibraryWidget.vue'
|
||||||
import ChannelsWidget from '~/components/audio/ChannelsWidget.vue'
|
import ChannelsWidget from '~/components/audio/ChannelsWidget.vue'
|
||||||
import PlaylistWidget from '~/components/playlists/Widget.vue'
|
|
||||||
import AlbumWidget from '~/components/album/Widget.vue'
|
import AlbumWidget from '~/components/album/Widget.vue'
|
||||||
import TrackWidget from '~/components/audio/track/Widget.vue'
|
import TrackWidget from '~/components/audio/track/Widget.vue'
|
||||||
|
|
||||||
|
@ -44,7 +43,7 @@ const store = useStore()
|
||||||
// We are working either with an Actor or null
|
// We are working either with an Actor or null
|
||||||
const object = ref<Actor | null>(null)
|
const object = ref<Actor | null>(null)
|
||||||
|
|
||||||
const actorColor = computed(() => intToRGB(hashCode(object.full_username)))
|
const actorColor = computed(() => intToRGB(hashCode(object.value?.full_username)))
|
||||||
const defaultAvatarStyle = computed(() => ({ backgroundColor: `#${actorColor.value}` }))
|
const defaultAvatarStyle = computed(() => ({ backgroundColor: `#${actorColor.value}` }))
|
||||||
|
|
||||||
const displayName = computed(() => object.value?.name ?? object.value?.preferred_username)
|
const displayName = computed(() => object.value?.name ?? object.value?.preferred_username)
|
||||||
|
@ -174,7 +173,7 @@ const recentActivity = ref(0)
|
||||||
|
|
||||||
<track-widget
|
<track-widget
|
||||||
:url="'history/listenings/'"
|
:url="'history/listenings/'"
|
||||||
:filters="{ scope: `actor:${object.full_username}`, ordering: '-creation_date', ...qualityFilters}"
|
:filters="{ scope: `actor:${object?.full_username}`, ordering: '-creation_date', ...qualityFilters}"
|
||||||
:websocket-handlers="['Listen']"
|
:websocket-handlers="['Listen']"
|
||||||
@count="recentActivity = $event"
|
@count="recentActivity = $event"
|
||||||
>
|
>
|
||||||
|
@ -192,7 +191,7 @@ const recentActivity = ref(0)
|
||||||
</template>
|
</template>
|
||||||
</track-widget>
|
</track-widget>
|
||||||
|
|
||||||
<album-widget :filters="{scope: `actor:${object.full_username}`, playable: true, ordering: '-creation_date', ...qualityFilters}">
|
<album-widget :filters="{scope: `actor:${object?.full_username}`, playable: true, ordering: '-creation_date', ...qualityFilters}">
|
||||||
<template #title>
|
<template #title>
|
||||||
{{ t('components.library.Home.header.recentlyAdded') }}
|
{{ t('components.library.Home.header.recentlyAdded') }}
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -4,7 +4,7 @@ import type { Playlist, BackendResponse } from '~/types'
|
||||||
import type { RouteRecordName } from 'vue-router'
|
import type { RouteRecordName } from 'vue-router'
|
||||||
import type { OrderingField } from '~/store/ui'
|
import type { OrderingField } from '~/store/ui'
|
||||||
|
|
||||||
import { computed, ref, watch, onMounted } from 'vue'
|
import { computed, ref, watch } from 'vue'
|
||||||
import { useRouteQuery } from '@vueuse/router'
|
import { useRouteQuery } from '@vueuse/router'
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
import { syncRef } from '@vueuse/core'
|
import { syncRef } from '@vueuse/core'
|
||||||
|
|
Loading…
Reference in New Issue