Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-02-02 06:06:41 +01:00
Code Issues Projects Releases Packages 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 { #settings-container div {
vertical-align: middle; vertical-align: middle;
} }
#settings-container section > ul > li .sub-section hr {
margin: 8px 0;
}
#settings-container section select { #settings-container section select {
padding: 4px; padding: 4px;

95
src/pages/settings.jsx
View file

@ -255,42 +255,43 @@ function Settings({ onClose }) {
: '' : ''
}`} }`}
> >
<label> <div>
Translate to{' '} <label>
<select Translate to{' '}
value={targetLanguage || ''} <select
disabled={!snapStates.settings.contentTranslation} value={targetLanguage || ''}
onChange={(e) => { disabled={!snapStates.settings.contentTranslation}
states.settings.contentTranslationTargetLanguage = onChange={(e) => {
e.target.value || null; states.settings.contentTranslationTargetLanguage =
}} e.target.value || null;
> }}
<option value=""> >
System language ({systemTargetLanguageText}) <option value="">
</option> System language ({systemTargetLanguageText})
<option disabled>──────────</option> </option>
{targetLanguages.map((lang) => ( <option disabled>──────────</option>
<option value={lang.code}>{lang.name}</option> {targetLanguages.map((lang) => (
))} <option value={lang.code}>{lang.name}</option>
</select> ))}
</label> </select>
</label>
</div>
<hr />
<p class="checkbox-fieldset"> <p class="checkbox-fieldset">
<small> Hide "Translate" button for
Hide "Translate" button for {snapStates.settings.contentTranslationHideLanguages.length >
{snapStates.settings.contentTranslationHideLanguages 0 && (
.length > 0 && ( <>
<> {' '}
{' '} (
( {
{ snapStates.settings.contentTranslationHideLanguages
snapStates.settings.contentTranslationHideLanguages .length
.length }
} )
) </>
</> )}
)} :
:
</small>
<div class="checkbox-fields"> <div class="checkbox-fields">
{targetLanguages.map((lang) => ( {targetLanguages.map((lang) => (
<label> <label>
@ -318,7 +319,7 @@ function Settings({ onClose }) {
))} ))}
</div> </div>
</p> </p>
<p> <p class="insignificant">
<small> <small>
Note: This feature uses an external API to translate, Note: This feature uses an external API to translate,
powered by{' '} powered by{' '}
@ -331,6 +332,28 @@ function Settings({ onClose }) {
. .
</small> </small>
</p> </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> </div>
</li> </li>
<li> <li>

5
src/utils/states.js
View file

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