chore(ui): use `store` object instead of `$store` plugin

This commit is contained in:
upsiflu 2024-12-08 20:20:21 +01:00
parent 074df60f09
commit b447daed47
19 changed files with 77 additions and 77 deletions

View File

@ -80,7 +80,7 @@ const headerStyle = computed(() => {
<div class="ui two stackable cards"> <div class="ui two stackable cards">
<div class="ui card"> <div class="ui card">
<div <div
v-if="!$store.state.auth.authenticated" v-if="!store.state.auth.authenticated"
class="signup-form content" class="signup-form content"
> >
<h3 class="header"> <h3 class="header">
@ -124,7 +124,7 @@ const headerStyle = computed(() => {
{{ t('components.About.message.loggedIn') }} {{ t('components.About.message.loggedIn') }}
</div> </div>
<p> <p>
{{ t('components.About.message.greeting', {username: $store.state.auth.username}) }} {{ t('components.About.message.greeting', {username: store.state.auth.username}) }}
</p> </p>
</div> </div>
</h3> </h3>
@ -162,14 +162,14 @@ const headerStyle = computed(() => {
<div class="two column row"> <div class="two column row">
<div class="column"> <div class="column">
<span class="statistics-figure ui text"> <span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.users.toLocaleString($store.state.ui.momentLocale) }}</strong></span> <span class="ui big text"><strong>{{ stats.users.toLocaleString(store.state.ui.momentLocale) }}</strong></span>
<br> <br>
{{ t('components.About.stat.activeUsers', stats.users) }} {{ t('components.About.stat.activeUsers', stats.users) }}
</span> </span>
</div> </div>
<div class="column"> <div class="column">
<span class="statistics-figure ui text"> <span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.hours.toLocaleString($store.state.ui.momentLocale) }}</strong></span> <span class="ui big text"><strong>{{ stats.hours.toLocaleString(store.state.ui.momentLocale) }}</strong></span>
<br> <br>
{{ t('components.About.stat.hoursOfMusic', stats.hours) }} {{ t('components.About.stat.hoursOfMusic', stats.hours) }}
</span> </span>

View File

@ -340,7 +340,7 @@ const headerStyle = computed(() => {
class="statistics-statistic" class="statistics-statistic"
> >
<span class="statistics-figure ui text"> <span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.hours.toLocaleString($store.state.ui.momentLocale) }}</strong></span> <span class="ui big text"><strong>{{ stats.hours.toLocaleString(store.state.ui.momentLocale) }}</strong></span>
<br> <br>
{{ t('components.AboutPod.stat.hoursOfMusic', stats.hours) }} {{ t('components.AboutPod.stat.hoursOfMusic', stats.hours) }}
</span> </span>
@ -350,7 +350,7 @@ const headerStyle = computed(() => {
class="statistics-statistic" class="statistics-statistic"
> >
<span class="statistics-figure ui text"> <span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.artists.toLocaleString($store.state.ui.momentLocale) }}</strong></span> <span class="ui big text"><strong>{{ stats.artists.toLocaleString(store.state.ui.momentLocale) }}</strong></span>
<br> <br>
{{ t('components.AboutPod.stat.artistsCount', stats.artists) }} {{ t('components.AboutPod.stat.artistsCount', stats.artists) }}
</span> </span>
@ -360,7 +360,7 @@ const headerStyle = computed(() => {
class="statistics-statistic" class="statistics-statistic"
> >
<span class="statistics-figure ui text"> <span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.albums.toLocaleString($store.state.ui.momentLocale) }}</strong></span> <span class="ui big text"><strong>{{ stats.albums.toLocaleString(store.state.ui.momentLocale) }}</strong></span>
<br> <br>
{{ t('components.AboutPod.stat.albumsCount', stats.albums) }} {{ t('components.AboutPod.stat.albumsCount', stats.albums) }}
</span> </span>
@ -370,7 +370,7 @@ const headerStyle = computed(() => {
class="statistics-statistic" class="statistics-statistic"
> >
<span class="statistics-figure ui text"> <span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.tracks.toLocaleString($store.state.ui.momentLocale) }}</strong></span> <span class="ui big text"><strong>{{ stats.tracks.toLocaleString(store.state.ui.momentLocale) }}</strong></span>
<br> <br>
{{ t('components.AboutPod.stat.tracksCount', stats.tracks) }} {{ t('components.AboutPod.stat.tracksCount', stats.tracks) }}
</span> </span>
@ -380,7 +380,7 @@ const headerStyle = computed(() => {
class="statistics-statistic" class="statistics-statistic"
> >
<span class="statistics-figure ui text"> <span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.users.toLocaleString($store.state.ui.momentLocale) }}</strong></span> <span class="ui big text"><strong>{{ stats.users.toLocaleString(store.state.ui.momentLocale) }}</strong></span>
<br> <br>
{{ t('components.AboutPod.stat.activeUsers', stats.users) }} {{ t('components.AboutPod.stat.activeUsers', stats.users) }}
</span> </span>
@ -390,7 +390,7 @@ const headerStyle = computed(() => {
class="statistics-statistic" class="statistics-statistic"
> >
<span class="statistics-figure ui text"> <span class="statistics-figure ui text">
<span class="ui big text"><strong>{{ stats.listenings.toLocaleString($store.state.ui.momentLocale) }}</strong></span> <span class="ui big text"><strong>{{ stats.listenings.toLocaleString(store.state.ui.momentLocale) }}</strong></span>
<br> <br>
{{ t('components.AboutPod.stat.listeningsCount', stats.listenings) }} {{ t('components.AboutPod.stat.listeningsCount', stats.listenings) }}
</span> </span>

View File

@ -138,7 +138,7 @@ onMounted(() => {
<nav class="top ui compact right aligned inverted text menu"> <nav class="top ui compact right aligned inverted text menu">
<div class="right menu"> <div class="right menu">
<div <div
v-if="$store.state.auth.availablePermissions['settings'] || $store.state.auth.availablePermissions['moderation']" v-if="store.state.auth.availablePermissions['settings'] || store.state.auth.availablePermissions['moderation']"
class="item" class="item"
:title="labels.administration" :title="labels.administration"
> >
@ -156,42 +156,42 @@ onMounted(() => {
</h3> </h3>
<div class="divider" /> <div class="divider" />
<router-link <router-link
v-if="$store.state.auth.availablePermissions['library']" v-if="store.state.auth.availablePermissions['library']"
class="item" class="item"
:to="{name: 'manage.library.edits', query: {q: 'is_approved:null'}}" :to="{name: 'manage.library.edits', query: {q: 'is_approved:null'}}"
> >
<div <div
v-if="$store.state.ui.notifications.pendingReviewEdits > 0" v-if="store.state.ui.notifications.pendingReviewEdits > 0"
:title="labels.pendingReviewEdits" :title="labels.pendingReviewEdits"
:class="['ui', 'circular', 'mini', 'right floated', 'accent', 'label']" :class="['ui', 'circular', 'mini', 'right floated', 'accent', 'label']"
> >
{{ $store.state.ui.notifications.pendingReviewEdits }} {{ store.state.ui.notifications.pendingReviewEdits }}
</div> </div>
{{ t('components.Sidebar.link.library') }} {{ t('components.Sidebar.link.library') }}
</router-link> </router-link>
<router-link <router-link
v-if="$store.state.auth.availablePermissions['moderation']" v-if="store.state.auth.availablePermissions['moderation']"
class="item" class="item"
:to="{name: 'manage.moderation.reports.list', query: {q: 'resolved:no'}}" :to="{name: 'manage.moderation.reports.list', query: {q: 'resolved:no'}}"
> >
<div <div
v-if="$store.state.ui.notifications.pendingReviewReports + $store.state.ui.notifications.pendingReviewRequests > 0" v-if="store.state.ui.notifications.pendingReviewReports + store.state.ui.notifications.pendingReviewRequests > 0"
:title="labels.pendingReviewReports" :title="labels.pendingReviewReports"
:class="['ui', 'circular', 'mini', 'right floated', 'accent', 'label']" :class="['ui', 'circular', 'mini', 'right floated', 'accent', 'label']"
> >
{{ $store.state.ui.notifications.pendingReviewReports + $store.state.ui.notifications.pendingReviewRequests }} {{ store.state.ui.notifications.pendingReviewReports + store.state.ui.notifications.pendingReviewRequests }}
</div> </div>
{{ t('components.Sidebar.link.moderation') }} {{ t('components.Sidebar.link.moderation') }}
</router-link> </router-link>
<router-link <router-link
v-if="$store.state.auth.availablePermissions['settings']" v-if="store.state.auth.availablePermissions['settings']"
class="item" class="item"
:to="{name: 'manage.users.users.list'}" :to="{name: 'manage.users.users.list'}"
> >
{{ t('components.Sidebar.link.users') }} {{ t('components.Sidebar.link.users') }}
</router-link> </router-link>
<router-link <router-link
v-if="$store.state.auth.availablePermissions['settings']" v-if="store.state.auth.availablePermissions['settings']"
class="item" class="item"
:to="{path: '/manage/settings'}" :to="{path: '/manage/settings'}"
> >
@ -202,7 +202,7 @@ onMounted(() => {
</div> </div>
</div> </div>
<router-link <router-link
v-if="$store.state.auth.authenticated" v-if="store.state.auth.authenticated"
class="item" class="item"
:to="{name: 'content.index'}" :to="{name: 'content.index'}"
> >
@ -213,24 +213,24 @@ onMounted(() => {
<div class="item"> <div class="item">
<div class="ui user-dropdown dropdown"> <div class="ui user-dropdown dropdown">
<img <img
v-if="$store.state.auth.authenticated && $store.state.auth.profile?.avatar && $store.state.auth.profile?.avatar.urls.medium_square_crop" v-if="store.state.auth.authenticated && store.state.auth.profile?.avatar && store.state.auth.profile?.avatar.urls.medium_square_crop"
class="ui avatar image" class="ui avatar image"
alt="" alt=""
:src="$store.getters['instance/absoluteUrl']($store.state.auth.profile?.avatar.urls.medium_square_crop)" :src="store.getters['instance/absoluteUrl'](store.state.auth.profile?.avatar.urls.medium_square_crop)"
> >
<actor-avatar <actor-avatar
v-else-if="$store.state.auth.authenticated" v-else-if="store.state.auth.authenticated"
:actor="{preferred_username: $store.state.auth.username, full_username: $store.state.auth.username,}" :actor="{preferred_username: store.state.auth.username, full_username: store.state.auth.username,}"
/> />
<i <i
v-else v-else
class="cog icon" class="cog icon"
/> />
<div <div
v-if="$store.state.ui.notifications.inbox + additionalNotifications > 0" v-if="store.state.ui.notifications.inbox + additionalNotifications > 0"
:class="['ui', 'accent', 'mini', 'bottom floating', 'circular', 'label']" :class="['ui', 'accent', 'mini', 'bottom floating', 'circular', 'label']"
> >
{{ $store.state.ui.notifications.inbox + additionalNotifications }} {{ store.state.ui.notifications.inbox + additionalNotifications }}
</div> </div>
<user-menu <user-menu
v-bind="$attrs" v-bind="$attrs"
@ -246,24 +246,24 @@ onMounted(() => {
@click.prevent.exact="showUserModal = !showUserModal" @click.prevent.exact="showUserModal = !showUserModal"
> >
<img <img
v-if="$store.state.auth.authenticated && $store.state.auth.profile?.avatar?.urls.medium_square_crop" v-if="store.state.auth.authenticated && store.state.auth.profile?.avatar?.urls.medium_square_crop"
class="ui avatar image" class="ui avatar image"
alt="" alt=""
:src="$store.getters['instance/absoluteUrl']($store.state.auth.profile?.avatar.urls.medium_square_crop)" :src="store.getters['instance/absoluteUrl'](store.state.auth.profile?.avatar.urls.medium_square_crop)"
> >
<actor-avatar <actor-avatar
v-else-if="$store.state.auth.authenticated" v-else-if="store.state.auth.authenticated"
:actor="{preferred_username: $store.state.auth.username, full_username: $store.state.auth.username,}" :actor="{preferred_username: store.state.auth.username, full_username: store.state.auth.username,}"
/> />
<i <i
v-else v-else
class="cog icon" class="cog icon"
/> />
<div <div
v-if="$store.state.ui.notifications.inbox + additionalNotifications > 0" v-if="store.state.ui.notifications.inbox + additionalNotifications > 0"
:class="['ui', 'accent', 'mini', 'bottom floating', 'circular', 'label']" :class="['ui', 'accent', 'mini', 'bottom floating', 'circular', 'label']"
> >
{{ $store.state.ui.notifications.inbox + additionalNotifications }} {{ store.state.ui.notifications.inbox + additionalNotifications }}
</div> </div>
</a> </a>
</template> </template>
@ -348,7 +348,7 @@ onMounted(() => {
<search-bar @search="isCollapsed = false" /> <search-bar @search="isCollapsed = false" />
</div> </div>
<div <div
v-if="!$store.state.auth.authenticated" v-if="!store.state.auth.authenticated"
class="ui basic signup segment" class="ui basic signup segment"
> >
<router-link <router-link
@ -454,7 +454,7 @@ onMounted(() => {
</div> </div>
</div> </div>
<div <div
v-if="$store.state.auth.authenticated" v-if="store.state.auth.authenticated"
:class="[{ collapsed: expanded !== 'myLibrary' }, 'collapsible item']" :class="[{ collapsed: expanded !== 'myLibrary' }, 'collapsible item']"
> >
<h3 <h3
@ -516,7 +516,7 @@ onMounted(() => {
</div> </div>
</div> </div>
<router-link <router-link
v-if="$store.state.auth.authenticated" v-if="store.state.auth.authenticated"
class="header item" class="header item"
:to="{name: 'subscriptions'}" :to="{name: 'subscriptions'}"
> >

View File

@ -91,7 +91,7 @@ const submit = async () => {
</h4> </h4>
<ul class="list"> <ul class="list">
<li <li
v-if="errors[0] == 'invalid_credentials' && $store.state.instance.settings.moderation.signup_approval_enabled.value" v-if="errors[0] == 'invalid_credentials' && store.state.instance.settings.moderation.signup_approval_enabled.value"
> >
{{ t('components.auth.LoginForm.help.approvalRequired') }} {{ t('components.auth.LoginForm.help.approvalRequired') }}
</li> </li>
@ -103,7 +103,7 @@ const submit = async () => {
</li> </li>
</ul> </ul>
</div> </div>
<template v-if="domain === $store.getters['instance/domain']"> <template v-if="domain === store.getters['instance/domain']">
<div class="field"> <div class="field">
<label for="username-field"> <label for="username-field">
{{ t('components.auth.LoginForm.label.username') }} {{ t('components.auth.LoginForm.label.username') }}
@ -145,7 +145,7 @@ const submit = async () => {
</template> </template>
<template v-else> <template v-else>
<p> <p>
{{ t('components.auth.LoginForm.message.redirect', { domain: $store.getters['instance/domain'] }) }} {{ t('components.auth.LoginForm.message.redirect', { domain: store.getters['instance/domain'] }) }}
</p> </p>
</template> </template>
<button <button

View File

@ -108,7 +108,7 @@ fetchInstanceSettings()
@submit.prevent="submit()" @submit.prevent="submit()"
> >
<p <p
v-if="!$store.state.instance.settings.users.registration_enabled.value" v-if="!store.state.instance.settings.users.registration_enabled.value"
class="ui message" class="ui message"
> >
{{ t('components.auth.SignupForm.message.registrationClosed') }} {{ t('components.auth.SignupForm.message.registrationClosed') }}
@ -177,7 +177,7 @@ fetchInstanceSettings()
/> />
</div> </div>
<div <div
v-if="!$store.state.instance.settings.users.registration_enabled.value" v-if="!store.state.instance.settings.users.registration_enabled.value"
class="required field" class="required field"
> >
<label for="invitation-code">{{ t('components.auth.SignupForm.label.invitation') }}</label> <label for="invitation-code">{{ t('components.auth.SignupForm.label.invitation') }}</label>

View File

@ -604,7 +604,7 @@ defineExpose({
<div class="content"> <div class="content">
<p> <p>
<i class="info icon" /> <i class="info icon" />
{{ t('components.channels.UploadForm.description.extensions', {extensions: $store.state.ui.supportedExtensions.join(', ')}) }} {{ t('components.channels.UploadForm.description.extensions', {extensions: store.state.ui.supportedExtensions.join(', ')}) }}
</p> </p>
</div> </div>
</div> </div>

View File

@ -32,7 +32,7 @@ const title = computed(() => isFavorite.value
<button <button
v-if="button" v-if="button"
:class="['ui', 'pink', {'inverted': isFavorite}, {'favorited': isFavorite}, 'icon', 'labeled', 'button']" :class="['ui', 'pink', {'inverted': isFavorite}, {'favorited': isFavorite}, 'icon', 'labeled', 'button']"
@click.stop="$store.dispatch('favorites/toggle', track.id)" @click.stop="store.dispatch('favorites/toggle', track.id)"
> >
<i class="heart icon" /> <i class="heart icon" />
<span v-if="isFavorite"> <span v-if="isFavorite">
@ -47,7 +47,7 @@ const title = computed(() => isFavorite.value
:class="['ui', 'favorite-icon', {'pink': isFavorite}, {'favorited': isFavorite}, 'basic', 'circular', 'icon', {'really': !border}, 'button']" :class="['ui', 'favorite-icon', {'pink': isFavorite}, {'favorited': isFavorite}, 'basic', 'circular', 'icon', {'really': !border}, 'button']"
:aria-label="title" :aria-label="title"
:title="title" :title="title"
@click.stop="$store.dispatch('favorites/toggle', track.id)" @click.stop="store.dispatch('favorites/toggle', track.id)"
> >
<i :class="['heart', {'pink': isFavorite}, 'basic', 'icon']" /> <i :class="['heart', {'pink': isFavorite}, 'basic', 'icon']" />
</button> </button>

View File

@ -231,7 +231,7 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
{{ t('components.library.Albums.empty.noResults') }} {{ t('components.library.Albums.empty.noResults') }}
</div> </div>
<router-link <router-link
v-if="$store.state.auth.authenticated" v-if="store.state.auth.authenticated"
:to="{name: 'content.index'}" :to="{name: 'content.index'}"
class="ui success button labeled icon" class="ui success button labeled icon"
> >

View File

@ -86,12 +86,12 @@ export default { inheritAttrs: false }
<file-upload <file-upload
ref="upload" ref="upload"
v-bind="$attrs" v-bind="$attrs"
:post-action="$store.getters['instance/absoluteUrl']('/api/v1/uploads/')" :post-action="store.getters['instance/absoluteUrl']('/api/v1/uploads/')"
:multiple="true" :multiple="true"
:thread="1" :thread="1"
:custom-action="uploadAction" :custom-action="uploadAction"
:headers="headers" :headers="headers"
:extensions="$store.state.ui.supportedExtensions" :extensions="store.state.ui.supportedExtensions"
:drop="true" :drop="true"
name="audio_file" name="audio_file"
> >

View File

@ -231,7 +231,7 @@ const paginateOptions = computed(() => sortedUniq([12, 30, 50, paginateBy.value]
{{ t('components.library.Podcasts.empty.noResults') }} {{ t('components.library.Podcasts.empty.noResults') }}
</div> </div>
<router-link <router-link
v-if="$store.state.auth.authenticated" v-if="store.state.auth.authenticated"
:to="{name: 'content.index'}" :to="{name: 'content.index'}"
class="ui success button labeled icon" class="ui success button labeled icon"
> >
@ -239,7 +239,7 @@ const paginateOptions = computed(() => sortedUniq([12, 30, 50, paginateBy.value]
{{ t('components.library.Podcasts.button.channel') }} {{ t('components.library.Podcasts.button.channel') }}
</router-link> </router-link>
<h1 <h1
v-if="$store.state.auth.authenticated" v-if="store.state.auth.authenticated"
class="ui with-actions header" class="ui with-actions header"
> >
<div class="actions"> <div class="actions">

View File

@ -123,7 +123,7 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
<radio-card <radio-card
v-if="isAuthenticated" v-if="isAuthenticated"
:type="'actor-content'" :type="'actor-content'"
:object-id="$store.state.auth.fullUsername" :object-id="store.state.auth.fullUsername"
/> />
<radio-card <radio-card
v-if="isAuthenticated && hasFavorites" v-if="isAuthenticated && hasFavorites"
@ -139,11 +139,11 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
/> />
<radio-card :type="'recently-added'" /> <radio-card :type="'recently-added'" />
<radio-card <radio-card
v-if="$store.state.auth.authenticated && scope === 'all'" v-if="store.state.auth.authenticated && scope === 'all'"
:type="'less-listened'" :type="'less-listened'"
/> />
<radio-card <radio-card
v-if="$store.state.auth.authenticated && scope === 'me'" v-if="store.state.auth.authenticated && scope === 'me'"
:type="'less-listened_library'" :type="'less-listened_library'"
/> />
</div> </div>
@ -244,7 +244,7 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
{{ t('components.library.Radios.empty.noResults') }} {{ t('components.library.Radios.empty.noResults') }}
</div> </div>
<router-link <router-link
v-if="$store.state.auth.authenticated" v-if="store.state.auth.authenticated"
:to="{name: 'library.radios.build'}" :to="{name: 'library.radios.build'}"
class="ui success button labeled icon" class="ui success button labeled icon"
> >

View File

@ -171,7 +171,7 @@ watchEffect(async () => {
:label="true" :label="true"
/> />
<div <div
v-if="!$store.state.auth.authenticated" v-if="!store.state.auth.authenticated"
class="ui eight wide required field" class="ui eight wide required field"
> >
<label for="report-submitter-email"> <label for="report-submitter-email">

View File

@ -278,7 +278,7 @@ const insertMany = async (insertedTracks: number[], allowDuplicates: boolean) =>
<td class="center aligned"> <td class="center aligned">
<img <img
v-if="plt.track.album && plt.track.album.cover && plt.track.album.cover.urls.original" v-if="plt.track.album && plt.track.album.cover && plt.track.album.cover.urls.original"
v-lazy="$store.getters['instance/absoluteUrl'](plt.track.album.cover.urls.medium_square_crop)" v-lazy="store.getters['instance/absoluteUrl'](plt.track.album.cover.urls.medium_square_crop)"
alt="" alt=""
class="ui mini image" class="ui mini image"
> >

View File

@ -82,7 +82,7 @@ store.dispatch('playlists/fetchOwn')
<template> <template>
<semantic-modal <semantic-modal
v-model:show="$store.state.playlists.showModal" v-model:show="store.state.playlists.showModal"
> >
<h4 class="header"> <h4 class="header">
<template v-if="track"> <template v-if="track">
@ -197,7 +197,7 @@ store.dispatch('playlists/fetchOwn')
<td> <td>
<router-link <router-link
:to="{name: 'library.playlists.detail', params: {id: playlist.id }}" :to="{name: 'library.playlists.detail', params: {id: playlist.id }}"
@click="$store.state.playlists.showModal = false" @click="store.state.playlists.showModal = false"
> >
{{ playlist.name }} {{ playlist.name }}
</router-link> </router-link>

View File

@ -3,6 +3,6 @@ import { RootState } from '~/store'
declare module '@vue/runtime-core' { declare module '@vue/runtime-core' {
interface ComponentCustomProperties { interface ComponentCustomProperties {
$store: Store<RootState> store: Store<RootState>
} }
} }

View File

@ -94,7 +94,7 @@ watch(props, fetchData, { immediate: true })
<i class="ellipsis vertical icon" /> <i class="ellipsis vertical icon" />
<div class="menu"> <div class="menu">
<a <a
v-if="object.domain != $store.getters['instance/domain']" v-if="object.domain != store.getters['instance/domain']"
:href="object.fid" :href="object.fid"
target="_blank" target="_blank"
class="basic item" class="basic item"
@ -114,7 +114,7 @@ watch(props, fetchData, { immediate: true })
<div class="divider" /> <div class="divider" />
<router-link <router-link
v-if="$store.state.auth.availablePermissions['moderation']" v-if="store.state.auth.availablePermissions['moderation']"
class="basic item" class="basic item"
:to="{name: 'manage.moderation.accounts.detail', params: {id: object.full_username}}" :to="{name: 'manage.moderation.accounts.detail', params: {id: object.full_username}}"
> >
@ -134,7 +134,7 @@ watch(props, fetchData, { immediate: true })
/> />
<img <img
v-else v-else
v-lazy="$store.getters['instance/absoluteUrl'](object.icon.urls.medium_square_crop)" v-lazy="store.getters['instance/absoluteUrl'](object.icon.urls.medium_square_crop)"
alt="" alt=""
class="ui big circular image" class="ui big circular image"
> >
@ -149,7 +149,7 @@ watch(props, fetchData, { immediate: true })
{{ object.full_username }} {{ object.full_username }}
</div> </div>
</div> </div>
<template v-if="object.full_username === $store.state.auth.fullUsername"> <template v-if="object.full_username === store.state.auth.fullUsername">
<div class="ui very small hidden divider" /> <div class="ui very small hidden divider" />
<div class="ui basic success label"> <div class="ui basic success label">
{{ t('views.auth.ProfileBase.label.self') }} {{ t('views.auth.ProfileBase.label.self') }}
@ -157,12 +157,12 @@ watch(props, fetchData, { immediate: true })
</template> </template>
</h1> </h1>
<div class="ui small hidden divider" /> <div class="ui small hidden divider" />
<div v-if="$store.getters['ui/layoutVersion'] === 'large'"> <div v-if="store.getters['ui/layoutVersion'] === 'large'">
<rendered-description <rendered-description
:content="object.summary" :content="object.summary"
:field-name="'summary'" :field-name="'summary'"
:update-url="`users/${$store.state.auth.username}/`" :update-url="`users/${store.state.auth.username}/`"
:can-update="$store.state.auth.authenticated && object.full_username === $store.state.auth.fullUsername" :can-update="store.state.auth.authenticated && object.full_username === store.state.auth.fullUsername"
@updated="emit('updated', $event)" @updated="emit('updated', $event)"
/> />
</div> </div>

View File

@ -151,7 +151,7 @@ const updateSubscriptionCount = (delta: number) => {
v-if="object.artist?.cover" v-if="object.artist?.cover"
alt="" alt=""
class="huge channel-image" class="huge channel-image"
:src="$store.getters['instance/absoluteUrl'](object.artist.cover.urls.medium_square_crop)" :src="store.getters['instance/absoluteUrl'](object.artist.cover.urls.medium_square_crop)"
> >
<i <i
v-else v-else
@ -182,7 +182,7 @@ const updateSubscriptionCount = (delta: number) => {
{{ t('views.channels.DetailBase.meta.tracks', totalTracks) }} {{ t('views.channels.DetailBase.meta.tracks', totalTracks) }}
</span> </span>
</template> </template>
<template v-if="object.attributed_to.full_username === $store.state.auth.fullUsername || $store.getters['channels/isSubscribed'](object.uuid)"> <template v-if="object.attributed_to.full_username === store.state.auth.fullUsername || store.getters['channels/isSubscribed'](object.uuid)">
<br> <br>
{{ t('views.channels.DetailBase.meta.subscribers', object?.subscriptions_count ?? 0) }} {{ t('views.channels.DetailBase.meta.subscribers', object?.subscriptions_count ?? 0) }}
<br> <br>
@ -204,7 +204,7 @@ const updateSubscriptionCount = (delta: number) => {
</h4> </h4>
<div class="scrollable content"> <div class="scrollable content">
<div class="description"> <div class="description">
<template v-if="$store.state.auth.authenticated"> <template v-if="store.state.auth.authenticated">
<h3> <h3>
<i class="user icon" /> <i class="user icon" />
{{ t('views.channels.DetailBase.modal.subscribe.funkwhale.header') }} {{ t('views.channels.DetailBase.modal.subscribe.funkwhale.header') }}
@ -263,7 +263,7 @@ const updateSubscriptionCount = (delta: number) => {
{{ t('views.channels.DetailBase.button.embed') }} {{ t('views.channels.DetailBase.button.embed') }}
</a> </a>
<a <a
v-if="object.actor && object.actor.domain != $store.getters['instance/domain']" v-if="object.actor && object.actor.domain != store.getters['instance/domain']"
:href="object.url" :href="object.url"
target="_blank" target="_blank"
class="basic item" class="basic item"
@ -318,7 +318,7 @@ const updateSubscriptionCount = (delta: number) => {
</template> </template>
</dangerous-button> </dangerous-button>
</template> </template>
<template v-if="$store.state.auth.availablePermissions['library']"> <template v-if="store.state.auth.availablePermissions['library']">
<div class="divider" /> <div class="divider" />
<router-link <router-link
class="basic item" class="basic item"
@ -368,7 +368,7 @@ const updateSubscriptionCount = (delta: number) => {
> >
<button <button
class="ui basic labeled icon button" class="ui basic labeled icon button"
@click.prevent.stop="$store.commit('channels/showUploadModal', {show: true, config: {channel: object}})" @click.prevent.stop="store.commit('channels/showUploadModal', {show: true, config: {channel: object}})"
> >
<i class="upload icon" /> <i class="upload icon" />
{{ t('views.channels.DetailBase.button.upload') }} {{ t('views.channels.DetailBase.button.upload') }}
@ -452,7 +452,7 @@ const updateSubscriptionCount = (delta: number) => {
</div> </div>
</semantic-modal> </semantic-modal>
</div> </div>
<div v-if="$store.getters['ui/layoutVersion'] === 'large'"> <div v-if="store.getters['ui/layoutVersion'] === 'large'">
<rendered-description <rendered-description
:content="object.artist?.description" :content="object.artist?.description"
:update-url="`channels/${object.uuid}/`" :update-url="`channels/${object.uuid}/`"

View File

@ -105,7 +105,7 @@ const updateUploads = (count: number) => {
<i class="ellipsis vertical icon" /> <i class="ellipsis vertical icon" />
<div class="menu"> <div class="menu">
<a <a
v-if="object.actor.domain != $store.getters['instance/domain']" v-if="object.actor.domain != store.getters['instance/domain']"
:href="object.fid" :href="object.fid"
target="_blank" target="_blank"
class="basic item" class="basic item"
@ -125,7 +125,7 @@ const updateUploads = (count: number) => {
<div class="divider" /> <div class="divider" />
<router-link <router-link
v-if="$store.state.auth.availablePermissions['moderation']" v-if="store.state.auth.availablePermissions['moderation']"
class="basic item" class="basic item"
:to="{name: 'manage.library.libraries.detail', params: {id: object.uuid}}" :to="{name: 'manage.library.libraries.detail', params: {id: object.uuid}}"
> >
@ -200,13 +200,13 @@ const updateUploads = (count: number) => {
class="ui small buttons" class="ui small buttons"
> >
<library-follow-button <library-follow-button
v-if="$store.state.auth.authenticated" v-if="store.state.auth.authenticated"
:library="object" :library="object"
/> />
</div> </div>
</div> </div>
<template v-if="$store.getters['ui/layoutVersion'] === 'large'"> <template v-if="store.getters['ui/layoutVersion'] === 'large'">
<rendered-description <rendered-description
:content="object.description ? {html: object.description} : null" :content="object.description ? {html: object.description} : null"
:update-url="`channels/${object.uuid}/`" :update-url="`channels/${object.uuid}/`"

View File

@ -114,7 +114,7 @@ const deletePlaylist = async () => {
</div> </div>
<div class="ui buttons"> <div class="ui buttons">
<button <button
v-if="$store.state.auth.profile && playlist.actor.full_username === store.state.auth.fullUsername" v-if="store.state.auth.profile && playlist.actor.full_username === store.state.auth.fullUsername"
class="ui icon labeled button" class="ui icon labeled button"
@click="edit = !edit" @click="edit = !edit"
> >
@ -137,7 +137,7 @@ const deletePlaylist = async () => {
{{ t('views.playlists.Detail.button.embed') }} {{ t('views.playlists.Detail.button.embed') }}
</button> </button>
<dangerous-button <dangerous-button
v-if="$store.state.auth.profile && playlist.actor.full_username === store.state.auth.fullUsername" v-if="store.state.auth.profile && playlist.actor.full_username === store.state.auth.fullUsername"
class="ui labeled danger icon button" class="ui labeled danger icon button"
:action="deletePlaylist" :action="deletePlaylist"
> >