From 8786414aa68922e241db0c33b19f8fa76803f8e6 Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 20 Apr 2023 11:33:00 -0300 Subject: [PATCH 01/30] create API method to improvePhrase using gpt --- src/api/api.js | 24 ++++++++++++++++++++++++ 1 file changed, 24 insertions(+) diff --git a/src/api/api.js b/src/api/api.js index 300d8dcc4..718987af6 100644 --- a/src/api/api.js +++ b/src/api/api.js @@ -575,6 +575,30 @@ class API { const { data } = await this.axiosInstance.get(`/subscription/list`); return data; } + + async improvePhrase(phrase) { + const authToken = getAuthToken(); + if (!(authToken && authToken.length)) { + throw new Error('Need to be authenticated to perform this request'); + } + + try { + const headers = { + Authorization: `Bearer ${authToken}` + }; + + const { data } = await this.axiosInstance.post( + `/gpt/edit`, + { phrase }, + { + headers + } + ); + return data; + } catch (error) { + console.error(error); + } + } } const API_INSTANCE = new API({}); From bb5bcbebde7d1eb6c529faa87dc6faef742467f3 Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 20 Apr 2023 11:36:25 -0300 Subject: [PATCH 02/30] dispatch improvePhrase on changeOutput --- src/components/Board/Board.actions.js | 29 ++++++++++++++++++++++++--- 1 file changed, 26 insertions(+), 3 deletions(-) diff --git a/src/components/Board/Board.actions.js b/src/components/Board/Board.actions.js index 1bdbcaaea..60d6768de 100644 --- a/src/components/Board/Board.actions.js +++ b/src/components/Board/Board.actions.js @@ -324,9 +324,32 @@ export function clickOutput(outputPhrase) { } export function changeOutput(output) { - return { - type: CHANGE_OUTPUT, - output + return async dispatch => { + dispatch(improvePhrase(output)); + dispatch({ + type: CHANGE_OUTPUT, + output + }); + }; +} + +export function improvePhrase(output) { + const improvePhrase = async () => { + const MIN_TILES_TO_IMPROVE = 2; + if (output.length <= MIN_TILES_TO_IMPROVE) return; + const labels = output.map(symbol => symbol.label); + const phrase = labels.join(' '); //this.handlePhraseToShare(); + + const improvedPhrase = await API.improvePhrase(phrase); + return improvedPhrase; + }; + return async (dispatch, getState) => { + try { + const improvedPhrase = await improvePhrase(); + console.log('improvedPhrase', improvedPhrase); + } catch (err) { + console.log('error', err); + } }; } From b5fccccab7d766a0d7603718573ef8e49ece4d07 Mon Sep 17 00:00:00 2001 From: tomivm Date: Wed, 21 Jun 2023 17:32:48 -0300 Subject: [PATCH 03/30] Implement an action to change improved phrase --- src/components/Board/Board.actions.js | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/src/components/Board/Board.actions.js b/src/components/Board/Board.actions.js index 60d6768de..7b1b05f42 100644 --- a/src/components/Board/Board.actions.js +++ b/src/components/Board/Board.actions.js @@ -17,6 +17,7 @@ import { CLICK_SYMBOL, CLICK_OUTPUT, CHANGE_OUTPUT, + CHANGE_IMPROVED_PHRASE, CHANGE_LIVE_MODE, REPLACE_BOARD, HISTORY_REMOVE_BOARD, @@ -335,18 +336,22 @@ export function changeOutput(output) { export function improvePhrase(output) { const improvePhrase = async () => { - const MIN_TILES_TO_IMPROVE = 2; - if (output.length <= MIN_TILES_TO_IMPROVE) return; + const MIN_TILES_TO_IMPROVE = 1; + if (output.length <= MIN_TILES_TO_IMPROVE) return ''; const labels = output.map(symbol => symbol.label); const phrase = labels.join(' '); //this.handlePhraseToShare(); const improvedPhrase = await API.improvePhrase(phrase); - return improvedPhrase; + return improvedPhrase.phrase; }; - return async (dispatch, getState) => { + return async dispatch => { try { const improvedPhrase = await improvePhrase(); console.log('improvedPhrase', improvedPhrase); + dispatch({ + type: CHANGE_IMPROVED_PHRASE, + improvedPhrase + }); } catch (err) { console.log('error', err); } From 2646a02421ac977bbf646f7bb2d86cb31a11024c Mon Sep 17 00:00:00 2001 From: tomivm Date: Wed, 21 Jun 2023 17:33:53 -0300 Subject: [PATCH 04/30] Implement change improved phrase reducer --- src/components/Board/Board.constants.js | 1 + src/components/Board/Board.reducer.js | 9 ++++++++- 2 files changed, 9 insertions(+), 1 deletion(-) diff --git a/src/components/Board/Board.constants.js b/src/components/Board/Board.constants.js index 6485712d0..7d820d648 100644 --- a/src/components/Board/Board.constants.js +++ b/src/components/Board/Board.constants.js @@ -15,6 +15,7 @@ export const FOCUS_TILE = 'cboard/Board/FOCUS_TILE'; export const CLICK_SYMBOL = 'cboard/Board/CLICK_SYMBOL'; export const CLICK_OUTPUT = 'cboard/Board/CLICK_OUTPUT'; export const CHANGE_OUTPUT = 'cboard/Board/CHANGE_OUTPUT'; +export const CHANGE_IMPROVED_PHRASE = 'cboard/Board/CHANGE_IMPROVED_PHRASE'; export const CHANGE_LIVE_MODE = 'cboard/Board/CHANGE_LIVE_MODE'; export const HISTORY_REMOVE_BOARD = 'cboard/Board/HISTORY_REMOVE_BOARD'; export const UNMARK_BOARD = 'cboard/Board/UNMARK_BOARD'; diff --git a/src/components/Board/Board.reducer.js b/src/components/Board/Board.reducer.js index 82127c582..03b5fd327 100644 --- a/src/components/Board/Board.reducer.js +++ b/src/components/Board/Board.reducer.js @@ -17,6 +17,7 @@ import { EDIT_TILES, FOCUS_TILE, CHANGE_OUTPUT, + CHANGE_IMPROVED_PHRASE, REPLACE_BOARD, HISTORY_REMOVE_BOARD, UNMARK_BOARD, @@ -48,7 +49,8 @@ const initialState = { isFetching: false, images: [], isFixed: false, - isLiveMode: false + isLiveMode: false, + improvedPhrase: '' }; function reconcileBoards(localBoard, remoteBoard) { @@ -411,6 +413,11 @@ function boardReducer(state = initialState, action) { return { ...state }; + case CHANGE_IMPROVED_PHRASE: + return { + ...state, + improvedPhrase: action.improvedPhrase + }; default: return state; } From 011249de606a71bf740c05aac94ee742a430754c Mon Sep 17 00:00:00 2001 From: tomivm Date: Wed, 21 Jun 2023 19:31:40 -0300 Subject: [PATCH 05/30] Add UI to Improve Phrase feature --- .../Board/Output/Output.container.js | 12 ++- .../SymbolOutput/ImprovePhraseControls.js | 48 +++++++++++ .../Output/SymbolOutput/Scroll/Scroll.css | 2 +- .../Output/SymbolOutput/SymbolOutput.css | 71 +++++++++++++++ .../Board/Output/SymbolOutput/SymbolOutput.js | 86 ++++++++++++------- 5 files changed, 185 insertions(+), 34 deletions(-) create mode 100644 src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js diff --git a/src/components/Board/Output/Output.container.js b/src/components/Board/Output/Output.container.js index 059a9bfca..89279c694 100644 --- a/src/components/Board/Output/Output.container.js +++ b/src/components/Board/Output/Output.container.js @@ -227,6 +227,10 @@ export class OutputContainer extends Component { } }; + handleSpeakImprovedPhrase = () => { + this.play(this.props.improvedPhrase); + }; + handleOutputKeyDown = event => { if (event.keyCode === keycode('enter')) { const targetEl = event.target; @@ -287,7 +291,8 @@ export class OutputContainer extends Component { output, navigationSettings, isLiveMode, - increaseOutputButtons + increaseOutputButtons, + improvedPhrase } = this.props; const tabIndex = output.length ? '0' : '-1'; return ( @@ -306,6 +311,8 @@ export class OutputContainer extends Component { increaseOutputButtons={increaseOutputButtons} phrase={this.handlePhraseToShare()} onWriteSymbol={this.handleWriteSymbol} + improvedPhrase={improvedPhrase} + onPlayImprovedPhrase={this.handleSpeakImprovedPhrase} /> ); } @@ -316,7 +323,8 @@ const mapStateToProps = ({ board, app }) => { output: board.output, isLiveMode: board.isLiveMode, navigationSettings: app.navigationSettings, - increaseOutputButtons: app.displaySettings.increaseOutputButtons + increaseOutputButtons: app.displaySettings.increaseOutputButtons, + improvedPhrase: board.improvedPhrase }; }; diff --git a/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js b/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js new file mode 100644 index 000000000..5b1306e44 --- /dev/null +++ b/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js @@ -0,0 +1,48 @@ +import React from 'react'; +import PropTypes from 'prop-types'; + +import IconButton from '@material-ui/core/IconButton'; +import PlayArrowIcon from '@material-ui/icons/PlayArrow'; + +const propTypes = { + increaseOutputButtons: PropTypes.bool, + bigControlsClassName: PropTypes.string, + onPlayImprovedPhrase: PropTypes.function +}; + +function ImprovePhraseControls({ + increaseOutputButtons, + bigControlsClassName, + onPlayImprovedPhrase +}) { + return ( +
+
+
+
+ + + +
+
+
+ ); +} +ImprovePhraseControls.propTypes = propTypes; +ImprovePhraseControls.defaultProps = {}; + +export default ImprovePhraseControls; diff --git a/src/components/Board/Output/SymbolOutput/Scroll/Scroll.css b/src/components/Board/Output/SymbolOutput/Scroll/Scroll.css index 6e4a41ef0..202bb620c 100644 --- a/src/components/Board/Output/SymbolOutput/Scroll/Scroll.css +++ b/src/components/Board/Output/SymbolOutput/Scroll/Scroll.css @@ -1,6 +1,6 @@ .Scroll__container { position: relative; - width: auto; + width: calc(100% - var(--improve-phrase-widht)); height: 100%; display: flex; flex-grow: 1; diff --git a/src/components/Board/Output/SymbolOutput/SymbolOutput.css b/src/components/Board/Output/SymbolOutput/SymbolOutput.css index cbeb267a3..bf0666a2c 100644 --- a/src/components/Board/Output/SymbolOutput/SymbolOutput.css +++ b/src/components/Board/Output/SymbolOutput/SymbolOutput.css @@ -4,6 +4,65 @@ display: flex; background: #fff; color: rgba(0, 0, 0, 0.54); + --improve-phrase-widht: 67px; +} + +.improvePhrase_big_controlls { + --improve-phrase-widht: 105px; +} + +.SymbolOutput__scroll_improved { + display: flex; + flex-direction: column; + height: 100%; + width: 100%; + overflow-x: auto; + color: inherit; + background: inherit; +} + +.SymbolOutput__improved__Phrase { + padding: 0.2em; + /* border-radius: 0 30px 30px 0; */ + /* border: 1px solid #dcdcdc; */ + box-shadow: -9px 1px 8px 1px #dcdcdc; + color: black; + background: inherit; + font-weight: bolder; + width: calc(100% - var(--improve-phrase-widht)); + position: relative; + z-index: 1; +} + +.SymbolOutput__improved__Phrase p { + font-weight: bolder; +} + +.SymbolOutput__improved__Phrase__controls { + background: #fff; + position: absolute; + bottom: 0; + right: 0; /* Pay attention to invert direction of escriture */ + height: 100%; + width: var(--improve-phrase-widht); + /* box-shadow: 1px 1px 8px 1px #dcdcdc; */ + /* border-radius: 0 30px 30px 0; */ +} + +.improved_Phrase_Button { + display: flex; + height: 100%; + justify-content: center; + align-content: center; +} + +.improved__Phrase_shadow { + position: absolute; + top: 0; + height: 100%; + width: 100%; + box-shadow: 1px 1px 8px 1px #dcdcdc; + border-radius: 20px 20px 20px 0; } .is-dark .SymbolOutput { @@ -87,6 +146,12 @@ button.Output__button__lg { margin-right: 15px; } +button.Improved__Phrase__button__lg { + align-self: center; + height: 100px; + width: 100px; +} + svg.Output__icon__sm { height: 32px; width: 32px; @@ -126,6 +191,12 @@ svg.Output__icon__lg { margin-right: unset; } + button.Improved__Phrase__button__lg { + align-self: center; + height: 64px; + width: 64px; + } + svg.Output__icon__lg { height: 32px; width: 32px; diff --git a/src/components/Board/Output/SymbolOutput/SymbolOutput.js b/src/components/Board/Output/SymbolOutput/SymbolOutput.js index f624cd60f..f63e0a728 100644 --- a/src/components/Board/Output/SymbolOutput/SymbolOutput.js +++ b/src/components/Board/Output/SymbolOutput/SymbolOutput.js @@ -14,6 +14,8 @@ import PhraseShare from '../PhraseShare'; import Scroll from './Scroll'; import './SymbolOutput.css'; import { injectIntl } from 'react-intl'; +import { Typography } from '@material-ui/core'; +import ImprovePhraseControls from './ImprovePhraseControls'; class SymbolOutput extends PureComponent { constructor(props) { @@ -91,6 +93,8 @@ class SymbolOutput extends PureComponent { phrase, isLiveMode, increaseOutputButtons, + improvedPhrase, + onPlayImprovedPhrase, ...other } = this.props; @@ -110,41 +114,54 @@ class SymbolOutput extends PureComponent { visibility: navigationSettings.removeOutputActive ? 'hidden' : 'visible' }; + const bigControlsClassName = increaseOutputButtons + ? 'improvePhrase_big_controlls' + : ''; + return (
- - {symbols.map(({ image, label, type }, index) => ( -
- -
- - - +
+ + {symbols.map(({ image, label, type }, index) => ( +
+ +
+ + + +
+ ))} + + {improvedPhrase.length > 0 && ( +
+ {improvedPhrase}
- ))} - + )} +
+ {improvedPhrase.length > 0 && ( + + )} {navigationSettings.shareShowActive && ( Date: Thu, 22 Jun 2023 18:32:25 -0300 Subject: [PATCH 06/30] add state to enable and disable improve Phrase --- src/components/App/App.reducer.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/App/App.reducer.js b/src/components/App/App.reducer.js index 84bdff8fe..a27b7cfe0 100644 --- a/src/components/App/App.reducer.js +++ b/src/components/App/App.reducer.js @@ -49,7 +49,8 @@ const initialState = { quickUnlockActive: false, removeOutputActive: false, vocalizeFolders: false, - liveMode: false + liveMode: false, + improvePhraseActive: false }, userData: {} }; From 078b5cd7d80604bf1c7da770b970293d663e33de Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 22 Jun 2023 18:33:06 -0300 Subject: [PATCH 07/30] Only dispatch improvePhrase wen feature is enabled --- src/components/Board/Board.actions.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/components/Board/Board.actions.js b/src/components/Board/Board.actions.js index 7b1b05f42..ac3f4dedb 100644 --- a/src/components/Board/Board.actions.js +++ b/src/components/Board/Board.actions.js @@ -325,8 +325,13 @@ export function clickOutput(outputPhrase) { } export function changeOutput(output) { - return async dispatch => { - dispatch(improvePhrase(output)); + return async (dispatch, getState) => { + const { + app: { + navigationSettings: { improvePhraseActive } + } + } = getState(); + if (improvePhraseActive) dispatch(improvePhrase(output)); dispatch({ type: CHANGE_OUTPUT, output From 03c979a3190456d52eae26d60127f465eafb2a0c Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 22 Jun 2023 18:35:03 -0300 Subject: [PATCH 08/30] Add item to Navigation settings to enable the Improve Phrase feature --- .../Navigation/Navigation.component.js | 27 +++++++++++++++++++ .../Navigation/Navigation.messages.js | 9 +++++++ src/translations/src/cboard.json | 2 ++ 3 files changed, 38 insertions(+) diff --git a/src/components/Settings/Navigation/Navigation.component.js b/src/components/Settings/Navigation/Navigation.component.js index 9059411b9..598d48bbd 100644 --- a/src/components/Settings/Navigation/Navigation.component.js +++ b/src/components/Settings/Navigation/Navigation.component.js @@ -80,6 +80,12 @@ class Navigation extends React.Component { }); }; + toggleimprovePhraseActive = () => { + this.setState({ + improvePhraseActive: !this.state.improvePhraseActive + }); + }; + onSubmit = () => { const { isLiveMode, changeLiveMode } = this.props; if (!this.state.liveMode && isLiveMode) { @@ -289,6 +295,27 @@ class Navigation extends React.Component { /> + + + } + secondary={ + + } + /> + + + + diff --git a/src/components/Settings/Navigation/Navigation.messages.js b/src/components/Settings/Navigation/Navigation.messages.js index 7822e571a..d8def2f62 100644 --- a/src/components/Settings/Navigation/Navigation.messages.js +++ b/src/components/Settings/Navigation/Navigation.messages.js @@ -56,6 +56,15 @@ export default defineMessages({ defaultMessage: 'Live mode allows you to write text directly into the output bar and quickly play the sound. It is intended for users that can write.' }, + activeImprovePhrase: { + id: 'cboard.components.Settings.Navigation.activeImprovePhrase', + defaultMessage: 'Use Improve Phrase' + }, + activeImprovePhraseSecondary: { + id: 'cboard.components.Settings.Navigation.activeImprovePhraseSecondary', + defaultMessage: + 'Improve Phrase allows you to gramatically improve the output phrase using Artificial intelligence. It is intended for users of core boards' + }, bigScroll: { id: 'cboard.components.Settings.Navigation.bigScroll', defaultMessage: 'Enable big scroll buttons' diff --git a/src/translations/src/cboard.json b/src/translations/src/cboard.json index 741fe814d..66a1f430c 100644 --- a/src/translations/src/cboard.json +++ b/src/translations/src/cboard.json @@ -421,6 +421,8 @@ "cboard.components.Settings.Navigation.vocalizeFoldersSecondary": "Reads folders name out loud when clicked", "cboard.components.Settings.Navigation.showLiveMode": "Use the Live Mode", "cboard.components.Settings.Navigation.showLiveModeSecondary": "Live mode allows you to write text directly into the output bar and quickly play the sound. It is intended for users that can write.", + "cboard.components.Settings.Navigation.activeImprovePhrase": "Use Improve Phrase", + "cboard.components.Settings.Navigation.activeImprovePhraseSecondary": "Improve Phrase allows you to gramatically improve the output phrase using Artificial intelligence. It is intended for users of core boards", "cboard.components.Settings.Navigation.bigScroll": "Enable big scroll buttons", "cboard.components.Settings.Navigation.bigScrollSecondary": "Shows big scroll buttons. Select the desired style in navigation buttons style section", "cboard.components.Settings.Navigation.navigationButtonsStyle": "Navigation buttons style", From 78e70516a43938cf8f046f70a1e92136a1928ade Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 22 Jun 2023 18:36:47 -0300 Subject: [PATCH 09/30] Show Improve Phrase components only when it is enabled --- .../Board/Output/SymbolOutput/SymbolOutput.css | 4 ++++ .../Board/Output/SymbolOutput/SymbolOutput.js | 17 ++++++++++++----- 2 files changed, 16 insertions(+), 5 deletions(-) diff --git a/src/components/Board/Output/SymbolOutput/SymbolOutput.css b/src/components/Board/Output/SymbolOutput/SymbolOutput.css index bf0666a2c..9d85465d2 100644 --- a/src/components/Board/Output/SymbolOutput/SymbolOutput.css +++ b/src/components/Board/Output/SymbolOutput/SymbolOutput.css @@ -4,6 +4,10 @@ display: flex; background: #fff; color: rgba(0, 0, 0, 0.54); + --improve-phrase-widht: 0; +} + +.improvePhrase_active { --improve-phrase-widht: 67px; } diff --git a/src/components/Board/Output/SymbolOutput/SymbolOutput.js b/src/components/Board/Output/SymbolOutput/SymbolOutput.js index f63e0a728..ea596c719 100644 --- a/src/components/Board/Output/SymbolOutput/SymbolOutput.js +++ b/src/components/Board/Output/SymbolOutput/SymbolOutput.js @@ -98,6 +98,8 @@ class SymbolOutput extends PureComponent { ...other } = this.props; + const improvePhraseActive = navigationSettings.improvePhraseActive; + const clearButtonStyle = { visibility: symbols.length ? 'visible' : 'hidden' }; @@ -114,12 +116,17 @@ class SymbolOutput extends PureComponent { visibility: navigationSettings.removeOutputActive ? 'hidden' : 'visible' }; - const bigControlsClassName = increaseOutputButtons - ? 'improvePhrase_big_controlls' + const activeImprovePhraseClassName = improvePhraseActive + ? 'improvePhrase_active' : ''; + const bigControlsClassName = + improvePhraseActive && increaseOutputButtons + ? 'improvePhrase_big_controlls' + : ''; + return ( -
+
@@ -156,7 +163,7 @@ class SymbolOutput extends PureComponent {
))} - {improvedPhrase.length > 0 && ( + {improvePhraseActive && improvedPhrase.length > 0 && (
{improvedPhrase}
@@ -169,7 +176,7 @@ class SymbolOutput extends PureComponent { minWidth: 'fit-content' }} > - {improvedPhrase.length > 0 && ( + {improvePhraseActive && improvedPhrase.length > 0 && ( Date: Thu, 22 Jun 2023 18:37:17 -0300 Subject: [PATCH 10/30] fix Proptype on improvePhraseControls --- .../Board/Output/SymbolOutput/ImprovePhraseControls.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js b/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js index 5b1306e44..afe204c4c 100644 --- a/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js +++ b/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js @@ -7,7 +7,7 @@ import PlayArrowIcon from '@material-ui/icons/PlayArrow'; const propTypes = { increaseOutputButtons: PropTypes.bool, bigControlsClassName: PropTypes.string, - onPlayImprovedPhrase: PropTypes.function + onPlayImprovedPhrase: PropTypes.func }; function ImprovePhraseControls({ From 282c53753337c1d8972e820ffaa97b15cef4e2db Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 22 Jun 2023 18:47:12 -0300 Subject: [PATCH 11/30] Add improvedPhrase to the initial state of the test --- src/components/Board/__tests__/Board.reducer.test.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/Board/__tests__/Board.reducer.test.js b/src/components/Board/__tests__/Board.reducer.test.js index 04bc9bb51..ebd19708c 100644 --- a/src/components/Board/__tests__/Board.reducer.test.js +++ b/src/components/Board/__tests__/Board.reducer.test.js @@ -52,7 +52,8 @@ const initialState = { isFetching: false, isFixed: false, images: [], - isLiveMode: false + isLiveMode: false, + improvedPhrase: '' }; describe('reducer', () => { From 53ec9675eb4a87e7af1a715dfca1aa19688278c9 Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 22 Jun 2023 18:56:38 -0300 Subject: [PATCH 12/30] Update App reducer test to support improvePhrase active setting --- src/components/App/__tests__/App.reducer.test.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/src/components/App/__tests__/App.reducer.test.js b/src/components/App/__tests__/App.reducer.test.js index ac5dcbf98..b65e2622e 100644 --- a/src/components/App/__tests__/App.reducer.test.js +++ b/src/components/App/__tests__/App.reducer.test.js @@ -47,7 +47,8 @@ describe('reducer', () => { shareShowActive: false, quickUnlockActive: false, removeOutputActive: false, - vocalizeFolders: false + vocalizeFolders: false, + improvePhraseActive: false }, userData: {} }; @@ -73,7 +74,8 @@ describe('reducer', () => { shareShowActive: false, quickUnlockActive: false, removeOutputActive: false, - vocalizeFolders: false + vocalizeFolders: false, + improvePhraseActive: false }, userData: uData }; From cd5eb3da8c3ff7c51e90b6798e81116c3427be4d Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 22 Jun 2023 19:34:16 -0300 Subject: [PATCH 13/30] Test changeOutput action like a thunk --- .../Board/__tests__/Board.actions.test.js | 20 ++++++++++++++----- 1 file changed, 15 insertions(+), 5 deletions(-) diff --git a/src/components/Board/__tests__/Board.actions.test.js b/src/components/Board/__tests__/Board.actions.test.js index 7afaf44d9..fc8879265 100644 --- a/src/components/Board/__tests__/Board.actions.test.js +++ b/src/components/Board/__tests__/Board.actions.test.js @@ -42,6 +42,9 @@ const initialState = { app: { userData: { email: 'asd@qwe.com' + }, + navigationSettings: { + improvePhraseActive: false } } }; @@ -200,11 +203,18 @@ describe('actions', () => { it('should create an action to REPLACE_ME', () => { const output = [{}, {}]; - const expectedAction = { - type: types.CHANGE_OUTPUT, - output - }; - expect(actions.changeOutput(output)).toEqual(expectedAction); + const expectedActions = [ + { + type: types.CHANGE_OUTPUT, + output + } + ]; + + const store = mockStore(initialState); + store.dispatch(actions.changeOutput(output)); + const dispatchedActions = store.getActions(); + console.log(dispatchedActions); + expect(dispatchedActions).toEqual(expectedActions); }); it('should create an action to REPLACE_ME', () => { From a761494dd708e74f829961d5658d489410b365bb Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 10 Aug 2023 16:44:44 -0300 Subject: [PATCH 14/30] Allow use improve phrase feature only for premium users --- .../Settings/Navigation/Navigation.component.js | 15 +++++++++------ .../SubscriptionProvider.actions.js | 7 +++++++ 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/src/components/Settings/Navigation/Navigation.component.js b/src/components/Settings/Navigation/Navigation.component.js index 598d48bbd..db37057e1 100644 --- a/src/components/Settings/Navigation/Navigation.component.js +++ b/src/components/Settings/Navigation/Navigation.component.js @@ -17,6 +17,7 @@ import { NAVIGATION_BUTTONS_STYLES } from './Navigation.constants'; import './Navigation.css'; import ResetToursItem from '../../UI/ResetToursItem'; +import PremiumFeature from '../../PremiumFeature'; const propTypes = { /** @@ -308,12 +309,14 @@ class Navigation extends React.Component { } /> - + + + diff --git a/src/providers/SubscriptionProvider/SubscriptionProvider.actions.js b/src/providers/SubscriptionProvider/SubscriptionProvider.actions.js index f4c0e5c86..fb50a9466 100644 --- a/src/providers/SubscriptionProvider/SubscriptionProvider.actions.js +++ b/src/providers/SubscriptionProvider/SubscriptionProvider.actions.js @@ -16,6 +16,7 @@ import { import API from '../../api'; import { isLogged } from '../../components/App/App.selectors'; import { isAndroid } from '../../cordova-util'; +import { updateNavigationSettings } from '../../components/App/App.actions'; export function updateIsInFreeCountry() { return (dispatch, getState) => { @@ -43,6 +44,8 @@ export function updateIsOnTrialPeriod() { isOnTrialPeriod }) ); + + if (!isOnTrialPeriod) disablePremiumFeaturesOnTrialPeriodEnded(); return isOnTrialPeriod; function isUserOnTrialPeriod(createdAt) { @@ -56,6 +59,10 @@ export function updateIsOnTrialPeriod() { if (actualDate >= tryLimitDate) return false; return true; } + + function disablePremiumFeaturesOnTrialPeriodEnded() { + dispatch(updateNavigationSettings({ improvePhraseActive: false })); + } }; } From f65dd99542b138f3c70be9b4fe6da4cc6bb01943 Mon Sep 17 00:00:00 2001 From: tomivm Date: Thu, 10 Aug 2023 17:21:45 -0300 Subject: [PATCH 15/30] Pass the app language to gpt endpoint in order to avoid wrong results --- src/api/api.js | 4 ++-- src/components/Board/Board.actions.js | 10 +++++----- 2 files changed, 7 insertions(+), 7 deletions(-) diff --git a/src/api/api.js b/src/api/api.js index b4c7527c1..66adfa72e 100644 --- a/src/api/api.js +++ b/src/api/api.js @@ -627,7 +627,7 @@ class API { } } - async improvePhrase(phrase) { + async improvePhrase({ phrase, language }) { const authToken = getAuthToken(); if (!(authToken && authToken.length)) { throw new Error('Need to be authenticated to perform this request'); @@ -640,7 +640,7 @@ class API { const { data } = await this.axiosInstance.post( `/gpt/edit`, - { phrase }, + { phrase, language }, { headers } diff --git a/src/components/Board/Board.actions.js b/src/components/Board/Board.actions.js index ac3f4dedb..6c931dc13 100644 --- a/src/components/Board/Board.actions.js +++ b/src/components/Board/Board.actions.js @@ -340,18 +340,18 @@ export function changeOutput(output) { } export function improvePhrase(output) { - const improvePhrase = async () => { + const improvePhrase = async language => { const MIN_TILES_TO_IMPROVE = 1; if (output.length <= MIN_TILES_TO_IMPROVE) return ''; const labels = output.map(symbol => symbol.label); const phrase = labels.join(' '); //this.handlePhraseToShare(); - - const improvedPhrase = await API.improvePhrase(phrase); + const improvedPhrase = await API.improvePhrase({ phrase, language }); return improvedPhrase.phrase; }; - return async dispatch => { + return async (dispatch, getState) => { try { - const improvedPhrase = await improvePhrase(); + const language = getState().language.lang; + const improvedPhrase = await improvePhrase(language); console.log('improvedPhrase', improvedPhrase); dispatch({ type: CHANGE_IMPROVED_PHRASE, From 301ed3fc8ac5d699e9aafebd4ed6926c9d2eaeb0 Mon Sep 17 00:00:00 2001 From: tomivm Date: Fri, 11 Aug 2023 17:23:41 -0300 Subject: [PATCH 16/30] remove console logs --- src/components/Board/Board.actions.js | 1 - src/components/Board/__tests__/Board.actions.test.js | 1 - 2 files changed, 2 deletions(-) diff --git a/src/components/Board/Board.actions.js b/src/components/Board/Board.actions.js index 6c931dc13..2f44f767b 100644 --- a/src/components/Board/Board.actions.js +++ b/src/components/Board/Board.actions.js @@ -352,7 +352,6 @@ export function improvePhrase(output) { try { const language = getState().language.lang; const improvedPhrase = await improvePhrase(language); - console.log('improvedPhrase', improvedPhrase); dispatch({ type: CHANGE_IMPROVED_PHRASE, improvedPhrase diff --git a/src/components/Board/__tests__/Board.actions.test.js b/src/components/Board/__tests__/Board.actions.test.js index fc8879265..c9743e001 100644 --- a/src/components/Board/__tests__/Board.actions.test.js +++ b/src/components/Board/__tests__/Board.actions.test.js @@ -213,7 +213,6 @@ describe('actions', () => { const store = mockStore(initialState); store.dispatch(actions.changeOutput(output)); const dispatchedActions = store.getActions(); - console.log(dispatchedActions); expect(dispatchedActions).toEqual(expectedActions); }); From e2c099b567f68a51ecbcbbe5b2bfcd3bd623d1bd Mon Sep 17 00:00:00 2001 From: tomivm Date: Fri, 11 Aug 2023 17:35:59 -0300 Subject: [PATCH 17/30] Avoid disabling features for subscribers and users in a free country --- .../SubscriptionProvider/SubscriptionProvider.actions.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/providers/SubscriptionProvider/SubscriptionProvider.actions.js b/src/providers/SubscriptionProvider/SubscriptionProvider.actions.js index fb50a9466..6344cf5f5 100644 --- a/src/providers/SubscriptionProvider/SubscriptionProvider.actions.js +++ b/src/providers/SubscriptionProvider/SubscriptionProvider.actions.js @@ -45,7 +45,11 @@ export function updateIsOnTrialPeriod() { }) ); - if (!isOnTrialPeriod) disablePremiumFeaturesOnTrialPeriodEnded(); + const isInFreeCountry = state.subscription?.isInFreeCountry; + const isSubscribed = state.subscription?.isSubscribed; + if (!isOnTrialPeriod && !(isSubscribed || isInFreeCountry)) + disablePremiumFeaturesOnTrialPeriodEnded(); + return isOnTrialPeriod; function isUserOnTrialPeriod(createdAt) { From a731132bada010668abbce00528ce7ce29085b60 Mon Sep 17 00:00:00 2001 From: tomivm Date: Mon, 28 Aug 2023 16:09:07 -0300 Subject: [PATCH 18/30] Add new UI --- src/components/Board/Board.component.js | 7 +++- src/components/Board/Board.container.js | 9 +++- .../ImprovePhraseOutput.js | 41 +++++++++++++++++++ .../ImprovePhraseOutput.module.css | 27 ++++++++++++ .../Board/ImprovePhraseOutput/index.js | 1 + 5 files changed, 81 insertions(+), 4 deletions(-) create mode 100644 src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js create mode 100644 src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css create mode 100644 src/components/Board/ImprovePhraseOutput/index.js diff --git a/src/components/Board/Board.component.js b/src/components/Board/Board.component.js index ba76dbc7c..4c5f8f65d 100644 --- a/src/components/Board/Board.component.js +++ b/src/components/Board/Board.component.js @@ -34,6 +34,7 @@ import './Board.css'; import BoardTour from './BoardTour/BoardTour'; import ScrollButtons from '../ScrollButtons'; import { NAVIGATION_BUTTONS_STYLE_SIDES } from '../Settings/Navigation/Navigation.constants'; +import ImprovePhraseOutput from './ImprovePhraseOutput'; export class Board extends Component { static propTypes = { @@ -315,7 +316,9 @@ export class Board extends Component { setIsScroll, isScroll, totalRows, - changeDefaultBoard + changeDefaultBoard, + improvedPhrase, + speak } = this.props; const tiles = this.renderTiles(board.tiles); @@ -524,7 +527,7 @@ export class Board extends Component { /> )}
- + { + if (!improvedPhrase || improvedPhrase.length === 0) return; + speak(improvedPhrase); + }; + const enabledControllsClassname = improvedPhrase + ? `${styles.text_and_controls} ${styles.enabled}` + : styles.text_and_controls; + + return ( +
+ {improvedPhrase} + {improvedPhrase && ( + + )} +
+ ); +} + +ImprovePhraseOutput.propTypes = propTypes; + +export default ImprovePhraseOutput; diff --git a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css new file mode 100644 index 000000000..128aaf0cb --- /dev/null +++ b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css @@ -0,0 +1,27 @@ +.text_and_controls { + display: flex; + align-items: center; + justify-content: space-between; + box-shadow: 0px 3px 4px 3px #c1c1c1; + padding: 0.5em 1.5em 0.5em 2em; + margin: 0.5em 0.5em; + border-radius: 0.5em; + transition: box-shadow 0.3s; + border: 2px solid transparent; + height: 3em; +} + +.text_and_controls.enabled:hover, +.text_and_controls.enabled:focus { + outline: none; + border: 2px solid #3f51b5; /* Red border */ +} + +.text_and_controls .playArrow, +.text_and_controls { + transition: all 0.3s; +} +.text_and_controls.enabled:hover .playArrow, +.text_and_controls.enabled:focus .playArrow { + transform: scale(1.2); +} diff --git a/src/components/Board/ImprovePhraseOutput/index.js b/src/components/Board/ImprovePhraseOutput/index.js new file mode 100644 index 000000000..81fd06be2 --- /dev/null +++ b/src/components/Board/ImprovePhraseOutput/index.js @@ -0,0 +1 @@ +export { default } from './ImprovePhraseOutput'; From f80e96094c11bb3d67bfc36e26966261d60e7832 Mon Sep 17 00:00:00 2001 From: tomivm Date: Mon, 28 Aug 2023 16:26:43 -0300 Subject: [PATCH 19/30] Remove old UI --- .../Board/Output/Output.container.js | 12 +-- .../Output/SymbolOutput/Scroll/Scroll.css | 2 +- .../Output/SymbolOutput/SymbolOutput.css | 75 --------------- .../Board/Output/SymbolOutput/SymbolOutput.js | 96 +++++++------------ 4 files changed, 36 insertions(+), 149 deletions(-) diff --git a/src/components/Board/Output/Output.container.js b/src/components/Board/Output/Output.container.js index 89279c694..059a9bfca 100644 --- a/src/components/Board/Output/Output.container.js +++ b/src/components/Board/Output/Output.container.js @@ -227,10 +227,6 @@ export class OutputContainer extends Component { } }; - handleSpeakImprovedPhrase = () => { - this.play(this.props.improvedPhrase); - }; - handleOutputKeyDown = event => { if (event.keyCode === keycode('enter')) { const targetEl = event.target; @@ -291,8 +287,7 @@ export class OutputContainer extends Component { output, navigationSettings, isLiveMode, - increaseOutputButtons, - improvedPhrase + increaseOutputButtons } = this.props; const tabIndex = output.length ? '0' : '-1'; return ( @@ -311,8 +306,6 @@ export class OutputContainer extends Component { increaseOutputButtons={increaseOutputButtons} phrase={this.handlePhraseToShare()} onWriteSymbol={this.handleWriteSymbol} - improvedPhrase={improvedPhrase} - onPlayImprovedPhrase={this.handleSpeakImprovedPhrase} /> ); } @@ -323,8 +316,7 @@ const mapStateToProps = ({ board, app }) => { output: board.output, isLiveMode: board.isLiveMode, navigationSettings: app.navigationSettings, - increaseOutputButtons: app.displaySettings.increaseOutputButtons, - improvedPhrase: board.improvedPhrase + increaseOutputButtons: app.displaySettings.increaseOutputButtons }; }; diff --git a/src/components/Board/Output/SymbolOutput/Scroll/Scroll.css b/src/components/Board/Output/SymbolOutput/Scroll/Scroll.css index 202bb620c..6e4a41ef0 100644 --- a/src/components/Board/Output/SymbolOutput/Scroll/Scroll.css +++ b/src/components/Board/Output/SymbolOutput/Scroll/Scroll.css @@ -1,6 +1,6 @@ .Scroll__container { position: relative; - width: calc(100% - var(--improve-phrase-widht)); + width: auto; height: 100%; display: flex; flex-grow: 1; diff --git a/src/components/Board/Output/SymbolOutput/SymbolOutput.css b/src/components/Board/Output/SymbolOutput/SymbolOutput.css index 9d85465d2..cbeb267a3 100644 --- a/src/components/Board/Output/SymbolOutput/SymbolOutput.css +++ b/src/components/Board/Output/SymbolOutput/SymbolOutput.css @@ -4,69 +4,6 @@ display: flex; background: #fff; color: rgba(0, 0, 0, 0.54); - --improve-phrase-widht: 0; -} - -.improvePhrase_active { - --improve-phrase-widht: 67px; -} - -.improvePhrase_big_controlls { - --improve-phrase-widht: 105px; -} - -.SymbolOutput__scroll_improved { - display: flex; - flex-direction: column; - height: 100%; - width: 100%; - overflow-x: auto; - color: inherit; - background: inherit; -} - -.SymbolOutput__improved__Phrase { - padding: 0.2em; - /* border-radius: 0 30px 30px 0; */ - /* border: 1px solid #dcdcdc; */ - box-shadow: -9px 1px 8px 1px #dcdcdc; - color: black; - background: inherit; - font-weight: bolder; - width: calc(100% - var(--improve-phrase-widht)); - position: relative; - z-index: 1; -} - -.SymbolOutput__improved__Phrase p { - font-weight: bolder; -} - -.SymbolOutput__improved__Phrase__controls { - background: #fff; - position: absolute; - bottom: 0; - right: 0; /* Pay attention to invert direction of escriture */ - height: 100%; - width: var(--improve-phrase-widht); - /* box-shadow: 1px 1px 8px 1px #dcdcdc; */ - /* border-radius: 0 30px 30px 0; */ -} - -.improved_Phrase_Button { - display: flex; - height: 100%; - justify-content: center; - align-content: center; -} - -.improved__Phrase_shadow { - position: absolute; - top: 0; - height: 100%; - width: 100%; - box-shadow: 1px 1px 8px 1px #dcdcdc; - border-radius: 20px 20px 20px 0; } .is-dark .SymbolOutput { @@ -150,12 +87,6 @@ button.Output__button__lg { margin-right: 15px; } -button.Improved__Phrase__button__lg { - align-self: center; - height: 100px; - width: 100px; -} - svg.Output__icon__sm { height: 32px; width: 32px; @@ -195,12 +126,6 @@ svg.Output__icon__lg { margin-right: unset; } - button.Improved__Phrase__button__lg { - align-self: center; - height: 64px; - width: 64px; - } - svg.Output__icon__lg { height: 32px; width: 32px; diff --git a/src/components/Board/Output/SymbolOutput/SymbolOutput.js b/src/components/Board/Output/SymbolOutput/SymbolOutput.js index f0a826cac..27ae191b7 100644 --- a/src/components/Board/Output/SymbolOutput/SymbolOutput.js +++ b/src/components/Board/Output/SymbolOutput/SymbolOutput.js @@ -14,8 +14,6 @@ import PhraseShare from '../PhraseShare'; import Scroll from './Scroll'; import './SymbolOutput.css'; import { injectIntl } from 'react-intl'; -import { Typography } from '@material-ui/core'; -import ImprovePhraseControls from './ImprovePhraseControls'; class SymbolOutput extends PureComponent { constructor(props) { @@ -94,13 +92,9 @@ class SymbolOutput extends PureComponent { phrase, isLiveMode, increaseOutputButtons, - improvedPhrase, - onPlayImprovedPhrase, ...other } = this.props; - const improvePhraseActive = navigationSettings.improvePhraseActive; - const clearButtonStyle = { visibility: symbols.length ? 'visible' : 'hidden' }; @@ -117,59 +111,42 @@ class SymbolOutput extends PureComponent { visibility: navigationSettings.removeOutputActive ? 'hidden' : 'visible' }; - const activeImprovePhraseClassName = improvePhraseActive - ? 'improvePhrase_active' - : ''; - - const bigControlsClassName = - improvePhraseActive && increaseOutputButtons - ? 'improvePhrase_big_controlls' - : ''; - return ( -
-
- - {symbols.map(({ image, label, type }, index) => ( -
- -
- - - -
+
+ + {symbols.map(({ image, label, type, keyPath }, index) => ( +
+ +
+ + +
- ))} - - {improvePhraseActive && improvedPhrase.length > 0 && ( -
- {improvedPhrase}
- )} -
+ ))} +
- {improvePhraseActive && improvedPhrase.length > 0 && ( - - )} {navigationSettings.shareShowActive && ( Date: Mon, 28 Aug 2023 16:31:46 -0300 Subject: [PATCH 20/30] Add divider on settings --- src/components/Settings/Navigation/Navigation.component.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/Settings/Navigation/Navigation.component.js b/src/components/Settings/Navigation/Navigation.component.js index db37057e1..fb32ef412 100644 --- a/src/components/Settings/Navigation/Navigation.component.js +++ b/src/components/Settings/Navigation/Navigation.component.js @@ -296,6 +296,7 @@ class Navigation extends React.Component { /> + Date: Tue, 29 Aug 2023 16:10:01 -0300 Subject: [PATCH 21/30] Avoid render the ImprovePhraseOutput when feature is disabled --- src/components/Board/Board.component.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/Board/Board.component.js b/src/components/Board/Board.component.js index 4c5f8f65d..63d41e732 100644 --- a/src/components/Board/Board.component.js +++ b/src/components/Board/Board.component.js @@ -527,7 +527,12 @@ export class Board extends Component { /> )}
- + {navigationSettings.improvePhraseActive && ( + + )} Date: Tue, 29 Aug 2023 16:14:20 -0300 Subject: [PATCH 22/30] Change bg color of the improve phrase output --- .../Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css index 128aaf0cb..6dce5e34c 100644 --- a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css +++ b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css @@ -9,12 +9,14 @@ transition: box-shadow 0.3s; border: 2px solid transparent; height: 3em; + background-color: indigo; + color: white; } .text_and_controls.enabled:hover, .text_and_controls.enabled:focus { outline: none; - border: 2px solid #3f51b5; /* Red border */ + border: 2px solid #ffffff; /* Red border */ } .text_and_controls .playArrow, From a0c7a47d5008d338a763bced22a2d854882f7486 Mon Sep 17 00:00:00 2001 From: tomivm Date: Fri, 1 Sep 2023 11:54:24 -0300 Subject: [PATCH 23/30] Use horizontally scroll on text overflow --- .../Board/ImprovePhraseOutput/ImprovePhraseOutput.js | 4 +++- .../ImprovePhraseOutput/ImprovePhraseOutput.module.css | 8 +++++++- 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js index 66d6ba603..de1278c7c 100644 --- a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js +++ b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js @@ -28,7 +28,9 @@ function ImprovePhraseOutput({ improvedPhrase, speak }) { className={enabledControllsClassname} onClick={handlePlay} > - {improvedPhrase} + + {improvedPhrase} + {improvedPhrase && ( )} diff --git a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css index 6dce5e34c..1eee2e157 100644 --- a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css +++ b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css @@ -8,7 +8,7 @@ border-radius: 0.5em; transition: box-shadow 0.3s; border: 2px solid transparent; - height: 3em; + height: 3.2em; background-color: indigo; color: white; } @@ -19,6 +19,12 @@ border: 2px solid #ffffff; /* Red border */ } +.text { + width: auto; + overflow-x: scroll; + white-space: nowrap; +} + .text_and_controls .playArrow, .text_and_controls { transition: all 0.3s; From 2d033a5e014cae1066b00762743586ae5286828a Mon Sep 17 00:00:00 2001 From: tomivm Date: Fri, 1 Sep 2023 13:10:32 -0300 Subject: [PATCH 24/30] Cancel old requests before a new request to improve the phrase --- src/api/api.js | 9 ++++++--- src/components/Board/Board.actions.js | 3 +++ 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/api/api.js b/src/api/api.js index 66adfa72e..381992625 100644 --- a/src/api/api.js +++ b/src/api/api.js @@ -16,6 +16,7 @@ import { isAndroid } from '../cordova-util'; const BASE_URL = API_URL; const LOCAL_COMMUNICATOR_ID = 'cboard_default'; +export let improvePhraseAbortController; const getUserData = () => { const store = getStore(); @@ -637,17 +638,19 @@ class API { const headers = { Authorization: `Bearer ${authToken}` }; - + improvePhraseAbortController = new AbortController(); const { data } = await this.axiosInstance.post( `/gpt/edit`, { phrase, language }, { - headers + headers, + signal: improvePhraseAbortController.signal } ); return data; } catch (error) { - console.error(error); + if (error.message !== 'canceled') console.error(error); + return { phrase: '' }; } } } diff --git a/src/components/Board/Board.actions.js b/src/components/Board/Board.actions.js index 2f44f767b..b4ef8bb3d 100644 --- a/src/components/Board/Board.actions.js +++ b/src/components/Board/Board.actions.js @@ -56,6 +56,7 @@ import { import { isAndroid, writeCvaFile } from '../../cordova-util'; import { DEFAULT_BOARDS } from '../../helpers'; import history from './../../history'; +import { improvePhraseAbortController } from '../../api/api'; const BOARDS_PAGE_LIMIT = 100; @@ -351,6 +352,8 @@ export function improvePhrase(output) { return async (dispatch, getState) => { try { const language = getState().language.lang; + if (improvePhraseAbortController?.abort) + improvePhraseAbortController.abort(); const improvedPhrase = await improvePhrase(language); dispatch({ type: CHANGE_IMPROVED_PHRASE, From be22d9bed32cec1ea3dadac97a9430325957b0ac Mon Sep 17 00:00:00 2001 From: tomivm Date: Fri, 1 Sep 2023 13:12:43 -0300 Subject: [PATCH 25/30] Fix proptypes --- .../Board/ImprovePhraseOutput/ImprovePhraseOutput.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js index de1278c7c..2a7a711d1 100644 --- a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js +++ b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.js @@ -7,10 +7,8 @@ import { Typography } from '@material-ui/core'; import { PlayArrow } from '@material-ui/icons'; const propTypes = { - isRootBoardTourEnabled: PropTypes.bool, - isUnlockedTourEnabled: PropTypes.bool, - isLocked: PropTypes.bool, - disableTour: PropTypes.func.isRequired + improvedPhrase: PropTypes.string, + speak: PropTypes.func }; function ImprovePhraseOutput({ improvedPhrase, speak }) { From 16961a1499b381a877f62e295f8c0ca01b56ba95 Mon Sep 17 00:00:00 2001 From: tomivm Date: Fri, 1 Sep 2023 13:14:26 -0300 Subject: [PATCH 26/30] Replace console log by console error --- src/components/Board/Board.actions.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Board/Board.actions.js b/src/components/Board/Board.actions.js index b4ef8bb3d..a416f656e 100644 --- a/src/components/Board/Board.actions.js +++ b/src/components/Board/Board.actions.js @@ -360,7 +360,7 @@ export function improvePhrase(output) { improvedPhrase }); } catch (err) { - console.log('error', err); + console.error('error', err); } }; } From a3d319aa66856e9435c78415518010fb556f8a53 Mon Sep 17 00:00:00 2001 From: tomivm Date: Tue, 12 Sep 2023 18:42:51 -0300 Subject: [PATCH 27/30] Use camel case for toggleImprovePhraseActive function name --- src/components/Settings/Navigation/Navigation.component.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Settings/Navigation/Navigation.component.js b/src/components/Settings/Navigation/Navigation.component.js index fb32ef412..33e64ec4c 100644 --- a/src/components/Settings/Navigation/Navigation.component.js +++ b/src/components/Settings/Navigation/Navigation.component.js @@ -81,7 +81,7 @@ class Navigation extends React.Component { }); }; - toggleimprovePhraseActive = () => { + toggleImprovePhraseActive = () => { this.setState({ improvePhraseActive: !this.state.improvePhraseActive }); @@ -313,7 +313,7 @@ class Navigation extends React.Component { From 285b18ba6bcb860653df456f6e80055f62b77a77 Mon Sep 17 00:00:00 2001 From: tomivm Date: Tue, 12 Sep 2023 18:47:06 -0300 Subject: [PATCH 28/30] Avoid confusions on names inside improvePhrase function --- src/components/Board/Board.actions.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/Board/Board.actions.js b/src/components/Board/Board.actions.js index a416f656e..cee628515 100644 --- a/src/components/Board/Board.actions.js +++ b/src/components/Board/Board.actions.js @@ -341,7 +341,7 @@ export function changeOutput(output) { } export function improvePhrase(output) { - const improvePhrase = async language => { + const fetchImprovePhrase = async language => { const MIN_TILES_TO_IMPROVE = 1; if (output.length <= MIN_TILES_TO_IMPROVE) return ''; const labels = output.map(symbol => symbol.label); @@ -354,7 +354,7 @@ export function improvePhrase(output) { const language = getState().language.lang; if (improvePhraseAbortController?.abort) improvePhraseAbortController.abort(); - const improvedPhrase = await improvePhrase(language); + const improvedPhrase = await fetchImprovePhrase(language); dispatch({ type: CHANGE_IMPROVED_PHRASE, improvedPhrase From bb678884b83ac79f00aa47e582af377f72daed65 Mon Sep 17 00:00:00 2001 From: tomivm Date: Tue, 12 Sep 2023 18:48:37 -0300 Subject: [PATCH 29/30] Remove wrong comment --- .../Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css index 1eee2e157..930042814 100644 --- a/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css +++ b/src/components/Board/ImprovePhraseOutput/ImprovePhraseOutput.module.css @@ -16,7 +16,7 @@ .text_and_controls.enabled:hover, .text_and_controls.enabled:focus { outline: none; - border: 2px solid #ffffff; /* Red border */ + border: 2px solid #ffffff; } .text { From 6202ca203c045433e1f30a0d0415dd144d852a15 Mon Sep 17 00:00:00 2001 From: tomivm Date: Tue, 12 Sep 2023 19:00:34 -0300 Subject: [PATCH 30/30] remove unnecessary component --- .../SymbolOutput/ImprovePhraseControls.js | 48 ------------------- 1 file changed, 48 deletions(-) delete mode 100644 src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js diff --git a/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js b/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js deleted file mode 100644 index afe204c4c..000000000 --- a/src/components/Board/Output/SymbolOutput/ImprovePhraseControls.js +++ /dev/null @@ -1,48 +0,0 @@ -import React from 'react'; -import PropTypes from 'prop-types'; - -import IconButton from '@material-ui/core/IconButton'; -import PlayArrowIcon from '@material-ui/icons/PlayArrow'; - -const propTypes = { - increaseOutputButtons: PropTypes.bool, - bigControlsClassName: PropTypes.string, - onPlayImprovedPhrase: PropTypes.func -}; - -function ImprovePhraseControls({ - increaseOutputButtons, - bigControlsClassName, - onPlayImprovedPhrase -}) { - return ( -
-
-
-
- - - -
-
-
- ); -} -ImprovePhraseControls.propTypes = propTypes; -ImprovePhraseControls.defaultProps = {}; - -export default ImprovePhraseControls;