diff --git a/src/components/Settings/Language/Language.component.js b/src/components/Settings/Language/Language.component.js index 6bb0c84d4..cfe162a20 100644 --- a/src/components/Settings/Language/Language.component.js +++ b/src/components/Settings/Language/Language.component.js @@ -205,7 +205,7 @@ class Language extends React.Component { const isDownloadable = avaliableAndDownloadablesLangs.filter( downloadableLang => { - return downloadableLang.langCode === lang.slice(0, 2); + return downloadableLang.lang === lang; } )[0]; diff --git a/src/components/Settings/Language/Language.container.js b/src/components/Settings/Language/Language.container.js index d8e66e1c7..245215978 100644 --- a/src/components/Settings/Language/Language.container.js +++ b/src/components/Settings/Language/Language.container.js @@ -345,18 +345,6 @@ export class LanguageContainer extends Component { firstClick }; setDownloadingLang(downloadingLangState); - try { - await this.handleSetTtsEngine(ttsName); //after tts change it fires a remounting - } catch { - //if tts hasn't any voice SetTtsEngine throw an error and the user would be alerted that should open the tts app - this.setState({ - downloadingLangError: { - ttsError: false, - langError: true - }, - downloadLangLoading: false - }); - } }; onErrorDialogAcepted = () => { @@ -415,7 +403,7 @@ export class LanguageContainer extends Component { const { setDownloadingLang, - localLangs, + ttsEngines, ttsEngine, history, @@ -442,9 +430,9 @@ export class LanguageContainer extends Component { langError: true } }); - return; } } + const localLangs = this.props.localLangs; if (!localLangs.includes(selectedLang)) { this.setState({ downloadingLangError: { @@ -458,7 +446,14 @@ export class LanguageContainer extends Component { isdownloading: false }; setDownloadingLang(downloadingLangState); - this.setState({ selectedLang: selectedLang }); + this.setState({ + downloadingLangError: { + ttsError: false, + langError: false + }, + selectedLang: selectedLang + }); + this.refreshLanguageList(); if (isDiferentTts) return; await this.handleSubmit(selectedLang); showNotification( @@ -467,9 +462,7 @@ export class LanguageContainer extends Component { history.push('/settings'); }; - componentDidMount = async () => { - const { isdownloading } = this.props.downloadingLang; - + refreshLanguageList = () => { this.setState({ downloadablesLangs: isAndroid() ? this.prepareDownloadablesLenguages() @@ -479,11 +472,35 @@ export class LanguageContainer extends Component { downloadablesOnly: [] } }); + }; + + refreshDownloadLanguage = async () => { + const { isdownloading } = this.props.downloadingLang; + + this.refreshLanguageList(); if (isdownloading) await this.lookDownloadingLang(); this.setState({ downloadLangLoading: false }); }; + componentDidMount = async () => { + if (this.props.langsFetched) this.refreshDownloadLanguage(); + }; + + componentDidUpdate = async prevProps => { + const isdownloading = this.props.downloadingLang?.isdownloading; + const langsFetched = this.props.langsFetched; + + if (!prevProps.langsFetched && langsFetched) { + this.setState({ downloadLangLoading: true }); + await this.refreshDownloadLanguage(); + } + if (!isdownloading) return; + if (prevProps.downloadingLang.isdownloading === false) { + await this.refreshDownloadLanguage(); + } + }; + render() { const { lang, langs, localLangs, ttsEngines, ttsEngine } = this.props; @@ -539,6 +556,7 @@ export class LanguageContainer extends Component { const mapStateToProps = state => ({ lang: state.language.lang, + langsFetched: state.language.langsFetched, langs: state.language.langs, localLangs: state.language.localLangs, ttsEngines: state.speech.ttsEngines, diff --git a/src/providers/LanguageProvider/LanguageProvider.reducer.js b/src/providers/LanguageProvider/LanguageProvider.reducer.js index 3b22429ad..68a17418d 100644 --- a/src/providers/LanguageProvider/LanguageProvider.reducer.js +++ b/src/providers/LanguageProvider/LanguageProvider.reducer.js @@ -16,6 +16,7 @@ const initialState = { dir: 'ltr', langs: [], localLangs: [], + langsFetched: false, downloadingLang: { isdownloading: false } }; @@ -44,7 +45,8 @@ function languageProviderReducer(state = initialState, action) { return { ...state, langs: action.langs.sort(), - localLangs: action.localLangs || [] + localLangs: action.localLangs || [], + langsFetched: true }; case SET_DOWNLOADING_LANG: return { ...state, downloadingLang: action.downloadingLangData }; diff --git a/src/providers/SpeechProvider/SpeechProvider.actions.js b/src/providers/SpeechProvider/SpeechProvider.actions.js index 54ce28b2b..403a5f2c6 100644 --- a/src/providers/SpeechProvider/SpeechProvider.actions.js +++ b/src/providers/SpeechProvider/SpeechProvider.actions.js @@ -52,19 +52,26 @@ export function receiveTtsEngine(ttsEngineName) { } export function getTtsEngines() { - const ttsEngines = tts.getTtsEngines(); + const ttsEngines = tts?.getTtsEngines(); return { type: RECEIVE_TTS_ENGINES, ttsEngines }; } -export function setTtsEngine(ttsEngineName) { +export function setTtsEngine(selectedTtsEngineName) { return async dispatch => { dispatch(requestTtsEngine()); try { - const voices = await tts.setTtsEngine(ttsEngineName); - dispatch(receiveTtsEngine(ttsEngineName)); + const engineAvailable = tts + .getTtsEngines() + .map(tts => tts.name) + .includes(selectedTtsEngineName); + const engineName = engineAvailable + ? selectedTtsEngineName + : tts.getTtsDefaultEngine().name; + const voices = await tts.setTtsEngine(engineName); + dispatch(receiveTtsEngine(engineName)); if (!voices.length) { throw new Error('TTS engine does not have a language.'); } diff --git a/src/reducers.js b/src/reducers.js index c30c9acad..47621ad32 100644 --- a/src/reducers.js +++ b/src/reducers.js @@ -1,4 +1,4 @@ -import { persistCombineReducers } from 'redux-persist'; +import { persistCombineReducers, persistReducer } from 'redux-persist'; import appReducer from './components/App/App.reducer'; import languageProviderReducer from './providers/LanguageProvider/LanguageProvider.reducer'; @@ -11,13 +11,20 @@ import storage from 'redux-persist/lib/storage'; const config = { key: 'root', - storage + storage, + blacklist: ['language'] +}; + +const languagePersistConfig = { + key: 'language', + storage: storage, + blacklist: ['langsFetched'] }; export default function createReducer() { return persistCombineReducers(config, { app: appReducer, - language: languageProviderReducer, + language: persistReducer(languagePersistConfig, languageProviderReducer), speech: speechProviderReducer, board: boardReducer, communicator: communicatorReducer,