Add options for translation services (#10)

Co-authored-by: FloatingGhost <hannah@coffee-and-dreams.uk>
Reviewed-on: https://akkoma.dev/AkkomaGang/admin-fe/pulls/10

src/lang/en.js

@@ -412,6 +412,7 @@ export default {
     submit: 'Submit',
     settings: 'Settings',
     instance: 'Instance',
+    search: 'Search',
     upload: 'Upload',
     mailer: 'Mailer',
     linkFormatter: 'Link Formatter',
@@ -425,7 +426,6 @@ export default {
     mrf: 'MRF',
     mediaProxy: 'Media Proxy',
     metadata: 'Metadata',
-    gopher: 'Gopher',
     jobQueue: 'Job queue',
     webPush: 'Web push encryption',
     rateLimiters: 'Rate limiters',

src/utils/tabs.js

@@ -4,7 +4,6 @@ export const tabs = [
   { label: 'Captcha', path: 'captcha', tab: ':captcha' },
   { label: 'Emoji', path: 'emoji', tab: ':emoji' },
   { label: 'Frontend', path: 'frontend', tab: ':frontend' },
-  { label: 'Gopher', path: 'gopher', tab: ':gopher' },
   { label: 'HTTP', path: 'http', tab: ':http' },
   { label: 'Instance', path: 'instance', tab: ':instance' },
   { label: 'Job queue', path: 'job-queue', tab: ':job_queue' },
@@ -17,5 +16,6 @@ export const tabs = [
   { label: 'Rate limiters', path: 'rate-limiters', tab: ':rate_limiters' },
   { label: 'Web push encryption', path: 'web-push', tab: ':web_push' },
   { label: 'Upload', path: 'upload', tab: ':upload' },
+  { label: 'Search', path: 'search', tab: ':search' },
   { label: 'Other', path: 'other', tab: ':other' }
 ]

src/views/settings/components/Instance.vue

@@ -44,6 +44,17 @@
     <el-form :model="streamerData" :label-position="labelPosition" :label-width="labelWidth">
       <setting :setting-group="streamer" :data="streamerData"/>
     </el-form>
+    <el-divider v-if="translator" class="divider thick-line"/>
+    <el-form :model="translatorData" :label-position="labelPosition" :label-width="labelWidth">
+      <setting :setting-group="translator" :data="translatorData"/>
+    </el-form>
+    <el-form v-if="usesDeepL" :model="deeplData" :label-position="labelPosition" :label-width="labelWidth">
+      <setting :setting-group="deepl" :data="deeplData"/>
+    </el-form>
+    <el-form v-if="usesLibreTranslate" :model="libretranslateData" :label-position="labelPosition" :label-width="labelWidth">
+      <setting :setting-group="libre_translate" :data="libretranslateData"/>
+    </el-form>
+
     <div class="submit-button-container">
       <el-button class="submit-button" type="primary" @click="onSubmit">{{ $t('settings.submit') }}</el-button>
     </div>
@@ -172,6 +183,30 @@ export default {
     },
     welcomeData() {
       return _.get(this.settings.settings, [':pleroma', ':welcome']) || {}
+    },
+    translator() {
+      return this.$store.state.settings.description.find(setting => setting.key === ':translator')
+    },
+    translatorData() {
+      return _.get(this.settings.settings, [':pleroma', ':translator']) || {}
+    },
+    usesDeepL() {
+      return (_.get(this.settings.settings, [':pleroma', ':translator', ':module']) || '').toLowerCase().endsWith('deepl')
+    },
+    usesLibreTranslate() {
+      return (_.get(this.settings.settings, [':pleroma', ':translator', ':module']) || '').toLowerCase().endsWith('libretranslate')
+    },
+    deepl() {
+      return this.$store.state.settings.description.find(setting => setting.key === ':deepl')
+    },
+    deeplData() {
+      return _.get(this.settings.settings, [':pleroma', ':deepl']) || {}
+    },
+    libre_translate() {
+      return this.$store.state.settings.description.find(setting => setting.key === ':libre_translate')
+    },
+    libretranslateData() {
+      return _.get(this.settings.settings, [':pleroma', ':libre_translate']) || {}
     }
   },
   async mounted() {

src/views/settings/components/Search.vue

@@ -1,7 +1,13 @@
 <template>
   <div v-if="!loading" :class="isSidebarOpen" class="form-container">
-    <el-form v-if="!loading" :model="gopherData" :label-position="labelPosition" :label-width="labelWidth">
-      <setting :setting-group="gopher" :data="gopherData"/>
+    <el-form :model="searchData" :label-position="labelPosition" :label-width="labelWidth">
+      <setting :setting-group="search" :data="searchData"/>
+    </el-form>
+    <el-form v-if="isMeilisearch" :model="meilisearchData" :label-position="labelPosition" :label-width="labelWidth">
+      <setting :setting-group="meilisearch" :data="meilisearchData"/>
+    </el-form>
+    <el-form v-if="isElasticsearch" :model="elasticsearchData" :label-position="labelPosition" :label-width="labelWidth">
+      <setting :setting-group="elasticsearch" :data="elasticsearchData"/>
     </el-form>
     <div class="submit-button-container">
       <el-button class="submit-button" type="primary" @click="onSubmit">{{ $t('settings.submit') }}</el-button>
@@ -16,17 +22,35 @@ import Setting from './Setting'
 import _ from 'lodash'
 
 export default {
-  name: 'Gopher',
+  name: 'Search',
   components: { Setting },
   computed: {
     ...mapGetters([
       'settings'
     ]),
-    gopher() {
-      return this.settings.description.find(setting => setting.key === ':gopher')
+    search() {
+      return this.settings.description.find(setting => setting.key === 'Pleroma.Search')
     },
-    gopherData() {
-      return _.get(this.settings.settings, [':pleroma', ':gopher']) || {}
+    searchData() {
+      return _.get(this.settings.settings, [':pleroma', 'Pleroma.Search']) || {}
+    },
+    meilisearch() {
+      return this.settings.description.find(setting => setting.key === 'Pleroma.Search.Meilisearch')
+    },
+    isMeilisearch() {
+      return (_.get(this.settings.settings, [':pleroma', 'Pleroma.Search', ':module']) || '').toLowerCase().endsWith('meilisearch')
+    },
+    meilisearchData() {
+      return _.get(this.settings.settings, [':pleroma', 'Pleroma.Search.Meilisearch']) || {}
+    },
+    elasticsearch() {
+      return this.settings.description.find(setting => setting.key === 'Pleroma.Search.Elasticsearch.Cluster')
+    },
+    isElasticsearch() {
+      return (_.get(this.settings.settings, [':pleroma', 'Pleroma.Search', ':module']) || '').toLowerCase().endsWith('elasticsearch')
+    },
+    elasticsearchData() {
+      return _.get(this.settings.settings, [':pleroma', 'Pleroma.Search.Elasticsearch.Cluster']) || {}
     },
     isMobile() {
       return this.$store.state.app.device === 'mobile'

src/views/settings/components/index.js

@@ -4,7 +4,6 @@ export { default as Captcha } from './Captcha'
 export { default as Emoji } from './Emoji'
 export { default as Esshd } from './Esshd'
 export { default as Frontend } from './Frontend'
-export { default as Gopher } from './Gopher'
 export { default as Http } from './Http'
 export { default as Instance } from './Instance'
 export { default as JobQueue } from './JobQueue'
@@ -18,3 +17,4 @@ export { default as Other } from './Other'
 export { default as RateLimiters } from './RateLimiters'
 export { default as Upload } from './Upload'
 export { default as WebPush } from './WebPush'
+export { default as Search } from './Search'

src/views/settings/components/tabs.js

@@ -26,7 +26,7 @@ export const tabs = description => {
     },
     'instance': {
       label: 'settings.instance',
-      settings: [':admin_token', ':instance', ':instance_panel', ':instances_favicons', ':welcome', ':manifest', 'Pleroma.User', 'Pleroma.ScheduledActivity', ':uri_schemes', ':feed', ':streamer', ':restrict_unauthenticated']
+      settings: [':admin_token', ':instance', ':instance_panel', ':instances_favicons', ':welcome', ':manifest', 'Pleroma.User', 'Pleroma.ScheduledActivity', ':uri_schemes', ':feed', ':streamer', ':restrict_unauthenticated', ':translator', ':deepl', ':libre_translate']
     },
     'job-queue': {
       label: 'settings.jobQueue',
@@ -68,6 +68,10 @@ export const tabs = description => {
       label: 'settings.upload',
       settings: ['Pleroma.Upload.Filter.AnonymizeFilename', 'Pleroma.Upload.Filter.Mogrify', 'Pleroma.Uploaders.S3', 'Pleroma.Uploaders.Local', 'Pleroma.Upload', ':s3']
     },
+    'search': {
+      label: 'settings.search',
+      settings: ['Pleroma.Search', 'Pleroma.Search.Meilisearch', 'Pleroma.Search.Elasticsearch.Cluster']
+    },
     'other': {
       label: 'settings.other',
       settings: [':mime', 'Pleroma.User.Backup', 'Pleroma.Web.Plugs.RemoteIp', 'Pleroma.Web.Endpoint.MetricsExporter', ':modules', 'Pleroma.Web.ApiSpec.CastAndValidate', ':terms_of_services']

src/views/settings/index.vue

@@ -9,7 +9,7 @@
         <div class="docs-search-container">
           <el-link
             :underline="false"
-            href="https://docs-develop.pleroma.social/backend/administration/CLI_tasks/config/"
+            href="https://docs.akkoma.dev/stable/administration/CLI_tasks/config/"
             target="_blank">
             <el-button class="settings-docs-button">
               <span>
@@ -71,7 +71,6 @@ import {
   Emoji,
   Esshd,
   Frontend,
-  Gopher,
   Http,
   Instance,
   JobQueue,
@@ -84,6 +83,7 @@ import {
   Other,
   RateLimiters,
   Upload,
+  Search,
   WebPush
 } from './components'
 import RebootButton from '@/components/RebootButton'
@@ -96,7 +96,6 @@ export default {
     Emoji,
     Esshd,
     Frontend,
-    Gopher,
     Http,
     Instance,
     JobQueue,
@@ -110,6 +109,7 @@ export default {
     RateLimiters,
     RebootButton,
     Upload,
+    Search,
     WebPush
   },
   data() {