From 223cad08e3aaa96af7b8e3999b885a749f8e345e Mon Sep 17 00:00:00 2001 From: William Wong Date: Tue, 20 Aug 2019 04:41:38 -0700 Subject: [PATCH] Remove context argument --- packages/component/src/Activity/Speak.js | 2 +- packages/component/src/Composer.js | 12 ++++++++++-- packages/component/src/defaultSelectVoice.js | 2 +- packages/component/src/defaultSelectVoice.test.js | 12 ++++++------ packages/playground/src/App.js | 4 ++-- samples/06.g.select-voice/README.md | 4 ++-- samples/06.g.select-voice/index.html | 2 +- 7 files changed, 23 insertions(+), 15 deletions(-) diff --git a/packages/component/src/Activity/Speak.js b/packages/component/src/Activity/Speak.js index e0c57b3f7c..20a08dfab5 100644 --- a/packages/component/src/Activity/Speak.js +++ b/packages/component/src/Activity/Speak.js @@ -14,7 +14,7 @@ const connectSpeakActivity = (...selectors) => ({ language, markActivity, selectVoice }, { activity }) => ({ language, markAsSpoken: () => markActivity(activity, 'speak', false), - selectVoice: voices => selectVoice(voices, { language }, activity) + selectVoice: voices => selectVoice(voices, activity) }), ...selectors ); diff --git a/packages/component/src/Composer.js b/packages/component/src/Composer.js index 992ac1c556..ff0aeda141 100644 --- a/packages/component/src/Composer.js +++ b/packages/component/src/Composer.js @@ -196,6 +196,10 @@ class Composer extends React.Component { this.createContextFromProps = memoize(createLogic, shallowEquals); + this.createSelectVoice = memoize( + (selectVoice, language) => selectVoice || defaultSelectVoice.bind(null, { language }) + ); + this.createWebSpeechPonyfill = memoize( (webSpeechPonyfillFactory, referenceGrammarID) => webSpeechPonyfillFactory && webSpeechPonyfillFactory({ referenceGrammarID }) @@ -258,9 +262,11 @@ class Composer extends React.Component { grammars, groupTimestamp, + locale, referenceGrammarID, renderMarkdown, scrollToEnd, + selectVoice, store, userID: _userID, // Ignoring eslint no-unused-vars: we just want to remove userID and username from propsForLogic username: _username, // Ignoring eslint no-unused-vars: we just want to remove userID and username from propsForLogic @@ -281,11 +287,13 @@ class Composer extends React.Component { { activityRenderer, attachmentRenderer, - groupTimestamp, disabled, + locale, grammars: grammars || EMPTY_ARRAY, + groupTimestamp, renderMarkdown, scrollToEnd, + selectVoice: this.createSelectVoice(selectVoice, locale), store, webSpeechPonyfill: this.createWebSpeechPonyfill(webSpeechPonyfillFactory, referenceGrammarID) } @@ -352,7 +360,7 @@ Composer.defaultProps = { locale: window.navigator.language || 'en-US', referenceGrammarID: '', renderMarkdown: text => text, - selectVoice: defaultSelectVoice, + selectVoice: undefined, sendTimeout: 20000, sendTyping: undefined, sendTypingIndicator: false, diff --git a/packages/component/src/defaultSelectVoice.js b/packages/component/src/defaultSelectVoice.js index f6c52c5c7b..dfe700fd96 100644 --- a/packages/component/src/defaultSelectVoice.js +++ b/packages/component/src/defaultSelectVoice.js @@ -1,4 +1,4 @@ -export default function(voices, { language }, activity) { +export default function({ language }, voices, activity) { // Find the first voice based on this order: // 1. Voice with language same as locale as defined in the activity // 2. Voice with language same as locale as passed into Web Chat diff --git a/packages/component/src/defaultSelectVoice.test.js b/packages/component/src/defaultSelectVoice.test.js index 7b2a98847c..13a144ea3e 100644 --- a/packages/component/src/defaultSelectVoice.test.js +++ b/packages/component/src/defaultSelectVoice.test.js @@ -24,19 +24,19 @@ beforeEach(() => { }); test('Select voice based on activity locale', () => { - const actual = selectVoice(VOICES, { language: 'en-US' }, { locale: 'zh-HK' }); + const actual = selectVoice({ language: 'en-US' }, VOICES, { locale: 'zh-HK' }); expect(actual).toHaveProperty('lang', 'zh-HK'); }); test('Select voice based on options', () => { - const actual = selectVoice(VOICES, { language: 'en-UK' }, { locale: 'en-XX' }); + const actual = selectVoice({ language: 'en-UK' }, VOICES, { locale: 'en-XX' }); expect(actual).toHaveProperty('lang', 'en-UK'); }); test('Select voice based on browser', () => { - const actual = selectVoice(VOICES, { language: 'en-XX' }, { locale: 'en-XX' }); + const actual = selectVoice({ language: 'en-XX' }, VOICES, { locale: 'en-XX' }); expect(actual).toHaveProperty('lang', 'ja-JP'); }); @@ -44,13 +44,13 @@ test('Select voice based on browser', () => { test('Select voice of "en-US"', () => { global.window.navigator.language = 'en-XX'; - const actual = selectVoice(VOICES, { language: 'en-XX' }, { locale: 'en-XX' }); + const actual = selectVoice({ language: 'en-XX' }, VOICES, { locale: 'en-XX' }); expect(actual).toHaveProperty('lang', 'en-US'); }); test('Select first voice', () => { - const actual = selectVoice([{ lang: 'ko-KR' }], { language: 'en-XX' }, { locale: 'en-XX' }); + const actual = selectVoice({ language: 'en-XX' }, [{ lang: 'ko-KR' }], { locale: 'en-XX' }); expect(actual).toHaveProperty('lang', 'ko-KR'); }); @@ -67,7 +67,7 @@ test('Prefer voice powered by deep neural network', () => { } ]; - const actual = selectVoice(voices, { language: 'en-US' }, { locale: 'en-US' }); + const actual = selectVoice({ language: 'en-US' }, voices, { locale: 'en-US' }); expect(actual).toHaveProperty('name', 'GuyNeural'); }); diff --git a/packages/playground/src/App.js b/packages/playground/src/App.js index 6917940998..b482a89c7b 100644 --- a/packages/playground/src/App.js +++ b/packages/playground/src/App.js @@ -326,11 +326,11 @@ export default class extends React.Component { this.setState(() => ({ wordBreak: value })); } - selectVoiceWithGender(voices, { language }, activity) { + selectVoiceWithGender(voices, activity) { const { voiceGenderPreference } = this.state; return ( - [activity.locale, language, window.navigator.language, 'en-US'].reduce( + [activity.locale, this.state.language, window.navigator.language, 'en-US'].reduce( (result, targetLanguage) => result || voices.find( diff --git a/samples/06.g.select-voice/README.md b/samples/06.g.select-voice/README.md index 39a90b5536..e93456f1c6 100644 --- a/samples/06.g.select-voice/README.md +++ b/samples/06.g.select-voice/README.md @@ -47,7 +47,7 @@ In the sample code below, if the activity is for language "zh-HK", we will use a window.WebChat.renderWebChat({ directLine: window.WebChat.createDirectLine({ token }), -+ selectVoice: (voices, { language }, activity) => ++ selectVoice: (voices, activity) => + // If the activity is in zh-HK, use a voice with keyword "TracyRUS" (Cantonese). + // Otherwise, use "JessaNeural" (preferred) or "Jessa". + activity.locale === 'zh-HK' ? @@ -72,7 +72,7 @@ webSpeechPonyfillFactory = await window.WebChat.createCognitiveServicesSpeechSer window.WebChat.renderWebChat({ directLine: window.WebChat.createDirectLine({ token }), - selectVoice: (voices, { language }, activity) => + selectVoice: (voices, activity) => // If the activity is in zh-HK, use a voice with keyword "TracyRUS" (Cantonese). // Otherwise, use "JessaNeural" (preferred) or "Jessa". activity.locale === 'zh-HK' ? diff --git a/samples/06.g.select-voice/index.html b/samples/06.g.select-voice/index.html index 59303fdd0e..681d4edb54 100644 --- a/samples/06.g.select-voice/index.html +++ b/samples/06.g.select-voice/index.html @@ -39,7 +39,7 @@ window.WebChat.renderWebChat({ directLine: window.WebChat.createDirectLine({ token }), - selectVoice: (voices, { language }, activity) => + selectVoice: (voices, activity) => // If the activity is in zh-HK, use a voice with keyword "TracyRUS" (Cantonese). // Otherwise, use "JessaNeural" (preferred) or "Jessa". activity.locale === 'zh-HK' ?