diff --git a/front/src/components/federation/LibraryCard.vue b/front/src/components/federation/LibraryCard.vue
index a5579c125acb8cf5691cfc572b03a6ce03fd5204..f91b003ebae5140059f5657563a1437248513623 100644
--- a/front/src/components/federation/LibraryCard.vue
+++ b/front/src/components/federation/LibraryCard.vue
@@ -7,41 +7,39 @@
</div>
<div class="content">
<span class="right floated" v-if="following">
- <i class="check icon"></i> Following
+ <i class="check icon"></i><i18next path="Following"/>
</span>
<span class="right floated" v-else-if="manuallyApprovesFollowers">
- <i class="lock icon"></i> Followers only
+ <i class="lock icon"></i><i18next path="Followers only"/>
</span>
<span class="right floated" v-else>
- <i class="open lock icon"></i> Open
+ <i class="open lock icon"></i><i18next path="Open"/>
</span>
<span v-if="totalItems">
<i class="music icon"></i>
- {{ totalItems }} tracks
+ <i18next path="{%0%} tracks">
+ {{ totalItems }}
+ </i18next>
</span>
</div>
<div class="extra content">
<template v-if="awaitingApproval">
<i class="clock icon"></i>
- Follow request pending approval
+ <i18next path="Follow request pending approval"/>
</template>
<div
v-if="!library"
@click="follow"
:disabled="isLoading"
:class="['ui', 'basic', {loading: isLoading}, 'green', 'button']">
- <template v-if="manuallyApprovesFollowers">
- Send a follow request
- </template>
- <template v-else>
- Follow
- </template>
+ <i18next v-if="manuallyApprovesFollowers" path="Send a follow request"/>
+ <i18next v-else path="Follow">
</div>
<router-link
v-else
class="ui basic button"
:to="{name: 'federation.libraries.detail', params: {id: library.uuid }}">
- Detail
+ <i18next path="Detail"/>
</router-link>
</div>
</div>
diff --git a/front/src/components/federation/LibraryFollowTable.vue b/front/src/components/federation/LibraryFollowTable.vue
index 9a35e0db636b92be2a953253d09c2418de731702..fd16d83710cc956def2a8ce46a1b0e7d4b3506c9 100644
--- a/front/src/components/federation/LibraryFollowTable.vue
+++ b/front/src/components/federation/LibraryFollowTable.vue
@@ -8,7 +8,7 @@
<div class="ui four wide inline field">
<div class="ui checkbox">
<input v-model="pending" type="checkbox">
- <label>Pending approval</label>
+ <label><i18next path="Pending approval"/></label>
</div>
</div>
</div>
@@ -17,10 +17,10 @@
<table v-if="result" class="ui very basic single line unstackable table">
<thead>
<tr>
- <th>Actor</th>
- <th>Creation date</th>
- <th>Status</th>
- <th>Actions</th>
+ <i18next tag="th" path="Actor"/>
+ <i18next tag="th" path="Creation date"/>
+ <i18next tag="th" path="Status"/>
+ <i18next tag="th" path="Actions"/>
</tr>
</thead>
<tbody>
@@ -33,27 +33,36 @@
</td>
<td>
<template v-if="follow.approved === true">
- <i class="check icon"></i> Approved
+ <i class="check icon"></i><i18next path="Approved"/>
</template>
<template v-else-if="follow.approved === false">
- <i class="x icon"></i> Refused
+ <i class="x icon"></i><i18next path="Refused"/>
</template>
<template v-else>
- <i class="clock icon"></i> Pending
+ <i class="clock icon"></i><i18next path="Pending"/>
</template>
</td>
<td>
<dangerous-button v-if="follow.approved !== false" class="tiny basic labeled icon" color='red' @confirm="updateFollow(follow, false)">
- <i class="x icon"></i> Deny
- <p slot="modal-header">Deny access?</p>
- <p slot="modal-content">By confirming, {{ follow.actor.preferred_username }}@{{ follow.actor.domain }} will be denied access to your library.</p>
- <p slot="modal-confirm">Deny</p>
+ <i class="x icon"></i><i18next path="Deny"/>
+ <p slot="modal-header"><i18next path="Deny access?"/></p>
+ <p slot="modal-content">
+ <i18next path="By confirming, {%0%}@{%1%} will be denied access to your library.">
+ {{ follow.actor.preferred_username }}
+ {{ follow.actor.domain }}
+ </i18next>
+ </p>
+ <p slot="modal-confirm"><i18next path="Deny"/></p>
</dangerous-button>
<dangerous-button v-if="follow.approved !== true" class="tiny basic labeled icon" color='green' @confirm="updateFollow(follow, true)">
- <i class="x icon"></i> Approve
- <p slot="modal-header">Approve access?</p>
- <p slot="modal-content">By confirming, {{ follow.actor.preferred_username }}@{{ follow.actor.domain }} will be granted access to your library.</p>
- <p slot="modal-confirm">Approve</p>
+ <i class="x icon"></i> <i18next path="Approve"/>
+ <p slot="modal-header"><i18next path="Approve access?"/></p>
+ <p slot="modal-content">
+ <i18next path="By confirming, {%0%}@{%1%} will be granted access to your library.">
+ {{ follow.actor.preferred_username }}
+ {{ follow.actor.domain }}
+ </i18next>
+ <p slot="modal-confirm"><i18next path="Approve"/></p>
</dangerous-button>
</td>
</tr>
@@ -71,7 +80,12 @@
></pagination>
</th>
<th v-if="result && result.results.length > 0">
- Showing results {{ ((page-1) * paginateBy) + 1 }}-{{ ((page-1) * paginateBy) + result.results.length }} on {{ result.count }}</th>
+ <i18next path="Showing results {%0%}-{%1%} on {%2%}">
+ {{ ((page-1) * paginateBy) + 1 }}
+ {{ ((page-1) * paginateBy) + result.results.length }}
+ {{ result.count }}
+ </i18next>
+ </th>
<th></th>
<th></th>
</tr>
diff --git a/front/src/components/federation/LibraryForm.vue b/front/src/components/federation/LibraryForm.vue
index 3aec5213d96ff6a3558380db3706233c1187d8b0..7e1d5c49f4a70c67fa64db3fefeae91b75dc28fb 100644
--- a/front/src/components/federation/LibraryForm.vue
+++ b/front/src/components/federation/LibraryForm.vue
@@ -1,9 +1,9 @@
<template>
<form class="ui form" @submit.prevent="fetchInstanceInfo">
- <h3 class="ui header">Federate with a new instance</h3>
- <p>Use this form to scan an instance and setup federation.</p>
+ <h3 class="ui header"><i18next path="Federate with a new instance"/></h3>
+ <p><i18next path="Use this form to scan an instance and setup federation."/></p>
<div v-if="errors.length > 0 || scanErrors.length > 0" class="ui negative message">
- <div class="header">Error while scanning library</div>
+ <div class="header"><i18next path="Error while scanning library"/></div>
<ul class="list">
<li v-for="error in errors">{{ error }}</li>
<li v-for="error in scanErrors">{{ error }}</li>
@@ -11,7 +11,7 @@
</div>
<div class="ui two fields">
<div class="ui field">
- <label>Library name</label>
+ <label><i18next path="Library name"/></label>
<input v-model="libraryUsername" type="text" placeholder="library@demo.funkwhale.audio" />
</div>
<div class="ui field">
@@ -21,7 +21,7 @@
:disabled="isLoading"
:class="['ui', 'icon', {loading: isLoading}, 'button']">
<i class="search icon"></i>
- Launch scan
+ <i18next path="Launch scan"/>
</button>
</div>
</div>
diff --git a/front/src/components/federation/LibraryTrackTable.vue b/front/src/components/federation/LibraryTrackTable.vue
index 6404f39905814e88812c3012e6be0d8e58fd4a52..814f94f25cc01198caa6d4d73b94c3a412176b13 100644
--- a/front/src/components/federation/LibraryTrackTable.vue
+++ b/front/src/components/federation/LibraryTrackTable.vue
@@ -14,11 +14,11 @@
:checked="result.results.length === checked.length"><label> </label>
</div>
</th>
- <th>Title</th>
- <th>Artist</th>
- <th>Album</th>
- <th>Published date</th>
- <th v-if="showLibrary">Library</th>
+ <i18next tag="th" path="Title"/>
+ <i18next tag="th" path="Artist"/>
+ <i18next tag="th" path="Album"/>
+ <i18next tag="th" path="Published date"/>
+ <i18next tag="th" v-if="showLibrary" path="Library"/>
</tr>
</thead>
<tbody>
@@ -31,7 +31,7 @@
:checked="checked.indexOf(track.id) > -1"><label> </label>
</div>
<div v-else class="ui label">
- In library
+ <i18next path="In library"/>
</div>
</td>
<td>
@@ -65,17 +65,22 @@
</th>
<th v-if="result && result.results.length > 0">
- Showing results {{ ((page-1) * paginateBy) + 1 }}-{{ ((page-1) * paginateBy) + result.results.length }} on {{ result.count }}</th>
+ <i18next path="Showing results {%0%}-{%1%} on {%2%}">
+ {{ ((page-1) * paginateBy) + 1 }}
+ {{ ((page-1) * paginateBy) + result.results.length }}
+ {{ result.count }}
+ </i18next>
<th>
<button
@click="launchImport"
:disabled="checked.length === 0 || isImporting"
- :class="['ui', 'green', {loading: isImporting}, 'button']">Import {{ checked.length }} tracks
+ :class="['ui', 'green', {loading: isImporting}, 'button']">
+ <i18next path="Import {%count%} tracks" :count="checked.length"/>
</button>
<router-link
v-if="importBatch"
:to="{name: 'library.import.batches.detail', params: {id: importBatch.id }}">
- Import #{{ importBatch.id }} launched
+ <i18next path="Import #{%id%} launched" :id="importBatch.id"/>
</router-link>
</th>
<th></th>