nki/phanpy
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Make auto inline translation as a setting, turned off by default

Browse source
This commit is contained in:
Lim Chee Aun 2023-07-22 20:59:07 +08:00
parent d8b385a742
commit 32a853ecc0
3 changed files with 67 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/pages/settings.css
View file

@ -59,6 +59,9 @@
#settings-container div {
vertical-align: middle;
}
#settings-container section > ul > li .sub-section hr {
margin: 8px 0;
}
#settings-container section select {
padding: 4px;

95
src/pages/settings.jsx
View file

@ -255,42 +255,43 @@ function Settings({ onClose }) {
: ''
}`}
>
<label>
Translate to{' '}
<select
value={targetLanguage || ''}
disabled={!snapStates.settings.contentTranslation}
onChange={(e) => {
states.settings.contentTranslationTargetLanguage =
e.target.value || null;
}}
>
<option value="">
System language ({systemTargetLanguageText})
</option>
<option disabled>──────────</option>
{targetLanguages.map((lang) => (
<option value={lang.code}>{lang.name}</option>
))}
</select>
</label>
<div>
<label>
Translate to{' '}
<select
value={targetLanguage || ''}
disabled={!snapStates.settings.contentTranslation}
onChange={(e) => {
states.settings.contentTranslationTargetLanguage =
e.target.value || null;
}}
>
<option value="">
System language ({systemTargetLanguageText})
</option>
<option disabled>──────────</option>
{targetLanguages.map((lang) => (
<option value={lang.code}>{lang.name}</option>
))}
</select>
</label>
</div>
<hr />
<p class="checkbox-fieldset">
<small>
Hide "Translate" button for
{snapStates.settings.contentTranslationHideLanguages
.length > 0 && (
<>
{' '}
(
{
snapStates.settings.contentTranslationHideLanguages
.length
}
)
</>
)}
:
</small>
Hide "Translate" button for
{snapStates.settings.contentTranslationHideLanguages.length >
0 && (
<>
{' '}
(
{
snapStates.settings.contentTranslationHideLanguages
.length
}
)
</>
)}
:
<div class="checkbox-fields">
{targetLanguages.map((lang) => (
<label>
@ -318,7 +319,7 @@ function Settings({ onClose }) {
))}
</div>
</p>
<p>
<p class="insignificant">
<small>
Note: This feature uses an external API to translate,
powered by{' '}
@ -331,6 +332,28 @@ function Settings({ onClose }) {
.
</small>
</p>
<hr />
<div>
<label>
<input
type="checkbox"
checked={snapStates.settings.contentTranslationAutoInline}
disabled={!snapStates.settings.contentTranslation}
onChange={(e) => {
states.settings.contentTranslationAutoInline =
e.target.checked;
}}
/>{' '}
Auto inline translation
</label>
<p class="insignificant">
<small>
Automatically show translation for posts in timeline. Only
works for <b>short</b> posts without content warning,
media and poll.
</small>
</p>
</div>
</div>
</li>
<li>

5
src/utils/states.js
View file

@ -52,6 +52,8 @@ const states = proxy({
store.account.get('settings-contentTranslationTargetLanguage') || null,
contentTranslationHideLanguages:
store.account.get('settings-contentTranslationHideLanguages') || [],
contentTranslationAutoInline:
store.account.get('settings-contentTranslationAutoInline') ?? false,
cloakMode: store.account.get('settings-cloakMode') ?? false,
},
});
@ -80,6 +82,9 @@ subscribe(states, (changes) => {
if (path.join('.') === 'settings.contentTranslation') {
store.account.set('settings-contentTranslation', !!value);
}
if (path.join('.') === 'settings.contentTranslationAutoInline') {
store.account.set('settings-contentTranslationAutoInline', !!value);
}
if (path.join('.') === 'settings.contentTranslationTargetLanguage') {
console.log('SET', value);
store.account.set('settings-contentTranslationTargetLanguage', value);