@hedia/recommendation-screen 2.1.54 → 2.1.55-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/RecommendationScreen.d.ts +10 -18
- package/dist/src/RecommendationScreen.js +15 -28
- package/dist/src/components/ExitModal.d.ts +1 -0
- package/dist/src/components/ExitModal.js +9 -7
- package/dist/src/components/RecommendationModal.d.ts +23 -2
- package/dist/src/components/RecommendationModal.js +18 -4
- package/dist/src/components/TimeoutModal.d.ts +2 -0
- package/dist/src/components/TimeoutModal.js +7 -6
- package/dist/src/types/enum.d.ts +2 -8
- package/dist/src/types/enum.js +1 -9
- package/package.json +3 -3
- package/dist/src/components/LimitationMessage.d.ts +0 -14
- package/dist/src/components/LimitationMessage.js +0 -23
|
@@ -69,17 +69,15 @@ export interface IRecommendationProps {
|
|
|
69
69
|
* @param error The detected error.
|
|
70
70
|
*/
|
|
71
71
|
onError(error: RecommendationError): void;
|
|
72
|
-
/**
|
|
73
|
-
* Callback function taking a single argument of type boolean.
|
|
74
|
-
* To be called to hide the bottom navigation bar while displaying modal dialogs.
|
|
75
|
-
* @param toggle Showing (true) or hiding (false) the bottom navigation bar on the calculation flow screens.
|
|
76
|
-
*/
|
|
77
|
-
showBolusBar(toggle: boolean): void;
|
|
78
72
|
/**
|
|
79
73
|
* Callback function taking no arguments.
|
|
80
74
|
* To be called if the user chooses to restart the calculation.
|
|
81
75
|
*/
|
|
82
76
|
restartCalculation(): void;
|
|
77
|
+
/**
|
|
78
|
+
* Callback function taking a single argument of type boolean.
|
|
79
|
+
*/
|
|
80
|
+
hideExitModal(): void;
|
|
83
81
|
}
|
|
84
82
|
interface IState {
|
|
85
83
|
/** The time in hours in hours until a reminder notification will be sent to the user. If 0 then no notification will be sent. */
|
|
@@ -112,8 +110,10 @@ interface IState {
|
|
|
112
110
|
* The exit modal prompts the user to consider saving the calculation to a logbook entry before closing the recommendation screen.
|
|
113
111
|
*/
|
|
114
112
|
showExitModal: boolean;
|
|
115
|
-
/**
|
|
116
|
-
|
|
113
|
+
/**
|
|
114
|
+
* Keeps track of whether or not only the limitation page of the reommnendation modal should be visible.
|
|
115
|
+
*/
|
|
116
|
+
onlyShowLimitationMessage: boolean;
|
|
117
117
|
/** Keeps track of whether or not a message about the recommendation being too old should be displayed. */
|
|
118
118
|
showTimeoutModal: boolean;
|
|
119
119
|
}
|
|
@@ -174,7 +174,7 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
|
|
|
174
174
|
* - Set activeInsulin to the estimation returned from the calculation result.
|
|
175
175
|
* - Set enteredCarbs, enteredInsulin, selectedMood to null.
|
|
176
176
|
* - Set recommendationModal to be true if wasLimited is true or if carbRecommendation after being rounded is truthy or if the return value from calling the getBGLevelAttentionMessage() method is truthy.
|
|
177
|
-
* - Set showExitModal,
|
|
177
|
+
* - Set showExitModal, showTimeoutModal to be false.
|
|
178
178
|
* 3. Start a 15 minute timer assigned to the timer member variable using the setTimeout() function. When the timer expires, call the showTimeoutModal() method.
|
|
179
179
|
* @param props The data required to initialise the Recommendation Screen
|
|
180
180
|
*/
|
|
@@ -249,19 +249,12 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
|
|
|
249
249
|
* 1. Set the recommendationModal state variable to false.
|
|
250
250
|
*/
|
|
251
251
|
hideAttentionModal: () => void;
|
|
252
|
-
/**
|
|
253
|
-
* Hide the modal that shows attention messages.
|
|
254
|
-
*
|
|
255
|
-
* Steps:
|
|
256
|
-
* 1. Set the showLimitationMessage state variable to false.
|
|
257
|
-
*/
|
|
258
|
-
hideLimitationMessage: () => void;
|
|
259
252
|
/**
|
|
260
253
|
* Hide the exit modal. To be used when the user closes the modal directly or in some way exits the recommendation screen.
|
|
261
254
|
*
|
|
262
255
|
* Steps:
|
|
263
256
|
* 1. Set the showExitModal state variable to false.
|
|
264
|
-
*
|
|
257
|
+
* 2. Call the hideExitModal prop callback function.
|
|
265
258
|
*/
|
|
266
259
|
hideExitModal: () => void;
|
|
267
260
|
/**
|
|
@@ -269,7 +262,6 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
|
|
|
269
262
|
*
|
|
270
263
|
* Steps:
|
|
271
264
|
* 1. Set the showTimeoutModal state variable to false.
|
|
272
|
-
* When the state has been updated, call the showBolusBar prop callback function with the inverse value of the showTimeoutModal state variable as argument.
|
|
273
265
|
*/
|
|
274
266
|
hideTimeoutModal: () => void;
|
|
275
267
|
/**
|
|
@@ -15,7 +15,6 @@ import { colors } from "./utils/Constants";
|
|
|
15
15
|
import { t } from "@lingui/macro";
|
|
16
16
|
import Activity from "./components/activity/Activity";
|
|
17
17
|
import ExitModal from "./components/ExitModal";
|
|
18
|
-
import LimitationMessage from "./components/LimitationMessage";
|
|
19
18
|
import RecommendationModal from "./components/RecommendationModal";
|
|
20
19
|
import { FONTS } from "./components/styles/fonts";
|
|
21
20
|
import Text from "./components/Text";
|
|
@@ -87,7 +86,7 @@ export default class RecommendationScreen extends React.Component {
|
|
|
87
86
|
* - Set activeInsulin to the estimation returned from the calculation result.
|
|
88
87
|
* - Set enteredCarbs, enteredInsulin, selectedMood to null.
|
|
89
88
|
* - Set recommendationModal to be true if wasLimited is true or if carbRecommendation after being rounded is truthy or if the return value from calling the getBGLevelAttentionMessage() method is truthy.
|
|
90
|
-
* - Set showExitModal,
|
|
89
|
+
* - Set showExitModal, showTimeoutModal to be false.
|
|
91
90
|
* 3. Start a 15 minute timer assigned to the timer member variable using the setTimeout() function. When the timer expires, call the showTimeoutModal() method.
|
|
92
91
|
* @param props The data required to initialise the Recommendation Screen
|
|
93
92
|
*/
|
|
@@ -112,8 +111,8 @@ export default class RecommendationScreen extends React.Component {
|
|
|
112
111
|
enteredInsulin: null,
|
|
113
112
|
selectedMood: null,
|
|
114
113
|
recommendationModal: wasLimited || !!Math.round(carbRecommendation) || !!this.getBGLevelAttentionMessage(),
|
|
114
|
+
onlyShowLimitationMessage: false,
|
|
115
115
|
showExitModal: props.showExitModal,
|
|
116
|
-
showLimitationMessage: false,
|
|
117
116
|
showTimeoutModal: false,
|
|
118
117
|
};
|
|
119
118
|
this.timer = setTimeout(this.showTimeoutModal, Milliseconds.Minute * 15);
|
|
@@ -153,7 +152,7 @@ export default class RecommendationScreen extends React.Component {
|
|
|
153
152
|
this.backHandlerSubscription?.remove();
|
|
154
153
|
}
|
|
155
154
|
componentDidUpdate({ showExitModal }) {
|
|
156
|
-
if (showExitModal !== this.props.showExitModal) {
|
|
155
|
+
if (this.props.showExitModal && showExitModal !== this.props.showExitModal) {
|
|
157
156
|
this.onExit();
|
|
158
157
|
}
|
|
159
158
|
}
|
|
@@ -175,7 +174,7 @@ export default class RecommendationScreen extends React.Component {
|
|
|
175
174
|
* 1. Set the showTimeoutModal state variable to be true. Use a callback function to call the showBolusBar prop callback function with false as argument when the state has been updated.
|
|
176
175
|
* */
|
|
177
176
|
showTimeoutModal = () => {
|
|
178
|
-
this.setState({ showTimeoutModal: true }
|
|
177
|
+
this.setState({ showTimeoutModal: true });
|
|
179
178
|
};
|
|
180
179
|
/**
|
|
181
180
|
* Make a new insulin calculation and set the result to be displayed to the user.
|
|
@@ -197,7 +196,7 @@ export default class RecommendationScreen extends React.Component {
|
|
|
197
196
|
enteredInsulin: null,
|
|
198
197
|
wasLimited,
|
|
199
198
|
activityReduction,
|
|
200
|
-
|
|
199
|
+
onlyShowLimitationMessage: wasLimited,
|
|
201
200
|
});
|
|
202
201
|
};
|
|
203
202
|
/**
|
|
@@ -211,7 +210,7 @@ export default class RecommendationScreen extends React.Component {
|
|
|
211
210
|
*/
|
|
212
211
|
onExit = () => {
|
|
213
212
|
if (this.state.isRecommendationDisplayed) {
|
|
214
|
-
this.setState({ showExitModal: true }
|
|
213
|
+
this.setState({ showExitModal: true });
|
|
215
214
|
}
|
|
216
215
|
else {
|
|
217
216
|
this.props.exitCallback();
|
|
@@ -235,36 +234,26 @@ export default class RecommendationScreen extends React.Component {
|
|
|
235
234
|
* 1. Set the recommendationModal state variable to false.
|
|
236
235
|
*/
|
|
237
236
|
hideAttentionModal = () => {
|
|
238
|
-
this.setState({ recommendationModal: false });
|
|
239
|
-
};
|
|
240
|
-
/**
|
|
241
|
-
* Hide the modal that shows attention messages.
|
|
242
|
-
*
|
|
243
|
-
* Steps:
|
|
244
|
-
* 1. Set the showLimitationMessage state variable to false.
|
|
245
|
-
*/
|
|
246
|
-
hideLimitationMessage = () => {
|
|
247
|
-
this.setState({ showLimitationMessage: false });
|
|
237
|
+
this.setState({ recommendationModal: false, onlyShowLimitationMessage: false });
|
|
248
238
|
};
|
|
249
239
|
/**
|
|
250
240
|
* Hide the exit modal. To be used when the user closes the modal directly or in some way exits the recommendation screen.
|
|
251
241
|
*
|
|
252
242
|
* Steps:
|
|
253
243
|
* 1. Set the showExitModal state variable to false.
|
|
254
|
-
*
|
|
244
|
+
* 2. Call the hideExitModal prop callback function.
|
|
255
245
|
*/
|
|
256
246
|
hideExitModal = () => {
|
|
257
|
-
this.setState({ showExitModal: false },
|
|
247
|
+
this.setState({ showExitModal: false }, this.props.hideExitModal);
|
|
258
248
|
};
|
|
259
249
|
/**
|
|
260
250
|
* Hide the modal that warns the user that their recommendation is old.
|
|
261
251
|
*
|
|
262
252
|
* Steps:
|
|
263
253
|
* 1. Set the showTimeoutModal state variable to false.
|
|
264
|
-
* When the state has been updated, call the showBolusBar prop callback function with the inverse value of the showTimeoutModal state variable as argument.
|
|
265
254
|
*/
|
|
266
255
|
hideTimeoutModal = () => {
|
|
267
|
-
this.setState({ showTimeoutModal: false }
|
|
256
|
+
this.setState({ showTimeoutModal: false });
|
|
268
257
|
};
|
|
269
258
|
/**
|
|
270
259
|
* Used as a callback function for the Remeasure component to update the state when the remeasure time slider’s value changes.
|
|
@@ -487,14 +476,12 @@ export default class RecommendationScreen extends React.Component {
|
|
|
487
476
|
{!this.state.isRecommendationDisplayed ? (<RecentInsulin onRecentInsulinYes={this.props.onRecentInsulinYes} onRecentInsulinNo={this.handleNoRecentInsulin}/>) : (<RecommendedInsulin injectionMethod={this.props.injectionMethod} insulinRecommendation={insulinRecommendation} enteredInsulin={enteredInsulin} activityReduction={activityReduction} updateRecommendedInsulin={this.updateInsulinRecommendation}/>)}
|
|
488
477
|
<Emotion moodSelected={this.handleMoodSelected} currentMood={this.state.selectedMood}/>
|
|
489
478
|
<TransferToLogbook visible={isRecommendationDisplayed} transfer={this.handleTransfer}/>
|
|
490
|
-
<RecommendationModal isVisible={recommendationModal} suggestedCarbohydrates={carbRecommendationProp} attentionMessage={this.getBGLevelAttentionMessage()} limitationMessage={this.getLimitationAttentionMessage()} onClickOkButton={this.hideAttentionModal} onAcceptCarbohydrates={this.acceptCarbRecommendation} onDeclineCarbohydrates={this.declineCarbRecommendation}/>
|
|
479
|
+
<RecommendationModal isVisible={recommendationModal || this.state.onlyShowLimitationMessage} onlyShowLimitationMessage={this.state.onlyShowLimitationMessage} suggestedCarbohydrates={carbRecommendationProp} attentionMessage={this.getBGLevelAttentionMessage()} limitationMessage={this.getLimitationAttentionMessage()} onClickOkButton={this.hideAttentionModal} onAcceptCarbohydrates={this.acceptCarbRecommendation} onDeclineCarbohydrates={this.declineCarbRecommendation}/>
|
|
491
480
|
</KeyboardAwareScrollView>
|
|
492
|
-
|
|
493
|
-
{this.state.
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
{this.state.showTimeoutModal &&
|
|
497
|
-
(this.state.isRecommendationDisplayed ? (<TimeoutModal title={Messages.TimeoutPrompTitle()} message={Messages.TimeoutRecommendationVisible(this.recommendationDate)} textFirstOption={i18n._(t `Yes, save to logbook`)} textSecondOption={i18n._(t `No, return to dashboard`)} firstOption={this.handleTransfer} secondOption={this.closeCalculation}/>) : (<TimeoutModal title={Messages.TimeoutPrompTitle()} message={Messages.TimeoutRecommendationNotVisible()} textFirstOption={i18n._(t `Start new calculation`)} textSecondOption={i18n._(t `Return to dashboard`)} firstOption={this.restartCalculation} secondOption={this.closeCalculation}/>))}
|
|
481
|
+
|
|
482
|
+
<ExitModal isVisible={this.state.showExitModal} title={i18n._(t `Save data before closing?`)} message={i18n._(t `Your saved data will be used for future calculations.`)} textFirstOption={i18n._(t `Save to logbook`)} textSecondOption={i18n._(t `Close calculation`)} firstOption={this.handleTransfer} secondOption={this.closeCalculation} onClose={this.hideExitModal}/>
|
|
483
|
+
|
|
484
|
+
{this.state.isRecommendationDisplayed ? (<TimeoutModal isVisible={this.state.showTimeoutModal} title={Messages.TimeoutPrompTitle()} message={Messages.TimeoutRecommendationVisible(this.recommendationDate)} textFirstOption={i18n._(t `Yes, save to logbook`)} textSecondOption={i18n._(t `No, return to dashboard`)} firstOption={this.handleTransfer} secondOption={this.closeCalculation}/>) : (<TimeoutModal isVisible={this.state.showTimeoutModal} title={Messages.TimeoutPrompTitle()} message={Messages.TimeoutRecommendationNotVisible()} textFirstOption={i18n._(t `Start new calculation`)} textSecondOption={i18n._(t `Return to dashboard`)} firstOption={this.restartCalculation} secondOption={this.closeCalculation}/>)}
|
|
498
485
|
</I18nProvider>);
|
|
499
486
|
}
|
|
500
487
|
}
|
|
@@ -1,19 +1,20 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { StatusBar, StyleSheet, TouchableOpacity, View } from "react-native";
|
|
3
|
+
import ReactNativeModal from "react-native-modal";
|
|
3
4
|
import Close from "../assets/IconsSVG/Close";
|
|
4
5
|
import { Testing } from "../types/enum";
|
|
5
6
|
import { colors } from "../utils/Constants";
|
|
6
7
|
import { FONTS } from "./styles/fonts";
|
|
7
8
|
import Text from "./Text";
|
|
8
|
-
const { ExitModalTestIds
|
|
9
|
+
const { ExitModalTestIds } = Testing.Id;
|
|
9
10
|
/** Display a modal with two buttons for the user to choose between. */
|
|
10
11
|
export default class ExitModal extends React.Component {
|
|
11
12
|
/** Compose a JSX element for displaying the modal. */
|
|
12
13
|
render() {
|
|
13
|
-
return (<
|
|
14
|
+
return (<ReactNativeModal style={style.container} isVisible={this.props.isVisible}>
|
|
14
15
|
<StatusBar backgroundColor={colors.transparentLightBlue}/>
|
|
15
16
|
<View style={style.modalContainer}>
|
|
16
|
-
<TouchableOpacity onPress={this.props.onClose} testID={
|
|
17
|
+
<TouchableOpacity onPress={this.props.onClose} testID={ExitModalTestIds.ExitButton} style={style.iconWrapper}>
|
|
17
18
|
{Close({ color: colors.white, style: style.icon })}
|
|
18
19
|
</TouchableOpacity>
|
|
19
20
|
<View style={style.textContainer}>
|
|
@@ -21,21 +22,22 @@ export default class ExitModal extends React.Component {
|
|
|
21
22
|
<Text style={style.message}>{this.props.message}</Text>
|
|
22
23
|
</View>
|
|
23
24
|
<View style={style.buttonContainer}>
|
|
24
|
-
<TouchableOpacity testID={
|
|
25
|
+
<TouchableOpacity testID={ExitModalTestIds.FirstOption} onPress={this.props.firstOption} style={[style.button, { marginBottom: 16 }]}>
|
|
25
26
|
<Text style={style.textButton}>{this.props.textFirstOption}</Text>
|
|
26
27
|
</TouchableOpacity>
|
|
27
|
-
<TouchableOpacity testID={
|
|
28
|
+
<TouchableOpacity testID={ExitModalTestIds.SecondOption} onPress={this.props.secondOption} style={style.button}>
|
|
28
29
|
<Text style={style.textButton}>{this.props.textSecondOption}</Text>
|
|
29
30
|
</TouchableOpacity>
|
|
30
31
|
</View>
|
|
31
32
|
</View>
|
|
32
|
-
</
|
|
33
|
+
</ReactNativeModal>);
|
|
33
34
|
}
|
|
34
35
|
}
|
|
36
|
+
//const { height, width } = Dimensions.get(`screen`);
|
|
35
37
|
/** @internal */
|
|
36
38
|
const style = StyleSheet.create({
|
|
37
39
|
container: {
|
|
38
|
-
|
|
40
|
+
margin: 0,
|
|
39
41
|
justifyContent: `center`,
|
|
40
42
|
backgroundColor: colors.transparentBlack,
|
|
41
43
|
},
|
|
@@ -8,16 +8,20 @@ export interface IModalProps {
|
|
|
8
8
|
attentionMessage: string | null;
|
|
9
9
|
/** A message to display to the user to inform them if their insulin recommendation was limited by the maximum threshold. */
|
|
10
10
|
limitationMessage: string | null;
|
|
11
|
+
/**
|
|
12
|
+
* If true then the modal will only display the limitation message and not the attention message.
|
|
13
|
+
*/
|
|
14
|
+
onlyShowLimitationMessage: boolean;
|
|
11
15
|
/** Callback function taking no arguments and returning no value - Should be called if the user taps the “OK” button on the modal. */
|
|
12
16
|
onClickOkButton(): void;
|
|
13
17
|
/**
|
|
14
|
-
*
|
|
18
|
+
* Callback function taking no arguments and returning no value.
|
|
15
19
|
* Should be called if the user taps the “accept” button when they are recommended to eat additional carbohydrates.
|
|
16
20
|
*/
|
|
17
21
|
onAcceptCarbohydrates(): void;
|
|
18
22
|
/**
|
|
19
23
|
* Callback function taking no arguments and returning no value.
|
|
20
|
-
*
|
|
24
|
+
* Should be called if the user taps the “decline” button when they are recommended to eat additional carbohydrates.
|
|
21
25
|
*/
|
|
22
26
|
onDeclineCarbohydrates(): void;
|
|
23
27
|
}
|
|
@@ -41,6 +45,7 @@ export default class RecommendationModal extends React.Component<IModalProps, IM
|
|
|
41
45
|
* @param props The class props
|
|
42
46
|
*/
|
|
43
47
|
constructor(props: IModalProps);
|
|
48
|
+
componentDidUpdate(prevProps: Readonly<IModalProps>): void;
|
|
44
49
|
/**
|
|
45
50
|
* Handle what happens when the “next” button is pressed.
|
|
46
51
|
*
|
|
@@ -104,6 +109,10 @@ export declare const stylesModal: {
|
|
|
104
109
|
marginTop: number;
|
|
105
110
|
fontFamily: import("./styles/fonts").FontFamily;
|
|
106
111
|
fontSize: number;
|
|
112
|
+
/**
|
|
113
|
+
* Callback function taking no arguments and returning no value.
|
|
114
|
+
* Should be called if the user taps the “accept” button when they are recommended to eat additional carbohydrates.
|
|
115
|
+
*/
|
|
107
116
|
lineHeight: number;
|
|
108
117
|
};
|
|
109
118
|
buttonText: {
|
|
@@ -135,6 +144,10 @@ export declare const stylesModal: {
|
|
|
135
144
|
paddingHorizontal: number;
|
|
136
145
|
fontFamily: import("./styles/fonts").FontFamily;
|
|
137
146
|
fontSize: number;
|
|
147
|
+
/**
|
|
148
|
+
* Callback function taking no arguments and returning no value.
|
|
149
|
+
* Should be called if the user taps the “accept” button when they are recommended to eat additional carbohydrates.
|
|
150
|
+
*/
|
|
138
151
|
lineHeight: number;
|
|
139
152
|
};
|
|
140
153
|
recommendEatingText: {
|
|
@@ -144,6 +157,10 @@ export declare const stylesModal: {
|
|
|
144
157
|
marginBottom: number;
|
|
145
158
|
fontFamily: import("./styles/fonts").FontFamily;
|
|
146
159
|
fontSize: number;
|
|
160
|
+
/**
|
|
161
|
+
* Callback function taking no arguments and returning no value.
|
|
162
|
+
* Should be called if the user taps the “accept” button when they are recommended to eat additional carbohydrates.
|
|
163
|
+
*/
|
|
147
164
|
lineHeight: number;
|
|
148
165
|
};
|
|
149
166
|
carbohydrateText: {
|
|
@@ -159,6 +176,10 @@ export declare const stylesModal: {
|
|
|
159
176
|
marginHorizontal: number;
|
|
160
177
|
fontFamily: import("./styles/fonts").FontFamily;
|
|
161
178
|
fontSize: number;
|
|
179
|
+
/**
|
|
180
|
+
* Callback function taking no arguments and returning no value.
|
|
181
|
+
* Should be called if the user taps the “accept” button when they are recommended to eat additional carbohydrates.
|
|
182
|
+
*/
|
|
162
183
|
lineHeight: number;
|
|
163
184
|
};
|
|
164
185
|
recommendationButtonsContainer: {
|
|
@@ -5,7 +5,6 @@ import ReactNativeModal from "react-native-modal";
|
|
|
5
5
|
import { i18n } from "../locale/i18nUtils";
|
|
6
6
|
import { Testing } from "../types/enum";
|
|
7
7
|
import { colors } from "../utils/Constants";
|
|
8
|
-
import LimitationMessage from "./LimitationMessage";
|
|
9
8
|
import { FONTS } from "./styles/fonts";
|
|
10
9
|
import Text from "./Text";
|
|
11
10
|
const { RecommendationModalTestIds } = Testing.Id;
|
|
@@ -30,6 +29,15 @@ export default class RecommendationModal extends React.Component {
|
|
|
30
29
|
firstPageVisible: !!this.props.limitationMessage,
|
|
31
30
|
};
|
|
32
31
|
}
|
|
32
|
+
/*
|
|
33
|
+
* Steps:
|
|
34
|
+
* 1. Set the firstPageVisible state variable true if the limitationMessage prop was updated.
|
|
35
|
+
*/
|
|
36
|
+
componentDidUpdate(prevProps) {
|
|
37
|
+
if (prevProps.limitationMessage !== this.props.limitationMessage) {
|
|
38
|
+
this.setState({ firstPageVisible: !!this.props.limitationMessage });
|
|
39
|
+
}
|
|
40
|
+
}
|
|
33
41
|
/**
|
|
34
42
|
* Handle what happens when the “next” button is pressed.
|
|
35
43
|
*
|
|
@@ -40,8 +48,8 @@ export default class RecommendationModal extends React.Component {
|
|
|
40
48
|
*/
|
|
41
49
|
onPressNextButton = () => {
|
|
42
50
|
const { attentionMessage, suggestedCarbohydrates } = this.props;
|
|
43
|
-
const
|
|
44
|
-
return
|
|
51
|
+
const isSecondPageVisible = !!attentionMessage || !!suggestedCarbohydrates;
|
|
52
|
+
return isSecondPageVisible ? this.setState({ firstPageVisible: false }) : this.props.onClickOkButton();
|
|
45
53
|
};
|
|
46
54
|
/**
|
|
47
55
|
* @returns Return an JSX element for composing two buttons: one for accepting a suggestion and one for rejecting it.
|
|
@@ -105,7 +113,13 @@ export default class RecommendationModal extends React.Component {
|
|
|
105
113
|
*/
|
|
106
114
|
firstPage = () => {
|
|
107
115
|
const { limitationMessage } = this.props;
|
|
108
|
-
return <
|
|
116
|
+
return (<React.Fragment>
|
|
117
|
+
<Text style={stylesModal.textTittleMessage}>{i18n._(t `Attention`)}</Text>
|
|
118
|
+
<Text style={stylesModal.textMessage}>{limitationMessage}</Text>
|
|
119
|
+
<TouchableOpacity testID={Testing.Id.RecommendationModalTestIds.LimitationOkButton} style={stylesModal.okButton} onPress={this.props.onlyShowLimitationMessage ? this.props.onClickOkButton : this.onPressNextButton}>
|
|
120
|
+
<Text style={stylesModal.buttonText}>{i18n._(t `OK`)}</Text>
|
|
121
|
+
</TouchableOpacity>
|
|
122
|
+
</React.Fragment>);
|
|
109
123
|
};
|
|
110
124
|
/**
|
|
111
125
|
* @returns JSX element for rendering a modal that is visible if the isVisible prop is true.
|
|
@@ -1,15 +1,16 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { StatusBar, StyleSheet, TouchableOpacity, View } from "react-native";
|
|
3
|
+
import ReactNativeModal from "react-native-modal";
|
|
3
4
|
import { Testing } from "../types/enum";
|
|
4
5
|
import { colors } from "../utils/Constants";
|
|
5
6
|
import { FONTS } from "./styles/fonts";
|
|
6
7
|
import Text from "./Text";
|
|
7
|
-
const {
|
|
8
|
+
const { TimeOutModalTestIds } = Testing.Id;
|
|
8
9
|
/** Display a modal with two buttons for the user to choose between. */
|
|
9
10
|
export default class TimeoutModal extends React.Component {
|
|
10
11
|
/** Compose a JSX element for displaying the modal. */
|
|
11
12
|
render() {
|
|
12
|
-
return (<
|
|
13
|
+
return (<ReactNativeModal style={style.container} isVisible={this.props.isVisible}>
|
|
13
14
|
<StatusBar backgroundColor={colors.transparentLightBlue}/>
|
|
14
15
|
<View style={style.modalContainer}>
|
|
15
16
|
<View style={style.textContainer}>
|
|
@@ -17,21 +18,21 @@ export default class TimeoutModal extends React.Component {
|
|
|
17
18
|
<Text style={style.message}>{this.props.message}</Text>
|
|
18
19
|
</View>
|
|
19
20
|
<View style={style.buttonContainer}>
|
|
20
|
-
<TouchableOpacity testID={
|
|
21
|
+
<TouchableOpacity testID={TimeOutModalTestIds.FirstOption} onPress={this.props.firstOption} style={[style.button, { backgroundColor: colors.teal, marginBottom: 16 }]}>
|
|
21
22
|
<Text style={style.textFirstButton}>{this.props.textFirstOption}</Text>
|
|
22
23
|
</TouchableOpacity>
|
|
23
|
-
<TouchableOpacity testID={
|
|
24
|
+
<TouchableOpacity testID={TimeOutModalTestIds.SecondOption} onPress={this.props.secondOption} style={style.button}>
|
|
24
25
|
<Text style={style.textSecondButton}>{this.props.textSecondOption}</Text>
|
|
25
26
|
</TouchableOpacity>
|
|
26
27
|
</View>
|
|
27
28
|
</View>
|
|
28
|
-
</
|
|
29
|
+
</ReactNativeModal>);
|
|
29
30
|
}
|
|
30
31
|
}
|
|
31
32
|
/** @internal */
|
|
32
33
|
const style = StyleSheet.create({
|
|
33
34
|
container: {
|
|
34
|
-
|
|
35
|
+
margin: 0,
|
|
35
36
|
justifyContent: `center`,
|
|
36
37
|
backgroundColor: colors.transparentBlack,
|
|
37
38
|
},
|
package/dist/src/types/enum.d.ts
CHANGED
|
@@ -9,13 +9,6 @@ export declare namespace Testing {
|
|
|
9
9
|
ActivityDuration = "activity-duration-minutes",
|
|
10
10
|
ActivityReduction = "activity-reduction-percentage"
|
|
11
11
|
}
|
|
12
|
-
enum HeaderTestIds {
|
|
13
|
-
ExitCalculation = "exit-calculation-button",
|
|
14
|
-
HeaderText = "header-text"
|
|
15
|
-
}
|
|
16
|
-
enum LimitationMessageTestIds {
|
|
17
|
-
OkButton = "limitation-message-ok-button"
|
|
18
|
-
}
|
|
19
12
|
enum RecentInsulinTestIds {
|
|
20
13
|
No = "recent-insulin-no",
|
|
21
14
|
Yes = "recent-insulin-yes"
|
|
@@ -38,6 +31,7 @@ export declare namespace Testing {
|
|
|
38
31
|
DeclineCarbs = "recommendation-modal-decline-carbs",
|
|
39
32
|
AcceptCarbs = "recommendation-modal-accept-carbs",
|
|
40
33
|
OkButton = "recommendation-modal-ok-button",
|
|
34
|
+
LimitationOkButton = "limitation-message-ok-button",
|
|
41
35
|
SuggestedCarbs = "recommendation-modal-suggested-carbs"
|
|
42
36
|
}
|
|
43
37
|
enum RemeasureTestIds {
|
|
@@ -78,7 +72,7 @@ export declare namespace Testing {
|
|
|
78
72
|
}
|
|
79
73
|
/** Namespace containing all the TestIdEnum keys */
|
|
80
74
|
namespace Types {
|
|
81
|
-
type TestIdEnum = Id.ActivityTestIds | Id.
|
|
75
|
+
type TestIdEnum = Id.ActivityTestIds | Id.RecentInsulinTestIds | Id.RecommendedCarbsTestIds | Id.RecommendedInsulinTestIds | Id.RecommendationModalTestIds | Id.RemeasureTestIds | Id.TransferToLogbookTestIds | Id.ExitModalTestIds | Id.TimeOutModalTestIds | Id.InfoBarTestIds.Unit | Id.InfoBarTestIds.Value | Id.InfoBarTestIds.Label;
|
|
82
76
|
}
|
|
83
77
|
}
|
|
84
78
|
/**
|
package/dist/src/types/enum.js
CHANGED
|
@@ -13,15 +13,6 @@ export var Testing;
|
|
|
13
13
|
ActivityTestIds["ActivityDuration"] = "activity-duration-minutes";
|
|
14
14
|
ActivityTestIds["ActivityReduction"] = "activity-reduction-percentage";
|
|
15
15
|
})(ActivityTestIds = Id.ActivityTestIds || (Id.ActivityTestIds = {}));
|
|
16
|
-
let HeaderTestIds;
|
|
17
|
-
(function (HeaderTestIds) {
|
|
18
|
-
HeaderTestIds["ExitCalculation"] = "exit-calculation-button";
|
|
19
|
-
HeaderTestIds["HeaderText"] = "header-text";
|
|
20
|
-
})(HeaderTestIds = Id.HeaderTestIds || (Id.HeaderTestIds = {}));
|
|
21
|
-
let LimitationMessageTestIds;
|
|
22
|
-
(function (LimitationMessageTestIds) {
|
|
23
|
-
LimitationMessageTestIds["OkButton"] = "limitation-message-ok-button";
|
|
24
|
-
})(LimitationMessageTestIds = Id.LimitationMessageTestIds || (Id.LimitationMessageTestIds = {}));
|
|
25
16
|
let RecentInsulinTestIds;
|
|
26
17
|
(function (RecentInsulinTestIds) {
|
|
27
18
|
RecentInsulinTestIds["No"] = "recent-insulin-no";
|
|
@@ -48,6 +39,7 @@ export var Testing;
|
|
|
48
39
|
RecommendationModalTestIds["DeclineCarbs"] = "recommendation-modal-decline-carbs";
|
|
49
40
|
RecommendationModalTestIds["AcceptCarbs"] = "recommendation-modal-accept-carbs";
|
|
50
41
|
RecommendationModalTestIds["OkButton"] = "recommendation-modal-ok-button";
|
|
42
|
+
RecommendationModalTestIds["LimitationOkButton"] = "limitation-message-ok-button";
|
|
51
43
|
RecommendationModalTestIds["SuggestedCarbs"] = "recommendation-modal-suggested-carbs";
|
|
52
44
|
})(RecommendationModalTestIds = Id.RecommendationModalTestIds || (Id.RecommendationModalTestIds = {}));
|
|
53
45
|
let RemeasureTestIds;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hedia/recommendation-screen",
|
|
3
|
-
"version": "2.1.
|
|
3
|
+
"version": "2.1.55-alpha.0",
|
|
4
4
|
"description": "Hedia Recommendation Screen for Bolus and Carbohydrates",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"files": [
|
|
@@ -57,7 +57,8 @@
|
|
|
57
57
|
"@hedia/npm-audit-pipeline": "0.5.0",
|
|
58
58
|
"@hedia/recommendation-calculator": "2.0.15",
|
|
59
59
|
"@react-native-community/slider": "3.0.0",
|
|
60
|
-
"@testing-library/jest-native": "
|
|
60
|
+
"@testing-library/jest-native": "5.4.1",
|
|
61
|
+
"@testing-library/react-native": "11.5.2",
|
|
61
62
|
"@types/jest": "27.5.2",
|
|
62
63
|
"@types/lingui__core": "2.7.0",
|
|
63
64
|
"@types/lingui__macro": "2.7.3",
|
|
@@ -78,7 +79,6 @@
|
|
|
78
79
|
"react-native-keyboard-aware-scroll-view": "0.9.5",
|
|
79
80
|
"react-native-linear-gradient": "2.5.6",
|
|
80
81
|
"react-native-svg": "13.6.0",
|
|
81
|
-
"react-native-testing-library": "2.1.0",
|
|
82
82
|
"react-test-renderer": "18.0.0",
|
|
83
83
|
"tslint": "6.1.3",
|
|
84
84
|
"tslint-config-prettier": "1.18.0",
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
export interface ILimitationMessageProps {
|
|
3
|
-
/** The message to display to the user. */
|
|
4
|
-
limitationMessage: string | null;
|
|
5
|
-
/** Callback function taking no arguments and giving no return value - To be called when the user presses the “OK” button. */
|
|
6
|
-
onPressNextButton(): void;
|
|
7
|
-
}
|
|
8
|
-
/** Display a message on the screen to inform the user that their insulin recommendation was limited. */
|
|
9
|
-
export default class LimitationMessage extends React.Component<ILimitationMessageProps> {
|
|
10
|
-
/**
|
|
11
|
-
* @returns JSX element for displaying a dialog with the limitationMessage and an “OK” button that calls the onPressNextButton prop callback when tapped.
|
|
12
|
-
*/
|
|
13
|
-
render: () => JSX.Element;
|
|
14
|
-
}
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { t } from "@lingui/macro";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
import { TouchableOpacity } from "react-native";
|
|
4
|
-
import { i18n } from "../locale/i18nUtils";
|
|
5
|
-
import { Testing } from "../types/enum";
|
|
6
|
-
import { stylesModal } from "./RecommendationModal";
|
|
7
|
-
import Text from "./Text";
|
|
8
|
-
/** Display a message on the screen to inform the user that their insulin recommendation was limited. */
|
|
9
|
-
export default class LimitationMessage extends React.Component {
|
|
10
|
-
/**
|
|
11
|
-
* @returns JSX element for displaying a dialog with the limitationMessage and an “OK” button that calls the onPressNextButton prop callback when tapped.
|
|
12
|
-
*/
|
|
13
|
-
render = () => {
|
|
14
|
-
const { limitationMessage } = this.props;
|
|
15
|
-
return (<React.Fragment>
|
|
16
|
-
<Text style={stylesModal.textTittleMessage}>{i18n._(t `Attention`)}</Text>
|
|
17
|
-
<Text style={stylesModal.textMessage}>{limitationMessage}</Text>
|
|
18
|
-
<TouchableOpacity testID={Testing.Id.LimitationMessageTestIds.OkButton} style={stylesModal.okButton} onPress={this.props.onPressNextButton}>
|
|
19
|
-
<Text style={stylesModal.buttonText}>{i18n._(t `OK`)}</Text>
|
|
20
|
-
</TouchableOpacity>
|
|
21
|
-
</React.Fragment>);
|
|
22
|
-
};
|
|
23
|
-
}
|