From d1a87518e6a959e00f1194b3c3a9d8d978aa6021 Mon Sep 17 00:00:00 2001 From: tomivm Date: Mon, 21 Mar 2022 10:20:07 -0300 Subject: [PATCH 1/4] Await for fetch voices and Languages during download --- .../Settings/Language/Language.container.js | 52 +++++++++++++------ .../LanguageProvider.actions.js | 7 +++ .../LanguageProvider.constants.js | 2 + .../LanguageProvider.reducer.js | 10 +++- .../SpeechProvider.container.js | 9 +++- 5 files changed, 61 insertions(+), 19 deletions(-) diff --git a/src/components/Settings/Language/Language.container.js b/src/components/Settings/Language/Language.container.js index d8e66e1c7..b0a2b13df 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: { @@ -457,8 +445,15 @@ export class LanguageContainer extends Component { const downloadingLangState = { isdownloading: false }; + this.setState({ + downloadingLangError: { + ttsError: false, + langError: false + } + }); setDownloadingLang(downloadingLangState); this.setState({ 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.actions.js b/src/providers/LanguageProvider/LanguageProvider.actions.js index 399629565..fbbb72709 100644 --- a/src/providers/LanguageProvider/LanguageProvider.actions.js +++ b/src/providers/LanguageProvider/LanguageProvider.actions.js @@ -1,5 +1,6 @@ import { CHANGE_LANG, + START_FETCHING_LANGS, SET_LANGS, SET_DOWNLOADING_LANG } from './LanguageProvider.constants'; @@ -13,6 +14,12 @@ export function changeLang(lang) { }; } +export function startFetchingLangs() { + return { + type: START_FETCHING_LANGS + }; +} + export function setLangs(langs, localLangs) { return { type: SET_LANGS, diff --git a/src/providers/LanguageProvider/LanguageProvider.constants.js b/src/providers/LanguageProvider/LanguageProvider.constants.js index 5657372d5..f147df237 100644 --- a/src/providers/LanguageProvider/LanguageProvider.constants.js +++ b/src/providers/LanguageProvider/LanguageProvider.constants.js @@ -1,4 +1,6 @@ export const CHANGE_LANG = 'cboard/LanguageProvider/CHANGE_LANG'; +export const START_FETCHING_LANGS = + 'cboard/LanguageProvider/START_FETCHING_LANGS'; export const SET_LANGS = 'cboard/LanguageProvider/SET_LANGS'; export const SET_DOWNLOADING_LANG = 'cboard/LanguageProvider/SET_DOWNLOADING_LANG'; diff --git a/src/providers/LanguageProvider/LanguageProvider.reducer.js b/src/providers/LanguageProvider/LanguageProvider.reducer.js index 3b22429ad..8bdf89b16 100644 --- a/src/providers/LanguageProvider/LanguageProvider.reducer.js +++ b/src/providers/LanguageProvider/LanguageProvider.reducer.js @@ -1,5 +1,6 @@ import { CHANGE_LANG, + START_FETCHING_LANGS, SET_LANGS, SET_DOWNLOADING_LANG } from './LanguageProvider.constants'; @@ -16,6 +17,7 @@ const initialState = { dir: 'ltr', langs: [], localLangs: [], + langsFetched: false, downloadingLang: { isdownloading: false } }; @@ -40,11 +42,17 @@ function languageProviderReducer(state = initialState, action) { lang: action.lang ? action.lang : state.lang, dir: action.lang ? getDir(action.lang) : state.dir }; + case START_FETCHING_LANGS: + return { + ...state, + langsFetched: false + }; case SET_LANGS: 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.container.js b/src/providers/SpeechProvider/SpeechProvider.container.js index 15778fa9c..f476b64dd 100644 --- a/src/providers/SpeechProvider/SpeechProvider.container.js +++ b/src/providers/SpeechProvider/SpeechProvider.container.js @@ -10,6 +10,7 @@ import { updateLangSpeechStatus, setTtsEngine } from './SpeechProvider.actions'; +import { startFetchingLangs } from '../LanguageProvider/LanguageProvider.actions'; import { isAndroid } from '../../cordova-util'; export class SpeechProvider extends Component { @@ -19,6 +20,11 @@ export class SpeechProvider extends Component { setTtsEngine: PropTypes.func }; + constructor(props) { + super(props); + this.props.startFetchingLangs(); + } + async componentDidMount() { const { getVoices, @@ -67,7 +73,8 @@ const mapDispatchToProps = { getTtsEngines, getTtsDefaultEngine, setTtsEngine, - updateLangSpeechStatus + updateLangSpeechStatus, + startFetchingLangs }; export default connect( From c74c14909734969ac0732ceebba5f6bf01d754dd Mon Sep 17 00:00:00 2001 From: tomivm Date: Mon, 21 Mar 2022 22:30:54 -0300 Subject: [PATCH 2/4] Compare dialect to show download button --- src/components/Settings/Language/Language.component.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) 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]; From f4aca2daa4f9cb143e31f168b7283fee27e9e749 Mon Sep 17 00:00:00 2001 From: tomivm Date: Wed, 23 Mar 2022 21:13:35 -0300 Subject: [PATCH 3/4] prevent set unavailable ttsEngine --- .../SpeechProvider/SpeechProvider.actions.js | 15 +++++++++++---- 1 file changed, 11 insertions(+), 4 deletions(-) diff --git a/src/providers/SpeechProvider/SpeechProvider.actions.js b/src/providers/SpeechProvider/SpeechProvider.actions.js index 5d38265c2..dccbe2dcd 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.'); } From 96e1d3b8428fc8514814a8d37e9c60cda470c0ee Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 24 Mar 2022 10:26:30 -0300 Subject: [PATCH 4/4] add langsFetched to blacklist --- .../Settings/Language/Language.container.js | 6 +++--- .../LanguageProvider/LanguageProvider.actions.js | 7 ------- .../LanguageProvider/LanguageProvider.constants.js | 2 -- .../LanguageProvider/LanguageProvider.reducer.js | 6 ------ .../SpeechProvider/SpeechProvider.container.js | 9 +-------- src/reducers.js | 13 ++++++++++--- 6 files changed, 14 insertions(+), 29 deletions(-) diff --git a/src/components/Settings/Language/Language.container.js b/src/components/Settings/Language/Language.container.js index b0a2b13df..245215978 100644 --- a/src/components/Settings/Language/Language.container.js +++ b/src/components/Settings/Language/Language.container.js @@ -445,14 +445,14 @@ export class LanguageContainer extends Component { const downloadingLangState = { isdownloading: false }; + setDownloadingLang(downloadingLangState); this.setState({ downloadingLangError: { ttsError: false, langError: false - } + }, + selectedLang: selectedLang }); - setDownloadingLang(downloadingLangState); - this.setState({ selectedLang: selectedLang }); this.refreshLanguageList(); if (isDiferentTts) return; await this.handleSubmit(selectedLang); diff --git a/src/providers/LanguageProvider/LanguageProvider.actions.js b/src/providers/LanguageProvider/LanguageProvider.actions.js index fbbb72709..399629565 100644 --- a/src/providers/LanguageProvider/LanguageProvider.actions.js +++ b/src/providers/LanguageProvider/LanguageProvider.actions.js @@ -1,6 +1,5 @@ import { CHANGE_LANG, - START_FETCHING_LANGS, SET_LANGS, SET_DOWNLOADING_LANG } from './LanguageProvider.constants'; @@ -14,12 +13,6 @@ export function changeLang(lang) { }; } -export function startFetchingLangs() { - return { - type: START_FETCHING_LANGS - }; -} - export function setLangs(langs, localLangs) { return { type: SET_LANGS, diff --git a/src/providers/LanguageProvider/LanguageProvider.constants.js b/src/providers/LanguageProvider/LanguageProvider.constants.js index f147df237..5657372d5 100644 --- a/src/providers/LanguageProvider/LanguageProvider.constants.js +++ b/src/providers/LanguageProvider/LanguageProvider.constants.js @@ -1,6 +1,4 @@ export const CHANGE_LANG = 'cboard/LanguageProvider/CHANGE_LANG'; -export const START_FETCHING_LANGS = - 'cboard/LanguageProvider/START_FETCHING_LANGS'; export const SET_LANGS = 'cboard/LanguageProvider/SET_LANGS'; export const SET_DOWNLOADING_LANG = 'cboard/LanguageProvider/SET_DOWNLOADING_LANG'; diff --git a/src/providers/LanguageProvider/LanguageProvider.reducer.js b/src/providers/LanguageProvider/LanguageProvider.reducer.js index 8bdf89b16..68a17418d 100644 --- a/src/providers/LanguageProvider/LanguageProvider.reducer.js +++ b/src/providers/LanguageProvider/LanguageProvider.reducer.js @@ -1,6 +1,5 @@ import { CHANGE_LANG, - START_FETCHING_LANGS, SET_LANGS, SET_DOWNLOADING_LANG } from './LanguageProvider.constants'; @@ -42,11 +41,6 @@ function languageProviderReducer(state = initialState, action) { lang: action.lang ? action.lang : state.lang, dir: action.lang ? getDir(action.lang) : state.dir }; - case START_FETCHING_LANGS: - return { - ...state, - langsFetched: false - }; case SET_LANGS: return { ...state, diff --git a/src/providers/SpeechProvider/SpeechProvider.container.js b/src/providers/SpeechProvider/SpeechProvider.container.js index f476b64dd..15778fa9c 100644 --- a/src/providers/SpeechProvider/SpeechProvider.container.js +++ b/src/providers/SpeechProvider/SpeechProvider.container.js @@ -10,7 +10,6 @@ import { updateLangSpeechStatus, setTtsEngine } from './SpeechProvider.actions'; -import { startFetchingLangs } from '../LanguageProvider/LanguageProvider.actions'; import { isAndroid } from '../../cordova-util'; export class SpeechProvider extends Component { @@ -20,11 +19,6 @@ export class SpeechProvider extends Component { setTtsEngine: PropTypes.func }; - constructor(props) { - super(props); - this.props.startFetchingLangs(); - } - async componentDidMount() { const { getVoices, @@ -73,8 +67,7 @@ const mapDispatchToProps = { getTtsEngines, getTtsDefaultEngine, setTtsEngine, - updateLangSpeechStatus, - startFetchingLangs + updateLangSpeechStatus }; export default connect( 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,