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

Update all views

This commit is contained in:
Ciarán Ainsworth 2022-09-23 20:14:25 +02:00 committed by Kasper Seweryn
parent 3a46cb140d
commit 2934f0b407
51 changed files with 1897 additions and 1306 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1869
front/src/locales/en.json
View File

File diff suppressed because it is too large Load Diff

46
front/src/views/Notifications.vue
View File

@ -101,7 +101,7 @@ const markAllAsRead = async () => {
class="ui container" class="ui container"
> >
<h1 class="ui header"> <h1 class="ui header">
{{ $t('views.Notifications.messagesHeader') }} {{ $t('views.Notifications.header.messages') }}
</h1> </h1>
<div class="ui two column stackable grid"> <div class="ui two column stackable grid">
<div <div
@ -110,7 +110,7 @@ const markAllAsRead = async () => {
> >
<div class="ui attached info message"> <div class="ui attached info message">
<h4 class="header"> <h4 class="header">
{{ $t('views.Notifications.instanceSupportHeader') }} {{ $t('views.Notifications.header.instanceSupport') }}
</h4> </h4>
<sanitized-html :html="supportMessage" /> <sanitized-html :html="supportMessage" />
</div> </div>
@ -121,30 +121,30 @@ const markAllAsRead = async () => {
> >
<div class="inline field"> <div class="inline field">
<label for="instance-reminder-delay"> <label for="instance-reminder-delay">
{{ $t('views.Notifications.instanceReminderDelay') }} {{ $t('views.Notifications.label.reminder') }}
</label> </label>
<select <select
id="instance-reminder-delay" id="instance-reminder-delay"
v-model="instanceSupportMessageDelay" v-model="instanceSupportMessageDelay"
> >
<option :value="30"> <option :value="30">
{{ $t('views.Notifications.instanceReminder30') }} {{ $t('views.Notifications.option.delay.30') }}
</option> </option>
<option :value="60"> <option :value="60">
{{ $t('views.Notifications.instanceReminder60') }} {{ $t('views.Notifications.option.delay.60') }}
</option> </option>
<option :value="90"> <option :value="90">
{{ $t('views.Notifications.instanceReminder90') }} {{ $t('views.Notifications.option.delay.90') }}
</option> </option>
<option :value="null"> <option :value="null">
{{ $t('views.Notifications.instanceReminderNever') }} {{ $t('views.Notifications.option.delay.never') }}
</option> </option>
</select> </select>
<button <button
type="submit" type="submit"
class="ui right floated basic button" class="ui right floated basic button"
> >
{{ $t('views.Notifications.instanceReminderSubmitButton') }} {{ $t('views.Notifications.button.submit') }}
</button> </button>
</div> </div>
</form> </form>
@ -156,10 +156,10 @@ const markAllAsRead = async () => {
> >
<div class="ui info attached message"> <div class="ui info attached message">
<h4 class="header"> <h4 class="header">
{{ $t('views.Notifications.funkwhaleSupportHeader') }} {{ $t('views.Notifications.header.funkwhaleSupport') }}
</h4> </h4>
<p> <p>
{{ $t('views.Notifications.funkwhaleSupportMessage') }} {{ $t('views.Notifications.message.funkwhaleSupport') }}
</p> </p>
<a <a
href="https://funkwhale.audio/support-us" href="https://funkwhale.audio/support-us"
@ -167,7 +167,7 @@ const markAllAsRead = async () => {
rel="noopener" rel="noopener"
class="ui primary inverted button" class="ui primary inverted button"
> >
{{ $t('views.Notifications.funkwhaleSupportDonateLink') }} {{ $t('views.Notifications.link.donate') }}
</a> </a>
<a <a
href="https://contribute.funkwhale.audio" href="https://contribute.funkwhale.audio"
@ -175,7 +175,7 @@ const markAllAsRead = async () => {
rel="noopener" rel="noopener"
class="ui secondary inverted button" class="ui secondary inverted button"
> >
{{ $t('views.Notifications.funkwhaleSupportHelpLink') }} {{ $t('views.Notifications.link.help') }}
</a> </a>
</div> </div>
<div class="ui bottom attached segment"> <div class="ui bottom attached segment">
@ -185,30 +185,30 @@ const markAllAsRead = async () => {
> >
<div class="inline field"> <div class="inline field">
<label for="funkwhale-reminder-delay"> <label for="funkwhale-reminder-delay">
{{ $t('views.Notifications.funkwhaleReminderDelay') }} {{ $t('views.Notifications.label.reminder') }}
</label> </label>
<select <select
id="funkwhale-reminder-delay" id="funkwhale-reminder-delay"
v-model="funkwhaleSupportMessageDelay" v-model="funkwhaleSupportMessageDelay"
> >
<option :value="30"> <option :value="30">
{{ $t('views.Notifications.funkwhaleReminder30') }} {{ $t('views.Notifications.option.delay.30') }}
</option> </option>
<option :value="60"> <option :value="60">
{{ $t('views.Notifications.funkwhaleReminder60') }} {{ $t('views.Notifications.option.delay.60') }}
</option> </option>
<option :value="90"> <option :value="90">
{{ $t('views.Notifications.funkwhaleReminder90') }} {{ $t('views.Notifications.option.delay.90') }}
</option> </option>
<option :value="null"> <option :value="null">
{{ $t('views.Notifications.funkwhaleReminderNever') }} {{ $t('views.Notifications.option.delay.never') }}
</option> </option>
</select> </select>
<button <button
type="submit" type="submit"
class="ui right floated basic button" class="ui right floated basic button"
> >
{{ $t('views.Notifications.funkwhaleReminderSubmitButton') }} {{ $t('views.Notifications.button.submit') }}
</button> </button>
</div> </div>
</form> </form>
@ -217,7 +217,7 @@ const markAllAsRead = async () => {
</div> </div>
</div> </div>
<h1 class="ui header"> <h1 class="ui header">
{{ $t('views.Notifications.notificationsHeader') }} {{ $t('views.Notifications.header.notifications') }}
</h1> </h1>
<div class="ui toggle checkbox"> <div class="ui toggle checkbox">
<input <input
@ -225,7 +225,7 @@ const markAllAsRead = async () => {
v-model="filters.is_read" v-model="filters.is_read"
type="checkbox" type="checkbox"
> >
<label for="show-read-notifications">{{ $t('views.Notifications.showReadNotificationsCheckbox') }}</label> <label for="show-read-notifications">{{ $t('views.Notifications.label.showRead') }}</label>
</div> </div>
<button <button
v-if="filters.is_read === false && notifications.count > 0" v-if="filters.is_read === false && notifications.count > 0"
@ -233,7 +233,7 @@ const markAllAsRead = async () => {
@click.prevent="markAllAsRead" @click.prevent="markAllAsRead"
> >
<i class="ui check icon" /> <i class="ui check icon" />
{{ $t('views.Notifications.markAllReadButton') }} {{ $t('views.Notifications.button.read') }}
</button> </button>
<div class="ui hidden divider" /> <div class="ui hidden divider" />
@ -242,7 +242,7 @@ const markAllAsRead = async () => {
:class="['ui', {'active': isLoading}, 'inverted', 'dimmer']" :class="['ui', {'active': isLoading}, 'inverted', 'dimmer']"
> >
<div class="ui text loader"> <div class="ui text loader">
{{ $t('views.Notifications.loadingNotifications') }} {{ $t('views.Notifications.loading.notifications') }}
</div> </div>
</div> </div>
@ -259,7 +259,7 @@ const markAllAsRead = async () => {
</tbody> </tbody>
</table> </table>
<p v-else-if="additionalNotifications === 0"> <p v-else-if="additionalNotifications === 0">
{{ $t('views.Notifications.noNotifications') }} {{ $t('views.Notifications.empty.notifications') }}
</p> </p>
</div> </div>
</section> </section>

26
front/src/views/Search.vue
View File

@ -65,43 +65,43 @@ interface SearchType {
const types = computed(() => [ const types = computed(() => [
{ {
id: 'artists', id: 'artists',
label: t('views.Search.artistsLabel'), label: t('views.Search.label.artists'),
includeChannels: true, includeChannels: true,
contentCategory: 'music' contentCategory: 'music'
}, },
{ {
id: 'albums', id: 'albums',
label: t('views.Search.albumsLabel'), label: t('views.Search.label.albums'),
includeChannels: true, includeChannels: true,
contentCategory: 'music' contentCategory: 'music'
}, },
{ {
id: 'tracks', id: 'tracks',
label: t('views.Search.tracksLabel') label: t('views.Search.label.tracks')
}, },
{ {
id: 'playlists', id: 'playlists',
label: t('views.Search.playlistsLabel') label: t('views.Search.label.playlists')
}, },
{ {
id: 'radios', id: 'radios',
label: t('views.Search.radiosLabel'), label: t('views.Search.label.radios'),
endpoint: 'radios/radios' endpoint: 'radios/radios'
}, },
{ {
id: 'tags', id: 'tags',
label: t('views.Search.tagsLabel') label: t('views.Search.label.tags')
}, },
{ {
id: 'podcasts', id: 'podcasts',
label: t('views.Search.podcastsLabel'), label: t('views.Search.label.podcasts'),
endpoint: '/artists', endpoint: '/artists',
contentCategory: 'podcast', contentCategory: 'podcast',
includeChannels: true includeChannels: true
}, },
{ {
id: 'series', id: 'series',
label: t('views.Search.seriesLabel'), label: t('views.Search.label.series'),
endpoint: '/albums', endpoint: '/albums',
includeChannels: true, includeChannels: true,
contentCategory: 'podcast' contentCategory: 'podcast'
@ -181,11 +181,11 @@ const labels = computed(() => ({
title: id.value title: id.value
? ( ? (
type.value === 'rss' type.value === 'rss'
? t('views.Search.rssTitle') ? t('views.Search.header.rss')
: t('views.Search.remoteTitle') : t('views.Search.header.remote')
) )
: t('views.Search.searchTitle'), : t('views.Search.header.search'),
submitSearch: t('views.Search.submitSearchLabel') submitSearch: t('views.Search.button.submit')
})) }))
const radioConfig = computed(() => { const radioConfig = computed(() => {
@ -236,7 +236,7 @@ const radioConfig = computed(() => {
> >
<h2> <h2>
<label for="query"> <label for="query">
{{ $t('views.Search.searchHeader') }} {{ $t('views.Search.header.search') }}
</label> </label>
</h2> </h2>
<div class="ui two column doubling stackable grid container"> <div class="ui two column doubling stackable grid container">

62
front/src/views/admin/ChannelDetail.vue
View File

@ -21,7 +21,7 @@ const { t } = useI18n()
const router = useRouter() const router = useRouter()
const labels = computed(() => ({ const labels = computed(() => ({
statsWarning: t('views.admin.ChannelDetail.statsWarning') statsWarning: t('views.admin.ChannelDetail.warning.stats')
})) }))
const isLoading = ref(false) const isLoading = ref(false)
@ -106,7 +106,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<template v-if="object.artist.is_local"> <template v-if="object.artist.is_local">
<span class="ui tiny accent label"> <span class="ui tiny accent label">
<i class="home icon" /> <i class="home icon" />
{{ $t('views.admin.ChannelDetail.localLabel') }} {{ $t('views.admin.ChannelDetail.label.local') }}
</span> </span>
&nbsp; &nbsp;
</template> </template>
@ -129,7 +129,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:to="{name: 'channels.detail', params: {id: object.uuid }}" :to="{name: 'channels.detail', params: {id: object.uuid }}"
> >
<i class="info icon" /> <i class="info icon" />
{{ $t('views.admin.ChannelDetail.localProfileLink') }} {{ $t('views.admin.ChannelDetail.link.localProfile') }}
</router-link> </router-link>
<button <button
v-dropdown v-dropdown
@ -145,7 +145,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.ChannelDetail.djangoLink') }} {{ $t('views.admin.ChannelDetail.link.django') }}
</a> </a>
<fetch-button <fetch-button
v-if="!object.actor.is_local" v-if="!object.actor.is_local"
@ -154,7 +154,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
@refresh="fetchData" @refresh="fetchData"
> >
<i class="refresh icon" />&nbsp; <i class="refresh icon" />&nbsp;
{{ $t('views.admin.ChannelDetail.refreshButton') }} {{ $t('views.admin.ChannelDetail.button.refresh') }}
</fetch-button> </fetch-button>
<a <a
class="basic item" class="basic item"
@ -163,7 +163,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.ChannelDetail.openRemoteButton') }} {{ $t('views.admin.ChannelDetail.button.openRemote') }}
</a> </a>
</div> </div>
</button> </button>
@ -173,22 +173,22 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:class="['ui', {loading: isLoading}, 'basic danger button']" :class="['ui', {loading: isLoading}, 'basic danger button']"
:action="remove" :action="remove"
> >
{{ $t('views.admin.ChannelDetail.deleteButton') }} {{ $t('views.admin.ChannelDetail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.admin.ChannelDetail.deleteModalHeader') }} {{ $t('views.admin.ChannelDetail.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.admin.ChannelDetail.deleteModalMessage') }} {{ $t('views.admin.ChannelDetail.modal.delete.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.admin.ChannelDetail.deleteButton') }} {{ $t('views.admin.ChannelDetail.button.delete') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -205,14 +205,14 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.ChannelDetail.channelDataHeader') }} {{ $t('views.admin.ChannelDetail.header.channelData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.ChannelDetail.nameLabel') }} {{ $t('views.admin.ChannelDetail.table.channelData.name') }}
</td> </td>
<td> <td>
{{ object.artist.name }} {{ object.artist.name }}
@ -221,7 +221,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.channels', query: {q: getQuery('category', object.artist.content_category) }}"> <router-link :to="{name: 'manage.channels', query: {q: getQuery('category', object.artist.content_category) }}">
{{ $t('views.admin.ChannelDetail.categoryLabel') }} {{ $t('views.admin.ChannelDetail.table.channelData.category') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -231,7 +231,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.accounts.detail', params: {id: object.attributed_to.full_username }}"> <router-link :to="{name: 'manage.moderation.accounts.detail', params: {id: object.attributed_to.full_username }}">
{{ $t('views.admin.ChannelDetail.accountLabel') }} {{ $t('views.admin.ChannelDetail.table.channelData.account') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -241,7 +241,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr v-if="!object.actor.is_local"> <tr v-if="!object.actor.is_local">
<td> <td>
<router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.actor.domain }}"> <router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.actor.domain }}">
{{ $t('views.admin.ChannelDetail.domainLabel') }} {{ $t('views.admin.ChannelDetail.table.channelData.domain') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -250,7 +250,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr v-if="object.artist.description"> <tr v-if="object.artist.description">
<td> <td>
{{ $t('views.admin.ChannelDetail.descriptionLabel') }} {{ $t('views.admin.ChannelDetail.table.channelData.description') }}
</td> </td>
<sanitized-html <sanitized-html
tag="td" tag="td"
@ -259,7 +259,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr v-if="object.actor.url"> <tr v-if="object.actor.url">
<td> <td>
{{ $t('views.admin.ChannelDetail.urlLabel') }} {{ $t('views.admin.ChannelDetail.table.channelData.url') }}
</td> </td>
<td> <td>
<a <a
@ -271,7 +271,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr v-if="object.rss_url"> <tr v-if="object.rss_url">
<td> <td>
{{ $t('views.admin.ChannelDetail.rssLabel') }} {{ $t('views.admin.ChannelDetail.table.channelData.rss') }}
</td> </td>
<td> <td>
<a <a
@ -290,7 +290,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.ChannelDetail.activityHeader') }}&nbsp; {{ $t('views.admin.ChannelDetail.header.activity') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -310,7 +310,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.ChannelDetail.firstSeenLabel') }} {{ $t('views.admin.ChannelDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="object.creation_date" /> <human-date :date="object.creation_date" />
@ -318,7 +318,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.ChannelDetail.listeningsLabel') }} {{ $t('views.admin.ChannelDetail.table.activity.listenings') }}
</td> </td>
<td> <td>
{{ stats.listenings }} {{ stats.listenings }}
@ -326,7 +326,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.ChannelDetail.favoritedLabel') }} {{ $t('views.admin.ChannelDetail.table.activity.favorited') }}
</td> </td>
<td> <td>
{{ stats.track_favorites }} {{ stats.track_favorites }}
@ -334,7 +334,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.ChannelDetail.playlistsLabel') }} {{ $t('views.admin.ChannelDetail.table.activity.playlists') }}
</td> </td>
<td> <td>
{{ stats.playlists }} {{ stats.playlists }}
@ -343,7 +343,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `channel:${object.uuid}`) }}"> <router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `channel:${object.uuid}`) }}">
{{ $t('views.admin.ChannelDetail.linkedReportsLabel') }} {{ $t('views.admin.ChannelDetail.table.activity.linkedReports') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -353,7 +353,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.edits', query: {q: getQuery('target', 'artist ' + object.artist.id)}}"> <router-link :to="{name: 'manage.library.edits', query: {q: getQuery('target', 'artist ' + object.artist.id)}}">
{{ $t('views.admin.ChannelDetail.editsLabel') }} {{ $t('views.admin.ChannelDetail.table.activity.edits') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -369,7 +369,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.ChannelDetail.audioContentHeader') }}&nbsp; {{ $t('views.admin.ChannelDetail.header.audioContent') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -389,7 +389,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.ChannelDetail.cachedSizeLabel') }} {{ $t('views.admin.ChannelDetail.table.audioContent.cachedSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_downloaded_size) }} {{ humanSize(stats.media_downloaded_size) }}
@ -397,7 +397,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.ChannelDetail.totalSizeLabel') }} {{ $t('views.admin.ChannelDetail.table.audioContent.totalSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_total_size) }} {{ humanSize(stats.media_total_size) }}
@ -406,7 +406,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('channel_id', object.uuid) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('channel_id', object.uuid) }}">
{{ $t('views.admin.ChannelDetail.uploadsLabel') }} {{ $t('views.admin.ChannelDetail.table.audioContent.uploads') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -416,7 +416,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.albums', query: {q: getQuery('channel_id', object.uuid) }}"> <router-link :to="{name: 'manage.library.albums', query: {q: getQuery('channel_id', object.uuid) }}">
{{ $t('views.admin.ChannelDetail.albumsLabel') }} {{ $t('views.admin.ChannelDetail.table.audioContent.albums') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -426,7 +426,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('channel_id', object.uuid) }}"> <router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('channel_id', object.uuid) }}">
{{ $t('views.admin.ChannelDetail.tracksLabel') }} {{ $t('views.admin.ChannelDetail.table.audioContent.tracks') }}
</router-link> </router-link>
</td> </td>
<td> <td>

20
front/src/views/admin/CommonList.vue
View File

@ -27,16 +27,16 @@ const props = withDefaults(defineProps<Props>(), {
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
accounts: t('views.admin.CommonList.accountsLabel'), accounts: t('views.admin.CommonList.title.accounts'),
albums: t('views.admin.CommonList.albumsLabel'), albums: t('views.admin.CommonList.title.albums'),
artists: t('views.admin.CommonList.artistsLabel'), artists: t('views.admin.CommonList.title.artists'),
channels: t('views.admin.CommonList.channelsLabel'), channels: t('views.admin.CommonList.title.channels'),
invitations: t('views.admin.CommonList.invitationsLabel'), invitations: t('views.admin.CommonList.title.invitations'),
libraries: t('views.admin.CommonList.librariesLabel'), libraries: t('views.admin.CommonList.title.libraries'),
tags: t('views.admin.CommonList.tagsLabel'), tags: t('views.admin.CommonList.title.tags'),
tracks: t('views.admin.CommonList.tracksLabel'), tracks: t('views.admin.CommonList.title.tracks'),
uploads: t('views.admin.CommonList.uploadsLabel'), uploads: t('views.admin.CommonList.title.uploads'),
users: t('views.admin.CommonList.usersLabel') users: t('views.admin.CommonList.title.users')
})) }))
const title = computed(() => labels.value[props.type]) const title = computed(() => labels.value[props.type])

26
front/src/views/admin/Settings.vue
View File

@ -20,7 +20,7 @@ const { t } = useI18n()
const groups = computed(() => [ const groups = computed(() => [
{ {
label: t('views.admin.Settings.instanceInfoLabel'), label: t('views.admin.Settings.header.instanceInfo'),
id: 'instance', id: 'instance',
settings: [ settings: [
{ name: 'instance__name' }, { name: 'instance__name' },
@ -34,7 +34,7 @@ const groups = computed(() => [
] ]
}, },
{ {
label: t('views.admin.Settings.signupsLabel'), label: t('views.admin.Settings.header.signups'),
id: 'signup', id: 'signup',
settings: [ settings: [
{ name: 'users__registration_enabled' }, { name: 'users__registration_enabled' },
@ -43,7 +43,7 @@ const groups = computed(() => [
] ]
}, },
{ {
label: t('views.admin.Settings.securityLabel'), label: t('views.admin.Settings.header.security'),
id: 'security', id: 'security',
settings: [ settings: [
{ name: 'common__api_authentication_required' }, { name: 'common__api_authentication_required' },
@ -52,7 +52,7 @@ const groups = computed(() => [
] ]
}, },
{ {
label: t('views.admin.Settings.musicLabel'), label: t('views.admin.Settings.header.music'),
id: 'music', id: 'music',
settings: [ settings: [
{ name: 'music__transcoding_enabled' }, { name: 'music__transcoding_enabled' },
@ -60,7 +60,7 @@ const groups = computed(() => [
] ]
}, },
{ {
label: t('views.admin.Settings.channelsLabel'), label: t('views.admin.Settings.header.channels'),
id: 'channels', id: 'channels',
settings: [ settings: [
{ name: 'audio__channels_enabled' }, { name: 'audio__channels_enabled' },
@ -68,14 +68,14 @@ const groups = computed(() => [
] ]
}, },
{ {
label: t('views.admin.Settings.playlistsLabel'), label: t('views.admin.Settings.header.playlists'),
id: 'playlists', id: 'playlists',
settings: [ settings: [
{ name: 'playlists__max_tracks' } { name: 'playlists__max_tracks' }
] ]
}, },
{ {
label: t('views.admin.Settings.moderationLabel'), label: t('views.admin.Settings.header.moderation'),
id: 'moderation', id: 'moderation',
settings: [ settings: [
{ name: 'moderation__allow_list_enabled' }, { name: 'moderation__allow_list_enabled' },
@ -84,7 +84,7 @@ const groups = computed(() => [
] ]
}, },
{ {
label: t('views.admin.Settings.federationLabel'), label: t('views.admin.Settings.header.federation'),
id: 'federation', id: 'federation',
settings: [ settings: [
{ name: 'federation__enabled' }, { name: 'federation__enabled' },
@ -95,14 +95,14 @@ const groups = computed(() => [
] ]
}, },
{ {
label: t('views.admin.Settings.subsonicLabel'), label: t('views.admin.Settings.header.subsonic'),
id: 'subsonic', id: 'subsonic',
settings: [ settings: [
{ name: 'subsonic__enabled' } { name: 'subsonic__enabled' }
] ]
}, },
{ {
label: t('views.admin.Settings.statsLabel'), label: t('views.admin.Settings.header.stats'),
id: 'ui', id: 'ui',
settings: [ settings: [
{ name: 'ui__custom_css' }, { name: 'ui__custom_css' },
@ -110,7 +110,7 @@ const groups = computed(() => [
] ]
}, },
{ {
label: t('views.admin.Settings.uiLabel'), label: t('views.admin.Settings.header.ui'),
id: 'statistics', id: 'statistics',
settings: [ settings: [
{ name: 'instance__nodeinfo_stats_enabled' }, { name: 'instance__nodeinfo_stats_enabled' },
@ -120,7 +120,7 @@ const groups = computed(() => [
] as SettingsGroupType[]) ] as SettingsGroupType[])
const labels = computed(() => ({ const labels = computed(() => ({
settings: t('views.admin.Settings.settingsLabel') settings: t('views.admin.Settings.header.settings')
})) }))
const scrollTo = (id: string) => { const scrollTo = (id: string) => {
@ -186,7 +186,7 @@ await nextTick()
<div class="four wide column"> <div class="four wide column">
<div class="ui sticky vertical secondary menu"> <div class="ui sticky vertical secondary menu">
<div class="header item"> <div class="header item">
{{ $t('views.admin.Settings.sectionsHeader') }} {{ $t('views.admin.Settings.header.sections') }}
</div> </div>
<a <a
v-for="(group, key) in groups" v-for="(group, key) in groups"

60
front/src/views/admin/library/AlbumDetail.vue
View File

@ -21,7 +21,7 @@ const { t } = useI18n()
const router = useRouter() const router = useRouter()
const labels = computed(() => ({ const labels = computed(() => ({
statsWarning: t('views.admin.library.AlbumDetail.statsWarning') statsWarning: t('views.admin.library.AlbumDetail.warning.stats')
})) }))
const isLoading = ref(false) const isLoading = ref(false)
@ -106,7 +106,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<template v-if="object.is_local"> <template v-if="object.is_local">
<span class="ui tiny accent label"> <span class="ui tiny accent label">
<i class="home icon" /> <i class="home icon" />
{{ $t('views.admin.library.AlbumDetail.localLabel') }} {{ $t('views.admin.library.AlbumDetail.header.local') }}
</span> </span>
&nbsp; &nbsp;
</template> </template>
@ -130,7 +130,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:to="{name: 'library.albums.detail', params: {id: object.id }}" :to="{name: 'library.albums.detail', params: {id: object.id }}"
> >
<i class="info icon" /> <i class="info icon" />
{{ $t('views.admin.library.AlbumDetail.localProfileLink') }} {{ $t('views.admin.library.AlbumDetail.link.localProfile') }}
</router-link> </router-link>
<button <button
v-dropdown v-dropdown
@ -146,7 +146,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.library.AlbumDetail.djangoLink') }} {{ $t('views.admin.library.AlbumDetail.link.django') }}
</a> </a>
<a <a
v-if="object.mbid" v-if="object.mbid"
@ -156,7 +156,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.library.AlbumDetail.musicbrainzLink') }} {{ $t('views.admin.library.AlbumDetail.link.musicbrainz') }}
</a> </a>
<fetch-button <fetch-button
v-if="!object.is_local" v-if="!object.is_local"
@ -165,7 +165,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
@refresh="fetchData" @refresh="fetchData"
> >
<i class="refresh icon" />&nbsp; <i class="refresh icon" />&nbsp;
{{ $t('views.admin.library.AlbumDetail.remoteRefreshButton') }} {{ $t('views.admin.library.AlbumDetail.button.remoteRefresh') }}
</fetch-button> </fetch-button>
<a <a
class="basic item" class="basic item"
@ -174,7 +174,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.library.AlbumDetail.remoteProfileLink') }} {{ $t('views.admin.library.AlbumDetail.link.remoteProfile') }}
</a> </a>
</div> </div>
</button> </button>
@ -186,7 +186,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
class="ui labeled icon button" class="ui labeled icon button"
> >
<i class="edit icon" /> <i class="edit icon" />
{{ $t('views.admin.library.AlbumDetail.editButton') }} {{ $t('views.admin.library.AlbumDetail.button.edit') }}
</router-link> </router-link>
</div> </div>
<div class="ui buttons"> <div class="ui buttons">
@ -194,22 +194,22 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:class="['ui', {loading: isLoading}, 'basic danger button']" :class="['ui', {loading: isLoading}, 'basic danger button']"
:action="remove" :action="remove"
> >
{{ $t('views.admin.library.AlbumDetail.deleteButton') }} {{ $t('views.admin.library.AlbumDetail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.admin.library.AlbumDetail.deleteModalHeader') }} {{ $t('views.admin.library.AlbumDetail.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.admin.library.AlbumDetail.deleteModalMessage') }} {{ $t('views.admin.library.AlbumDetail.modal.delete.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.admin.library.AlbumDetail.deleteButton') }} {{ $t('views.admin.library.AlbumDetail.button.delete') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -226,14 +226,14 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.AlbumDetail.albumDataHeader') }} {{ $t('views.admin.library.AlbumDetail.header.albumData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.AlbumDetail.titleLabel') }} {{ $t('views.admin.library.AlbumDetail.table.album.title') }}
</td> </td>
<td> <td>
{{ object.title }} {{ object.title }}
@ -242,7 +242,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.artists.detail', params: {id: object.artist.id }}"> <router-link :to="{name: 'manage.library.artists.detail', params: {id: object.artist.id }}">
{{ $t('views.admin.library.AlbumDetail.artistLabel') }} {{ $t('views.admin.library.AlbumDetail.link.artist') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -252,7 +252,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr v-if="!object.is_local"> <tr v-if="!object.is_local">
<td> <td>
<router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}"> <router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}">
{{ $t('views.admin.library.AlbumDetail.domainLabel') }} {{ $t('views.admin.library.AlbumDetail.link.domain') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -261,7 +261,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr v-if="object.description"> <tr v-if="object.description">
<td> <td>
{{ $t('views.admin.library.AlbumDetail.descriptionLabel') }} {{ $t('views.admin.library.AlbumDetail.table.album.description') }}
</td> </td>
<sanitized-html <sanitized-html
tag="td" tag="td"
@ -277,7 +277,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.AlbumDetail.activityHeader') }}&nbsp; {{ $t('views.admin.library.AlbumDetail.header.activity') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -297,7 +297,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.AlbumDetail.firstSeenLabel') }} {{ $t('views.admin.library.AlbumDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="object.creation_date" /> <human-date :date="object.creation_date" />
@ -305,7 +305,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.AlbumDetail.listeningsLabel') }} {{ $t('views.admin.library.AlbumDetail.table.activity.listenings') }}
</td> </td>
<td> <td>
{{ stats.listenings }} {{ stats.listenings }}
@ -313,7 +313,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.AlbumDetail.favoritedLabel') }} {{ $t('views.admin.library.AlbumDetail.table.activity.favorited') }}
</td> </td>
<td> <td>
{{ stats.track_favorites }} {{ stats.track_favorites }}
@ -321,7 +321,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.AlbumDetail.playlistsLabel') }} {{ $t('views.admin.library.AlbumDetail.table.activity.playlists') }}
</td> </td>
<td> <td>
{{ stats.playlists }} {{ stats.playlists }}
@ -330,7 +330,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `album:${object.id}`) }}"> <router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `album:${object.id}`) }}">
{{ $t('views.admin.library.AlbumDetail.linkedReportsLabel') }} {{ $t('views.admin.library.AlbumDetail.link.reports') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -340,7 +340,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.edits', query: {q: getQuery('target', 'album ' + object.id)}}"> <router-link :to="{name: 'manage.library.edits', query: {q: getQuery('target', 'album ' + object.id)}}">
{{ $t('views.admin.library.AlbumDetail.editsLabel') }} {{ $t('views.admin.library.AlbumDetail.link.edits') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -356,7 +356,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.AlbumDetail.audioContentHeader') }}&nbsp; {{ $t('views.admin.library.AlbumDetail.header.audioContent') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -376,7 +376,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.AlbumDetail.cachedSizeLabel') }} {{ $t('views.admin.library.AlbumDetail.table.audioContent.cachedSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_downloaded_size) }} {{ humanSize(stats.media_downloaded_size) }}
@ -384,7 +384,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.AlbumDetail.totalSizeLabel') }} {{ $t('views.admin.library.AlbumDetail.table.audioContent.totalSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_total_size) }} {{ humanSize(stats.media_total_size) }}
@ -394,7 +394,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('album_id', object.id) }}"> <router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('album_id', object.id) }}">
{{ $t('views.admin.library.AlbumDetail.librariesLabel') }} {{ $t('views.admin.library.AlbumDetail.link.libraries') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -404,7 +404,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('album_id', object.id) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('album_id', object.id) }}">
{{ $t('views.admin.library.AlbumDetail.uploadsLabel') }} {{ $t('views.admin.library.AlbumDetail.link.uploads') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -414,7 +414,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('album_id', object.id) }}"> <router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('album_id', object.id) }}">
{{ $t('views.admin.library.AlbumDetail.tracksLabel') }} {{ $t('views.admin.library.AlbumDetail.link.tracks') }}
</router-link> </router-link>
</td> </td>
<td> <td>

62
front/src/views/admin/library/ArtistDetail.vue
View File

@ -21,7 +21,7 @@ const { t } = useI18n()
const router = useRouter() const router = useRouter()
const labels = computed(() => ({ const labels = computed(() => ({
statsWarning: t('views.admin.library.ArtistDetail.statsWarning') statsWarning: t('views.admin.library.ArtistDetail.warning.stats')
})) }))
const isLoading = ref(false) const isLoading = ref(false)
@ -106,7 +106,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<template v-if="object.is_local"> <template v-if="object.is_local">
<span class="ui tiny accent label"> <span class="ui tiny accent label">
<i class="home icon" /> <i class="home icon" />
{{ $t('views.admin.library.ArtistDetail.localLabel') }} {{ $t('views.admin.library.ArtistDetail.header.local') }}
</span> </span>
&nbsp; &nbsp;
</template> </template>
@ -129,7 +129,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:to="{name: 'library.artists.detail', params: {id: object.id }}" :to="{name: 'library.artists.detail', params: {id: object.id }}"
> >
<i class="info icon" /> <i class="info icon" />
{{ $t('views.admin.library.ArtistDetail.localProfileLink') }} {{ $t('views.admin.library.ArtistDetail.link.localProfile') }}
</router-link> </router-link>
<button <button
v-dropdown v-dropdown
@ -145,7 +145,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.library.ArtistDetail.djangoLink') }} {{ $t('views.admin.library.ArtistDetail.link.django') }}
</a> </a>
<a <a
v-if="object.mbid" v-if="object.mbid"
@ -155,7 +155,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.library.ArtistDetail.musicbrainzLink') }} {{ $t('views.admin.library.ArtistDetail.link.musicbrainz') }}
</a> </a>
<fetch-button <fetch-button
v-if="!object.is_local" v-if="!object.is_local"
@ -164,7 +164,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
@refresh="fetchData" @refresh="fetchData"
> >
<i class="refresh icon" />&nbsp; <i class="refresh icon" />&nbsp;
{{ $t('views.admin.library.ArtistDetail.remoteRefreshButton') }} {{ $t('views.admin.library.ArtistDetail.button.remoteRefresh') }}
</fetch-button> </fetch-button>
<a <a
class="basic item" class="basic item"
@ -173,7 +173,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.library.ArtistDetail.remoteProfileLink') }} {{ $t('views.admin.library.ArtistDetail.link.remoteProfile') }}
</a> </a>
</div> </div>
</button> </button>
@ -185,7 +185,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
class="ui labeled icon button" class="ui labeled icon button"
> >
<i class="edit icon" /> <i class="edit icon" />
{{ $t('views.admin.library.ArtistDetail.editButton') }} {{ $t('views.admin.library.ArtistDetail.button.edit') }}
</router-link> </router-link>
</div> </div>
<div class="ui buttons"> <div class="ui buttons">
@ -193,22 +193,22 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:class="['ui', {loading: isLoading}, 'basic danger button']" :class="['ui', {loading: isLoading}, 'basic danger button']"
:action="remove" :action="remove"
> >
{{ $t('views.admin.library.ArtistDetail.deleteButton') }} {{ $t('views.admin.library.ArtistDetail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.admin.library.ArtistDetail.deleteModalHeader') }} {{ $t('views.admin.library.ArtistDetail.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.admin.library.ArtistDetail.deleteModalMessage') }} {{ $t('views.admin.library.ArtistDetail.modal.delete.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.admin.library.ArtistDetail.deleteButton') }} {{ $t('views.admin.library.ArtistDetail.button.delete') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -225,14 +225,14 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.ArtistDetail.artistDataHeader') }} {{ $t('views.admin.library.ArtistDetail.header.artistData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.ArtistDetail.nameLabel') }} {{ $t('views.admin.library.ArtistDetail.table.artist.name') }}
</td> </td>
<td> <td>
{{ object.name }} {{ object.name }}
@ -241,7 +241,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.artists', query: {q: getQuery('category', object.content_category) }}"> <router-link :to="{name: 'manage.library.artists', query: {q: getQuery('category', object.content_category) }}">
{{ $t('views.admin.library.ArtistDetail.categoryLabel') }} {{ $t('views.admin.library.ArtistDetail.link.category') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -251,7 +251,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr v-if="!object.is_local"> <tr v-if="!object.is_local">
<td> <td>
<router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}"> <router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}">
{{ $t('views.admin.library.ArtistDetail.domainLabel') }} {{ $t('views.admin.library.ArtistDetail.link.domain') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -260,7 +260,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr v-if="object.description"> <tr v-if="object.description">
<td> <td>
{{ $t('views.admin.library.ArtistDetail.descriptionLabel') }} {{ $t('views.admin.library.ArtistDetail.table.artist.description') }}
</td> </td>
<sanitized-html <sanitized-html
tag="td" tag="td"
@ -276,7 +276,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.ArtistDetail.activityHeader') }}&nbsp; {{ $t('views.admin.library.ArtistDetail.header.activity') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -296,7 +296,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.ArtistDetail.firstSeenLabel') }} {{ $t('views.admin.library.ArtistDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="object.creation_date" /> <human-date :date="object.creation_date" />
@ -304,7 +304,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.ArtistDetail.listeningsLabel') }} {{ $t('views.admin.library.ArtistDetail.table.activity.listenings') }}
</td> </td>
<td> <td>
{{ stats.listenings }} {{ stats.listenings }}
@ -312,7 +312,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.ArtistDetail.favoritedLabel') }} {{ $t('views.admin.library.ArtistDetail.table.activity.favorited') }}
</td> </td>
<td> <td>
{{ stats.track_favorites }} {{ stats.track_favorites }}
@ -320,7 +320,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.ArtistDetail.playlistsLabel') }} {{ $t('views.admin.library.ArtistDetail.table.activity.playlists') }}
</td> </td>
<td> <td>
{{ stats.playlists }} {{ stats.playlists }}
@ -329,7 +329,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `artist:${object.id}`) }}"> <router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `artist:${object.id}`) }}">
{{ $t('views.admin.library.ArtistDetail.linkedReportsLabel') }} {{ $t('views.admin.library.ArtistDetail.link.reports') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -339,7 +339,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.edits', query: {q: getQuery('target', 'artist ' + object.id)}}"> <router-link :to="{name: 'manage.library.edits', query: {q: getQuery('target', 'artist ' + object.id)}}">
{{ $t('views.admin.library.ArtistDetail.editsLabel') }} {{ $t('views.admin.library.ArtistDetail.link.edits') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -355,7 +355,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.ArtistDetail.audioContentHeader') }}&nbsp; {{ $t('views.admin.library.ArtistDetail.header.audioContent') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -375,7 +375,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.ArtistDetail.cachedSizeLabel') }} {{ $t('views.admin.library.ArtistDetail.table.audioContent.cachedSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_downloaded_size) }} {{ humanSize(stats.media_downloaded_size) }}
@ -383,7 +383,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.ArtistDetail.totalSizeLabel') }} {{ $t('views.admin.library.ArtistDetail.table.audioContent.totalSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_total_size) }} {{ humanSize(stats.media_total_size) }}
@ -393,7 +393,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('artist_id', object.id) }}"> <router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('artist_id', object.id) }}">
{{ $t('views.admin.library.ArtistDetail.librariesLabel') }} {{ $t('views.admin.library.ArtistDetail.link.libraries') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -403,7 +403,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('artist_id', object.id) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('artist_id', object.id) }}">
{{ $t('views.admin.library.ArtistDetail.uploadsLabel') }} {{ $t('views.admin.library.ArtistDetail.link.uploads') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -413,7 +413,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.albums', query: {q: getQuery('artist_id', object.id) }}"> <router-link :to="{name: 'manage.library.albums', query: {q: getQuery('artist_id', object.id) }}">
{{ $t('views.admin.library.ArtistDetail.albumsLabel') }} {{ $t('views.admin.library.ArtistDetail.link.albums') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -423,7 +423,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('artist_id', object.id) }}"> <router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('artist_id', object.id) }}">
{{ $t('views.admin.library.ArtistDetail.tracksLabel') }} {{ $t('views.admin.library.ArtistDetail.link.tracks') }}
</router-link> </router-link>
</td> </td>
<td> <td>

18
front/src/views/admin/library/Base.vue
View File

@ -5,7 +5,7 @@ import { useI18n } from 'vue-i18n'
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
title: t('views.admin.library.Base.title'), title: t('views.admin.library.Base.title'),
secondaryMenu: t('views.admin.library.Base.secondaryMenu') secondaryMenu: t('views.admin.library.Base.menu.secondary')
})) }))
</script> </script>
@ -23,49 +23,49 @@ const labels = computed(() => ({
class="ui item" class="ui item"
:to="{name: 'manage.library.edits'}" :to="{name: 'manage.library.edits'}"
> >
{{ $t('views.admin.library.Base.editsLink') }} {{ $t('views.admin.library.Base.link.edits') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.channels'}" :to="{name: 'manage.channels'}"
> >
{{ $t('views.admin.library.Base.channelsLink') }} {{ $t('views.admin.library.Base.link.channels') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.library.artists'}" :to="{name: 'manage.library.artists'}"
> >
{{ $t('views.admin.library.Base.artistsLink') }} {{ $t('views.admin.library.Base.link.artists') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.library.albums'}" :to="{name: 'manage.library.albums'}"
> >
{{ $t('views.admin.library.Base.albumsLink') }} {{ $t('views.admin.library.Base.link.albums') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.library.tracks'}" :to="{name: 'manage.library.tracks'}"
> >
{{ $t('views.admin.library.Base.tracksLink') }} {{ $t('views.admin.library.Base.link.tracks') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.library.libraries'}" :to="{name: 'manage.library.libraries'}"
> >
{{ $t('views.admin.library.Base.librariesLink') }} {{ $t('views.admin.library.Base.link.libraries') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.library.uploads'}" :to="{name: 'manage.library.uploads'}"
> >
{{ $t('views.admin.library.Base.uploadsLink') }} {{ $t('views.admin.library.Base.link.uploads') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.library.tags'}" :to="{name: 'manage.library.tags'}"
> >
{{ $t('views.admin.library.Base.tagsLink') }} {{ $t('views.admin.library.Base.link.tags') }}
</router-link> </router-link>
</nav> </nav>
<router-view :key="$route.fullPath" /> <router-view :key="$route.fullPath" />

2
front/src/views/admin/library/EditsList.vue
View File

@ -26,7 +26,7 @@ const labels = computed(() => ({
:default-query="defaultQuery" :default-query="defaultQuery"
> >
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.admin.library.EditsList.libraryEditsHeader') }} {{ $t('views.admin.library.EditsList.header.edits') }}
</h2> </h2>
</edits-card-list> </edits-card-list>
</section> </section>

52
front/src/views/admin/library/LibraryDetail.vue
View File

@ -27,7 +27,7 @@ const router = useRouter()
const logger = useLogger() const logger = useLogger()
const labels = computed(() => ({ const labels = computed(() => ({
statsWarning: t('views.admin.library.LibraryDetail.statsWarning') statsWarning: t('views.admin.library.LibraryDetail.warning.stats')
})) }))
const isLoading = ref(false) const isLoading = ref(false)
@ -117,7 +117,7 @@ const updateObj = async (attr: string) => {
<template v-if="object.is_local"> <template v-if="object.is_local">
<span class="ui tiny accent label"> <span class="ui tiny accent label">
<i class="home icon" /> <i class="home icon" />
{{ $t('views.admin.library.LibraryDetail.localLabel') }} {{ $t('views.admin.library.LibraryDetail.header.local') }}
</span> </span>
&nbsp; &nbsp;
</template> </template>
@ -134,7 +134,7 @@ const updateObj = async (attr: string) => {
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.library.LibraryDetail.djangoLink') }} {{ $t('views.admin.library.LibraryDetail.link.django') }}
</a> </a>
<button <button
v-dropdown v-dropdown
@ -150,7 +150,7 @@ const updateObj = async (attr: string) => {
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.library.LibraryDetail.djangoLink') }} {{ $t('views.admin.library.LibraryDetail.link.django') }}
</a> </a>
<a <a
class="basic item" class="basic item"
@ -159,7 +159,7 @@ const updateObj = async (attr: string) => {
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.library.LibraryDetail.remoteProfileLink') }} {{ $t('views.admin.library.LibraryDetail.link.remoteProfile') }}
</a> </a>
</div> </div>
</button> </button>
@ -169,22 +169,22 @@ const updateObj = async (attr: string) => {
:class="['ui', {loading: isLoading}, 'basic danger button']" :class="['ui', {loading: isLoading}, 'basic danger button']"
:action="remove" :action="remove"
> >
{{ $t('views.admin.library.LibraryDetail.deleteButton') }} {{ $t('views.admin.library.LibraryDetail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.admin.library.LibraryDetail.deleteModalHeader') }} {{ $t('views.admin.library.LibraryDetail.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.admin.library.LibraryDetail.deleteModalMessage') }} {{ $t('views.admin.library.LibraryDetail.modal.delete.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.admin.library.LibraryDetail.deleteButton') }} {{ $t('views.admin.library.LibraryDetail.button.delete') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -201,14 +201,14 @@ const updateObj = async (attr: string) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.LibraryDetail.libraryDataHeader') }} {{ $t('views.admin.library.LibraryDetail.header.libraryData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.LibraryDetail.nameLabel') }} {{ $t('views.admin.library.LibraryDetail.table.library.name') }}
</td> </td>
<td> <td>
{{ object.name }} {{ object.name }}
@ -217,7 +217,7 @@ const updateObj = async (attr: string) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('privacy_level', object.privacy_level) }}"> <router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('privacy_level', object.privacy_level) }}">
{{ $t('views.admin.library.LibraryDetail.visibilityLabel') }} {{ $t('views.admin.library.LibraryDetail.link.visibility') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -244,7 +244,7 @@ const updateObj = async (attr: string) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.accounts.detail', params: {id: object.actor.full_username }}"> <router-link :to="{name: 'manage.moderation.accounts.detail', params: {id: object.actor.full_username }}">
{{ $t('views.admin.library.LibraryDetail.accountLabel') }} {{ $t('views.admin.library.LibraryDetail.link.account') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -254,7 +254,7 @@ const updateObj = async (attr: string) => {
<tr v-if="!object.is_local"> <tr v-if="!object.is_local">
<td> <td>
<router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}"> <router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}">
{{ $t('views.admin.library.LibraryDetail.domainLabel') }} {{ $t('views.admin.library.LibraryDetail.link.domain') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -263,7 +263,7 @@ const updateObj = async (attr: string) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.LibraryDetail.descriptionLabel') }} {{ $t('views.admin.library.LibraryDetail.table.library.description') }}
</td> </td>
<td> <td>
{{ object.description }} {{ object.description }}
@ -278,7 +278,7 @@ const updateObj = async (attr: string) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.LibraryDetail.activityHeader') }}&nbsp; {{ $t('views.admin.library.LibraryDetail.header.activity') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -298,7 +298,7 @@ const updateObj = async (attr: string) => {
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.LibraryDetail.firstSeenLabel') }} {{ $t('views.admin.library.LibraryDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="object.creation_date" /> <human-date :date="object.creation_date" />
@ -306,7 +306,7 @@ const updateObj = async (attr: string) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.LibraryDetail.followersLabel') }} {{ $t('views.admin.library.LibraryDetail.table.activity.followers') }}
</td> </td>
<td> <td>
{{ stats.followers }} {{ stats.followers }}
@ -315,7 +315,7 @@ const updateObj = async (attr: string) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `library:${object.uuid}`) }}"> <router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `library:${object.uuid}`) }}">
{{ $t('views.admin.library.LibraryDetail.linkedReportsLabel') }} {{ $t('views.admin.library.LibraryDetail.link.reports') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -331,7 +331,7 @@ const updateObj = async (attr: string) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.LibraryDetail.audioContentHeader') }}&nbsp; {{ $t('views.admin.library.LibraryDetail.header.audioContent') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -351,7 +351,7 @@ const updateObj = async (attr: string) => {
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.LibraryDetail.cachedSizeLabel') }} {{ $t('views.admin.library.LibraryDetail.table.audioContent.cachedSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_downloaded_size) }} {{ humanSize(stats.media_downloaded_size) }}
@ -359,7 +359,7 @@ const updateObj = async (attr: string) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.LibraryDetail.totalSizeLabel') }} {{ $t('views.admin.library.LibraryDetail.table.audioContent.totalSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_total_size) }} {{ humanSize(stats.media_total_size) }}
@ -368,7 +368,7 @@ const updateObj = async (attr: string) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.artists', query: {q: getQuery('library_id', object.id) }}"> <router-link :to="{name: 'manage.library.artists', query: {q: getQuery('library_id', object.id) }}">
{{ $t('views.admin.library.LibraryDetail.artistsLabel') }} {{ $t('views.admin.library.LibraryDetail.link.artists') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -378,7 +378,7 @@ const updateObj = async (attr: string) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.albums', query: {q: getQuery('library_id', object.id) }}"> <router-link :to="{name: 'manage.library.albums', query: {q: getQuery('library_id', object.id) }}">
{{ $t('views.admin.library.LibraryDetail.albumsLabel') }} {{ $t('views.admin.library.LibraryDetail.link.albums') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -388,7 +388,7 @@ const updateObj = async (attr: string) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('library_id', object.id) }}"> <router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('library_id', object.id) }}">
{{ $t('views.admin.library.LibraryDetail.tracksLabel') }} {{ $t('views.admin.library.LibraryDetail.link.tracks') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -398,7 +398,7 @@ const updateObj = async (attr: string) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('library_id', object.id) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('library_id', object.id) }}">
{{ $t('views.admin.library.LibraryDetail.uploadsLabel') }} {{ $t('views.admin.library.LibraryDetail.link.uploads') }}
</router-link> </router-link>
</td> </td>
<td> <td>

28
front/src/views/admin/library/TagDetail.vue
View File

@ -77,7 +77,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:to="{name: 'library.tags.detail', params: {id: object.name }}" :to="{name: 'library.tags.detail', params: {id: object.name }}"
> >
<i class="info icon" /> <i class="info icon" />
{{ $t('views.admin.library.TagDetail.localProfileLink') }} {{ $t('views.admin.library.TagDetail.link.localProfile') }}
</router-link> </router-link>
<button <button
v-dropdown v-dropdown
@ -93,7 +93,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.library.TagDetail.djangoLink') }} {{ $t('views.admin.library.TagDetail.link.django') }}
</a> </a>
</div> </div>
</button> </button>
@ -103,22 +103,22 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:class="['ui', {loading: isLoading}, 'basic danger button']" :class="['ui', {loading: isLoading}, 'basic danger button']"
:action="remove" :action="remove"
> >
{{ $t('views.admin.library.TagDetail.deleteButton') }} {{ $t('views.admin.library.TagDetail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.admin.library.TagDetail.deleteModalHeader') }} {{ $t('views.admin.library.TagDetail.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.admin.library.TagDetail.deleteModalMessage') }} {{ $t('views.admin.library.TagDetail.modal.delete.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.admin.library.TagDetail.deleteButton') }} {{ $t('views.admin.library.TagDetail.button.delete') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -135,14 +135,14 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.TagDetail.tagDataHeader') }} {{ $t('views.admin.library.TagDetail.header.tagData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TagDetail.nameLabel') }} {{ $t('views.admin.library.TagDetail.table.tag.name') }}
</td> </td>
<td> <td>
{{ object.name }} {{ object.name }}
@ -157,14 +157,14 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.TagDetail.activityHeader') }}&nbsp; {{ $t('views.admin.library.TagDetail.header.activity') }}&nbsp;
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TagDetail.firstSeenLabel') }} {{ $t('views.admin.library.TagDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="object.creation_date" /> <human-date :date="object.creation_date" />
@ -179,7 +179,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.TagDetail.audioContentHeader') }}&nbsp; {{ $t('views.admin.library.TagDetail.header.audioContent') }}&nbsp;
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
@ -187,7 +187,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.artists', query: {q: getQuery('tag', object.name) }}"> <router-link :to="{name: 'manage.library.artists', query: {q: getQuery('tag', object.name) }}">
{{ $t('views.admin.library.TagDetail.artistsLabel') }} {{ $t('views.admin.library.TagDetail.link.artists') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -197,7 +197,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.albums', query: {q: getQuery('tag', object.name) }}"> <router-link :to="{name: 'manage.library.albums', query: {q: getQuery('tag', object.name) }}">
{{ $t('views.admin.library.TagDetail.albumsLabel') }} {{ $t('views.admin.library.TagDetail.link.albums') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -207,7 +207,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('tag', object.name) }}"> <router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('tag', object.name) }}">
{{ $t('views.admin.library.TagDetail.tracksLabel') }} {{ $t('views.admin.library.TagDetail.link.tracks') }}
</router-link> </router-link>
</td> </td>
<td> <td>

70
front/src/views/admin/library/TrackDetail.vue
View File

@ -19,7 +19,7 @@ const props = defineProps<Props>()
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
statsWarning: t('views.admin.library.TrackDetail.statsWarning') statsWarning: t('views.admin.library.TrackDetail.warning.stats')
})) }))
const track = ref() const track = ref()
@ -105,7 +105,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<template v-if="track.is_local"> <template v-if="track.is_local">
<span class="ui tiny accent label"> <span class="ui tiny accent label">
<i class="home icon" /> <i class="home icon" />
{{ $t('views.admin.library.TrackDetail.localLabel') }} {{ $t('views.admin.library.TrackDetail.header.local') }}
</span> </span>
&nbsp; &nbsp;
</template> </template>
@ -129,7 +129,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:to="{name: 'library.tracks.detail', params: {id: track.id }}" :to="{name: 'library.tracks.detail', params: {id: track.id }}"
> >
<i class="info icon" /> <i class="info icon" />
{{ $t('views.admin.library.TrackDetail.localProfileLink') }} {{ $t('views.admin.library.TrackDetail.link.localProfile') }}
</router-link> </router-link>
<button <button
v-dropdown v-dropdown
@ -145,7 +145,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.library.TrackDetail.djangoLink') }} {{ $t('views.admin.library.TrackDetail.link.django') }}
</a> </a>
<a <a
v-if="track.mbid" v-if="track.mbid"
@ -155,7 +155,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.library.TrackDetail.musicbrainzLink') }} {{ $t('views.admin.library.TrackDetail.link.musicbrainz') }}
</a> </a>
<fetch-button <fetch-button
v-if="!track.is_local" v-if="!track.is_local"
@ -164,7 +164,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
@refresh="fetchData" @refresh="fetchData"
> >
<i class="refresh icon" />&nbsp; <i class="refresh icon" />&nbsp;
{{ $t('views.admin.library.TrackDetail.remoteRefreshButton') }} {{ $t('views.admin.library.TrackDetail.button.remoteRefresh') }}
</fetch-button> </fetch-button>
<a <a
class="basic item" class="basic item"
@ -173,7 +173,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.library.TrackDetail.remoteProfileLink') }} {{ $t('views.admin.library.TrackDetail.link.remoteProfile') }}
</a> </a>
</div> </div>
</button> </button>
@ -185,7 +185,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
class="ui labeled icon button" class="ui labeled icon button"
> >
<i class="edit icon" /> <i class="edit icon" />
{{ $t('views.admin.library.TrackDetail.editButton') }} {{ $t('views.admin.library.TrackDetail.button.edit') }}
</router-link> </router-link>
</div> </div>
<div class="ui buttons"> <div class="ui buttons">
@ -193,22 +193,22 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
:class="['ui', {loading: isLoading}, 'basic danger button']" :class="['ui', {loading: isLoading}, 'basic danger button']"
:action="remove" :action="remove"
> >
{{ $t('views.admin.library.TrackDetail.deleteButton') }} {{ $t('views.admin.library.TrackDetail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.admin.library.TrackDetail.deleteModalHeader') }} {{ $t('views.admin.library.TrackDetail.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.admin.library.TrackDetail.deleteModalMessage') }} {{ $t('views.admin.library.TrackDetail.modal.delete.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.admin.library.TrackDetail.deleteButton') }} {{ $t('views.admin.library.TrackDetail.button.delete') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -225,14 +225,14 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.TrackDetail.trackDataHeader') }} {{ $t('views.admin.library.TrackDetail.header.trackData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TrackDetail.titleLabel') }} {{ $t('views.admin.library.TrackDetail.table.track.title') }}
</td> </td>
<td> <td>
{{ track.title }} {{ track.title }}
@ -241,7 +241,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr v-if="track.album"> <tr v-if="track.album">
<td> <td>
<router-link :to="{name: 'manage.library.albums.detail', params: {id: track.album.id }}"> <router-link :to="{name: 'manage.library.albums.detail', params: {id: track.album.id }}">
{{ $t('views.admin.library.TrackDetail.albumLabel') }} {{ $t('views.admin.library.TrackDetail.link.album') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -252,7 +252,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.artists.detail', params: {id: track.artist.id }}"> <router-link :to="{name: 'manage.library.artists.detail', params: {id: track.artist.id }}">
{{ $t('views.admin.library.TrackDetail.artistLabel') }} {{ $t('views.admin.library.TrackDetail.link.artist') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -262,7 +262,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr v-if="track.album"> <tr v-if="track.album">
<td> <td>
<router-link :to="{name: 'manage.library.artists.detail', params: {id: track.album.artist.id }}"> <router-link :to="{name: 'manage.library.artists.detail', params: {id: track.album.artist.id }}">
{{ $t('views.admin.library.TrackDetail.albumArtistLabel') }} {{ $t('views.admin.library.TrackDetail.link.albumArtist') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -271,7 +271,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TrackDetail.positionLabel') }} {{ $t('views.admin.library.TrackDetail.table.track.position') }}
</td> </td>
<td> <td>
{{ track.position }} {{ track.position }}
@ -279,7 +279,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr v-if="track.disc_number"> <tr v-if="track.disc_number">
<td> <td>
{{ $t('views.admin.library.TrackDetail.discNumberLabel') }} {{ $t('views.admin.library.TrackDetail.table.track.discNumber') }}
</td> </td>
<td> <td>
{{ track.disc_number }} {{ track.disc_number }}
@ -287,13 +287,13 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr v-if="track.copyright"> <tr v-if="track.copyright">
<td> <td>
{{ $t('views.admin.library.TrackDetail.copyrightLabel') }} {{ $t('views.admin.library.TrackDetail.table.track.copyright') }}
</td> </td>
<td>{{ track.copyright }}</td> <td>{{ track.copyright }}</td>
</tr> </tr>
<tr v-if="track.license"> <tr v-if="track.license">
<td> <td>
{{ $t('views.admin.library.TrackDetail.licenseLabel') }} {{ $t('views.admin.library.TrackDetail.table.track.license') }}
</td> </td>
<td> <td>
<router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('license', track.license)}}"> <router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('license', track.license)}}">
@ -304,7 +304,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr v-if="!track.is_local"> <tr v-if="!track.is_local">
<td> <td>
<router-link :to="{name: 'manage.moderation.domains.detail', params: {id: track.domain }}"> <router-link :to="{name: 'manage.moderation.domains.detail', params: {id: track.domain }}">
{{ $t('views.admin.library.TrackDetail.domainLabel') }} {{ $t('views.admin.library.TrackDetail.link.domain') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -313,7 +313,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr v-if="track.description"> <tr v-if="track.description">
<td> <td>
{{ $t('views.admin.library.TrackDetail.descriptionLabel') }} {{ $t('views.admin.library.TrackDetail.table.track.description') }}
</td> </td>
<sanitized-html <sanitized-html
tag="td" tag="td"
@ -329,7 +329,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.TrackDetail.activityHeader') }}&nbsp; {{ $t('views.admin.library.TrackDetail.header.activity') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -349,7 +349,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TrackDetail.firstSeenLabel') }} {{ $t('views.admin.library.TrackDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="track.creation_date" /> <human-date :date="track.creation_date" />
@ -357,7 +357,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TrackDetail.listeningsLabel') }} {{ $t('views.admin.library.TrackDetail.table.activity.listenings') }}
</td> </td>
<td> <td>
{{ stats.listenings }} {{ stats.listenings }}
@ -365,7 +365,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TrackDetail.favoritedLabel') }} {{ $t('views.admin.library.TrackDetail.table.activity.favorited') }}
</td> </td>
<td> <td>
{{ stats.track_favorites }} {{ stats.track_favorites }}
@ -373,7 +373,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TrackDetail.playlistsLabel') }} {{ $t('views.admin.library.TrackDetail.table.activity.playlists') }}
</td> </td>
<td> <td>
{{ stats.playlists }} {{ stats.playlists }}
@ -382,7 +382,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `track:${track.id}`) }}"> <router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `track:${track.id}`) }}">
{{ $t('views.admin.library.TrackDetail.linkedReportsLabel') }} {{ $t('views.admin.library.TrackDetail.link.reports') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -392,7 +392,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.edits', query: {q: getQuery('target', 'track ' + track.id)}}"> <router-link :to="{name: 'manage.library.edits', query: {q: getQuery('target', 'track ' + track.id)}}">
{{ $t('views.admin.library.TrackDetail.editsLabel') }} {{ $t('views.admin.library.TrackDetail.link.edits') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -408,7 +408,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.TrackDetail.trackDataHeader') }}&nbsp; {{ $t('views.admin.library.TrackDetail.header.trackData') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -428,7 +428,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TrackDetail.cachedSizeLabel') }} {{ $t('views.admin.library.TrackDetail.table.trackData.cachedSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_downloaded_size) }} {{ humanSize(stats.media_downloaded_size) }}
@ -436,7 +436,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.TrackDetail.totalSizeLabel') }} {{ $t('views.admin.library.TrackDetail.table.trackData.totalSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_total_size) }} {{ humanSize(stats.media_total_size) }}
@ -446,7 +446,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('track_id', track.id) }}"> <router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('track_id', track.id) }}">
{{ $t('views.admin.library.TrackDetail.librariesLabel') }} {{ $t('views.admin.library.TrackDetail.link.libraries') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -456,7 +456,7 @@ const getQuery = (field: string, value: string) => `${field}:"${value}"`
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('track_id', track.id) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('track_id', track.id) }}">
{{ $t('views.admin.library.TrackDetail.uploadsLabel') }} {{ $t('views.admin.library.TrackDetail.link.uploads') }}
</router-link> </router-link>
</td> </td>
<td> <td>

54
front/src/views/admin/library/UploadDetail.vue
View File

@ -89,7 +89,7 @@ const showUploadDetailModal = ref(false)
<template v-if="object.is_local"> <template v-if="object.is_local">
<span class="ui tiny accent label"> <span class="ui tiny accent label">
<i class="home icon" /> <i class="home icon" />
{{ $t('views.admin.library.UploadDetail.localLabel') }} {{ $t('views.admin.library.UploadDetail.header.local') }}
</span> </span>
&nbsp; &nbsp;
</template> </template>
@ -106,7 +106,7 @@ const showUploadDetailModal = ref(false)
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.library.UploadDetail.djangoLink') }} {{ $t('views.admin.library.UploadDetail.link.django') }}
</a> </a>
<button <button
v-dropdown v-dropdown
@ -122,7 +122,7 @@ const showUploadDetailModal = ref(false)
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.library.UploadDetail.djangoLink') }} {{ $t('views.admin.library.UploadDetail.link.django') }}
</a> </a>
<a <a
class="basic item" class="basic item"
@ -131,7 +131,7 @@ const showUploadDetailModal = ref(false)
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.library.UploadDetail.remoteProfileLink') }} {{ $t('views.admin.library.UploadDetail.link.remoteProfile') }}
</a> </a>
</div> </div>
</button> </button>
@ -145,7 +145,7 @@ const showUploadDetailModal = ref(false)
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="download icon" /> <i class="download icon" />
{{ $t('views.admin.library.UploadDetail.downloadButton') }} {{ $t('views.admin.library.UploadDetail.button.download') }}
</a> </a>
</div> </div>
<div class="ui buttons"> <div class="ui buttons">
@ -153,22 +153,22 @@ const showUploadDetailModal = ref(false)
:class="['ui', {loading: isLoading}, 'basic danger button']" :class="['ui', {loading: isLoading}, 'basic danger button']"
:action="remove" :action="remove"
> >
{{ $t('views.admin.library.UploadDetail.deleteButton') }} {{ $t('views.admin.library.UploadDetail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.admin.library.UploadDetail.deleteModalHeader') }} {{ $t('views.admin.library.UploadDetail.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.admin.library.UploadDetail.deleteModalMessage') }} {{ $t('views.admin.library.UploadDetail.modal.delete.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.admin.library.UploadDetail.deleteButton') }} {{ $t('views.admin.library.UploadDetail.button.delete') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -185,14 +185,14 @@ const showUploadDetailModal = ref(false)
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.UploadDetail.uploadDataHeader') }} {{ $t('views.admin.library.UploadDetail.header.uploadData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.UploadDetail.nameLabel') }} {{ $t('views.admin.library.UploadDetail.table.upload.name') }}
</td> </td>
<td> <td>
{{ displayName(object) }} {{ displayName(object) }}
@ -201,7 +201,7 @@ const showUploadDetailModal = ref(false)
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('privacy_level', object.library.privacy_level) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('privacy_level', object.library.privacy_level) }}">
{{ $t('views.admin.library.UploadDetail.visibilityLabel') }} {{ $t('views.admin.library.UploadDetail.link.visibility') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -211,7 +211,7 @@ const showUploadDetailModal = ref(false)
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.accounts.detail', params: {id: object.library.actor.full_username }}"> <router-link :to="{name: 'manage.moderation.accounts.detail', params: {id: object.library.actor.full_username }}">
{{ $t('views.admin.library.UploadDetail.accountLabel') }} {{ $t('views.admin.library.UploadDetail.link.account') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -221,7 +221,7 @@ const showUploadDetailModal = ref(false)
<tr v-if="!object.is_local"> <tr v-if="!object.is_local">
<td> <td>
<router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}"> <router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}">
{{ $t('views.admin.library.UploadDetail.domainLabel') }} {{ $t('views.admin.library.UploadDetail.link.domain') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -231,7 +231,7 @@ const showUploadDetailModal = ref(false)
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('status', object.import_status) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('status', object.import_status) }}">
{{ $t('views.admin.library.UploadDetail.importStatusLabel') }} {{ $t('views.admin.library.UploadDetail.link.importStatus') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -248,7 +248,7 @@ const showUploadDetailModal = ref(false)
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.libraries.detail', params: {id: object.library.uuid }}"> <router-link :to="{name: 'manage.library.libraries.detail', params: {id: object.library.uuid }}">
{{ $t('views.admin.library.UploadDetail.libraryLabel') }} {{ $t('views.admin.library.UploadDetail.link.library') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -264,14 +264,14 @@ const showUploadDetailModal = ref(false)
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.UploadDetail.activityHeader') }}&nbsp; {{ $t('views.admin.library.UploadDetail.header.activity') }}&nbsp;
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.UploadDetail.firstSeenLabel') }} {{ $t('views.admin.library.UploadDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="object.creation_date" /> <human-date :date="object.creation_date" />
@ -279,7 +279,7 @@ const showUploadDetailModal = ref(false)
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.UploadDetail.accessedDateLabel') }} {{ $t('views.admin.library.UploadDetail.table.activity.accessedDate') }}
</td> </td>
<td> <td>
<human-date <human-date
@ -302,7 +302,7 @@ const showUploadDetailModal = ref(false)
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.library.UploadDetail.audioContentHeader') }}&nbsp; {{ $t('views.admin.library.UploadDetail.header.audioContent') }}&nbsp;
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
@ -310,7 +310,7 @@ const showUploadDetailModal = ref(false)
<tr v-if="object.track"> <tr v-if="object.track">
<td> <td>
<router-link :to="{name: 'manage.library.tracks.detail', params: {id: object.track.id }}"> <router-link :to="{name: 'manage.library.tracks.detail', params: {id: object.track.id }}">
{{ $t('views.admin.library.UploadDetail.trackLabel') }} {{ $t('views.admin.library.UploadDetail.table.audioContent.track') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -319,7 +319,7 @@ const showUploadDetailModal = ref(false)
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.UploadDetail.cachedSizeLabel') }} {{ $t('views.admin.library.UploadDetail.table.audioContent.cachedSize') }}
</td> </td>
<td> <td>
<template v-if="object.audio_file"> <template v-if="object.audio_file">
@ -334,7 +334,7 @@ const showUploadDetailModal = ref(false)
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.UploadDetail.sizeLabel') }} {{ $t('views.admin.library.UploadDetail.table.audioContent.size') }}
</td> </td>
<td> <td>
{{ humanSize(object.size) }} {{ humanSize(object.size) }}
@ -342,11 +342,11 @@ const showUploadDetailModal = ref(false)
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.UploadDetail.bitrateLabel') }} {{ $t('views.admin.library.UploadDetail.table.audioContent.bitrate.label') }}
</td> </td>
<td> <td>
<template v-if="object.bitrate"> <template v-if="object.bitrate">
{{ $t('views.admin.library.UploadDetail.bitrateValue', {bitrate: humanSize(object.bitrate)}) }} {{ $t('views.admin.library.UploadDetail.table.audioContent.bitrate.value', {bitrate: humanSize(object.bitrate)}) }}
</template> </template>
<span <span
v-else v-else
@ -357,7 +357,7 @@ const showUploadDetailModal = ref(false)
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.library.UploadDetail.durationLabel') }} {{ $t('views.admin.library.UploadDetail.table.audioContent.duration') }}
</td> </td>
<td> <td>
<template v-if="object.duration"> <template v-if="object.duration">
@ -373,7 +373,7 @@ const showUploadDetailModal = ref(false)
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('type', object.mimetype) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('type', object.mimetype) }}">
{{ $t('views.admin.library.UploadDetail.typeLabel') }} {{ $t('views.admin.library.UploadDetail.link.type') }}
</router-link> </router-link>
</td> </td>
<td> <td>

94
front/src/views/admin/moderation/AccountsDetail.vue
View File

@ -26,14 +26,14 @@ const { t } = useI18n()
const logger = useLogger() const logger = useLogger()
const labels = computed(() => ({ const labels = computed(() => ({
statsWarning: t('views.admin.moderation.AccountsDetail.statsWarning'), statsWarning: t('views.admin.moderation.AccountsDetail.warning.stats'),
uploadQuota: t('views.admin.moderation.AccountsDetail.uploadQuota') uploadQuota: t('views.admin.moderation.AccountsDetail.tooltip.uploadQuota')
})) }))
const allPermissions = computed(() => [ const allPermissions = computed(() => [
{ code: 'library', label: t('views.admin.moderation.AccountsDetail.libraryPermission') }, { code: 'library', label: t('views.admin.moderation.AccountsDetail.option.permission.library') },
{ code: 'moderation', label: t('views.admin.moderation.AccountsDetail.moderationPermission') }, { code: 'moderation', label: t('views.admin.moderation.AccountsDetail.option.permission.moderation') },
{ code: 'settings', label: t('views.admin.moderation.AccountsDetail.settingsPermission') } { code: 'settings', label: t('views.admin.moderation.AccountsDetail.option.permission.settings') }
]) ])
const isLoadingPolicy = ref(false) const isLoadingPolicy = ref(false)
@ -167,7 +167,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<template v-if="object.user"> <template v-if="object.user">
<span class="ui tiny accent label"> <span class="ui tiny accent label">
<i class="home icon" /> <i class="home icon" />
{{ $t('views.admin.moderation.AccountsDetail.localAccountLabel') }} {{ $t('views.admin.moderation.AccountsDetail.header.localAccount') }}
</span> </span>
&nbsp; &nbsp;
</template> </template>
@ -176,7 +176,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
> >
{{ $t('views.admin.moderation.AccountsDetail.openProfileLink') }}&nbsp; {{ $t('views.admin.moderation.AccountsDetail.link.openProfile') }}&nbsp;
<i class="external icon" /> <i class="external icon" />
</a> </a>
</div> </div>
@ -192,7 +192,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.moderation.AccountsDetail.djangoLink') }}&nbsp; {{ $t('views.admin.moderation.AccountsDetail.link.django') }}&nbsp;
</a> </a>
<a <a
v-else-if="$store.state.auth.profile && $store.state.auth.profile.is_superuser" v-else-if="$store.state.auth.profile && $store.state.auth.profile.is_superuser"
@ -202,7 +202,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.moderation.AccountsDetail.djangoLink') }}&nbsp; {{ $t('views.admin.moderation.AccountsDetail.link.django') }}&nbsp;
</a> </a>
<button <button
v-dropdown v-dropdown
@ -217,7 +217,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.admin.moderation.AccountsDetail.remoteProfileLink') }}&nbsp; {{ $t('views.admin.moderation.AccountsDetail.link.remoteProfile') }}&nbsp;
</a> </a>
</div> </div>
</button> </button>
@ -243,17 +243,17 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<header class="ui header"> <header class="ui header">
<h3> <h3>
<i class="shield icon" /> <i class="shield icon" />
{{ $t('views.admin.moderation.AccountsDetail.noPolicyHeader') }} {{ $t('views.admin.moderation.AccountsDetail.header.noPolicy') }}
</h3> </h3>
</header> </header>
<p> <p>
{{ $t('views.admin.moderation.AccountsDetail.policyDescription') }} {{ $t('views.admin.moderation.AccountsDetail.description.policy') }}
</p> </p>
<button <button
class="ui primary button" class="ui primary button"
@click="showPolicyForm = true" @click="showPolicyForm = true"
> >
{{ $t('views.admin.moderation.AccountsDetail.addPolicyButton') }} {{ $t('views.admin.moderation.AccountsDetail.button.addPolicy') }}
</button> </button>
</template> </template>
<instance-policy-card <instance-policy-card
@ -263,7 +263,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
> >
<header class="ui header"> <header class="ui header">
<h3> <h3>
{{ $t('views.admin.moderation.AccountsDetail.activePolicyHeader') }} {{ $t('views.admin.moderation.AccountsDetail.header.activePolicy') }}
</h3> </h3>
</header> </header>
</instance-policy-card> </instance-policy-card>
@ -287,14 +287,14 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.moderation.AccountsDetail.accountDataHeader') }} {{ $t('views.admin.moderation.AccountsDetail.header.accountData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.usernameLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.username') }}
</td> </td>
<td> <td>
{{ object.preferred_username }} {{ object.preferred_username }}
@ -303,7 +303,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<tr v-if="!object.user"> <tr v-if="!object.user">
<td> <td>
<router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}"> <router-link :to="{name: 'manage.moderation.domains.detail', params: {id: object.domain }}">
{{ $t('views.admin.moderation.AccountsDetail.domainLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.domain') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -312,7 +312,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.displayNameLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.displayName') }}
</td> </td>
<td> <td>
{{ object.name }} {{ object.name }}
@ -320,7 +320,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr v-if="object.user"> <tr v-if="object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.emailLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.email') }}
</td> </td>
<td> <td>
{{ object.user.email }} {{ object.user.email }}
@ -328,7 +328,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr v-if="object.user"> <tr v-if="object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.loginStatusLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.loginStatus.label') }}
</td> </td>
<td> <td>
<div <div
@ -344,27 +344,27 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<label for="is-active"> <label for="is-active">
<span <span
v-if="object.user.is_active" v-if="object.user.is_active"
>{{ $t('views.admin.moderation.AccountsDetail.enabledStatus') }}</span> >{{ $t('views.admin.moderation.AccountsDetail.table.accountData.loginStatus.enabled') }}</span>
<span <span
v-else v-else
>{{ $t('views.admin.moderation.AccountsDetail.disabledStatus') }}</span> >{{ $t('views.admin.moderation.AccountsDetail.table.accountData.loginStatus.disabled') }}</span>
</label> </label>
</div> </div>
<span <span
v-else-if="object.user.is_active" v-else-if="object.user.is_active"
> >
{{ $t('views.admin.moderation.AccountsDetail.enabledStatus') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.loginStatus.enabled') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.admin.moderation.AccountsDetail.disabledStatus') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.loginStatus.disabled') }}
</span> </span>
</td> </td>
</tr> </tr>
<tr v-if="object.user"> <tr v-if="object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.permissionsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.permissions') }}
</td> </td>
<td> <td>
<select <select
@ -386,7 +386,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.userTypeLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.userType') }}
</td> </td>
<td> <td>
{{ object.type }} {{ object.type }}
@ -394,7 +394,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr v-if="!object.user"> <tr v-if="!object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.lastCheckedLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.lastChecked') }}
</td> </td>
<td> <td>
<human-date <human-date
@ -410,7 +410,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr v-if="object.user"> <tr v-if="object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.signupDateLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.signupDate') }}
</td> </td>
<td> <td>
<human-date :date="object.user.date_joined" /> <human-date :date="object.user.date_joined" />
@ -418,7 +418,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr v-if="object.user"> <tr v-if="object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.lastActivityLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.accountData.lastActivity') }}
</td> </td>
<td> <td>
<human-date :date="object.user.last_activity" /> <human-date :date="object.user.last_activity" />
@ -433,7 +433,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.moderation.AccountsDetail.activityHeader') }}&nbsp; {{ $t('views.admin.moderation.AccountsDetail.header.activity') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -453,7 +453,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<tbody> <tbody>
<tr v-if="!object.user"> <tr v-if="!object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.firstSeenLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="object.creation_date" /> <human-date :date="object.creation_date" />
@ -461,7 +461,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.emittedMessagesLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.activity.emittedMessages') }}
</td> </td>
<td> <td>
{{ stats.outbox_activities }} {{ stats.outbox_activities }}
@ -469,7 +469,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.receivedFollowsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.activity.receivedFollows') }}
</td> </td>
<td> <td>
{{ stats.received_library_follows }} {{ stats.received_library_follows }}
@ -477,7 +477,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.emittedFollowsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.activity.emittedFollows') }}
</td> </td>
<td> <td>
{{ stats.emitted_library_follows }} {{ stats.emitted_library_follows }}
@ -486,7 +486,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `account:${object.full_username}`) }}"> <router-link :to="{name: 'manage.moderation.reports.list', query: {q: getQuery('target', `account:${object.full_username}`) }}">
{{ $t('views.admin.moderation.AccountsDetail.linkedReportsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.linkedReports') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -496,7 +496,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.moderation.requests.list', query: {q: getQuery('submitter', `${object.full_username}`) }}"> <router-link :to="{name: 'manage.moderation.requests.list', query: {q: getQuery('submitter', `${object.full_username}`) }}">
{{ $t('views.admin.moderation.AccountsDetail.requestsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.requests') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -512,7 +512,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.moderation.AccountsDetail.audioContentHeader') }}&nbsp; {{ $t('views.admin.moderation.AccountsDetail.header.audioContent') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -532,7 +532,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<tbody> <tbody>
<tr v-if="!object.user"> <tr v-if="!object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.cachedSizeLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.audioContent.cachedSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_downloaded_size) }} {{ humanSize(stats.media_downloaded_size) }}
@ -540,7 +540,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr v-if="object.user"> <tr v-if="object.user">
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.uploadQuotaLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.audioContent.uploadQuota') }}
<span :data-tooltip="labels.uploadQuota"><i class="question circle icon" /></span> <span :data-tooltip="labels.uploadQuota"><i class="question circle icon" /></span>
</td> </td>
<td> <td>
@ -553,7 +553,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
@change="updateUser('upload_quota', true)" @change="updateUser('upload_quota', true)"
> >
<div class="ui basic label"> <div class="ui basic label">
{{ $t('views.admin.moderation.AccountsDetail.megabyteLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.audioContent.megabyte') }}
</div> </div>
<action-feedback <action-feedback
class="ui basic label" class="ui basic label"
@ -565,7 +565,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.totalSizeLabel') }} {{ $t('views.admin.moderation.AccountsDetail.table.audioContent.totalSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_total_size) }} {{ humanSize(stats.media_total_size) }}
@ -574,7 +574,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.channels', query: {q: getQuery('account', object.full_username) }}"> <router-link :to="{name: 'manage.channels', query: {q: getQuery('account', object.full_username) }}">
{{ $t('views.admin.moderation.AccountsDetail.channelsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.channels') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -584,7 +584,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('account', object.full_username) }}"> <router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('account', object.full_username) }}">
{{ $t('views.admin.moderation.AccountsDetail.librariesLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.libraries') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -594,7 +594,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('account', object.full_username) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('account', object.full_username) }}">
{{ $t('views.admin.moderation.AccountsDetail.uploadsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.uploads') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -603,7 +603,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.artistsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.artists') }}
</td> </td>
<td> <td>
{{ stats.artists }} {{ stats.artists }}
@ -611,7 +611,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.albumsLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.albums') }}
</td> </td>
<td> <td>
{{ stats.albums }} {{ stats.albums }}
@ -619,7 +619,7 @@ const updatePolicy = (newPolicy: InstancePolicy) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.AccountsDetail.tracksLabel') }} {{ $t('views.admin.moderation.AccountsDetail.link.tracks') }}
</td> </td>
<td> <td>
{{ stats.tracks }} {{ stats.tracks }}

12
front/src/views/admin/moderation/Base.vue
View File

@ -9,8 +9,8 @@ const { t } = useI18n()
const allowListEnabled = ref(false) const allowListEnabled = ref(false)
const labels = computed(() => ({ const labels = computed(() => ({
moderation: t('views.admin.moderation.Base.moderation'), moderation: t('views.admin.moderation.Base.title'),
secondaryMenu: t('views.admin.moderation.Base.secondaryMenu') secondaryMenu: t('views.admin.moderation.Base.menu.secondary')
})) }))
const fetchNodeInfo = async () => { const fetchNodeInfo = async () => {
@ -35,7 +35,7 @@ fetchNodeInfo()
class="ui item" class="ui item"
:to="{name: 'manage.moderation.reports.list', query: {q: 'resolved:no'}}" :to="{name: 'manage.moderation.reports.list', query: {q: 'resolved:no'}}"
> >
{{ $t('views.admin.moderation.Base.reportsLink') }} {{ $t('views.admin.moderation.Base.link.reports') }}
<div <div
v-if="$store.state.ui.notifications.pendingReviewReports > 0" v-if="$store.state.ui.notifications.pendingReviewReports > 0"
:class="['ui', 'circular', 'mini', 'right floated', 'accent', 'label']" :class="['ui', 'circular', 'mini', 'right floated', 'accent', 'label']"
@ -47,7 +47,7 @@ fetchNodeInfo()
class="ui item" class="ui item"
:to="{name: 'manage.moderation.requests.list', query: {q: 'status:pending'}}" :to="{name: 'manage.moderation.requests.list', query: {q: 'status:pending'}}"
> >
{{ $t('views.admin.moderation.Base.userRequestsLink') }} {{ $t('views.admin.moderation.Base.link.userRequests') }}
<div <div
v-if="$store.state.ui.notifications.pendingReviewRequests > 0" v-if="$store.state.ui.notifications.pendingReviewRequests > 0"
:class="['ui', 'circular', 'mini', 'right floated', 'accent', 'label']" :class="['ui', 'circular', 'mini', 'right floated', 'accent', 'label']"
@ -59,13 +59,13 @@ fetchNodeInfo()
class="ui item" class="ui item"
:to="{name: 'manage.moderation.domains.list'}" :to="{name: 'manage.moderation.domains.list'}"
> >
{{ $t('views.admin.moderation.Base.domainsLink') }} {{ $t('views.admin.moderation.Base.link.domains') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.moderation.accounts.list'}" :to="{name: 'manage.moderation.accounts.list'}"
> >
{{ $t('views.admin.moderation.Base.accountsLink') }} {{ $t('views.admin.moderation.Base.link.accounts') }}
</router-link> </router-link>
</nav> </nav>
<router-view <router-view

72
front/src/views/admin/moderation/DomainsDetail.vue
View File

@ -23,7 +23,7 @@ const props = defineProps<Props>()
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
statsWarning: t('views.admin.moderation.DomainsDetail.statsWarning') statsWarning: t('views.admin.moderation.DomainsDetail.warning.stats')
})) }))
const isLoadingPolicy = ref(false) const isLoadingPolicy = ref(false)
@ -133,7 +133,7 @@ const setAllowList = async (value: boolean) => {
rel="noopener noreferrer" rel="noopener noreferrer"
class="logo-wrapper" class="logo-wrapper"
> >
{{ $t('views.admin.moderation.DomainsDetail.websiteLink') }}&nbsp; {{ $t('views.admin.moderation.DomainsDetail.link.website') }}&nbsp;
<i class="external icon" /> <i class="external icon" />
</a> </a>
</div> </div>
@ -149,7 +149,7 @@ const setAllowList = async (value: boolean) => {
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.admin.moderation.DomainsDetail.djangoLink') }}&nbsp; {{ $t('views.admin.moderation.DomainsDetail.link.django') }}&nbsp;
</a> </a>
</div> </div>
<div <div
@ -162,7 +162,7 @@ const setAllowList = async (value: boolean) => {
@click.prevent="setAllowList(false)" @click.prevent="setAllowList(false)"
> >
<i class="x icon" /> <i class="x icon" />
{{ $t('views.admin.moderation.DomainsDetail.removeFromAllowList') }} {{ $t('views.admin.moderation.DomainsDetail.button.removeFromAllowList') }}
</button> </button>
<button <button
v-else v-else
@ -170,7 +170,7 @@ const setAllowList = async (value: boolean) => {
@click.prevent="setAllowList(true)" @click.prevent="setAllowList(true)"
> >
<i class="check icon" /> <i class="check icon" />
{{ $t('views.admin.moderation.DomainsDetail.addToAllowList') }} {{ $t('views.admin.moderation.DomainsDetail.button.addToAllowList') }}
</button> </button>
</div> </div>
</div> </div>
@ -191,17 +191,17 @@ const setAllowList = async (value: boolean) => {
<header class="ui header"> <header class="ui header">
<h3> <h3>
<i class="shield icon" /> <i class="shield icon" />
{{ $t('views.admin.moderation.DomainsDetail.noPolicyHeader') }} {{ $t('views.admin.moderation.DomainsDetail.header.noPolicy') }}
</h3> </h3>
</header> </header>
<p> <p>
{{ $t('views.admin.moderation.DomainsDetail.policyDescription') }} {{ $t('views.admin.moderation.DomainsDetail.description.policy') }}
</p> </p>
<button <button
class="ui primary button" class="ui primary button"
@click="showPolicyForm = true" @click="showPolicyForm = true"
> >
{{ $t('views.admin.moderation.DomainsDetail.addPolicyButton') }} {{ $t('views.admin.moderation.DomainsDetail.button.addPolicy') }}
</button> </button>
</template> </template>
<instance-policy-card <instance-policy-card
@ -211,7 +211,7 @@ const setAllowList = async (value: boolean) => {
> >
<header class="ui header"> <header class="ui header">
<h3> <h3>
{{ $t('views.admin.moderation.DomainsDetail.activePolicyHeader') }} {{ $t('views.admin.moderation.DomainsDetail.header.activePolicy') }}
</h3> </h3>
</header> </header>
</instance-policy-card> </instance-policy-card>
@ -235,31 +235,31 @@ const setAllowList = async (value: boolean) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="info icon" /> <i class="info icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.moderation.DomainsDetail.instanceDataHeader') }} {{ $t('views.admin.moderation.DomainsDetail.header.instanceData') }}
</div> </div>
</h3> </h3>
<table class="ui very basic table"> <table class="ui very basic table">
<tbody> <tbody>
<tr v-if="allowListEnabled"> <tr v-if="allowListEnabled">
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.inAllowListLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.inAllowList.label') }}
</td> </td>
<td> <td>
<span <span
v-if="object.allowed" v-if="object.allowed"
> >
{{ $t('views.admin.moderation.DomainsDetail.inAllowListTrue') }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.inAllowList.true') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.admin.moderation.DomainsDetail.inAllowListFalse') }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.inAllowList.false') }}
</span> </span>
</td> </td>
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.lastCheckedLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.lastChecked') }}
</td> </td>
<td> <td>
<human-date <human-date
@ -277,15 +277,15 @@ const setAllowList = async (value: boolean) => {
<template v-if="object.nodeinfo && object.nodeinfo.status === 'ok'"> <template v-if="object.nodeinfo && object.nodeinfo.status === 'ok'">
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.softwareLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.software.label') }}
</td> </td>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.softwareValue', {name: get(object, 'nodeinfo.payload.software.name', t('views.admin.moderation.DomainsDetail.notApplicable')), version: get(object, 'nodeinfo.payload.software.version', t('views.admin.moderation.DomainsDetail.notApplicable'))}) }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.software.value', {name: get(object, 'nodeinfo.payload.software.name', t('views.admin.moderation.DomainsDetail.notApplicable')), version: get(object, 'nodeinfo.payload.software.version', t('views.admin.moderation.DomainsDetail.notApplicable'))}) }}
</td> </td>
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.domainNameLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.domainName') }}
</td> </td>
<td> <td>
{{ get(object, 'nodeinfo.payload.metadata.nodeName', t('views.admin.moderation.DomainsDetail.notApplicable')) }} {{ get(object, 'nodeinfo.payload.metadata.nodeName', t('views.admin.moderation.DomainsDetail.notApplicable')) }}
@ -293,7 +293,7 @@ const setAllowList = async (value: boolean) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.totalUsersLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.totalUsers') }}
</td> </td>
<td> <td>
{{ get(object, 'nodeinfo.payload.usage.users.total', t('views.admin.moderation.DomainsDetail.notApplicable')) }} {{ get(object, 'nodeinfo.payload.usage.users.total', t('views.admin.moderation.DomainsDetail.notApplicable')) }}
@ -303,10 +303,10 @@ const setAllowList = async (value: boolean) => {
<template v-if="object.nodeinfo && object.nodeinfo.status === 'error'"> <template v-if="object.nodeinfo && object.nodeinfo.status === 'error'">
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.nodeInfoStatusLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.nodeInfoStatus.label') }}
</td> </td>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.nodeInfoFailureMessage') }}&nbsp; {{ $t('views.admin.moderation.DomainsDetail.table.instanceData.nodeInfoStatus.value') }}&nbsp;
<span :data-tooltip="object.nodeinfo.error"><i class="question circle icon" /></span> <span :data-tooltip="object.nodeinfo.error"><i class="question circle icon" /></span>
</td> </td>
@ -319,7 +319,7 @@ const setAllowList = async (value: boolean) => {
:url="'manage/federation/domains/' + object.name + '/nodeinfo/'" :url="'manage/federation/domains/' + object.name + '/nodeinfo/'"
@action-done="refreshNodeInfo" @action-done="refreshNodeInfo"
> >
{{ $t('views.admin.moderation.DomainsDetail.refreshNodeInfoButton') }} {{ $t('views.admin.moderation.DomainsDetail.button.refreshNodeInfo') }}
</ajax-button> </ajax-button>
</section> </section>
</div> </div>
@ -328,7 +328,7 @@ const setAllowList = async (value: boolean) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="feed icon" /> <i class="feed icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.moderation.DomainsDetail.activityHeader') }}&nbsp; {{ $t('views.admin.moderation.DomainsDetail.header.activity') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -348,7 +348,7 @@ const setAllowList = async (value: boolean) => {
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.firstSeenLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.activity.firstSeen') }}
</td> </td>
<td> <td>
<human-date :date="object.creation_date" /> <human-date :date="object.creation_date" />
@ -359,7 +359,7 @@ const setAllowList = async (value: boolean) => {
<router-link <router-link
:to="{name: 'manage.moderation.accounts.list', query: {q: 'domain:' + object.name }}" :to="{name: 'manage.moderation.accounts.list', query: {q: 'domain:' + object.name }}"
> >
{{ $t('views.admin.moderation.DomainsDetail.knownAccountsLink') }} {{ $t('views.admin.moderation.DomainsDetail.link.knownAccounts') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -368,7 +368,7 @@ const setAllowList = async (value: boolean) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.emittedMessagesLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.activity.emittedMessages') }}
</td> </td>
<td> <td>
{{ stats.outbox_activities }} {{ stats.outbox_activities }}
@ -376,7 +376,7 @@ const setAllowList = async (value: boolean) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.receivedFollowsLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.activity.receivedFollows') }}
</td> </td>
<td> <td>
{{ stats.received_library_follows }} {{ stats.received_library_follows }}
@ -384,7 +384,7 @@ const setAllowList = async (value: boolean) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.emittedFollowsLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.activity.emittedFollows') }}
</td> </td>
<td> <td>
{{ stats.emitted_library_follows }} {{ stats.emitted_library_follows }}
@ -399,7 +399,7 @@ const setAllowList = async (value: boolean) => {
<h3 class="ui header"> <h3 class="ui header">
<i class="music icon" /> <i class="music icon" />
<div class="content"> <div class="content">
{{ $t('views.admin.moderation.DomainsDetail.audioContentHeader') }}&nbsp; {{ $t('views.admin.moderation.DomainsDetail.header.audioContent') }}&nbsp;
<span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span> <span :data-tooltip="labels.statsWarning"><i class="question circle icon" /></span>
</div> </div>
</h3> </h3>
@ -419,7 +419,7 @@ const setAllowList = async (value: boolean) => {
<tbody> <tbody>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.cachedSizeLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.audioContent.cachedSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_downloaded_size) }} {{ humanSize(stats.media_downloaded_size) }}
@ -427,7 +427,7 @@ const setAllowList = async (value: boolean) => {
</tr> </tr>
<tr> <tr>
<td> <td>
{{ $t('views.admin.moderation.DomainsDetail.totalSizeLabel') }} {{ $t('views.admin.moderation.DomainsDetail.table.audioContent.totalSize') }}
</td> </td>
<td> <td>
{{ humanSize(stats.media_total_size) }} {{ humanSize(stats.media_total_size) }}
@ -436,7 +436,7 @@ const setAllowList = async (value: boolean) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.channels', query: {q: getQuery('domain', object.name) }}"> <router-link :to="{name: 'manage.channels', query: {q: getQuery('domain', object.name) }}">
{{ $t('views.admin.moderation.DomainsDetail.channelsLabel') }} {{ $t('views.admin.moderation.DomainsDetail.link.channels') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -446,7 +446,7 @@ const setAllowList = async (value: boolean) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('domain', object.name) }}"> <router-link :to="{name: 'manage.library.libraries', query: {q: getQuery('domain', object.name) }}">
{{ $t('views.admin.moderation.DomainsDetail.librariesLabel') }} {{ $t('views.admin.moderation.DomainsDetail.link.libraries') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -456,7 +456,7 @@ const setAllowList = async (value: boolean) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('domain', object.name) }}"> <router-link :to="{name: 'manage.library.uploads', query: {q: getQuery('domain', object.name) }}">
{{ $t('views.admin.moderation.DomainsDetail.uploadsLabel') }} {{ $t('views.admin.moderation.DomainsDetail.link.uploads') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -466,7 +466,7 @@ const setAllowList = async (value: boolean) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.artists', query: {q: getQuery('domain', object.name) }}"> <router-link :to="{name: 'manage.library.artists', query: {q: getQuery('domain', object.name) }}">
{{ $t('views.admin.moderation.DomainsDetail.artistsLabel') }} {{ $t('views.admin.moderation.DomainsDetail.link.artists') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -476,7 +476,7 @@ const setAllowList = async (value: boolean) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.albums', query: {q: getQuery('domain', object.name) }}"> <router-link :to="{name: 'manage.library.albums', query: {q: getQuery('domain', object.name) }}">
{{ $t('views.admin.moderation.DomainsDetail.albumsLabel') }} {{ $t('views.admin.moderation.DomainsDetail.link.albums') }}
</router-link> </router-link>
</td> </td>
<td> <td>
@ -486,7 +486,7 @@ const setAllowList = async (value: boolean) => {
<tr> <tr>
<td> <td>
<router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('domain', object.name) }}"> <router-link :to="{name: 'manage.library.tracks', query: {q: getQuery('domain', object.name) }}">
{{ $t('views.admin.moderation.DomainsDetail.tracksLabel') }} {{ $t('views.admin.moderation.DomainsDetail.link.tracks') }}
</router-link> </router-link>
</td> </td>
<td> <td>

10
front/src/views/admin/moderation/DomainsList.vue
View File

@ -50,7 +50,7 @@ const createDomain = async () => {
<main v-title="labels.domains"> <main v-title="labels.domains">
<section class="ui vertical stripe segment"> <section class="ui vertical stripe segment">
<h2 class="ui left floated header"> <h2 class="ui left floated header">
{{ $t('views.admin.moderation.DomainsList.title') }} {{ $t('views.admin.moderation.DomainsList.header.domains') }}
</h2> </h2>
<form <form
class="ui right floated form" class="ui right floated form"
@ -62,7 +62,7 @@ const createDomain = async () => {
class="ui negative message" class="ui negative message"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.admin.moderation.DomainsList.failureHeader') }} {{ $t('views.admin.moderation.DomainsList.header.failure') }}
</h4> </h4>
<ul class="list"> <ul class="list">
<li <li
@ -75,7 +75,7 @@ const createDomain = async () => {
</div> </div>
<div class="inline fields"> <div class="inline fields">
<div class="field"> <div class="field">
<label for="add-domain">{{ $t('views.admin.moderation.DomainsList.addDomainLabel') }}</label> <label for="add-domain">{{ $t('views.admin.moderation.DomainsList.label.addDomain') }}</label>
<input <input
id="add-domain" id="add-domain"
v-model="domainName" v-model="domainName"
@ -93,7 +93,7 @@ const createDomain = async () => {
type="checkbox" type="checkbox"
name="allowed" name="allowed"
> >
<label for="allowed">{{ $t('views.admin.moderation.DomainsList.addToAllowListLabel') }}</label> <label for="allowed">{{ $t('views.admin.moderation.DomainsList.label.addToAllowList') }}</label>
</div> </div>
<div class="field"> <div class="field">
<button <button
@ -101,7 +101,7 @@ const createDomain = async () => {
type="submit" type="submit"
:disabled="isCreating" :disabled="isCreating"
> >
{{ $t('views.admin.moderation.DomainsList.addButton') }} {{ $t('views.admin.moderation.DomainsList.button.add') }}
</button> </button>
</div> </div>
</div> </div>

22
front/src/views/admin/moderation/ReportsList.vue
View File

@ -90,7 +90,7 @@ fetchData()
const { t } = useI18n() const { t } = useI18n()
const sharedLabels = useSharedLabels() const sharedLabels = useSharedLabels()
const labels = computed(() => ({ const labels = computed(() => ({
searchPlaceholder: t('views.admin.moderation.ReportsList.searchPlaceholder'), searchPlaceholder: t('views.admin.moderation.ReportsList.placeholder.search'),
reports: t('views.admin.moderation.ReportsList.title') reports: t('views.admin.moderation.ReportsList.title')
})) }))
</script> </script>
@ -99,13 +99,13 @@ const labels = computed(() => ({
<main v-title="labels.reports"> <main v-title="labels.reports">
<section class="ui vertical stripe segment"> <section class="ui vertical stripe segment">
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.admin.moderation.ReportsList.title') }} {{ $t('views.admin.moderation.ReportsList.header.reports') }}
</h2> </h2>
<div class="ui hidden divider" /> <div class="ui hidden divider" />
<div class="ui inline form"> <div class="ui inline form">
<div class="fields"> <div class="fields">
<div class="ui field"> <div class="ui field">
<label for="reports-search">{{ $t('views.admin.moderation.ReportsList.searchLabel') }}</label> <label for="reports-search">{{ $t('views.admin.moderation.ReportsList.label.search') }}</label>
<form @submit.prevent="query = search.value"> <form @submit.prevent="query = search.value">
<input <input
id="reports-search" id="reports-search"
@ -118,7 +118,7 @@ const labels = computed(() => ({
</form> </form>
</div> </div>
<div class="field"> <div class="field">
<label for="reports-status">{{ $t('views.admin.moderation.ReportsList.statusLabel') }}</label> <label for="reports-status">{{ $t('views.admin.moderation.ReportsList.label.status') }}</label>
<select <select
id="reports-status" id="reports-status"
class="ui dropdown" class="ui dropdown"
@ -126,13 +126,13 @@ const labels = computed(() => ({
@change="addSearchToken('resolved', ($event.target as HTMLSelectElement).value)" @change="addSearchToken('resolved', ($event.target as HTMLSelectElement).value)"
> >
<option value=""> <option value="">
{{ $t('views.admin.moderation.ReportsList.allOption') }} {{ $t('views.admin.moderation.ReportsList.option.status.all') }}
</option> </option>
<option value="yes"> <option value="yes">
{{ $t('views.admin.moderation.ReportsList.resolvedStatus') }} {{ $t('views.admin.moderation.ReportsList.option.status.resolved') }}
</option> </option>
<option value="no"> <option value="no">
{{ $t('views.admin.moderation.ReportsList.unresolvedStatus') }} {{ $t('views.admin.moderation.ReportsList.option.status.unresolved') }}
</option> </option>
</select> </select>
</div> </div>
@ -144,7 +144,7 @@ const labels = computed(() => ({
@update:model-value="addSearchToken('category', $event)" @update:model-value="addSearchToken('category', $event)"
/> />
<div class="field"> <div class="field">
<label for="reports-ordering">{{ $t('views.admin.moderation.ReportsList.orderingLabel') }}</label> <label for="reports-ordering">{{ $t('views.admin.moderation.ReportsList.ordering.label') }}</label>
<select <select
id="reports-ordering" id="reports-ordering"
v-model="ordering" v-model="ordering"
@ -160,17 +160,17 @@ const labels = computed(() => ({
</select> </select>
</div> </div>
<div class="field"> <div class="field">
<label for="reports-ordering-direction">{{ $t('views.admin.moderation.ReportsList.orderingDirectionLabel') }}</label> <label for="reports-ordering-direction">{{ $t('views.admin.moderation.ReportsList.ordering.direction.label') }}</label>
<select <select
id="reports-ordering-direction" id="reports-ordering-direction"
v-model="orderingDirection" v-model="orderingDirection"
class="ui dropdown" class="ui dropdown"
> >
<option value="+"> <option value="+">
{{ $t('views.admin.moderation.ReportsList.ascendingOrdering') }} {{ $t('views.admin.moderation.ReportsList.ordering.direction.ascending') }}
</option> </option>
<option value="-"> <option value="-">
{{ $t('views.admin.moderation.ReportsList.descendingOrdering') }} {{ $t('views.admin.moderation.ReportsList.ordering.direction.descending') }}
</option> </option>
</select> </select>
</div> </div>

24
front/src/views/admin/moderation/RequestsList.vue
View File

@ -86,7 +86,7 @@ fetchData()
const { t } = useI18n() const { t } = useI18n()
const sharedLabels = useSharedLabels() const sharedLabels = useSharedLabels()
const labels = computed(() => ({ const labels = computed(() => ({
searchPlaceholder: t('views.admin.moderation.RequestsList.searchPlaceholder'), searchPlaceholder: t('views.admin.moderation.RequestsList.placeholder.search'),
reports: t('views.admin.moderation.RequestsList.title') reports: t('views.admin.moderation.RequestsList.title')
})) }))
</script> </script>
@ -95,13 +95,13 @@ const labels = computed(() => ({
<main v-title="labels.reports"> <main v-title="labels.reports">
<section class="ui vertical stripe segment"> <section class="ui vertical stripe segment">
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.admin.moderation.RequestsList.title') }} {{ $t('views.admin.moderation.RequestsList.header.userRequests') }}
</h2> </h2>
<div class="ui hidden divider" /> <div class="ui hidden divider" />
<div class="ui inline form"> <div class="ui inline form">
<div class="fields"> <div class="fields">
<div class="ui field"> <div class="ui field">
<label for="requests-search">{{ $t('views.admin.moderation.RequestsList.searchLabel') }}</label> <label for="requests-search">{{ $t('views.admin.moderation.RequestsList.label.search') }}</label>
<form @submit.prevent="query = search.value"> <form @submit.prevent="query = search.value">
<input <input
id="requests-search" id="requests-search"
@ -114,7 +114,7 @@ const labels = computed(() => ({
</form> </form>
</div> </div>
<div class="field"> <div class="field">
<label for="requests-status">{{ $t('views.admin.moderation.RequestsList.statusLabel') }}</label> <label for="requests-status">{{ $t('views.admin.moderation.RequestsList.label.status') }}</label>
<select <select
id="requests-status" id="requests-status"
class="ui dropdown" class="ui dropdown"
@ -122,21 +122,21 @@ const labels = computed(() => ({
@change="addSearchToken('status', ($event.target as HTMLSelectElement).value)" @change="addSearchToken('status', ($event.target as HTMLSelectElement).value)"
> >
<option value=""> <option value="">
{{ $t('views.admin.moderation.RequestsList.allOption') }} {{ $t('views.admin.moderation.RequestsList.option.status.all') }}
</option> </option>
<option value="pending"> <option value="pending">
{{ $t('views.admin.moderation.RequestsList.pendingStatus') }} {{ $t('views.admin.moderation.RequestsList.option.status.pending') }}
</option> </option>
<option value="approved"> <option value="approved">
{{ $t('views.admin.moderation.RequestsList.approvedStatus') }} {{ $t('views.admin.moderation.RequestsList.option.status.approved') }}
</option> </option>
<option value="refused"> <option value="refused">
{{ $t('views.admin.moderation.RequestsList.refusedStatus') }} {{ $t('views.admin.moderation.RequestsList.option.status.refused') }}
</option> </option>
</select> </select>
</div> </div>
<div class="field"> <div class="field">
<label for="requests-ordering">{{ $t('views.admin.moderation.RequestsList.orderingLabel') }}</label> <label for="requests-ordering">{{ $t('views.admin.moderation.RequestsList.ordering.label') }}</label>
<select <select
id="requests-ordering" id="requests-ordering"
v-model="ordering" v-model="ordering"
@ -152,17 +152,17 @@ const labels = computed(() => ({
</select> </select>
</div> </div>
<div class="field"> <div class="field">
<label for="requests-ordering-direction">{{ $t('views.admin.moderation.RequestsList.orderingDirectionLabel') }}</label> <label for="requests-ordering-direction">{{ $t('views.admin.moderation.RequestsList.ordering.direction.label') }}</label>
<select <select
id="requests-ordering-direction" id="requests-ordering-direction"
v-model="orderingDirection" v-model="orderingDirection"
class="ui dropdown" class="ui dropdown"
> >
<option value="+"> <option value="+">
{{ $t('views.admin.moderation.RequestsList.ascendingOrdering') }} {{ $t('views.admin.moderation.RequestsList.ordering.direction.ascending') }}
</option> </option>
<option value="-"> <option value="-">
{{ $t('views.admin.moderation.RequestsList.descendingOrdering') }} {{ $t('views.admin.moderation.RequestsList.ordering.direction.descending') }}
</option> </option>
</select> </select>
</div> </div>

6
front/src/views/admin/users/Base.vue
View File

@ -6,7 +6,7 @@ const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
manageUsers: t('views.admin.users.Base.title'), manageUsers: t('views.admin.users.Base.title'),
secondaryMenu: t('views.admin.users.Base.secondaryMenu') secondaryMenu: t('views.admin.users.Base.menu.secondary')
})) }))
</script> </script>
@ -24,13 +24,13 @@ const labels = computed(() => ({
class="ui item" class="ui item"
:to="{name: 'manage.users.users.list'}" :to="{name: 'manage.users.users.list'}"
> >
{{ $t('views.admin.users.Base.usersLink') }} {{ $t('views.admin.users.Base.link.users') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'manage.users.invitations.list'}" :to="{name: 'manage.users.invitations.list'}"
> >
{{ $t('views.admin.users.Base.invitationsLink') }} {{ $t('views.admin.users.Base.link.invitations') }}
</router-link> </router-link>
</nav> </nav>
<router-view :key="$route.fullPath" /> <router-view :key="$route.fullPath" />

2
front/src/views/auth/Callback.vue
View File

@ -27,7 +27,7 @@ onMounted(async () => {
<div class="ui active inverted dimmer"> <div class="ui active inverted dimmer">
<div class="ui text loader"> <div class="ui text loader">
<h2> <h2>
{{ $t('views.auth.Callback.loggingInHeader') }} {{ $t('views.auth.Callback.header.loggingIn') }}
</h2> </h2>
</div> </div>
</div> </div>

14
front/src/views/auth/EmailConfirm.vue
View File

@ -15,7 +15,7 @@ const props = defineProps<Props>()
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
confirm: t('views.auth.EmailConfirm.confirm') confirm: t('views.auth.EmailConfirm.title')
})) }))
const errors = ref([] as string[]) const errors = ref([] as string[])
@ -60,7 +60,7 @@ onMounted(() => {
class="ui negative message" class="ui negative message"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.auth.EmailConfirm.confirmFailureHeader') }} {{ $t('views.auth.EmailConfirm.header.failure') }}
</h4> </h4>
<ul class="list"> <ul class="list">
<li <li
@ -72,7 +72,7 @@ onMounted(() => {
</ul> </ul>
</div> </div>
<div class="field"> <div class="field">
<label for="confirmation-code">{{ $t('views.auth.EmailConfirm.confirmationCodeLabel') }}</label> <label for="confirmation-code">{{ $t('views.auth.EmailConfirm.label.confirmationCode') }}</label>
<input <input
id="confirmation-code" id="confirmation-code"
v-model="key" v-model="key"
@ -82,7 +82,7 @@ onMounted(() => {
> >
</div> </div>
<router-link :to="{path: '/login'}"> <router-link :to="{path: '/login'}">
{{ $t('views.auth.EmailConfirm.backToLoginLink') }} {{ $t('views.auth.EmailConfirm.link.back') }}
</router-link> </router-link>
<button <button
:class="['ui', {'loading': isLoading}, 'right', 'floated', 'success', 'button']" :class="['ui', {'loading': isLoading}, 'right', 'floated', 'success', 'button']"
@ -96,13 +96,13 @@ onMounted(() => {
class="ui positive message" class="ui positive message"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.auth.EmailConfirm.confirmSuccessHeader') }} {{ $t('views.auth.EmailConfirm.header.success') }}
</h4> </h4>
<p> <p>
{{ $t('views.auth.EmailConfirm.confirmSuccessMessage') }} {{ $t('views.auth.EmailConfirm.message.success') }}
</p> </p>
<router-link :to="{name: 'login'}"> <router-link :to="{name: 'login'}">
{{ $t('views.auth.EmailConfirm.goToLoginLink') }} {{ $t('views.auth.EmailConfirm.link.login') }}
</router-link> </router-link>
</div> </div>
</div> </div>

2
front/src/views/auth/Login.vue
View File

@ -37,7 +37,7 @@ whenever(() => store.state.auth.authenticated, () => {
<section class="ui vertical stripe segment"> <section class="ui vertical stripe segment">
<div class="ui small text container"> <div class="ui small text container">
<h2> <h2>
{{ $t('views.auth.Login.loginHeader') }} {{ $t('views.auth.Login.header.login') }}
</h2> </h2>
<login-form :next="next" /> <login-form :next="next" />
</div> </div>

14
front/src/views/auth/PasswordReset.vue
View File

@ -18,7 +18,7 @@ const { t } = useI18n()
const router = useRouter() const router = useRouter()
const labels = computed(() => ({ const labels = computed(() => ({
placeholder: t('views.auth.PasswordReset.placeholder'), placeholder: t('views.auth.PasswordReset.placeholder.email'),
reset: t('views.auth.PasswordReset.title') reset: t('views.auth.PasswordReset.title')
})) }))
@ -51,7 +51,7 @@ onMounted(() => emailInput.value.focus())
<section class="ui vertical stripe segment"> <section class="ui vertical stripe segment">
<div class="ui small text container"> <div class="ui small text container">
<h2> <h2>
{{ $t('views.auth.PasswordReset.title') }} {{ $t('views.auth.PasswordReset.header.reset') }}
</h2> </h2>
<form <form
class="ui form" class="ui form"
@ -63,7 +63,7 @@ onMounted(() => emailInput.value.focus())
class="ui negative message" class="ui negative message"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.auth.PasswordReset.resetFailureHeader') }} {{ $t('views.auth.PasswordReset.header.failure') }}
</h4> </h4>
<ul class="list"> <ul class="list">
<li <li
@ -75,10 +75,10 @@ onMounted(() => emailInput.value.focus())
</ul> </ul>
</div> </div>
<p> <p>
{{ $t('views.auth.PasswordReset.resetFormDescription') }} {{ $t('views.auth.PasswordReset.help.form') }}
</p> </p>
<div class="field"> <div class="field">
<label for="account-email">{{ $t('views.auth.PasswordReset.emailLabel') }}</label> <label for="account-email">{{ $t('views.auth.PasswordReset.label.email') }}</label>
<input <input
id="account-email" id="account-email"
ref="emailInput" ref="emailInput"
@ -91,13 +91,13 @@ onMounted(() => emailInput.value.focus())
> >
</div> </div>
<router-link :to="{path: '/login'}"> <router-link :to="{path: '/login'}">
{{ $t('views.auth.PasswordReset.backToLoginLink') }} {{ $t('views.auth.PasswordReset.link.back') }}
</router-link> </router-link>
<button <button
:class="['ui', {'loading': isLoading}, 'right', 'floated', 'success', 'button']" :class="['ui', {'loading': isLoading}, 'right', 'floated', 'success', 'button']"
type="submit" type="submit"
> >
{{ $t('views.auth.PasswordReset.requestResetButton') }} {{ $t('views.auth.PasswordReset.button.requestReset') }}
</button> </button>
</form> </form>
</div> </div>

16
front/src/views/auth/PasswordResetConfirm.vue
View File

@ -68,7 +68,7 @@ const submit = async () => {
class="ui negative message" class="ui negative message"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.auth.PasswordResetConfirm.changeFailureHeader') }} {{ $t('views.auth.PasswordResetConfirm.header.failure') }}
</h4> </h4>
<ul class="list"> <ul class="list">
<li <li
@ -81,25 +81,25 @@ const submit = async () => {
</div> </div>
<template v-if="token && uid"> <template v-if="token && uid">
<div class="field"> <div class="field">
<label for="password-field">{{ $t('views.auth.PasswordResetConfirm.newPasswordLabel') }}</label> <label for="password-field">{{ $t('views.auth.PasswordResetConfirm.label.newPassword') }}</label>
<password-input <password-input
v-model="newPassword" v-model="newPassword"
field-id="password-field" field-id="password-field"
/> />
</div> </div>
<router-link :to="{path: '/login'}"> <router-link :to="{path: '/login'}">
{{ $t('views.auth.PasswordResetConfirm.backToLoginLink') }} {{ $t('views.auth.PasswordResetConfirm.link.back') }}
</router-link> </router-link>
<button <button
:class="['ui', {'loading': isLoading}, 'right', 'floated', 'success', 'button']" :class="['ui', {'loading': isLoading}, 'right', 'floated', 'success', 'button']"
type="submit" type="submit"
> >
{{ $t('views.auth.PasswordResetConfirm.updatePasswordButton') }} {{ $t('views.auth.PasswordResetConfirm.button.update') }}
</button> </button>
</template> </template>
<template v-else> <template v-else>
<p> <p>
{{ $t('views.auth.PasswordResetConfirm.requestSentMessage') }} {{ $t('views.auth.PasswordResetConfirm.message.requestSent') }}
</p> </p>
</template> </template>
</form> </form>
@ -108,13 +108,13 @@ const submit = async () => {
class="ui positive message" class="ui positive message"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.auth.PasswordResetConfirm.changeSuccessHeader') }} {{ $t('views.auth.PasswordResetConfirm.header.success') }}
</h4> </h4>
<p> <p>
{{ $t('views.auth.PasswordResetConfirm.changeSuccessMessage') }} {{ $t('views.auth.PasswordResetConfirm.message.success') }}
</p> </p>
<router-link :to="{name: 'login'}"> <router-link :to="{name: 'login'}">
{{ $t('views.auth.PasswordResetConfirm.goToLoginLink') }} {{ $t('views.auth.PasswordResetConfirm.link.login') }}
</router-link> </router-link>
</div> </div>
</div> </div>

6
front/src/views/auth/ProfileActivity.vue
View File

@ -27,7 +27,7 @@ const recentActivity = ref(0)
:client-only="true" :client-only="true"
/> />
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.auth.ProfileActivity.recentlyListened') }} {{ $t('views.auth.ProfileActivity.header.recentlyListened') }}
</h2> </h2>
<div class="ui divider" /> <div class="ui divider" />
<track-widget <track-widget
@ -39,7 +39,7 @@ const recentActivity = ref(0)
<div class="ui hidden divider" /> <div class="ui hidden divider" />
<div> <div>
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.auth.ProfileActivity.recentlyFavorited') }} {{ $t('views.auth.ProfileActivity.header.recentlyFavorited') }}
</h2> </h2>
<div class="ui divider" /> <div class="ui divider" />
<track-widget <track-widget
@ -50,7 +50,7 @@ const recentActivity = ref(0)
<div class="ui hidden divider" /> <div class="ui hidden divider" />
<div> <div>
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.auth.ProfileActivity.playlistsHeader') }} {{ $t('views.auth.ProfileActivity.header.playlists') }}
</h2> </h2>
<div class="ui divider" /> <div class="ui divider" />
<playlist-widget <playlist-widget

10
front/src/views/auth/ProfileBase.vue
View File

@ -100,7 +100,7 @@ watch(props, fetchData, { immediate: true })
class="basic item" class="basic item"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.auth.ProfileBase.domainViewLink', {domain: object.domain}) }} {{ $t('views.auth.ProfileBase.link.domainView', {domain: object.domain}) }}
</a> </a>
<div <div
v-for="obj in getReportableObjects({account: object})" v-for="obj in getReportableObjects({account: object})"
@ -119,7 +119,7 @@ watch(props, fetchData, { immediate: true })
:to="{name: 'manage.moderation.accounts.detail', params: {id: object.full_username}}" :to="{name: 'manage.moderation.accounts.detail', params: {id: object.full_username}}"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.auth.ProfileBase.moderationLink') }} {{ $t('views.auth.ProfileBase.link.moderation') }}
</router-link> </router-link>
</div> </div>
</button> </button>
@ -148,7 +148,7 @@ watch(props, fetchData, { immediate: true })
<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.ownUserLabel') }} {{ $t('views.auth.ProfileBase.label.self') }}
</div> </div>
</template> </template>
</h1> </h1>
@ -171,13 +171,13 @@ watch(props, fetchData, { immediate: true })
class="item" class="item"
:to="{name: 'profile.overview', params: routerParams}" :to="{name: 'profile.overview', params: routerParams}"
> >
{{ $t('views.auth.ProfileBase.overviewLink') }} {{ $t('views.auth.ProfileBase.link.overview') }}
</router-link> </router-link>
<router-link <router-link
class="item" class="item"
:to="{name: 'profile.activity', params: routerParams}" :to="{name: 'profile.activity', params: routerParams}"
> >
{{ $t('views.auth.ProfileBase.activityLink') }} {{ $t('views.auth.ProfileBase.link.activity') }}
</router-link> </router-link>
</div> </div>
<div class="ui hidden divider" /> <div class="ui hidden divider" />

24
front/src/views/auth/ProfileOverview.vue
View File

@ -42,7 +42,7 @@ const createForm = ref()
</div> </div>
<div> <div>
<h2 class="ui with-actions header"> <h2 class="ui with-actions header">
{{ $t('views.auth.ProfileOverview.channelsHeader') }} {{ $t('views.auth.ProfileOverview.header.channels') }}
<div <div
v-if="$store.state.auth.authenticated && object.full_username === $store.state.auth.fullUsername" v-if="$store.state.auth.authenticated && object.full_username === $store.state.auth.fullUsername"
class="actions" class="actions"
@ -52,26 +52,26 @@ const createForm = ref()
@click.stop.prevent="showCreateModal = true" @click.stop.prevent="showCreateModal = true"
> >
<i class="plus icon" /> <i class="plus icon" />
{{ $t('views.auth.ProfileOverview.addNewLink') }} {{ $t('views.auth.ProfileOverview.link.addNew') }}
</a> </a>
</div> </div>
</h2> </h2>
<channels-widget :filters="{scope: `actor:${object.full_username}`}" /> <channels-widget :filters="{scope: `actor:${object.full_username}`}" />
<h2 class="ui with-actions header"> <h2 class="ui with-actions header">
{{ $t('views.auth.ProfileOverview.librariesHeader') }} {{ $t('views.auth.ProfileOverview.header.libraries') }}
<div <div
v-if="$store.state.auth.authenticated && object.full_username === $store.state.auth.fullUsername" v-if="$store.state.auth.authenticated && object.full_username === $store.state.auth.fullUsername"
class="actions" class="actions"
> >
<router-link :to="{name: 'content.libraries.index'}"> <router-link :to="{name: 'content.libraries.index'}">
<i class="plus icon" /> <i class="plus icon" />
{{ $t('views.auth.ProfileOverview.addNewLink') }} {{ $t('views.auth.ProfileOverview.link.addNew') }}
</router-link> </router-link>
</div> </div>
</h2> </h2>
<library-widget :url="`federation/actors/${object.full_username}/libraries/`"> <library-widget :url="`federation/actors/${object.full_username}/libraries/`">
<template #title> <template #title>
{{ $t('views.auth.ProfileOverview.sharedLibraries') }} {{ $t('views.auth.ProfileOverview.header.sharedLibraries') }}
</template> </template>
</library-widget> </library-widget>
</div> </div>
@ -81,17 +81,17 @@ const createForm = ref()
<span <span
v-if="step === 1" v-if="step === 1"
> >
{{ $t('views.auth.ProfileOverview.createChannelModalHeader') }} {{ $t('views.auth.ProfileOverview.modal.createChannel.header') }}
</span> </span>
<span <span
v-else-if="category === 'podcast'" v-else-if="category === 'podcast'"
> >
{{ $t('views.auth.ProfileOverview.podcastChannelHeader') }} {{ $t('views.auth.ProfileOverview.modal.createChannel.podcast.header') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.auth.ProfileOverview.artistChannelHeader') }} {{ $t('views.auth.ProfileOverview.modal.createChannel.artist.header') }}
</span> </span>
</h4> </h4>
<div <div
@ -115,21 +115,21 @@ const createForm = ref()
v-if="step === 1" v-if="step === 1"
class="ui basic deny button" class="ui basic deny button"
> >
{{ $t('views.auth.ProfileOverview.cancelButton') }} {{ $t('views.auth.ProfileOverview.button.cancel') }}
</button> </button>
<button <button
v-if="step > 1" v-if="step > 1"
class="ui basic button" class="ui basic button"
@click.stop.prevent="step -= 1" @click.stop.prevent="step -= 1"
> >
{{ $t('views.auth.ProfileOverview.previousButton') }} {{ $t('views.auth.ProfileOverview.button.previous') }}
</button> </button>
<button <button
v-if="step === 1" v-if="step === 1"
class="ui primary button" class="ui primary button"
@click.stop.prevent="step += 1" @click.stop.prevent="step += 1"
> >
{{ $t('views.auth.ProfileOverview.nextButton') }} {{ $t('views.auth.ProfileOverview.button.next') }}
</button> </button>
<button <button
v-if="step === 2" v-if="step === 2"
@ -138,7 +138,7 @@ const createForm = ref()
:disabled="!submittable && !loading" :disabled="!submittable && !loading"
@click.prevent.stop="createForm.submit" @click.prevent.stop="createForm.submit"
> >
{{ $t('views.auth.ProfileOverview.createChannelButton') }} {{ $t('views.auth.ProfileOverview.button.createChannel') }}
</button> </button>
</div> </div>
</semantic-modal> </semantic-modal>

2
front/src/views/auth/Signup.vue
View File

@ -31,7 +31,7 @@ const labels = computed(() => ({
<section class="ui vertical stripe segment"> <section class="ui vertical stripe segment">
<div class="ui small text container"> <div class="ui small text container">
<h2> <h2>
{{ $t('views.auth.Signup.createAccountHeader') }} {{ $t('views.auth.Signup.header.createAccount') }}
</h2> </h2>
<signup-form <signup-form
:default-invitation="defaultInvitation" :default-invitation="defaultInvitation"

62
front/src/views/channels/DetailBase.vue
View File

@ -170,19 +170,19 @@ const updateSubscriptionCount = (delta: number) => {
<span <span
v-if="object.artist?.content_category === 'podcast'" v-if="object.artist?.content_category === 'podcast'"
> >
{{ $t('views.channels.DetailBase.episodeCount', {count: totalTracks}) }} {{ $t('views.channels.DetailBase.meta.episodes', {count: totalTracks}) }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.channels.DetailBase.trackCount', {count: totalTracks}) }} {{ $t('views.channels.DetailBase.meta.tracks', {count: 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.subscriberCount', {count: object?.subscriptions_count}) }} {{ $t('views.channels.DetailBase.meta.subscribers', {count: object?.subscriptions_count}) }}
<br> <br>
{{ $t('views.channels.DetailBase.listeningsCount', {count: object?.downloads_count}) }} {{ $t('views.channels.DetailBase.meta.listenings', {count: object?.downloads_count}) }}
</template> </template>
<div class="ui hidden small divider" /> <div class="ui hidden small divider" />
<a <a
@ -196,14 +196,14 @@ const updateSubscriptionCount = (delta: number) => {
class="tiny" class="tiny"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.channels.DetailBase.subscribeModalHeader') }} {{ $t('views.channels.DetailBase.modal.subscribe.header') }}
</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.subscribeOnFunkwhale') }} {{ $t('views.channels.DetailBase.modal.subscribe.funkwhale.header') }}
</h3> </h3>
<subscribe-button <subscribe-button
:channel="object" :channel="object"
@ -214,20 +214,20 @@ const updateSubscriptionCount = (delta: number) => {
<template v-if="object.rss_url"> <template v-if="object.rss_url">
<h3> <h3>
<i class="feed icon" /> <i class="feed icon" />
{{ $t('views.channels.DetailBase.subscribeRss') }} {{ $t('views.channels.DetailBase.modal.subscribe.rss.header') }}
</h3> </h3>
<p> <p>
{{ $t('views.channels.DetailBase.copyUrl') }} {{ $t('views.channels.DetailBase.modal.subscribe.rss.content.help') }}
</p> </p>
<copy-input :value="object.rss_url" /> <copy-input :value="object.rss_url" />
</template> </template>
<template v-if="object.actor"> <template v-if="object.actor">
<h3> <h3>
<i class="bell icon" /> <i class="bell icon" />
{{ $t('views.channels.DetailBase.subscribeOnFediverse') }} {{ $t('views.channels.DetailBase.modal.subscribe.fediverse.header') }}
</h3> </h3>
<p> <p>
{{ $t('views.channels.DetailBase.subscribeOnFediverseDescription') }} {{ $t('views.channels.DetailBase.modal.subscribe.fediverse.content.help') }}
</p> </p>
<copy-input <copy-input
id="copy-tag" id="copy-tag"
@ -238,7 +238,7 @@ const updateSubscriptionCount = (delta: number) => {
</div> </div>
<div class="actions"> <div class="actions">
<button class="ui basic deny button"> <button class="ui basic deny button">
{{ $t('views.channels.DetailBase.cancelButton') }} {{ $t('views.channels.DetailBase.button.cancel') }}
</button> </button>
</div> </div>
</semantic-modal> </semantic-modal>
@ -256,7 +256,7 @@ const updateSubscriptionCount = (delta: number) => {
@click.prevent="showEmbedModal = !showEmbedModal" @click.prevent="showEmbedModal = !showEmbedModal"
> >
<i class="code icon" /> <i class="code icon" />
{{ $t('views.channels.DetailBase.embedButton') }} {{ $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']"
@ -265,7 +265,7 @@ const updateSubscriptionCount = (delta: number) => {
class="basic item" class="basic item"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.channels.DetailBase.domainViewLink', {domain: object.actor.domain}) }} {{ $t('views.channels.DetailBase.link.domainView', {domain: object.actor.domain}) }}
</a> </a>
<div class="divider" /> <div class="divider" />
<a <a
@ -286,7 +286,7 @@ const updateSubscriptionCount = (delta: number) => {
@click.stop.prevent="showEditModal = true" @click.stop.prevent="showEditModal = true"
> >
<i class="edit icon" /> <i class="edit icon" />
{{ $t('views.channels.DetailBase.editButton') }} {{ $t('views.channels.DetailBase.button.edit') }}
</a> </a>
<dangerous-button <dangerous-button
v-if="object" v-if="object"
@ -294,22 +294,22 @@ const updateSubscriptionCount = (delta: number) => {
@confirm="remove()" @confirm="remove()"
> >
<i class="ui trash icon" /> <i class="ui trash icon" />
{{ $t('views.channels.DetailBase.deleteButton') }} {{ $t('views.channels.DetailBase.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.channels.DetailBase.deleteModalHeader') }} {{ $t('views.channels.DetailBase.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.channels.DetailBase.deleteModalMessage') }} {{ $t('views.channels.DetailBase.modal.delete.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.channels.DetailBase.deleteModalConfirm') }} {{ $t('views.channels.DetailBase.button.confirm') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -321,7 +321,7 @@ const updateSubscriptionCount = (delta: number) => {
:to="{name: 'manage.channels.detail', params: {id: object.uuid}}" :to="{name: 'manage.channels.detail', params: {id: object.uuid}}"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.channels.DetailBase.moderationLink') }} {{ $t('views.channels.DetailBase.link.moderation') }}
</router-link> </router-link>
</template> </template>
</div> </div>
@ -352,7 +352,7 @@ const updateSubscriptionCount = (delta: number) => {
target="_blank" target="_blank"
> >
<i class="external link icon" /> <i class="external link icon" />
{{ $t('views.channels.DetailBase.mirroredLink', {domain: externalDomain}) }} {{ $t('views.channels.DetailBase.link.mirrored', {domain: externalDomain}) }}
</a> </a>
</div> </div>
</div> </div>
@ -367,7 +367,7 @@ const updateSubscriptionCount = (delta: number) => {
@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.uploadButton') }} {{ $t('views.channels.DetailBase.button.upload') }}
</button> </button>
</div> </div>
<div class="ui buttons"> <div class="ui buttons">
@ -376,7 +376,7 @@ const updateSubscriptionCount = (delta: number) => {
class="vibrant" class="vibrant"
:artist="object.artist" :artist="object.artist"
> >
{{ $t('views.channels.DetailBase.playButton') }} {{ $t('views.channels.DetailBase.button.play') }}
</play-button> </play-button>
</div> </div>
<div class="ui buttons"> <div class="ui buttons">
@ -392,7 +392,7 @@ const updateSubscriptionCount = (delta: number) => {
v-model:show="showEmbedModal" v-model:show="showEmbedModal"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.channels.DetailBase.embedModalHeader') }} {{ $t('views.channels.DetailBase.modal.embed.header') }}
</h4> </h4>
<div class="scrolling content"> <div class="scrolling content">
<div class="description"> <div class="description">
@ -404,7 +404,7 @@ const updateSubscriptionCount = (delta: number) => {
</div> </div>
<div class="actions"> <div class="actions">
<button class="ui basic deny button"> <button class="ui basic deny button">
{{ $t('views.channels.DetailBase.cancelButton') }} {{ $t('views.channels.DetailBase.button.cancel') }}
</button> </button>
</div> </div>
</semantic-modal> </semantic-modal>
@ -416,12 +416,12 @@ const updateSubscriptionCount = (delta: number) => {
<span <span
v-if="object.artist?.content_category === 'podcast'" v-if="object.artist?.content_category === 'podcast'"
> >
{{ $t('views.channels.DetailBase.podcastChannelHeader') }} {{ $t('views.channels.DetailBase.header.podcastChannel') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.channels.DetailBase.artistChannelHeader') }} {{ $t('views.channels.DetailBase.header.artistChannel') }}
</span> </span>
</h4> </h4>
<div class="scrolling content"> <div class="scrolling content">
@ -436,14 +436,14 @@ const updateSubscriptionCount = (delta: number) => {
</div> </div>
<div class="actions"> <div class="actions">
<button class="ui left floated basic deny button"> <button class="ui left floated basic deny button">
{{ $t('views.channels.DetailBase.cancelButton') }} {{ $t('views.channels.DetailBase.button.cancel') }}
</button> </button>
<button <button
:class="['ui', 'primary', 'confirm', {loading: edit.loading}, 'button']" :class="['ui', 'primary', 'confirm', {loading: edit.loading}, 'button']"
:disabled="!edit.submittable" :disabled="!edit.submittable"
@click.stop="editForm?.submit" @click.stop="editForm?.submit"
> >
{{ $t('views.channels.DetailBase.updateChannelButton') }} {{ $t('views.channels.DetailBase.button.updateChannel') }}
</button> </button>
</div> </div>
</semantic-modal> </semantic-modal>
@ -464,7 +464,7 @@ const updateSubscriptionCount = (delta: number) => {
:to="{name: 'channels.detail', params: {id: id}}" :to="{name: 'channels.detail', params: {id: id}}"
> >
{{ $t('views.channels.DetailBase.channelOverview') }} {{ $t('views.channels.DetailBase.link.channelOverview') }}
</router-link> </router-link>
<router-link <router-link
class="item" class="item"
@ -474,12 +474,12 @@ const updateSubscriptionCount = (delta: number) => {
<span <span
v-if="isPodcast" v-if="isPodcast"
> >
{{ $t('views.channels.DetailBase.channelEpisodes') }} {{ $t('views.channels.DetailBase.link.channelEpisodes') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.channels.DetailBase.channelTracks') }} {{ $t('views.channels.DetailBase.link.channelTracks') }}
</span> </span>
</router-link> </router-link>
</div> </div>

26
front/src/views/channels/DetailOverview.vue
View File

@ -101,15 +101,15 @@ const albumModal = ref()
@click="pendingUploads.length = 0" @click="pendingUploads.length = 0"
/> />
<h3 class="ui header"> <h3 class="ui header">
{{ $t('views.channels.DetailOverview.uploadsSuccessHeader') }} {{ $t('views.channels.DetailOverview.header.uploadsSuccess') }}
</h3> </h3>
<p> <p>
{{ $t('views.channels.DetailOverview.uploadsProgress', {finished: processedUploads.length, total: pendingUploads.length}) }} {{ $t('views.channels.DetailOverview.meta.progress', {finished: processedUploads.length, total: pendingUploads.length}) }}
</p> </p>
</template> </template>
<template v-else-if="isOver"> <template v-else-if="isOver">
<h3 class="ui header"> <h3 class="ui header">
{{ $t('views.channels.DetailOverview.uploadsFailureHeader') }} {{ $t('views.channels.DetailOverview.header.uploadsFailure') }}
</h3> </h3>
<div class="ui hidden divider" /> <div class="ui hidden divider" />
<router-link <router-link
@ -117,26 +117,26 @@ const albumModal = ref()
class="ui basic button" class="ui basic button"
:to="{name: 'content.libraries.files', query: {q: 'status:skipped'}}" :to="{name: 'content.libraries.files', query: {q: 'status:skipped'}}"
> >
{{ $t('views.channels.DetailOverview.skippedUploadsLink') }} {{ $t('views.channels.DetailOverview.link.skippedUploads') }}
</router-link> </router-link>
<router-link <router-link
v-if="erroredUploads.length > 0" v-if="erroredUploads.length > 0"
class="ui basic button" class="ui basic button"
:to="{name: 'content.libraries.files', query: {q: 'status:errored'}}" :to="{name: 'content.libraries.files', query: {q: 'status:errored'}}"
> >
{{ $t('views.channels.DetailOverview.erroredUploadsLink') }} {{ $t('views.channels.DetailOverview.link.erroredUploads') }}
</router-link> </router-link>
</template> </template>
<template v-else> <template v-else>
<div class="ui inline right floated active loader" /> <div class="ui inline right floated active loader" />
<h3 class="ui header"> <h3 class="ui header">
{{ $t('views.channels.DetailOverview.uploadsProcessingHeader') }} {{ $t('views.channels.DetailOverview.header.uploadsProcessing') }}
</h3> </h3>
<p> <p>
{{ $t('views.channels.DetailOverview.uploadsProcessingMessage') }} {{ $t('views.channels.DetailOverview.message.processing') }}
</p> </p>
<p> <p>
{{ $t('views.channels.DetailOverview.uploadsProgress', {finished: processedUploads.length, total: pendingUploads.length}) }} {{ $t('views.channels.DetailOverview.meta.progress', {finished: processedUploads.length, total: pendingUploads.length}) }}
</p> </p>
</template> </template>
</div> </div>
@ -159,12 +159,12 @@ const albumModal = ref()
<span <span
v-if="isPodcast" v-if="isPodcast"
> >
{{ $t('views.channels.DetailOverview.latestEpisodes') }} {{ $t('views.channels.DetailOverview.header.latestEpisodes') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.channels.DetailOverview.latestTracks') }} {{ $t('views.channels.DetailOverview.header.latestTracks') }}
</span> </span>
</h2> </h2>
</channel-entries> </channel-entries>
@ -178,12 +178,12 @@ const albumModal = ref()
<span <span
v-if="isPodcast" v-if="isPodcast"
> >
{{ $t('views.channels.DetailOverview.seriesHeader') }} {{ $t('views.channels.DetailOverview.header.series') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.channels.DetailOverview.albumsHeader') }} {{ $t('views.channels.DetailOverview.header.albums') }}
</span> </span>
<div <div
v-if="isOwner" v-if="isOwner"
@ -191,7 +191,7 @@ const albumModal = ref()
> >
<a @click.stop.prevent="albumModal.show = true"> <a @click.stop.prevent="albumModal.show = true">
<i class="plus icon" /> <i class="plus icon" />
{{ $t('views.channels.DetailOverview.addAlbumLink') }} {{ $t('views.channels.DetailOverview.link.addAlbum') }}
</a> </a>
</div> </div>
</h2> </h2>

10
front/src/views/channels/SubscriptionsList.vue
View File

@ -26,7 +26,7 @@ const widgetKey = ref(new Date().toLocaleString())
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
title: t('views.channels.SubscriptionsList.title'), title: t('views.channels.SubscriptionsList.title'),
searchPlaceholder: t('views.channels.SubscriptionsList.searchPlaceholder') searchPlaceholder: t('views.channels.SubscriptionsList.placeholder.search')
})) }))
const previousPage = ref() const previousPage = ref()
@ -66,7 +66,7 @@ const showSubscribeModal = ref(false)
<div class="actions"> <div class="actions">
<a @click.stop.prevent="showSubscribeModal = true"> <a @click.stop.prevent="showSubscribeModal = true">
<i class="plus icon" /> <i class="plus icon" />
{{ $t('views.channels.SubscriptionsList.addNewLink') }} {{ $t('views.channels.SubscriptionsList.link.addNew') }}
</a> </a>
</div> </div>
</h1> </h1>
@ -76,7 +76,7 @@ const showSubscribeModal = ref(false)
:fullscreen="false" :fullscreen="false"
> >
<h2 class="header"> <h2 class="header">
{{ $t('views.channels.SubscriptionsList.subscriptionModalHeader') }} {{ $t('views.channels.SubscriptionsList.modal.subscription.header') }}
</h2> </h2>
<div <div
ref="modalContent" ref="modalContent"
@ -92,7 +92,7 @@ const showSubscribeModal = ref(false)
</div> </div>
<div class="actions"> <div class="actions">
<button class="ui basic deny button"> <button class="ui basic deny button">
{{ $t('views.channels.SubscriptionsList.cancelButton') }} {{ $t('views.channels.SubscriptionsList.button.cancel') }}
</button> </button>
<button <button
form="remote-search" form="remote-search"
@ -100,7 +100,7 @@ const showSubscribeModal = ref(false)
class="ui primary button" class="ui primary button"
> >
<i class="bookmark icon" /> <i class="bookmark icon" />
{{ $t('views.channels.SubscriptionsList.subscribeButton') }} {{ $t('views.channels.SubscriptionsList.button.subscribe') }}
</button> </button>
</div> </div>
</semantic-modal> </semantic-modal>

6
front/src/views/content/Base.vue
View File

@ -5,7 +5,7 @@ import { computed } from 'vue'
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
secondaryMenu: t('views.content.Base.secondaryMenu'), secondaryMenu: t('views.content.Base.menu.secondary'),
title: t('views.content.Base.title') title: t('views.content.Base.title')
})) }))
</script> </script>
@ -24,13 +24,13 @@ const labels = computed(() => ({
class="ui item" class="ui item"
:to="{name: 'content.libraries.index'}" :to="{name: 'content.libraries.index'}"
> >
{{ $t('views.content.Base.librariesLink') }} {{ $t('views.content.Base.link.libraries') }}
</router-link> </router-link>
<router-link <router-link
class="ui item" class="ui item"
:to="{name: 'content.libraries.files'}" :to="{name: 'content.libraries.files'}"
> >
{{ $t('views.content.Base.tracksLink') }} {{ $t('views.content.Base.link.tracks') }}
</router-link> </router-link>
</nav> </nav>
<router-view :key="$route.fullPath" /> <router-view :key="$route.fullPath" />

20
front/src/views/content/Home.vue
View File

@ -23,51 +23,51 @@ const defaultQuota = computed(() => humanSize(quota.value * 1e6))
<div class="ui text container"> <div class="ui text container">
<h1>{{ labels.title }}</h1> <h1>{{ labels.title }}</h1>
<p> <p>
<strong>{{ $t('views.content.Home.uploadQuota', { quota: defaultQuota }) }}</strong> <strong>{{ $t('views.content.Home.help.uploadQuota', { quota: defaultQuota }) }}</strong>
</p> </p>
<div class="ui segment"> <div class="ui segment">
<h2> <h2>
<i class="feed icon" />&nbsp; <i class="feed icon" />&nbsp;
{{ $t('views.content.Home.channelHeader') }} {{ $t('views.content.Home.header.channel') }}
</h2> </h2>
<p> <p>
{{ $t('views.content.Home.channelDescription') }}&#32;{{ $t('views.content.Home.channelDescriptionContinued') }} {{ $t('views.content.Home.description.channel.1') }}&#32;{{ $t('views.content.Home.description.channel.2') }}
</p> </p>
<router-link <router-link
:to="{name: 'profile.overview', params: {username: store.state.auth.username}, hash: '#channels'}" :to="{name: 'profile.overview', params: {username: store.state.auth.username}, hash: '#channels'}"
class="ui primary button" class="ui primary button"
> >
{{ $t('views.content.Home.getStartedButton') }} {{ $t('views.content.Home.button.start') }}
</router-link> </router-link>
</div> </div>
<div class="ui segment"> <div class="ui segment">
<h2> <h2>
<i class="cloud icon" />&nbsp; <i class="cloud icon" />&nbsp;
{{ $t('views.content.Home.libraryUploadHeader') }} {{ $t('views.content.Home.header.upload') }}
</h2> </h2>
<p> <p>
{{ $t('views.content.Home.libraryUploadDescription') }} {{ $t('views.content.Home.description.upload') }}
</p> </p>
<router-link <router-link
:to="{name: 'content.libraries.index'}" :to="{name: 'content.libraries.index'}"
class="ui primary button" class="ui primary button"
> >
{{ $t('views.content.Home.getStartedButton') }} {{ $t('views.content.Home.button.start') }}
</router-link> </router-link>
</div> </div>
<div class="ui segment"> <div class="ui segment">
<h2> <h2>
<i class="download icon" />&nbsp; <i class="download icon" />&nbsp;
{{ $t('views.content.Home.followLibrariesHeader') }} {{ $t('views.content.Home.header.follow') }}
</h2> </h2>
<p> <p>
{{ $t('views.content.Home.followLibrariesDescription') }} {{ $t('views.content.Home.description.follow') }}
</p> </p>
<router-link <router-link
:to="{name: 'content.remote.index'}" :to="{name: 'content.remote.index'}"
class="ui primary button" class="ui primary button"
> >
{{ $t('views.content.Home.getStartedButton') }} {{ $t('views.content.Home.button.start') }}
</router-link> </router-link>
</div> </div>
</div> </div>

8
front/src/views/content/libraries/Card.vue
View File

@ -17,7 +17,7 @@ const { t } = useI18n()
const sharedLabels = useSharedLabels() const sharedLabels = useSharedLabels()
const sizeLabel = computed(() => t('views.content.libraries.Card.sizeLabel')) const sizeLabel = computed(() => t('views.content.libraries.Card.label.size'))
const privacyTooltips = (level: PrivacyLevel) => `Visibility: ${sharedLabels.fields.privacy_level.choices[level].toLowerCase()}` const privacyTooltips = (level: PrivacyLevel) => `Visibility: ${sharedLabels.fields.privacy_level.choices[level].toLowerCase()}`
</script> </script>
@ -69,7 +69,7 @@ const privacyTooltips = (level: PrivacyLevel) => `Visibility: ${sharedLabels.fie
{{ humanSize(library.size) }} {{ humanSize(library.size) }}
</span> </span>
<i class="music icon" /> <i class="music icon" />
{{ $t('views.content.libraries.Card.trackCount') }} {{ $t('views.content.libraries.Card.meta.tracks') }}
</div> </div>
</div> </div>
<div class="ui bottom basic attached buttons"> <div class="ui bottom basic attached buttons">
@ -77,13 +77,13 @@ const privacyTooltips = (level: PrivacyLevel) => `Visibility: ${sharedLabels.fie
:to="{name: 'library.detail.upload', params: {id: library.uuid}}" :to="{name: 'library.detail.upload', params: {id: library.uuid}}"
class="ui button" class="ui button"
> >
{{ $t('views.content.libraries.Card.uploadButton') }} {{ $t('views.content.libraries.Card.button.upload') }}
</router-link> </router-link>
<router-link <router-link
:to="{name: 'library.detail', params: {id: library.uuid}}" :to="{name: 'library.detail', params: {id: library.uuid}}"
class="ui button" class="ui button"
> >
{{ $t('views.content.libraries.Card.detailsLink') }} {{ $t('views.content.libraries.Card.link.details') }}
</router-link> </router-link>
</div> </div>
</div> </div>

50
front/src/views/content/libraries/FilesTable.vue
View File

@ -70,14 +70,14 @@ const actionFilters = computed(() => ({ q: query.value, ...props.filters }))
const actions = computed(() => [ const actions = computed(() => [
{ {
name: 'delete', name: 'delete',
label: t('views.content.libraries.FilesTable.deleteLabel'), label: t('views.content.libraries.FilesTable.action.delete'),
isDangerous: true, isDangerous: true,
allowAll: true, allowAll: true,
confirmColor: 'danger' confirmColor: 'danger'
}, },
{ {
name: 'relaunch_import', name: 'relaunch_import',
label: t('views.content.libraries.FilesTable.restartImportLabel'), label: t('views.content.libraries.FilesTable.action.restartImport'),
isDangerous: true, isDangerous: true,
allowAll: true, allowAll: true,
filterCheckable: (filter: { import_status: ImportStatus }) => { filterCheckable: (filter: { import_status: ImportStatus }) => {
@ -120,8 +120,8 @@ fetchData()
const sharedLabels = useSharedLabels() const sharedLabels = useSharedLabels()
const labels = computed(() => ({ const labels = computed(() => ({
searchPlaceholder: t('views.content.libraries.FilesTable.searchPlaceholder'), searchPlaceholder: t('views.content.libraries.FilesTable.placeholder.search'),
showStatus: t('views.content.libraries.FilesTable.showStatus') showStatus: t('views.content.libraries.FilesTable.button.showStatus')
})) }))
const detailedUpload = ref() const detailedUpload = ref()
@ -138,7 +138,7 @@ const getImportStatusChoice = (importStatus: ImportStatus) => {
<div class="fields"> <div class="fields">
<div class="ui six wide field"> <div class="ui six wide field">
<label for="files-search"> <label for="files-search">
{{ $t('views.content.libraries.FilesTable.searchLabel') }} {{ $t('views.content.libraries.FilesTable.label.search') }}
</label> </label>
<form @submit.prevent="query = search.value"> <form @submit.prevent="query = search.value">
<input <input
@ -153,7 +153,7 @@ const getImportStatusChoice = (importStatus: ImportStatus) => {
</div> </div>
<div class="field"> <div class="field">
<label for="import-status"> <label for="import-status">
{{ $t('views.content.libraries.FilesTable.importStatusLabel') }} {{ $t('views.content.libraries.FilesTable.label.importStatus') }}
</label> </label>
<select <select
id="import-status" id="import-status"
@ -162,28 +162,28 @@ const getImportStatusChoice = (importStatus: ImportStatus) => {
@change="addSearchToken('status', ($event.target as HTMLSelectElement).value)" @change="addSearchToken('status', ($event.target as HTMLSelectElement).value)"
> >
<option value> <option value>
{{ $t('views.content.libraries.FilesTable.allOption') }} {{ $t('views.content.libraries.FilesTable.option.status.all') }}
</option> </option>
<option value="draft"> <option value="draft">
{{ $t('views.content.libraries.FilesTable.draftStatus') }} {{ $t('views.content.libraries.FilesTable.option.status.draft') }}
</option> </option>
<option value="pending"> <option value="pending">
{{ $t('views.content.libraries.FilesTable.pendingStatus') }} {{ $t('views.content.libraries.FilesTable.option.status.pending') }}
</option> </option>
<option value="skipped"> <option value="skipped">
{{ $t('views.content.libraries.FilesTable.skippedStatus') }} {{ $t('views.content.libraries.FilesTable.option.status.skipped') }}
</option> </option>
<option value="errored"> <option value="errored">
{{ $t('views.content.libraries.FilesTable.failedStatus') }} {{ $t('views.content.libraries.FilesTable.option.status.failed') }}
</option> </option>
<option value="finished"> <option value="finished">
{{ $t('views.content.libraries.FilesTable.finishedStatus') }} {{ $t('views.content.libraries.FilesTable.option.status.finished') }}
</option> </option>
</select> </select>
</div> </div>
<div class="field"> <div class="field">
<label for="ordering-select"> <label for="ordering-select">
{{ $t('views.content.libraries.FilesTable.orderingLabel') }} {{ $t('views.content.libraries.FilesTable.ordering.label') }}
</label> </label>
<select <select
id="ordering-select" id="ordering-select"
@ -201,7 +201,7 @@ const getImportStatusChoice = (importStatus: ImportStatus) => {
</div> </div>
<div class="field"> <div class="field">
<label for="ordering-direction"> <label for="ordering-direction">
{{ $t('views.content.libraries.FilesTable.orderingDirectionLabel') }} {{ $t('views.content.libraries.FilesTable.ordering.direction.label') }}
</label> </label>
<select <select
id="ordering-direction" id="ordering-direction"
@ -209,10 +209,10 @@ const getImportStatusChoice = (importStatus: ImportStatus) => {
class="ui dropdown" class="ui dropdown"
> >
<option value="+"> <option value="+">
{{ $t('views.content.libraries.FilesTable.ascendingOrdering') }} {{ $t('views.content.libraries.FilesTable.ordering.direction.ascending') }}
</option> </option>
<option value="-"> <option value="-">
{{ $t('views.content.libraries.FilesTable.descendingOrdering') }} {{ $t('views.content.libraries.FilesTable.ordering.direction.descending') }}
</option> </option>
</select> </select>
</div> </div>
@ -236,7 +236,7 @@ const getImportStatusChoice = (importStatus: ImportStatus) => {
> >
<div class="ui icon header"> <div class="ui icon header">
<i class="upload icon" /> <i class="upload icon" />
{{ $t('views.content.libraries.FilesTable.emptyState') }} {{ $t('views.content.libraries.FilesTable.empty.noTracks') }}
</div> </div>
</div> </div>
<action-table <action-table
@ -254,25 +254,25 @@ const getImportStatusChoice = (importStatus: ImportStatus) => {
> >
<template #header-cells> <template #header-cells>
<th> <th>
{{ $t('views.content.libraries.FilesTable.titleTableHeader') }} {{ $t('views.content.libraries.FilesTable.table.file.header.title') }}
</th> </th>
<th> <th>
{{ $t('views.content.libraries.FilesTable.artistTableHeader') }} {{ $t('views.content.libraries.FilesTable.table.file.header.artist') }}
</th> </th>
<th> <th>
{{ $t('views.content.libraries.FilesTable.albumTableHeader') }} {{ $t('views.content.libraries.FilesTable.table.file.header.album') }}
</th> </th>
<th> <th>
{{ $t('views.content.libraries.FilesTable.uploadDateTableHeader') }} {{ $t('views.content.libraries.FilesTable.table.file.header.uploadDate') }}
</th> </th>
<th> <th>
{{ $t('views.content.libraries.FilesTable.importStatusTableHeader') }} {{ $t('views.content.libraries.FilesTable.table.file.header.importStatus') }}
</th> </th>
<th> <th>
{{ $t('views.content.libraries.FilesTable.durationTableHeader') }} {{ $t('views.content.libraries.FilesTable.table.file.header.duration') }}
</th> </th>
<th> <th>
{{ $t('views.content.libraries.FilesTable.sizeTableHeader') }} {{ $t('views.content.libraries.FilesTable.table.file.header.size') }}
</th> </th>
</template> </template>
<template <template
@ -351,7 +351,7 @@ const getImportStatusChoice = (importStatus: ImportStatus) => {
/> />
<span v-if="result && result.results.length > 0"> <span v-if="result && result.results.length > 0">
{{ $t('views.content.libraries.FilesTable.resultsDisplay', {start: ((page-1) * paginateBy) + 1, end: ((page-1) * paginateBy) + result.results.length, total: result.count}) }} {{ $t('views.content.libraries.FilesTable.pagination.results', {start: ((page-1) * paginateBy) + 1, end: ((page-1) * paginateBy) + result.results.length, total: result.count}) }}
</span> </span>
</div> </div>
</div> </div>

34
front/src/views/content/libraries/Form.vue
View File

@ -30,8 +30,8 @@ const sharedLabels = useSharedLabels()
const store = useStore() const store = useStore()
const labels = computed(() => ({ const labels = computed(() => ({
descriptionPlaceholder: t('views.content.libraries.Form.descriptionPlaceholder'), descriptionPlaceholder: t('views.content.libraries.Form.placeholder.description'),
namePlaceholder: t('views.content.libraries.Form.namePlaceholder') namePlaceholder: t('views.content.libraries.Form.placeholder.name')
})) }))
const currentVisibilityLevel = ref(props.library?.privacy_level ?? 'me') const currentVisibilityLevel = ref(props.library?.privacy_level ?? 'me')
@ -59,8 +59,8 @@ const submit = async () => {
store.commit('ui/addMessage', { store.commit('ui/addMessage', {
content: props.library content: props.library
? t('views.content.libraries.Form.libraryUpdateMessage') ? t('views.content.libraries.Form.message.libraryUpdated')
: t('views.content.libraries.Form.libraryCreateMessage'), : t('views.content.libraries.Form.message.libraryCreated'),
date: new Date() date: new Date()
}) })
} catch (error) { } catch (error) {
@ -77,7 +77,7 @@ const remove = async () => {
await axios.delete(`libraries/${props.library?.uuid}/`) await axios.delete(`libraries/${props.library?.uuid}/`)
emit('deleted') emit('deleted')
store.commit('ui/addMessage', { store.commit('ui/addMessage', {
content: t('views.content.libraries.Form.libraryDeleteMessage'), content: t('views.content.libraries.Form.message.libraryDeleted'),
date: new Date() date: new Date()
}) })
} catch (error) { } catch (error) {
@ -94,7 +94,7 @@ const remove = async () => {
@submit.prevent="submit" @submit.prevent="submit"
> >
<p v-if="!library"> <p v-if="!library">
{{ $t('views.content.libraries.Form.libraryHelp') }} {{ $t('views.content.libraries.Form.description.library') }}
</p> </p>
<div <div
v-if="errors.length > 0" v-if="errors.length > 0"
@ -102,7 +102,7 @@ const remove = async () => {
class="ui negative message" class="ui negative message"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.content.libraries.Form.failureHeader') }} {{ $t('views.content.libraries.Form.header.failure') }}
</h4> </h4>
<ul class="list"> <ul class="list">
<li <li
@ -114,7 +114,7 @@ const remove = async () => {
</ul> </ul>
</div> </div>
<div class="required field"> <div class="required field">
<label for="current-name">{{ $t('views.content.libraries.Form.nameLabel') }}</label> <label for="current-name">{{ $t('views.content.libraries.Form.label.name') }}</label>
<input <input
id="current-name" id="current-name"
v-model="currentName" v-model="currentName"
@ -125,7 +125,7 @@ const remove = async () => {
> >
</div> </div>
<div class="field"> <div class="field">
<label for="current-description">{{ $t('views.content.libraries.Form.descriptionLabel') }}</label> <label for="current-description">{{ $t('views.content.libraries.Form.label.description') }}</label>
<textarea <textarea
id="current-description" id="current-description"
v-model="currentDescription" v-model="currentDescription"
@ -134,9 +134,9 @@ const remove = async () => {
/> />
</div> </div>
<div class="field"> <div class="field">
<label for="visibility-level">{{ $t('views.content.libraries.Form.visibilityLabel') }}</label> <label for="visibility-level">{{ $t('views.content.libraries.Form.label.visibility') }}</label>
<p> <p>
{{ $t('views.content.libraries.Form.visibilityDescription') }} {{ $t('views.content.libraries.Form.description.visibility') }}
</p> </p>
<select <select
id="visibility-level" id="visibility-level"
@ -159,12 +159,12 @@ const remove = async () => {
<span <span
v-if="library" v-if="library"
> >
{{ $t('views.content.libraries.Form.updateButton') }} {{ $t('views.content.libraries.Form.button.update') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.content.libraries.Form.createButton') }} {{ $t('views.content.libraries.Form.button.create') }}
</span> </span>
</button> </button>
<dangerous-button <dangerous-button
@ -173,20 +173,20 @@ const remove = async () => {
class="ui right floated basic danger button" class="ui right floated basic danger button"
@confirm="remove" @confirm="remove"
> >
{{ $t('views.content.libraries.Form.deleteButton') }} {{ $t('views.content.libraries.Form.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.content.libraries.Form.deleteModalHeader') }} {{ $t('views.content.libraries.Form.modal.delete.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<p> <p>
{{ $t('views.content.libraries.Form.deleteModalMessage') }} {{ $t('views.content.libraries.Form.modal.delete.content.warning') }}
</p> </p>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<div> <div>
{{ $t('views.content.libraries.Form.deleteModalConfirm') }} {{ $t('views.content.libraries.Form.button.confirm') }}
</div> </div>
</template> </template>
</dangerous-button> </dangerous-button>

8
front/src/views/content/libraries/Home.vue
View File

@ -46,7 +46,7 @@ const libraryCreated = (library: Library) => {
:class="['ui', {'active': isLoading}, 'inverted', 'dimmer']" :class="['ui', {'active': isLoading}, 'inverted', 'dimmer']"
> >
<div class="ui text loader"> <div class="ui text loader">
{{ $t('views.content.libraries.Home.loadingLibraries') }} {{ $t('views.content.libraries.Home.loading.libraries') }}
</div> </div>
</div> </div>
<div <div
@ -54,11 +54,11 @@ const libraryCreated = (library: Library) => {
class="ui text container" class="ui text container"
> >
<h1 class="ui header"> <h1 class="ui header">
{{ $t('views.content.libraries.Home.ownLibrariesHeader') }} {{ $t('views.content.libraries.Home.header.libraries') }}
</h1> </h1>
<p v-if="libraries.length == 0"> <p v-if="libraries.length == 0">
{{ $t('views.content.libraries.Home.emptyState') }} {{ $t('views.content.libraries.Home.empty.noLibrary') }}
</p> </p>
<a <a
:aria-expanded="!hiddenForm" :aria-expanded="!hiddenForm"
@ -73,7 +73,7 @@ const libraryCreated = (library: Library) => {
v-else v-else
class="minus icon" class="minus icon"
/> />
{{ $t('views.content.libraries.Home.createLibraryLink') }} {{ $t('views.content.libraries.Home.link.createLibrary') }}
</a> </a>
<library-form <library-form
v-if="!hiddenForm" v-if="!hiddenForm"

44
front/src/views/content/libraries/Quota.vue
View File

@ -53,14 +53,14 @@ const purgeErroredFiles = () => purge('errored')
<template> <template>
<div class="ui segment"> <div class="ui segment">
<h3 class="ui header"> <h3 class="ui header">
{{ $t('views.content.libraries.Quota.currentUsageHeader') }} {{ $t('views.content.libraries.Quota.header.currentUsage') }}
</h3> </h3>
<div <div
v-if="isLoading" v-if="isLoading"
:class="['ui', {'active': isLoading}, 'inverted', 'dimmer']" :class="['ui', {'active': isLoading}, 'inverted', 'dimmer']"
> >
<div class="ui text loader"> <div class="ui text loader">
{{ $t('views.content.libraries.Quota.loadingMessage') }} {{ $t('views.content.libraries.Quota.loading.currentUsage') }}
</div> </div>
</div> </div>
<div <div
@ -72,14 +72,14 @@ const purgeErroredFiles = () => purge('errored')
:style="{width: `${progress}%`}" :style="{width: `${progress}%`}"
> >
<div class="progress"> <div class="progress">
{{ $t('views.content.libraries.Quota.percentUsed', {progress: progress}) }} {{ $t('views.content.libraries.Quota.label.percentUsed', {progress: progress}) }}
</div> </div>
</div> </div>
<div <div
v-if="quotaStatus" v-if="quotaStatus"
class="label" class="label"
> >
{{ $t('views.content.libraries.Quota.currentUsage', {max: humanSize(quotaStatus.max * 1000 * 1000), current: humanSize(quotaStatus.current * 1000 * 1000)}) }} {{ $t('views.content.libraries.Quota.label.currentUsage', {max: humanSize(quotaStatus.max * 1000 * 1000), current: humanSize(quotaStatus.current * 1000 * 1000)}) }}
</div> </div>
</div> </div>
<div class="ui hidden divider" /> <div class="ui hidden divider" />
@ -96,7 +96,7 @@ const purgeErroredFiles = () => purge('errored')
{{ humanSize(quotaStatus.pending * 1000 * 1000) }} {{ humanSize(quotaStatus.pending * 1000 * 1000) }}
</div> </div>
<div class="label"> <div class="label">
{{ $t('views.content.libraries.Quota.pendingLabel') }} {{ $t('views.content.libraries.Quota.label.pending') }}
</div> </div>
</div> </div>
<div> <div>
@ -104,27 +104,27 @@ const purgeErroredFiles = () => purge('errored')
class="ui basic primary tiny button" class="ui basic primary tiny button"
:to="{name: 'content.libraries.files', query: {q: compileTokens([{field: 'status', value: 'pending'}])}}" :to="{name: 'content.libraries.files', query: {q: compileTokens([{field: 'status', value: 'pending'}])}}"
> >
{{ $t('views.content.libraries.Quota.viewFilesLink') }} {{ $t('views.content.libraries.Quota.link.viewFiles') }}
</router-link> </router-link>
<dangerous-button <dangerous-button
class="ui basic tiny button" class="ui basic tiny button"
:action="purgePendingFiles" :action="purgePendingFiles"
> >
{{ $t('views.content.libraries.Quota.purgeButton') }} {{ $t('views.content.libraries.Quota.button.purge') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.content.libraries.Quota.purgePendingModalHeader') }} {{ $t('views.content.libraries.Quota.modal.purgePending.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<p> <p>
{{ $t('views.content.libraries.Quota.purgePendingModalMessage') }} {{ $t('views.content.libraries.Quota.modal.purgePending.content.description') }}
</p> </p>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<div> <div>
{{ $t('views.content.libraries.Quota.purgeButton') }} {{ $t('views.content.libraries.Quota.button.purge') }}
</div> </div>
</template> </template>
</dangerous-button> </dangerous-button>
@ -139,7 +139,7 @@ const purgeErroredFiles = () => purge('errored')
{{ humanSize(quotaStatus.skipped * 1000 * 1000) }} {{ humanSize(quotaStatus.skipped * 1000 * 1000) }}
</div> </div>
<div class="label"> <div class="label">
{{ $t('views.content.libraries.Quota.skippedLabel') }} {{ $t('views.content.libraries.Quota.label.skipped') }}
</div> </div>
</div> </div>
<div> <div>
@ -147,26 +147,26 @@ const purgeErroredFiles = () => purge('errored')
class="ui basic primary tiny button" class="ui basic primary tiny button"
:to="{name: 'content.libraries.files', query: {q: compileTokens([{field: 'status', value: 'skipped'}])}}" :to="{name: 'content.libraries.files', query: {q: compileTokens([{field: 'status', value: 'skipped'}])}}"
> >
{{ $t('views.content.libraries.Quota.viewFilesLink') }} {{ $t('views.content.libraries.Quota.link.viewFiles') }}
</router-link> </router-link>
<dangerous-button <dangerous-button
class="ui basic tiny button" class="ui basic tiny button"
:action="purgeSkippedFiles" :action="purgeSkippedFiles"
> >
{{ $t('views.content.libraries.Quota.purgeButton') }} {{ $t('views.content.libraries.Quota.button.purge') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.content.libraries.Quota.purgeSkippedModalHeader') }} {{ $t('views.content.libraries.Quota.modal.purgeSkipped.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<p> <p>
{{ $t('views.content.libraries.Quota.purgeSkippedModalMessage') }} {{ $t('views.content.libraries.Quota.modal.purgeSkipped.content.description') }}
</p> </p>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<div> <div>
{{ $t('views.content.libraries.Quota.purgeButton') }} {{ $t('views.content.libraries.Quota.button.purge') }}
</div> </div>
</template> </template>
</dangerous-button> </dangerous-button>
@ -181,7 +181,7 @@ const purgeErroredFiles = () => purge('errored')
{{ humanSize(quotaStatus.errored * 1000 * 1000) }} {{ humanSize(quotaStatus.errored * 1000 * 1000) }}
</div> </div>
<div class="label"> <div class="label">
{{ $t('views.content.libraries.Quota.erroredLabel') }} {{ $t('views.content.libraries.Quota.label.errored') }}
</div> </div>
</div> </div>
<div> <div>
@ -189,26 +189,26 @@ const purgeErroredFiles = () => purge('errored')
class="ui basic primary tiny button" class="ui basic primary tiny button"
:to="{name: 'content.libraries.files', query: {q: compileTokens([{field: 'status', value: 'errored'}])}}" :to="{name: 'content.libraries.files', query: {q: compileTokens([{field: 'status', value: 'errored'}])}}"
> >
{{ $t('views.content.libraries.Quota.viewFilesLink') }} {{ $t('views.content.libraries.Quota.link.viewFiles') }}
</router-link> </router-link>
<dangerous-button <dangerous-button
class="ui basic tiny button" class="ui basic tiny button"
:action="purgeErroredFiles" :action="purgeErroredFiles"
> >
{{ $t('views.content.libraries.Quota.purgeButton') }} {{ $t('views.content.libraries.Quota.button.purge') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.content.libraries.Quota.purgeErroredModalHeader') }} {{ $t('views.content.libraries.Quota.modal.purgeErrored.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<p> <p>
{{ $t('views.content.libraries.Quota.purgeErroredModalMessage') }} {{ $t('views.content.libraries.Quota.modal.purgeErrored.content.description') }}
</p> </p>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<div> <div>
{{ $t('views.content.libraries.Quota.purgeButton') }} {{ $t('views.content.libraries.Quota.button.purge') }}
</div> </div>
</template> </template>
</dangerous-button> </dangerous-button>

48
front/src/views/content/remote/Card.vue
View File

@ -50,8 +50,8 @@ const radioPlayable = computed(() => (
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
tooltips: { tooltips: {
me: t('views.content.remote.Card.privateTooltip'), me: t('views.content.remote.Card.tooltip.private'),
everyone: t('views.content.remote.Card.publicTooltip') everyone: t('views.content.remote.Card.tooltip.public')
} }
})) }))
@ -65,8 +65,8 @@ const launchScan = async () => {
store.commit('ui/addMessage', { store.commit('ui/addMessage', {
date: new Date(), date: new Date(),
content: response.data.status === 'skipped' content: response.data.status === 'skipped'
? t('views.content.remote.Card.scanSkipped') ? t('views.content.remote.Card.message.scanSkipped')
: t('views.content.remote.Card.scanLaunched') : t('views.content.remote.Card.message.scanLaunched')
}) })
} catch (error) { } catch (error) {
useErrorHandler(error as Error) useErrorHandler(error as Error)
@ -82,7 +82,7 @@ const follow = async () => {
} catch (error) { } catch (error) {
console.error(error) console.error(error)
store.commit('ui/addMessage', { store.commit('ui/addMessage', {
content: t('views.content.remote.Card.followError', { error }), content: t('views.content.remote.Card.error.follow', { error }),
date: new Date() date: new Date()
}) })
} }
@ -99,7 +99,7 @@ const unfollow = async () => {
} }
} catch (error) { } catch (error) {
store.commit('ui/addMessage', { store.commit('ui/addMessage', {
content: t('views.content.remote.Card.unfollowError', { error }), content: t('views.content.remote.Card.error.unfollow', { error }),
date: new Date() date: new Date()
}) })
} }
@ -191,7 +191,7 @@ watch(showScan, (shouldShow) => {
</div> </div>
<div class="meta"> <div class="meta">
<i class="music icon" /> <i class="music icon" />
{{ $t('views.content.remote.Card.trackCount', {count: library.uploads_count}) }} {{ $t('views.content.remote.Card.meta.tracks', {count: library.uploads_count}) }}
</div> </div>
<div <div
v-if="displayScan && latestScan" v-if="displayScan && latestScan"
@ -199,30 +199,30 @@ watch(showScan, (shouldShow) => {
> >
<template v-if="latestScan.status === 'pending'"> <template v-if="latestScan.status === 'pending'">
<i class="hourglass icon" /> <i class="hourglass icon" />
{{ $t('views.content.remote.Card.scanPending') }} {{ $t('views.content.remote.Card.label.scanPending') }}
</template> </template>
<template v-if="latestScan.status === 'scanning'"> <template v-if="latestScan.status === 'scanning'">
<i class="loading spinner icon" /> <i class="loading spinner icon" />
{{ $t('views.content.remote.Card.scanProgress', {progress: scanProgress}) }} {{ $t('views.content.remote.Card.label.scanProgress', {progress: scanProgress}) }}
</template> </template>
<template v-else-if="latestScan.status === 'errored'"> <template v-else-if="latestScan.status === 'errored'">
<i class="dangerdownload icon" /> <i class="dangerdownload icon" />
{{ $t('views.content.remote.Card.scanFailure') }} {{ $t('views.content.remote.Card.label.scanFailure') }}
</template> </template>
<template v-else-if="latestScan.status === 'finished' && latestScan.errored_files === 0"> <template v-else-if="latestScan.status === 'finished' && latestScan.errored_files === 0">
<i class="success download icon" /> <i class="success download icon" />
{{ $t('views.content.remote.Card.scanSuccess') }} {{ $t('views.content.remote.Card.label.scanSuccess') }}
</template> </template>
<template v-else-if="latestScan.status === 'finished' && latestScan.errored_files > 0"> <template v-else-if="latestScan.status === 'finished' && latestScan.errored_files > 0">
<i class="warning download icon" /> <i class="warning download icon" />
{{ $t('views.content.remote.Card.scanPartialSuccess') }} {{ $t('views.content.remote.Card.label.scanPartialSuccess') }}
</template> </template>
<a <a
href="" href=""
class="link right floated" class="link right floated"
@click.prevent="showScan = !showScan" @click.prevent="showScan = !showScan"
> >
{{ $t('views.content.remote.Card.scanDetails') }} {{ $t('views.content.remote.Card.link.scanDetails') }}
<i <i
v-if="showScan" v-if="showScan"
class="angle down icon" class="angle down icon"
@ -234,9 +234,9 @@ watch(showScan, (shouldShow) => {
</a> </a>
<div v-if="showScan"> <div v-if="showScan">
<template v-if="latestScan.modification_date"> <template v-if="latestScan.modification_date">
{{ $t('views.content.remote.Card.lastUpdate') }}<human-date :date="latestScan.modification_date" /><br> {{ $t('views.content.remote.Card.meta.lastUpdate') }}<human-date :date="latestScan.modification_date" /><br>
</template> </template>
{{ $t('views.content.remote.Card.failedTracks', {tracks: latestScan.errored_files}) }} {{ $t('views.content.remote.Card.meta.failedTracks', {tracks: latestScan.errored_files}) }}
</div> </div>
</div> </div>
<div <div
@ -248,7 +248,7 @@ watch(showScan, (shouldShow) => {
class="right floated link" class="right floated link"
@click.prevent="launchScan" @click.prevent="launchScan"
> >
{{ $t('views.content.remote.Card.scanNowButton') }}<i class="paper plane icon" /> {{ $t('views.content.remote.Card.link.scan') }}<i class="paper plane icon" />
</a> </a>
</div> </div>
</div> </div>
@ -264,7 +264,7 @@ watch(showScan, (shouldShow) => {
> >
<div class="ui form"> <div class="ui form">
<div class="field"> <div class="field">
<label :for="library.fid">{{ $t('views.content.remote.Card.sharingLinkLabel') }}</label> <label :for="library.fid">{{ $t('views.content.remote.Card.label.sharingLink') }}</label>
<copy-input <copy-input
:id="library.fid" :id="library.fid"
:button-classes="'basic'" :button-classes="'basic'"
@ -288,20 +288,20 @@ watch(showScan, (shouldShow) => {
:class="['ui', 'success', {'loading': isLoadingFollow}, 'button']" :class="['ui', 'success', {'loading': isLoadingFollow}, 'button']"
@click="follow()" @click="follow()"
> >
{{ $t('views.content.remote.Card.followButton') }} {{ $t('views.content.remote.Card.button.follow') }}
</button> </button>
<template v-else-if="!library.follow.approved"> <template v-else-if="!library.follow.approved">
<button <button
class="ui disabled button" class="ui disabled button"
> >
<i class="hourglass icon" /> <i class="hourglass icon" />
{{ $t('views.content.remote.Card.pendingApprovalButton') }} {{ $t('views.content.remote.Card.button.pending') }}
</button> </button>
<button <button
class="ui button" class="ui button"
@click="unfollow" @click="unfollow"
> >
{{ $t('views.content.remote.Card.cancelFollowButton') }} {{ $t('views.content.remote.Card.button.cancel') }}
</button> </button>
</template> </template>
<template v-else-if="library.follow.approved"> <template v-else-if="library.follow.approved">
@ -309,22 +309,22 @@ watch(showScan, (shouldShow) => {
:class="['ui', 'button']" :class="['ui', 'button']"
:action="unfollow" :action="unfollow"
> >
{{ $t('views.content.remote.Card.unfollowButton') }} {{ $t('views.content.remote.Card.button.unfollow') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.content.remote.Card.unfollowModalHeader') }} {{ $t('views.content.remote.Card.modal.unfollow.header') }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<div> <div>
<p> <p>
{{ $t('views.content.remote.Card.unfollowModalMessage') }} {{ $t('views.content.remote.Card.modal.unfollow.content.warning') }}
</p> </p>
</div> </div>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<div> <div>
{{ $t('views.content.remote.Card.unfollowButton') }} {{ $t('views.content.remote.Card.button.unfollow') }}
</div> </div>
</template> </template>
</dangerous-button> </dangerous-button>

10
front/src/views/content/remote/Home.vue
View File

@ -47,7 +47,7 @@ const scanResult = ref()
:class="['ui', {'active': isLoading}, 'inverted', 'dimmer']" :class="['ui', {'active': isLoading}, 'inverted', 'dimmer']"
> >
<div class="ui text loader"> <div class="ui text loader">
{{ $t('views.content.remote.Home.loadingMessage') }} {{ $t('views.content.remote.Home.loading.remoteLibraries') }}
</div> </div>
</div> </div>
<div <div
@ -55,10 +55,10 @@ const scanResult = ref()
class="ui text container" class="ui text container"
> >
<h1 class="ui header"> <h1 class="ui header">
{{ $t('views.content.remote.Home.remoteLibrariesHeader') }} {{ $t('views.content.remote.Home.header.remoteLibraries') }}
</h1> </h1>
<p> <p>
{{ $t('views.content.remote.Home.remoteLibrariesDescription') }} {{ $t('views.content.remote.Home.description.remoteLibraries') }}
</p> </p>
<scan-form @scanned="scanResult = $event" /> <scan-form @scanned="scanResult = $event" />
<div class="ui hidden divider" /> <div class="ui hidden divider" />
@ -74,7 +74,7 @@ const scanResult = ref()
</div> </div>
<template v-if="existingFollows && existingFollows.count > 0"> <template v-if="existingFollows && existingFollows.count > 0">
<h2> <h2>
{{ $t('views.content.remote.Home.knownLibrariesHeader') }} {{ $t('views.content.remote.Home.header.knownLibraries') }}
</h2> </h2>
<a <a
href="" href=""
@ -82,7 +82,7 @@ const scanResult = ref()
@click.prevent="fetchData" @click.prevent="fetchData"
> >
<i :class="['ui', 'circular', 'refresh', 'icon']" /> <i :class="['ui', 'circular', 'refresh', 'icon']" />
{{ $t('views.content.remote.Home.refreshButton') }} {{ $t('views.content.remote.Home.button.refresh') }}
</a> </a>
<div class="ui hidden divider" /> <div class="ui hidden divider" />
<div class="ui two cards"> <div class="ui two cards">

8
front/src/views/content/remote/ScanForm.vue
View File

@ -15,8 +15,8 @@ const emit = defineEmits<Events>()
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
placeholder: t('views.content.remote.ScanForm.placeholder'), placeholder: t('views.content.remote.ScanForm.placeholder.url'),
submitLibrarySearch: t('views.content.remote.ScanForm.submitLibrarySearch') submitLibrarySearch: t('views.content.remote.ScanForm.button.submit')
})) }))
const errors = ref([] as string[]) const errors = ref([] as string[])
@ -49,7 +49,7 @@ const scan = async () => {
class="ui negative message" class="ui negative message"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.content.remote.ScanForm.failureHeader') }} {{ $t('views.content.remote.ScanForm.header.failure') }}
</h4> </h4>
<ul class="list"> <ul class="list">
<li <li
@ -61,7 +61,7 @@ const scan = async () => {
</ul> </ul>
</div> </div>
<div class="ui field"> <div class="ui field">
<label for="library-search">{{ $t('views.content.remote.ScanForm.searchLabel') }}</label> <label for="library-search">{{ $t('views.content.remote.ScanForm.label.search') }}</label>
<div :class="['ui', 'action', {loading: isLoading}, 'input']"> <div :class="['ui', 'action', {loading: isLoading}, 'input']">
<input <input
id="library-search" id="library-search"

4
front/src/views/library/DetailAlbums.vue
View File

@ -26,12 +26,12 @@ defineProps<Props>()
<span <span
v-if="isOwner" v-if="isOwner"
> >
{{ $t('views.library.DetailAlbums.ownerEmptyState') }} {{ $t('views.library.DetailAlbums.empty.upload') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.library.DetailAlbums.viewerEmptyState') }} {{ $t('views.library.DetailAlbums.empty.follow') }}
</span> </span>
</p> </p>
</empty-state> </empty-state>

4
front/src/views/library/DetailOverview.vue
View File

@ -35,12 +35,12 @@ defineProps<Props>()
<span <span
v-if="isOwner" v-if="isOwner"
> >
{{ $t('views.library.DetailOverview.ownerEmptyState') }} {{ $t('views.library.DetailOverview.empty.upload') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.library.DetailOverview.viewerEmptyState') }} {{ $t('views.library.DetailOverview.empty.follow') }}
</span> </span>
</p> </p>
</empty-state> </empty-state>

4
front/src/views/library/DetailTracks.vue
View File

@ -25,12 +25,12 @@ defineProps<Props>()
<span <span
v-if="isOwner" v-if="isOwner"
> >
{{ $t('views.library.DetailTracks.ownerEmptyState') }} {{ $t('views.library.DetailTracks.empty.upload') }}
</span> </span>
<span <span
v-else v-else
> >
{{ $t('views.library.DetailTracks.viewerEmptyState') }} {{ $t('views.library.DetailTracks.empty.follow') }}
</span> </span>
</p> </p>
</empty-state> </empty-state>

26
front/src/views/library/Edit.vue
View File

@ -59,20 +59,20 @@ const updateApproved = async (follow: LibraryFollow, approved: boolean) => {
/> />
<div class="ui hidden divider" /> <div class="ui hidden divider" />
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.library.Edit.libraryContentsHeader') }} {{ $t('views.library.Edit.header.libraryContents') }}
</h2> </h2>
<library-files-table :filters="{ library: object.uuid }" /> <library-files-table :filters="{ library: object.uuid }" />
<div class="ui hidden divider" /> <div class="ui hidden divider" />
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.library.Edit.followersHeader') }} {{ $t('views.library.Edit.header.followers') }}
</h2> </h2>
<div <div
v-if="isLoading" v-if="isLoading"
:class="['ui', {'active': isLoading}, 'inverted', 'dimmer']" :class="['ui', {'active': isLoading}, 'inverted', 'dimmer']"
> >
<div class="ui text loader"> <div class="ui text loader">
{{ $t('views.library.Edit.loadingFollowers') }} {{ $t('views.library.Edit.loading.followers') }}
</div> </div>
</div> </div>
<table <table
@ -82,16 +82,16 @@ const updateApproved = async (follow: LibraryFollow, approved: boolean) => {
<thead> <thead>
<tr> <tr>
<th> <th>
{{ $t('views.library.Edit.userTableHeader') }} {{ $t('views.library.Edit.table.action.header.user') }}
</th> </th>
<th> <th>
{{ $t('views.library.Edit.dateTableHeader') }} {{ $t('views.library.Edit.table.action.header.date') }}
</th> </th>
<th> <th>
{{ $t('views.library.Edit.statusTableHeader') }} {{ $t('views.library.Edit.table.action.header.status') }}
</th> </th>
<th> <th>
{{ $t('views.library.Edit.actionTableHeader') }} {{ $t('views.library.Edit.table.action.header.action') }}
</th> </th>
</tr> </tr>
</thead> </thead>
@ -106,19 +106,19 @@ const updateApproved = async (follow: LibraryFollow, approved: boolean) => {
v-if="follow.approved === null" v-if="follow.approved === null"
:class="['ui', 'warning', 'basic', 'label']" :class="['ui', 'warning', 'basic', 'label']"
> >
{{ $t('views.library.Edit.pendingStatus') }} {{ $t('views.library.Edit.table.action.status.pending') }}
</span> </span>
<span <span
v-else-if="follow.approved === true" v-else-if="follow.approved === true"
:class="['ui', 'success', 'basic', 'label']" :class="['ui', 'success', 'basic', 'label']"
> >
{{ $t('views.library.Edit.acceptedStatus') }} {{ $t('views.library.Edit.table.action.status.accepted') }}
</span> </span>
<span <span
v-else-if="follow.approved === false" v-else-if="follow.approved === false"
:class="['ui', 'danger', 'basic', 'label']" :class="['ui', 'danger', 'basic', 'label']"
> >
{{ $t('views.library.Edit.rejectedStatus') }} {{ $t('views.library.Edit.table.action.status.rejected') }}
</span> </span>
</td> </td>
<td> <td>
@ -128,7 +128,7 @@ const updateApproved = async (follow: LibraryFollow, approved: boolean) => {
@click="updateApproved(follow, true)" @click="updateApproved(follow, true)"
> >
<i class="ui check icon" /> <i class="ui check icon" />
{{ $t('views.library.Edit.acceptButton') }} {{ $t('views.library.Edit.button.accept') }}
</button> </button>
<button <button
v-if="follow.approved === null || follow.approved === true" v-if="follow.approved === null || follow.approved === true"
@ -136,13 +136,13 @@ const updateApproved = async (follow: LibraryFollow, approved: boolean) => {
@click="updateApproved(follow, false)" @click="updateApproved(follow, false)"
> >
<i class="ui x icon" /> <i class="ui x icon" />
{{ $t('views.library.Edit.rejectButton') }} {{ $t('views.library.Edit.button.reject') }}
</button> </button>
</td> </td>
</tr> </tr>
</table> </table>
<p v-else> <p v-else>
{{ $t('views.library.Edit.noFollowers') }} {{ $t('views.library.Edit.empty.noFollowers') }}
</p> </p>
</section> </section>
</template> </template>

34
front/src/views/library/LibraryBase.vue
View File

@ -38,14 +38,14 @@ const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
title: t('views.library.LibraryBase.title'), title: t('views.library.LibraryBase.title'),
visibility: { visibility: {
me: t('views.library.LibraryBase.privateVisibility'), me: t('views.library.LibraryBase.label.private'),
instance: t('views.library.LibraryBase.instanceVisibility'), instance: t('views.library.LibraryBase.label.instance'),
everyone: t('views.library.LibraryBase.publicVisibility') everyone: t('views.library.LibraryBase.label.public')
}, },
tooltips: { tooltips: {
me: t('views.library.LibraryBase.privateTooltip'), me: t('views.library.LibraryBase.tooltip.private'),
instance: t('views.library.LibraryBase.instanceTooltip'), instance: t('views.library.LibraryBase.tooltip.instance'),
everyone: t('views.library.LibraryBase.publicTooltip') everyone: t('views.library.LibraryBase.tooltip.public')
} }
})) }))
@ -110,7 +110,7 @@ const updateUploads = (count: number) => {
class="basic item" class="basic item"
> >
<i class="external icon" /> <i class="external icon" />
{{ $t('views.library.LibraryBase.domainViewLink', {domain: object.actor.domain}) }} {{ $t('views.library.LibraryBase.link.domain', {domain: object.actor.domain}) }}
</a> </a>
<div <div
v-for="obj in getReportableObjects({library: object})" v-for="obj in getReportableObjects({library: object})"
@ -129,7 +129,7 @@ const updateUploads = (count: number) => {
:to="{name: 'manage.library.libraries.detail', params: {id: object.uuid}}" :to="{name: 'manage.library.libraries.detail', params: {id: object.uuid}}"
> >
<i class="wrench icon" /> <i class="wrench icon" />
{{ $t('views.library.LibraryBase.moderationLink') }} {{ $t('views.library.LibraryBase.link.moderation') }}
</router-link> </router-link>
</div> </div>
</button> </button>
@ -148,7 +148,7 @@ const updateUploads = (count: number) => {
:actor="object.actor" :actor="object.actor"
:truncate-length="0" :truncate-length="0"
> >
{{ $t('views.library.LibraryBase.ownerLink', {username: object.actor.full_username}) }} {{ $t('views.library.LibraryBase.link.owner', {username: object.actor.full_username}) }}
</actor-link> </actor-link>
</div> </div>
</div> </div>
@ -178,7 +178,7 @@ const updateUploads = (count: number) => {
</span> </span>
<span class="middledot icon"> <span class="middledot icon">
<i class="music icon" /> <i class="music icon" />
{{ $t('views.library.LibraryBase.trackCount', {count: object.uploads_count}) }} {{ $t('views.library.LibraryBase.meta.tracks', {count: object.uploads_count}) }}
</span> </span>
<span v-if="object.size"> <span v-if="object.size">
<i class="database icon" /> <i class="database icon" />
@ -216,10 +216,10 @@ const updateUploads = (count: number) => {
<div class="ui form"> <div class="ui form">
<div class="field"> <div class="field">
<label for="copy-input"> <label for="copy-input">
{{ $t('views.library.LibraryBase.sharingLinkLabel') }} {{ $t('views.library.LibraryBase.label.sharingLink') }}
</label> </label>
<p> <p>
{{ $t('views.library.LibraryBase.sharingLinkDescription') }} {{ $t('views.library.LibraryBase.description.sharingLink') }}
</p> </p>
<copy-input :value="object.fid" /> <copy-input :value="object.fid" />
</div> </div>
@ -234,21 +234,21 @@ const updateUploads = (count: number) => {
:to="{name: 'library.detail'}" :to="{name: 'library.detail'}"
> >
{{ $t('views.library.LibraryBase.artistsLink') }} {{ $t('views.library.LibraryBase.link.artists') }}
</router-link> </router-link>
<router-link <router-link
class="item" class="item"
:to="{name: 'library.detail.albums'}" :to="{name: 'library.detail.albums'}"
> >
{{ $t('views.library.LibraryBase.albumsLink') }} {{ $t('views.library.LibraryBase.link.albums') }}
</router-link> </router-link>
<router-link <router-link
class="item" class="item"
:to="{name: 'library.detail.tracks'}" :to="{name: 'library.detail.tracks'}"
> >
{{ $t('views.library.LibraryBase.tracksLink') }} {{ $t('views.library.LibraryBase.link.tracks') }}
</router-link> </router-link>
<router-link <router-link
v-if="isOwner" v-if="isOwner"
@ -257,7 +257,7 @@ const updateUploads = (count: number) => {
:to="{name: 'library.detail.upload'}" :to="{name: 'library.detail.upload'}"
> >
<i class="upload icon" /> <i class="upload icon" />
{{ $t('views.library.LibraryBase.uploadButton') }} {{ $t('views.library.LibraryBase.button.upload') }}
</router-link> </router-link>
<router-link <router-link
v-if="isOwner" v-if="isOwner"
@ -266,7 +266,7 @@ const updateUploads = (count: number) => {
:to="{name: 'library.detail.edit'}" :to="{name: 'library.detail.edit'}"
> >
<i class="pencil icon" /> <i class="pencil icon" />
{{ $t('views.library.LibraryBase.editButton') }} {{ $t('views.library.LibraryBase.button.edit') }}
</router-link> </router-link>
</div> </div>
<div class="ui hidden divider" /> <div class="ui hidden divider" />

28
front/src/views/playlists/Detail.vue
View File

@ -93,7 +93,7 @@ const deletePlaylist = async () => {
<div class="content"> <div class="content">
{{ playlist.name }} {{ playlist.name }}
<div class="sub header"> <div class="sub header">
{{ $t('views.playlists.Detail.trackCount', {count: tracks_count, username: playlist.user.username}) }} {{ $t('views.playlists.Detail.meta.tracks', {count: tracks_count, username: playlist.user.username}) }}
<br> <br>
<duration :seconds="playlist.duration" /> <duration :seconds="playlist.duration" />
</div> </div>
@ -107,7 +107,7 @@ const deletePlaylist = async () => {
:is-playable="playlist.is_playable" :is-playable="playlist.is_playable"
:tracks="tracks" :tracks="tracks"
> >
{{ $t('views.playlists.Detail.playAllButton') }} {{ $t('views.playlists.Detail.button.playAll') }}
</play-button> </play-button>
</div> </div>
<div class="ui buttons"> <div class="ui buttons">
@ -118,10 +118,10 @@ const deletePlaylist = async () => {
> >
<i class="pencil icon" /> <i class="pencil icon" />
<template v-if="edit"> <template v-if="edit">
{{ $t('views.playlists.Detail.stopEditButton') }} {{ $t('views.playlists.Detail.button.stopEdit') }}
</template> </template>
<template v-else> <template v-else>
{{ $t('views.playlists.Detail.editButton') }} {{ $t('views.playlists.Detail.button.edit') }}
</template> </template>
</button> </button>
</div> </div>
@ -132,7 +132,7 @@ const deletePlaylist = async () => {
@click="showEmbedModal = !showEmbedModal" @click="showEmbedModal = !showEmbedModal"
> >
<i class="code icon" /> <i class="code icon" />
{{ $t('views.playlists.Detail.embedButton') }} {{ $t('views.playlists.Detail.button.embed') }}
</button> </button>
<dangerous-button <dangerous-button
v-if="$store.state.auth.profile && playlist.user.id === $store.state.auth.profile.id" v-if="$store.state.auth.profile && playlist.user.id === $store.state.auth.profile.id"
@ -140,20 +140,20 @@ const deletePlaylist = async () => {
:action="deletePlaylist" :action="deletePlaylist"
> >
<i class="trash icon" /> <i class="trash icon" />
{{ $t('views.playlists.Detail.deleteButton') }} {{ $t('views.playlists.Detail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.playlists.Detail.deleteModalHeader', {playlist: playlist.name}) }} {{ $t('views.playlists.Detail.modal.delete.header', {playlist: playlist.name}) }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<p> <p>
{{ $t('views.playlists.Detail.deleteModalMessage') }} {{ $t('views.playlists.Detail.modal.delete.content.warning') }}
</p> </p>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<div> <div>
{{ $t('views.playlists.Detail.deleteModalConfirm') }} {{ $t('views.playlists.Detail.button.confirm') }}
</div> </div>
</template> </template>
</dangerous-button> </dangerous-button>
@ -164,7 +164,7 @@ const deletePlaylist = async () => {
v-model:show="showEmbedModal" v-model:show="showEmbedModal"
> >
<h4 class="header"> <h4 class="header">
{{ $t('views.playlists.Detail.embedModalHeader') }} {{ $t('views.playlists.Detail.modal.embed.header') }}
</h4> </h4>
<div class="scrolling content"> <div class="scrolling content">
<div class="description"> <div class="description">
@ -176,7 +176,7 @@ const deletePlaylist = async () => {
</div> </div>
<div class="actions"> <div class="actions">
<button class="ui basic deny button"> <button class="ui basic deny button">
{{ $t('views.playlists.Detail.cancelButton') }} {{ $t('views.playlists.Detail.button.cancel') }}
</button> </button>
</div> </div>
</semantic-modal> </semantic-modal>
@ -191,7 +191,7 @@ const deletePlaylist = async () => {
</template> </template>
<template v-else-if="tracks.length > 0"> <template v-else-if="tracks.length > 0">
<h2> <h2>
{{ $t('views.playlists.Detail.tracksHeader') }} {{ $t('views.playlists.Detail.header.tracks') }}
</h2> </h2>
<track-table <track-table
:display-position="true" :display-position="true"
@ -205,14 +205,14 @@ const deletePlaylist = async () => {
> >
<div class="ui icon header"> <div class="ui icon header">
<i class="list icon" /> <i class="list icon" />
{{ $t('views.playlists.Detail.emptyState') }} {{ $t('views.playlists.Detail.empty.noTracks') }}
</div> </div>
<button <button
class="ui success icon labeled button" class="ui success icon labeled button"
@click="edit = !edit" @click="edit = !edit"
> >
<i class="pencil icon" /> <i class="pencil icon" />
{{ $t('views.playlists.Detail.editButton') }} {{ $t('views.playlists.Detail.button.edit') }}
</button> </button>
</div> </div>
</section> </section>

26
front/src/views/playlists/List.vue
View File

@ -97,8 +97,8 @@ onMounted(() => $('.ui.dropdown').dropdown())
const { t } = useI18n() const { t } = useI18n()
const labels = computed(() => ({ const labels = computed(() => ({
playlists: t('views.playlists.List.playlistsHeader'), playlists: t('views.playlists.List.header.playlists'),
searchPlaceholder: t('views.playlists.List.searchPlaceholder') searchPlaceholder: t('views.playlists.List.placeholder.search')
})) }))
const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value].sort((a, b) => a - b))) const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value].sort((a, b) => a - b)))
@ -108,14 +108,14 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
<main v-title="labels.playlists"> <main v-title="labels.playlists">
<section class="ui vertical stripe segment"> <section class="ui vertical stripe segment">
<h2 class="ui header"> <h2 class="ui header">
{{ $t('views.playlists.List.browsePlaylistsHeader') }} {{ $t('views.playlists.List.header.browse') }}
</h2> </h2>
<template v-if="$store.state.auth.authenticated"> <template v-if="$store.state.auth.authenticated">
<button <button
class="ui success button" class="ui success button"
@click="$store.commit('playlists/showModal', true)" @click="$store.commit('playlists/showModal', true)"
> >
{{ $t('views.playlists.List.manageButton') }} {{ $t('views.playlists.List.button.manage') }}
</button> </button>
<div class="ui hidden divider" /> <div class="ui hidden divider" />
</template> </template>
@ -125,7 +125,7 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
> >
<div class="fields"> <div class="fields">
<div class="field"> <div class="field">
<label for="playlists-search">{{ $t('views.playlists.List.searchLabel') }}</label> <label for="playlists-search">{{ $t('views.playlists.List.label.search') }}</label>
<div class="ui action input"> <div class="ui action input">
<input <input
id="playlists-search" id="playlists-search"
@ -137,14 +137,14 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
<button <button
class="ui icon button" class="ui icon button"
type="submit" type="submit"
:aria-label="t('views.playlists.List.searchLabel')" :aria-label="t('views.playlists.List.button.search')"
> >
<i class="search icon" /> <i class="search icon" />
</button> </button>
</div> </div>
</div> </div>
<div class="field"> <div class="field">
<label for="playlists-ordering">{{ $t('views.playlists.List.orderingLabel') }}</label> <label for="playlists-ordering">{{ $t('views.playlists.List.ordering.label') }}</label>
<select <select
id="playlists-ordering" id="playlists-ordering"
v-model="ordering" v-model="ordering"
@ -160,22 +160,22 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
</select> </select>
</div> </div>
<div class="field"> <div class="field">
<label for="playlists-ordering-direction">{{ $t('views.playlists.List.orderingDirectionLabel') }}</label> <label for="playlists-ordering-direction">{{ $t('views.playlists.List.ordering.direction.label') }}</label>
<select <select
id="playlists-ordering-direction" id="playlists-ordering-direction"
v-model="orderingDirection" v-model="orderingDirection"
class="ui dropdown" class="ui dropdown"
> >
<option value="+"> <option value="+">
{{ $t('views.playlists.List.ascendingOrdering') }} {{ $t('views.playlists.List.ordering.direction.ascending') }}
</option> </option>
<option value="-"> <option value="-">
{{ $t('views.playlists.List.descendingOrdering') }} {{ $t('views.playlists.List.ordering.direction.descending') }}
</option> </option>
</select> </select>
</div> </div>
<div class="field"> <div class="field">
<label for="playlists-results">{{ $t('views.playlists.List.resultsPerPage') }}</label> <label for="playlists-results">{{ $t('views.playlists.List.pagination.results') }}</label>
<select <select
id="playlists-results" id="playlists-results"
v-model="paginateBy" v-model="paginateBy"
@ -204,7 +204,7 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
> >
<div class="ui icon header"> <div class="ui icon header">
<i class="list icon" /> <i class="list icon" />
{{ $t('views.playlists.List.emptyState') }} {{ $t('views.playlists.List.empty.noResults') }}
</div> </div>
<button <button
v-if="$store.state.auth.authenticated" v-if="$store.state.auth.authenticated"
@ -212,7 +212,7 @@ const paginateOptions = computed(() => sortedUniq([12, 25, 50, paginateBy.value]
@click="$store.commit('playlists/chooseTrack', null)" @click="$store.commit('playlists/chooseTrack', null)"
> >
<i class="list icon" /> <i class="list icon" />
{{ $t('views.playlists.List.createPlaylistButton') }} {{ $t('views.playlists.List.button.create') }}
</button> </button>
</div> </div>
<div class="ui center aligned basic segment"> <div class="ui center aligned basic segment">

18
front/src/views/radios/Detail.vue
View File

@ -82,7 +82,7 @@ const deleteRadio = async () => {
<div class="content"> <div class="content">
{{ radio.name }} {{ radio.name }}
<div class="sub header"> <div class="sub header">
{{ $t('views.radios.Detail.radioSubheader', {tracks: totalTracks}) }}<username :username="radio.user.username" /> {{ $t('views.radios.Detail.header.radio', {tracks: totalTracks}) }}<username :username="radio.user.username" />
</div> </div>
</div> </div>
</h2> </h2>
@ -97,26 +97,26 @@ const deleteRadio = async () => {
:to="{name: 'library.radios.edit', params: {id: radio.id}}" :to="{name: 'library.radios.edit', params: {id: radio.id}}"
> >
<i class="pencil icon" /> <i class="pencil icon" />
{{ $t('views.radios.Detail.editButton') }} {{ $t('views.radios.Detail.button.edit') }}
</router-link> </router-link>
<dangerous-button <dangerous-button
class="ui labeled danger icon button" class="ui labeled danger icon button"
:action="deleteRadio" :action="deleteRadio"
> >
<i class="trash icon" /> {{ $t('views.radios.Detail.deleteButton') }} <i class="trash icon" /> {{ $t('views.radios.Detail.button.delete') }}
<template #modal-header> <template #modal-header>
<p> <p>
{{ $t('views.radios.Detail.deleteModalHeader', {radio: radio.name}) }} {{ $t('views.radios.Detail.modal.delete.header', {radio: radio.name}) }}
</p> </p>
</template> </template>
<template #modal-content> <template #modal-content>
<p> <p>
{{ $t('views.radios.Detail.deleteModalMessage') }} {{ $t('views.radios.Detail.modal.delete.content.warning') }}
</p> </p>
</template> </template>
<template #modal-confirm> <template #modal-confirm>
<p> <p>
{{ $t('views.radios.Detail.deleteModalConfirm') }} {{ $t('views.radios.Detail.button.confirm') }}
</p> </p>
</template> </template>
</dangerous-button> </dangerous-button>
@ -128,7 +128,7 @@ const deleteRadio = async () => {
class="ui vertical stripe segment" class="ui vertical stripe segment"
> >
<h2> <h2>
{{ $t('views.radios.Detail.tracksHeader') }} {{ $t('views.radios.Detail.header.tracks') }}
</h2> </h2>
<track-table :tracks="tracks" /> <track-table :tracks="tracks" />
<div class="ui center aligned basic segment"> <div class="ui center aligned basic segment">
@ -146,7 +146,7 @@ const deleteRadio = async () => {
> >
<div class="ui icon header"> <div class="ui icon header">
<i class="rss icon" /> <i class="rss icon" />
{{ $t('views.radios.Detail.emptyState') }} {{ $t('views.radios.Detail.empty.noTracks') }}
</div> </div>
<router-link <router-link
v-if="$store.state.auth.username === radio?.user.username" v-if="$store.state.auth.username === radio?.user.username"
@ -154,7 +154,7 @@ const deleteRadio = async () => {
:to="{name: 'library.radios.edit', params: { id: radio?.id }}" :to="{name: 'library.radios.edit', params: { id: radio?.id }}"
> >
<i class="pencil icon" /> <i class="pencil icon" />
{{ $t('views.radios.Detail.editButton') }} {{ $t('views.radios.Detail.button.edit') }}
</router-link> </router-link>
</div> </div>
</main> </main>