diff --git a/front/package.json b/front/package.json index 43116ca50..051076f21 100644 --- a/front/package.json +++ b/front/package.json @@ -76,7 +76,6 @@ "@vue/eslint-config-typescript": "11.0.2", "@vue/test-utils": "2.2.4", "@vue/tsconfig": "0.1.3", - "easygettext": "2.17.0", "eslint": "8.28.0", "eslint-config-standard": "17.0.0", "eslint-plugin-html": "7.1.0", diff --git a/front/src/components/About.vue b/front/src/components/About.vue index 6e2bf9815..fddb6a1ba 100644 --- a/front/src/components/About.vue +++ b/front/src/components/About.vue @@ -1,6 +1,6 @@ @@ -20,13 +20,13 @@ const labels = computed(() => ({

- + Page not found!

- + Sorry, the page you asked for does not exist:

@@ -36,7 +36,7 @@ const labels = computed(() => ({ class="ui icon labeled right button" to="/" > - + Go to home page diff --git a/front/src/components/Queue.vue b/front/src/components/Queue.vue index 763058190..e90b613fa 100644 --- a/front/src/components/Queue.vue +++ b/front/src/components/Queue.vue @@ -4,7 +4,6 @@ import type { QueueItemSource } from '~/types' import { whenever, watchDebounced, useCurrentElement, useScrollLock, useFullscreen, useIdle, refAutoReset, useStorage } from '@vueuse/core' import { nextTick, ref, computed, watchEffect, onMounted } from 'vue' import { useFocusTrap } from '@vueuse/integrations/useFocusTrap' -import { useGettext } from 'vue3-gettext' import { useRouter } from 'vue-router' import { useStore } from '~/store' @@ -18,6 +17,11 @@ import TrackFavoriteIcon from '~/components/favorites/TrackFavoriteIcon.vue' import TrackPlaylistIcon from '~/components/playlists/TrackPlaylistIcon.vue' import PlayerControls from '~/components/audio/PlayerControls.vue' import MilkDrop from '~/components/audio/visualizer/MilkDrop.vue' +import { whenever, watchDebounced, useCurrentElement, useScrollLock } from '@vueuse/core' +import { useI18n } from 'vue-i18n' +import useQueue from '~/composables/audio/useQueue' +import usePlayer from '~/composables/audio/usePlayer' + import VirtualList from '~/components/vui/list/VirtualList.vue' import QueueItem from '~/components/QueueItem.vue' @@ -49,24 +53,24 @@ const { currentSound } = useTracks() const queueModal = ref() const { activate, deactivate } = useFocusTrap(queueModal, { allowOutsideClick: true, preventScroll: true }) -const { $pgettext } = useGettext() +const { t } = useI18n() const scrollLock = useScrollLock(document.body) const store = useStore() const labels = computed(() => ({ - queue: $pgettext('*/*/*', 'Queue'), - populating: $pgettext('*/*/*', 'Fetching radio track'), - duration: $pgettext('*/*/*', 'Duration'), - addArtistContentFilter: $pgettext('Sidebar/Player/Icon.Tooltip/Verb', 'Hide content from this artist…'), - restart: $pgettext('*/*/*', 'Restart track'), - previous: $pgettext('*/*/*', 'Previous track'), - next: $pgettext('*/*/*', 'Next track'), - pause: $pgettext('*/*/*', 'Pause'), - play: $pgettext('*/*/*', 'Play'), - fullscreen: $pgettext('*/*/*', 'Fullscreen'), - exitFullscreen: $pgettext('*/*/*', 'Exit fullscreen'), - showCoverArt: $pgettext('*/*/*', 'Show cover art'), - showVisualizer: $pgettext('*/*/*', 'Show visualizer') + queue: t('Queue'), + populating: t('Fetching radio track'), + duration: t('Duration'), + addArtistContentFilter: t('Hide content from this artist…'), + restart: t('Restart track'), + previous: t('Previous track'), + next: t('Next track'), + pause: t('Pause'), + play: t('Play'), + fullscreen: t('Fullscreen'), + exitFullscreen: t('Exit fullscreen'), + showCoverArt: t('Show cover art'), + showVisualizer: t('Show visualizer') })) watchEffect(async () => { @@ -125,10 +129,11 @@ const queueItems = computed(() => queue.value.map((track, index) => ({ ...track, key: `${index}-${track.id}`, labels: { - remove: $pgettext('*/*/*', 'Remove'), - selectTrack: $pgettext('*/*/*', 'Select track'), - favorite: $pgettext('*/*/*', 'Favorite track') - } + remove: t('Remove'), + selectTrack: t('Select track'), + favorite: t('Favorite track') + }, + duration: time.durationFormatted(track.uploads[0]?.duration ?? 0) ?? '' }) as QueueItemSource)) const reorderTracks = async (from: number, to: number) => { @@ -296,18 +301,18 @@ const coverType = useStorage('queue:cover-type', CoverType.COVER_ART) class="ui small warning message" >

- + The track cannot be loaded

- + The next track will play automatically in a few seconds…