teutat3s/elk
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

fix: respect source language of post and move translation UI into menu

Browse source
This commit is contained in:
Daniel Roe 2022-11-25 11:24:19 +00:00
parent bb05003fa3
commit 3f382bdad0
No known key found for this signature in database
GPG key ID: 22D5008E4F5D9B55
2 changed files with 15 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
components/status/StatusActions.vue
View file

@ -175,16 +175,6 @@ function mention() {
/>
</CommonTooltip>
<CommonTooltip v-if="isTranslationEnabled" placement="bottom" content="Translate">
<StatusActionButton
color="text-pink" hover="text-pink" group-hover="bg-pink/10"
icon="i-ri:translate"
:active="translation.visible"
:disabled="isLoading.translation"
@click="toggleTranslation()"
/>
</CommonTooltip>
<CommonDropdown placement="bottom">
<CommonTooltip placement="bottom" content="More">
<StatusActionButton
@ -203,6 +193,15 @@ function mention() {
Open in original site
</CommonDropdownItem>
<CommonDropdownItem v-if="isTranslationEnabled && status.language !== languageCode" icon="i-ri:translate" @click="toggleTranslation">
<template v-if="!translation.visible">
Translate post
</template>
<template v-else>
Show original post
</template>
</CommonDropdownItem>
<template v-if="isAuthor">
<CommonDropdownItem
icon="i-ri:pushpin-line"

10
composables/translate.ts
View file

@ -10,13 +10,14 @@ export interface TranslationResponse {
const config = useRuntimeConfig()
export async function translateText(text: string) {
export const languageCode = process.server ? 'en' : navigator.language.replace(/-.*$/, '')
export async function translateText(text: string, from?: string | null, to?: string) {
const { translatedText } = await $fetch<TranslationResponse>(config.public.translateApi, {
method: 'POST',
body: {
q: text,
source: 'auto',
target: navigator.language.replace(/-.*$/, ''),
source: from ?? 'auto',
target: to ?? languageCode,
format: 'html',
api_key: '',
},
@ -34,7 +35,7 @@ export function useTranslation(status: Status) {
async function toggle() {
if (!translation.text)
translation.text = await translateText(status.content)
translation.text = await translateText(status.content, status.language)
translation.visible = !translation.visible
}
@ -45,3 +46,4 @@ export function useTranslation(status: Status) {
translation,
}
}