Show recent languages in drop list
This commit is contained in:
parent
ef6812ad91
commit
0ded3881da
|
@ -41,6 +41,12 @@
|
|||
"langList": {
|
||||
"message": "af:Afrikaans, sq:Albanian, am:Amharic, ar:Arabic, hy:Armenian, az:Azerbaijani, eu:Basque, be:Belarusian, bn:Bengali, bs:Bosnian, bg:Bulgarian, ca:Catalan, ceb:Cebuano, ny:Chewa, zh-CN:Chinese (PRC), zh-TW:Chinese (Taiwan), co:Corsican, hr:Croatian, cs:Czech, da:Danish, nl:Dutch, en:English, eo:Esperanto, et:Estonian, fi:Finnish, fr:French, fy:Frisian, gl:Galician, ka:Georgian, de:German, el:Greek, gu:Gujarati, ht:Haitian, ha:Hausa, haw:Hawaiian, he:Hebrew, hi:Hindi, hu:Hungarian, is:Icelandic, ig:Igbo, id:Indonesian, ga:Irish, it:Italian, ja:Japanese, jv:Javanese, kn:Kannada, kk:Kazakh, km:Khmer, ky:Kirghiz, ko:Korean, ku:Kurdish, lo:Laotian, la:Latin, lv:Latvian, lt:Lithuanian, lb:Luxembourgish, mk:Macedonian, mg:Malagasy, ms:Malay, ml:Malayalam, mt:Maltese, mi:Maori, mr:Marathi, mn:Mongolian, hmn:Monk, my:Myanmar, ne:Nepali, no:Norwegian, fa:Persian, pl:Polish, pt:Portuguese, pa:Punjabi, ps:Pushto, ro:Romanian, ru:Russian, sm:Samoan, gd:Scottish Gaelic, sr:Serbian, sn:Shona, sd:Sindhi, si:Sinhala, sk:Slovak, sl:Slovenian, so:Somali, sx:Sotho, es:Spanish, su:Sundanese, sw:Swahili, sv:Swedish, tl:Tagalog, tg:Tajiki, ta:Tamil, te:Telugu, th:Thai, tr:Turkish, uk:Ukrainian, ur:Urdu, uz:Uzbek, vi:Vietnamese, cy:Welsh, xh:Xosa, yi:Yiddish, yo:Yoruba, zu:Zulu"
|
||||
},
|
||||
"allLangLabel": {
|
||||
"message": "All languages"
|
||||
},
|
||||
"recentLangLabel": {
|
||||
"message": "Recent languages"
|
||||
},
|
||||
"settingsLabel": {
|
||||
"message": "Settings"
|
||||
},
|
||||
|
|
|
@ -23,7 +23,7 @@ export default class Footer extends Component {
|
|||
};
|
||||
|
||||
render() {
|
||||
const { tabUrl, targetLang } = this.props;
|
||||
const { tabUrl, targetLang, langHistory } = this.props;
|
||||
|
||||
return (
|
||||
<div id="footer">
|
||||
|
@ -37,11 +37,22 @@ export default class Footer extends Component {
|
|||
onChange={this.handleChange}
|
||||
title={browser.i18n.getMessage("targetLangLabel")}
|
||||
>
|
||||
|
||||
<optgroup label={browser.i18n.getMessage("recentLangLabel")}>
|
||||
{this.langList.filter(option => langHistory.includes(option.value))
|
||||
.map(option => (
|
||||
<option value={option.value} key={option.value}>
|
||||
{option.name}
|
||||
</option>
|
||||
))}
|
||||
</optgroup>
|
||||
<optgroup label={browser.i18n.getMessage("allLangLabel")}>
|
||||
{this.langList.map(option => (
|
||||
<option value={option.value} key={option.value}>
|
||||
{option.name}
|
||||
</option>
|
||||
))}
|
||||
</optgroup>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import React, { Component } from "react";
|
||||
import browser from "webextension-polyfill";
|
||||
import log from "loglevel";
|
||||
import { initSettings, getSettings } from "src/settings/settings";
|
||||
import { initSettings, getSettings, setSettings } from "src/settings/settings";
|
||||
import { updateLogLevel, overWriteLogLevel } from "src/common/log";
|
||||
import translate from "src/common/translate";
|
||||
import Header from "./Header";
|
||||
|
@ -43,7 +43,8 @@ export default class PopupPage extends Component {
|
|||
statusText: "OK",
|
||||
tabUrl: "",
|
||||
isConnected: true,
|
||||
isEnabledOnPage: true
|
||||
isEnabledOnPage: true,
|
||||
langHistory: []
|
||||
};
|
||||
this.isSwitchedSecondLang = false;
|
||||
this.init();
|
||||
|
@ -56,8 +57,15 @@ export default class PopupPage extends Component {
|
|||
|
||||
document.body.dataset.theme = getSettings("theme");
|
||||
const targetLang = getSettings("targetLang");
|
||||
let langHistory = getSettings("langHistory");
|
||||
if (!langHistory) {
|
||||
const secondLang = getSettings("secondTargetLang");
|
||||
langHistory = [targetLang, secondLang];
|
||||
setSettings("langHistory", langHistory);
|
||||
}
|
||||
this.setState({
|
||||
targetLang: targetLang
|
||||
targetLang: targetLang,
|
||||
langHistory: langHistory
|
||||
});
|
||||
|
||||
const tabInfo = await getTabInfo();
|
||||
|
@ -82,11 +90,20 @@ export default class PopupPage extends Component {
|
|||
}, waitTime);
|
||||
};
|
||||
|
||||
setLangHistory = lang => {
|
||||
let langHistory = getSettings("langHistory") || [];
|
||||
langHistory.push(lang);
|
||||
if (langHistory.length > 30) langHistory = langHistory.slice(-30);
|
||||
setSettings("langHistory", langHistory);
|
||||
this.setState({ langHistory: langHistory });
|
||||
};
|
||||
|
||||
handleLangChange = lang => {
|
||||
log.info(logDir, "handleLangChange()", lang);
|
||||
this.setState({ targetLang: lang });
|
||||
const inputText = this.state.inputText;
|
||||
if (inputText !== "") this.translateText(inputText, lang);
|
||||
this.setLangHistory(lang);
|
||||
};
|
||||
|
||||
translateText = async (text, targetLang) => {
|
||||
|
@ -162,6 +179,7 @@ export default class PopupPage extends Component {
|
|||
<Footer
|
||||
tabUrl={this.state.tabUrl}
|
||||
targetLang={this.state.targetLang}
|
||||
langHistory={this.state.langHistory}
|
||||
handleLangChange={this.handleLangChange}
|
||||
/>
|
||||
</div>
|
||||
|
|
Loading…
Reference in a new issue