Translate bio button (#1432)

* Translation button finished

* Fix bug in theme

* revert cause some stuff broke

* "Translated by Google" text

* Translate that too

* I am very stupid sorry

* Add API Key

* Make toggle work, oops

* Fix merge issues

* Fixed as requested

* Change translation icon

* Return settings back (oops)

* Beep

* Boop

* Delete import again as the icon has been replaced with a better one

* Change text
This commit is contained in:
poprox24
2025-10-19 04:34:30 +02:00
committed by GitHub
parent a059d813f3
commit d7e08d6f7d
5 changed files with 279 additions and 2 deletions

View File

@@ -249,6 +249,11 @@
style="margin-left: 5px"
@click="showBioDialog"></el-button>
</div>
<div v-if="userDialog.id !== currentUser.id" style="float: right">
<el-button type="text" size="small" style="margin-left: 5px" @click="translateBio"
><i class="ri-translate-2"></i
></el-button>
</div>
<div style="margin-top: 5px">
<el-tooltip v-for="(link, index) in userDialog.ref.bioLinks" :key="index">
<template #content>
@@ -1305,8 +1310,10 @@
const { t } = useI18n();
const advancedSettingsStore = useAdvancedSettingsStore();
const { hideUserNotes, hideUserMemos } = storeToRefs(useAppearanceSettingsStore());
const { avatarRemoteDatabase } = storeToRefs(useAdvancedSettingsStore());
const { bioLanguage, avatarRemoteDatabase } = storeToRefs(useAdvancedSettingsStore());
const { userDialog, languageDialog, currentUser, isLocalUserVrcPlusSupporter } = storeToRefs(useUserStore());
const {
cachedUsers,
@@ -2270,6 +2277,52 @@
D.visible = true;
}
const bioCache = ref({
userID: null,
original: null,
translated: null,
showingTranslated: false
});
async function translateBio() {
const bio = userDialog.value.ref.bio;
if (!bio || bio === '-' || !advancedSettingsStore.translationApi) return;
const targetLang = bioLanguage.value;
if (bioCache.value.userID !== userDialog.value.id) {
bioCache.value.userID = userDialog.value.id;
bioCache.value.original = null;
bioCache.value.translated = null;
bioCache.value.showingTranslated = false;
}
if (!bioCache.value.original) bioCache.value.original = bio;
if (bioCache.value.showingTranslated) {
userDialog.value.ref.bio = bioCache.value.original;
bioCache.value.showingTranslated = false;
return;
}
if (bioCache.value.translated) {
userDialog.value.ref.bio = bioCache.value.translated;
bioCache.value.showingTranslated = true;
return;
}
try {
const translated = await advancedSettingsStore.translateText(bio + '\n\nTranslated by Google', targetLang);
if (!translated) throw new Error('No translation returned');
bioCache.value.translated = translated;
bioCache.value.showingTranslated = true;
userDialog.value.ref.bio = translated;
} catch (err) {
console.error('Translation failed:', err);
}
}
function showPreviousInstancesUserDialog(userRef) {
const D = previousInstancesUserDialog.value;
D.userRef = userRef;