this repo has no description
Show Translate button when different lang inside alt modal
+24
-3
+23
-2
src/components/media-alt-modal.jsx
+23
-2
src/components/media-alt-modal.jsx
···
1
1
import { Menu, MenuItem } from '@szhsin/react-menu';
2
2
import { useState } from 'preact/hooks';
3
+
import { useSnapshot } from 'valtio';
4
+
5
+
import getTranslateTargetLanguage from '../utils/get-translate-target-language';
6
+
import localeMatch from '../utils/locale-match';
7
+
import states from '../utils/states';
3
8
4
9
import Icon from './icon';
5
10
import TranslationBlock from './translation-block';
6
11
7
12
export default function MediaAltModal({ alt, lang, onClose }) {
13
+
const snapStates = useSnapshot(states);
8
14
const [forceTranslate, setForceTranslate] = useState(false);
15
+
const targetLanguage = getTranslateTargetLanguage(true);
16
+
const contentTranslationHideLanguages =
17
+
snapStates.settings.contentTranslationHideLanguages || [];
18
+
const differentLanguage =
19
+
!!lang &&
20
+
lang !== targetLanguage &&
21
+
!localeMatch([lang], [targetLanguage]) &&
22
+
!contentTranslationHideLanguages.find(
23
+
(l) => lang === l || localeMatch([lang], [l]),
24
+
);
25
+
9
26
return (
10
27
<div class="sheet">
11
28
{!!onClose && (
···
44
61
>
45
62
{alt}
46
63
</p>
47
-
{forceTranslate && (
48
-
<TranslationBlock forceTranslate={forceTranslate} text={alt} />
64
+
{(differentLanguage || forceTranslate) && (
65
+
<TranslationBlock
66
+
forceTranslate={forceTranslate}
67
+
sourceLanguage={lang}
68
+
text={alt}
69
+
/>
49
70
)}
50
71
</main>
51
72
</div>