@hedia/recommendation-screen 1.8.2 → 2.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hedia/recommendation-screen",
-  "version": "1.8.2",
+  "version": "2.0.2",
   "description": "Hedia Recommendation Screen for Bolus and Carbohydrates",
   "main": "index.js",
   "scripts": {
@@ -15,15 +15,12 @@
     "test-coverage": "npm run tsc-clean && jest --coverage",
     "tsc": "tsc",
     "tsc-clean": "tsc --build --clean",
-    "prepublish": "npm run lint && npm run lint-pkg && npm run prettier && npm run test-coverage && npm run tsc",
-    "publish-patch": "npm version patch && ./ignore-publish.sh && tsc && npm publish",
-    "publish-minor": "npm version minor && ./ignore-publish.sh && tsc && npm publish",
-    "publish-major": "npm version major && ./ignore-publish.sh && tsc && npm publish",
-    "postpublish": "./ignore-git.sh && ./index-git.sh && npm run tsc-clean && git push",
+    "prepublish": "npm run lint && npm run lint-pkg && npm run test-coverage && npm run tsc",
     "add-locale": "lingui add-locale",
     "extract": "lingui extract",
     "compile": "npm run cleanLanguage && lingui compile",
-    "cleanLanguage": "node ./src/locale/CleanLanguage.ts"
+    "cleanLanguage": "node ./src/locale/CleanLanguage.ts",
+    "upgrade": "npm i --save-exact @hedia/types@latest @hedia/recommendation-calculator@latest"
   },
   "keywords": [
     "Hedia",
@@ -41,8 +38,8 @@
     "@babel/preset-env": "7.10.2",
     "@babel/preset-react": "7.10.1",
     "@babel/preset-typescript": "7.10.1",
-    "@hedia/recommendation-calculator": "1.3.0",
-    "@hedia/types": "1.0.2",
+    "@hedia/recommendation-calculator": "2.0.1",
+    "@hedia/types": "2.1.9",
     "@lingui/babel-preset-react": "2.9.1",
     "@lingui/cli": "2.9.1",
     "@lingui/macro": "2.9.1",
@@ -55,6 +52,7 @@
     "@types/lingui__react": "2.8.2",
     "@types/react": "16.9.35",
     "@types/react-native": "0.62.13",
+    "@types/react-test-renderer": "17.0.1",
     "babel-core": "7.0.0-bridge.0",
     "babel-jest": "26.0.1",
     "babel-loader": "8.1.0",
@@ -70,7 +68,7 @@
     "react-test-renderer": "16.13.1",
     "tslint": "6.1.2",
     "tslint-config-prettier": "1.18.0",
-    "typescript": "3.9.5"
+    "typescript": "4.1.3"
   },
   "dependencies": {
     "moment": "2.27.0",

package/src/RecommendationScreen.d.ts

@@ -1,30 +1,28 @@
 import React from "react";
 import { AppStateStatus } from "react-native";
-import { InjectionMethod, Language, MoodEnum } from "./types/enum";
-import * as Calculator from "@hedia/recommendation-calculator";
-import { BloodGlucoseUnit, BloodKetonesUnit } from "@hedia/types";
+import { BloodGlucoseUnit, BloodKetonesUnit, Languages, Logbook, UserSettings } from "@hedia/types";
 import { RecommendationError } from "./utils/RecommendationError";
-import { IActivityDisplayProps, logbookEntry } from "./types/types";
+import { IActivityDisplayProps, IRecommendationParams, logbookEntry } from "./types/types";
 import { AttentionMessage } from "./utils/AttentionMessages";
 interface IResult {
     suggested: number;
-    entered?: number;
+    entered: number | null;
 }
 export interface IRecommendationProps {
     bloodGlucoseUnit: BloodGlucoseUnit;
-    language: Language;
+    language: Languages;
     userReminder: number;
-    calculatorParams: Calculator.IRecommendationParams;
-    injectionMethod: InjectionMethod;
+    calculatorParams: IRecommendationParams;
+    injectionMethod: UserSettings.Enums.InjectionMethod;
     currentBKL: number;
     bloodKetoneUnit: BloodKetonesUnit;
-    latestLogbookFrom6Hours: logbookEntry;
-    activityDisplayProps: IActivityDisplayProps;
+    latestLogbookFrom6Hours: logbookEntry | null;
+    activityDisplayProps: IActivityDisplayProps | null;
     carbRecommendationAnswer(carbRecommendationAnswer: boolean): void;
     closeCalculationCallback(): void;
     exitCallback(): void;
     onRecentInsulinYes(): void;
-    transferToLogbook(carbs: IResult, insulin: IResult, reminder: number, recommendationDate: Date, mood: MoodEnum): void;
+    transferToLogbook(carbs: IResult, insulin: IResult, reminder: number, recommendationDate: Date, mood: Logbook.Enums.MoodEnum | null): void;
     onError(error: RecommendationError): void;
     showBolusBar(toggle: boolean): void;
     restartCalculation(): void;
@@ -33,13 +31,13 @@ interface IState {
     remeasureTime: number;
     isRecommendationDisplayed: boolean;
     insulinRecommendation: number;
-    activityReduction?: number;
+    activityReduction: number | null;
     wasLimited: boolean;
-    carbRecommendation: number;
+    carbRecommendation: number | null;
     activeInsulin: number;
-    selectedMood?: MoodEnum;
-    enteredCarbs?: number;
-    enteredInsulin?: number;
+    selectedMood: Logbook.Enums.MoodEnum | null;
+    enteredCarbs: number | null;
+    enteredInsulin: number | null;
     recommendationModal: boolean;
     showExitModal: boolean;
     showLimitationMessage: boolean;
@@ -50,13 +48,13 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
     private readonly suggestedCarbs;
     private readonly hasError;
     private readonly recommendationDate;
-    private scrollView;
+    private scrollView?;
     constructor(props: IRecommendationProps);
     componentDidMount(): void;
     componentWillUnmount(): void;
     handleAppStateChange: (nextAppState: AppStateStatus) => void;
     showTimeoutModal: () => void;
-    recalculateInsulin: (calculatorParams: Calculator.IRecommendationParams) => void;
+    recalculateInsulin: (calculatorParams: IRecommendationParams) => void;
     onExit: () => void;
     hideAttentionModal: () => void;
     hideLimitationMessage: () => void;
@@ -73,9 +71,9 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
     handleMoodSelected: (selectedMood: IState["selectedMood"]) => void;
     updateInsulinRecommendation: (enteredInsulin: number) => void;
     handleTransfer: () => void;
-    getBGLevelAttentionMessage: () => AttentionMessage;
+    getBGLevelAttentionMessage: () => AttentionMessage | null;
     getBGLevelRemeasurementReminder: () => number;
-    getLimitationAttentionMessage: () => AttentionMessage;
+    getLimitationAttentionMessage: () => AttentionMessage | null;
     render(): JSX.Element;
 }
 export {};

package/src/RecommendationScreen.jsx

@@ -14,7 +14,7 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
     __setModuleDefault(result, mod);
     return result;
 };
@@ -24,7 +24,6 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const react_native_1 = require("react-native");
-const enum_1 = require("./types/enum");
 const Constants_1 = require("./utils/Constants");
 const Header_1 = __importDefault(require("./components/Header"));
 const InfoBars_1 = __importStar(require("./components/InfoBars"));
@@ -33,6 +32,7 @@ const RecommendedCarbs_1 = __importDefault(require("./components/RecommendedCarb
 const RecommendedInsulin_1 = __importDefault(require("./components/RecommendedInsulin"));
 const Remeasure_1 = __importDefault(require("./components/Remeasure"));
 const Calculator = __importStar(require("@hedia/recommendation-calculator"));
+const types_1 = require("@hedia/types");
 const react_2 = require("@lingui/react");
 const Emotion_1 = __importDefault(require("./components/mood/Emotion"));
 const TransferToLogbook_1 = __importDefault(require("./components/TransferToLogbook"));
@@ -54,7 +54,8 @@ class RecommendationScreen extends react_1.default.Component {
         super(props);
         this.hasError = false;
         this.handleAppStateChange = (nextAppState) => {
-            const isOlderThan15Minutes = global.Date.now() - this.recommendationDate.getTime() > enum_1.Milliseconds.Minute * 15;
+            const time = this.recommendationDate.getTime();
+            const isOlderThan15Minutes = global.Date.now() - time > types_1.Milliseconds.Minute * 15;
             if (nextAppState === `active` && isOlderThan15Minutes) {
                 this.showTimeoutModal();
             }
@@ -66,7 +67,7 @@ class RecommendationScreen extends react_1.default.Component {
             const { bolus, wasLimited, activityReduction } = Calculator.calculateRecommendation(calculatorParams);
             this.setState({
                 insulinRecommendation: Utils_1.Utils.roundValue(bolus, this.props.injectionMethod),
-                enteredInsulin: undefined,
+                enteredInsulin: null,
                 wasLimited,
                 activityReduction,
                 showLimitationMessage: wasLimited,
@@ -104,7 +105,9 @@ class RecommendationScreen extends react_1.default.Component {
         };
         this.updateCarbRecommendation = (enteredCarbs) => {
             const providedCarbs = this.props.calculatorParams.carbohydrates;
-            this.setState({ enteredCarbs }, () => this.recalculateInsulin({ ...this.props.calculatorParams, carbohydrates: providedCarbs + enteredCarbs }));
+            this.setState({ enteredCarbs }, () => {
+                this.recalculateInsulin({ ...this.props.calculatorParams, carbohydrates: providedCarbs + enteredCarbs });
+            });
         };
         this.removeCarbRecommendation = () => {
             this.setState({ enteredCarbs: null, carbRecommendation: null }, () => this.recalculateInsulin({ ...this.props.calculatorParams }));
@@ -170,13 +173,15 @@ class RecommendationScreen extends react_1.default.Component {
                 activityReduction,
                 carbRecommendation,
                 activeInsulin,
+                enteredCarbs: null,
+                enteredInsulin: null,
                 selectedMood: null,
                 recommendationModal: wasLimited || !!Math.round(carbRecommendation) || !!this.getBGLevelAttentionMessage(),
                 showExitModal: false,
                 showLimitationMessage: false,
                 showTimeoutModal: false,
             };
-            this.timer = setTimeout(this.showTimeoutModal, enum_1.Milliseconds.Minute * 15);
+            this.timer = setTimeout(this.showTimeoutModal, types_1.Milliseconds.Minute * 15);
         }
         catch (error) {
             this.hasError = true;
@@ -187,20 +192,28 @@ class RecommendationScreen extends react_1.default.Component {
         react_native_1.AppState.addEventListener(`change`, this.handleAppStateChange);
     }
     componentWillUnmount() {
-        clearTimeout(this.timer);
+        if (this.timer !== undefined) {
+            clearTimeout(this.timer);
+        }
         react_native_1.AppState.removeEventListener(`change`, this.handleAppStateChange);
     }
     render() {
         if (this.hasError) {
             return <react_native_1.View style={containerStyles.container}/>;
         }
-        const { activeInsulin, recommendationModal, carbRecommendation, enteredCarbs, enteredInsulin, insulinRecommendation, activityReduction, isRecommendationDisplayed, } = this.state;
+        const { activeInsulin, recommendationModal, carbRecommendation: carbRecommendationProp, enteredCarbs, enteredInsulin, insulinRecommendation, activityReduction, isRecommendationDisplayed, } = this.state;
+        const carbRecommendation = carbRecommendationProp !== null ? Math.round(carbRecommendationProp) : null;
+        const recommendedCarbs = enteredCarbs ?? carbRecommendation;
         const { calculatorParams, bloodGlucoseUnit, currentBKL, bloodKetoneUnit } = this.props;
-        const { currentBGL, carbohydrates } = calculatorParams;
+        const { currentBGL, carbohydrates: providedCarbs } = calculatorParams;
         const displayedBGL = Utils_1.Utils.displayedBGLValue(currentBGL, bloodGlucoseUnit);
         const displayedBKL = Utils_1.Utils.displayedBKLValue(currentBKL, bloodKetoneUnit);
         return (<react_2.I18nProvider language={this.props.language} i18n={i18nUtils_1.i18n}>
-				<react_native_1.ScrollView style={containerStyles.container} ref={(view) => (this.scrollView = view)}>
+				<react_native_1.ScrollView style={containerStyles.container} ref={(view) => {
+            if (view !== null) {
+                this.scrollView = view;
+            }
+        }}>
 					<Header_1.default exitCallback={this.onExit}/>
 					<InfoBars_1.default label={i18nUtils_1.i18n._(macro_1.t `Active Insulin`)} value={activeInsulin ? `${activeInsulin.toFixed(1)}` : null} unit={i18nUtils_1.i18n._(macro_1.t `units`)} showNullAsDash={false}/>
 					<InfoBars_1.default label={i18nUtils_1.i18n._(macro_1.t `Blood Glucose Level`)} value={currentBGL ? `${displayedBGL}` : null} unit={this.props.bloodGlucoseUnit} showNullAsDash={true}/>
@@ -210,12 +223,10 @@ class RecommendationScreen extends react_1.default.Component {
 							<react_native_1.View style={[
             containerStyles.calcBorder,
             {
-                borderColor: Math.round(carbRecommendation)
-                    ? Constants_1.BORDER_COLOUR_TEAL
-                    : Constants_1.BORDER_COLOUR_GREY,
+                borderColor: recommendedCarbs ? Constants_1.BORDER_COLOUR_TEAL : Constants_1.BORDER_COLOUR_GREY,
             },
         ]}>
-								<RecommendedCarbs_1.default enteredCarbs={`${carbohydrates}`} changedRecommendedCarbs={this.updateCarbRecommendation} recommendedCarbs={`${enteredCarbs ?? Math.round(carbRecommendation)}`} removeRecommendedCarbs={this.removeCarbRecommendation}/>
+								<RecommendedCarbs_1.default enteredCarbs={`${providedCarbs}`} changedRecommendedCarbs={this.updateCarbRecommendation} recommendedCarbs={`${recommendedCarbs}`} removeRecommendedCarbs={this.removeCarbRecommendation}/>
 							</react_native_1.View>
 						</react_native_1.View>
 					</react_native_1.View>
@@ -224,7 +235,7 @@ class RecommendationScreen extends react_1.default.Component {
 					{!this.state.isRecommendationDisplayed ? (<RecentInsulin_1.default onRecentInsulinYes={this.props.onRecentInsulinYes} onRecentInsulinNo={this.handleNoRecentInsulin}/>) : (<RecommendedInsulin_1.default injectionMethod={this.props.injectionMethod} insulinRecommendation={insulinRecommendation} enteredInsulin={enteredInsulin} activityReduction={activityReduction} updateRecommendedInsulin={this.updateInsulinRecommendation}/>)}
 					<Emotion_1.default moodSelected={this.handleMoodSelected} currentMood={this.state.selectedMood}/>
 					<TransferToLogbook_1.default visible={isRecommendationDisplayed} transfer={this.handleTransfer}/>
-					<RecommendationModal_1.default isVisible={recommendationModal} suggestedCarbohydrates={Math.round(carbRecommendation)} attentionMessage={this.getBGLevelAttentionMessage()} limitationMessage={this.getLimitationAttentionMessage()} onClickOkButton={this.hideAttentionModal} onAcceptCarbohydrates={this.acceptCarbRecommendation} onDeclineCarbohydrates={this.declineCarbRecommendation}/>
+					<RecommendationModal_1.default isVisible={recommendationModal} suggestedCarbohydrates={carbRecommendationProp} attentionMessage={this.getBGLevelAttentionMessage()} limitationMessage={this.getLimitationAttentionMessage()} onClickOkButton={this.hideAttentionModal} onAcceptCarbohydrates={this.acceptCarbRecommendation} onDeclineCarbohydrates={this.declineCarbRecommendation}/>
 				</react_native_1.ScrollView>
 				{this.state.showExitModal ? (<TwoOptionModal_1.default title={i18nUtils_1.i18n._(macro_1.t `Save data before closing?`)} message={i18nUtils_1.i18n._(macro_1.t `Your saved data will be used for future calculations.`)} textFirstOption={i18nUtils_1.i18n._(macro_1.t `Save to logbook`)} textSecondOption={i18nUtils_1.i18n._(macro_1.t `Close calculation`)} isCancelable={true} rowAsButtonLayout={true} firstOption={this.handleTransfer} secondOption={this.closeCalculation} onClose={this.hideExitModal}/>) : null}
 				{this.state.showLimitationMessage ? (<react_native_1.View style={TwoOptionModal_1.modalStyle.container}>

package/src/RecommendationScreen.tsx

@@ -1,7 +1,6 @@
 import React from "react";
 import { AppState, AppStateStatus, ScrollView, StyleSheet, View, YellowBox } from "react-native";
 
-import { InjectionMethod, Language, Milliseconds, MoodEnum } from "./types/enum";
 import { BACKGROUND_COLOUR_PURPLE, BORDER_COLOUR_GREY, BORDER_COLOUR_TEAL } from "./utils/Constants";
 
 import Header from "./components/Header";
@@ -12,7 +11,7 @@ import RecommendedInsulin from "./components/RecommendedInsulin";
 import Remeasure from "./components/Remeasure";
 
 import * as Calculator from "@hedia/recommendation-calculator";
-import { BloodGlucoseUnit, BloodKetonesUnit } from "@hedia/types";
+import { BloodGlucoseUnit, BloodKetonesUnit, Languages, Logbook, Milliseconds, UserSettings } from "@hedia/types";
 import { I18nProvider } from "@lingui/react";
 import Emotion from "./components/mood/Emotion";
 import TransferToLogbook from "./components/TransferToLogbook";
@@ -25,7 +24,7 @@ import LimitationMessage from "./components/LimitationMessage";
 import RecommendationModal from "./components/RecommendationModal";
 import TwoOptionModal, { modalStyle } from "./components/TwoOptionModal";
 import { changeLanguage, i18n } from "./locale/i18nUtils";
-import { IActivityDisplayProps, logbookEntry } from "./types/types";
+import { IActivityDisplayProps, IRecommendationParams, logbookEntry } from "./types/types";
 import { AttentionMessage, Messages } from "./utils/AttentionMessages";
 import { getAttentionMessage, getBGLevel, getLimitationMessage, getReminder } from "./utils/RecommendationUtils";
 import { Utils } from "./utils/Utils";
@@ -37,20 +36,20 @@ YellowBox.ignoreWarnings([`Setting a timer`]);
 
 interface IResult {
 	suggested: number;
-	entered?: number;
+	entered: number | null;
 }
 
 export interface IRecommendationProps {
 	// Values
 	bloodGlucoseUnit: BloodGlucoseUnit;
-	language: Language;
+	language: Languages;
 	userReminder: number;
-	calculatorParams: Calculator.IRecommendationParams;
-	injectionMethod: InjectionMethod;
+	calculatorParams: IRecommendationParams;
+	injectionMethod: UserSettings.Enums.InjectionMethod;
 	currentBKL: number;
 	bloodKetoneUnit: BloodKetonesUnit;
-	latestLogbookFrom6Hours: logbookEntry;
-	activityDisplayProps: IActivityDisplayProps;
+	latestLogbookFrom6Hours: logbookEntry | null;
+	activityDisplayProps: IActivityDisplayProps | null;
 
 	// Callbacks
 	carbRecommendationAnswer(carbRecommendationAnswer: boolean): void;
@@ -62,7 +61,7 @@ export interface IRecommendationProps {
 		insulin: IResult,
 		reminder: number,
 		recommendationDate: Date,
-		mood: MoodEnum,
+		mood: Logbook.Enums.MoodEnum | null,
 	): void;
 	onError(error: RecommendationError): void;
 	showBolusBar(toggle: boolean): void;
@@ -73,13 +72,13 @@ interface IState {
 	remeasureTime: number;
 	isRecommendationDisplayed: boolean;
 	insulinRecommendation: number;
-	activityReduction?: number;
+	activityReduction: number | null;
 	wasLimited: boolean;
-	carbRecommendation: number;
+	carbRecommendation: number | null;
 	activeInsulin: number;
-	selectedMood?: MoodEnum;
-	enteredCarbs?: number;
-	enteredInsulin?: number;
+	selectedMood: Logbook.Enums.MoodEnum | null;
+	enteredCarbs: number | null;
+	enteredInsulin: number | null;
 	recommendationModal: boolean;
 	showExitModal: boolean;
 	showLimitationMessage: boolean;
@@ -87,11 +86,11 @@ interface IState {
 }
 
 export default class RecommendationScreen extends React.Component<IRecommendationProps, IState> {
-	private readonly timer: ReturnType<typeof setTimeout>;
-	private readonly suggestedCarbs: number;
+	private readonly timer!: ReturnType<typeof setTimeout>;
+	private readonly suggestedCarbs!: number;
 	private readonly hasError: boolean = false;
-	private readonly recommendationDate: Date;
-	private scrollView: ScrollView;
+	private readonly recommendationDate!: Date;
+	private scrollView?: ScrollView;
 
 	constructor(props: IRecommendationProps) {
 		super(props);
@@ -119,6 +118,8 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 				activityReduction,
 				carbRecommendation,
 				activeInsulin,
+				enteredCarbs: null,
+				enteredInsulin: null,
 				selectedMood: null,
 				recommendationModal:
 					wasLimited || !!Math.round(carbRecommendation) || !!this.getBGLevelAttentionMessage(),
@@ -133,30 +134,35 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 			props.onError(error);
 		}
 	}
+
 	public componentDidMount(): void {
 		AppState.addEventListener(`change`, this.handleAppStateChange);
 	}
 
 	public componentWillUnmount(): void {
-		clearTimeout(this.timer);
+		if (this.timer !== undefined) {
+			clearTimeout(this.timer);
+		}
 		AppState.removeEventListener(`change`, this.handleAppStateChange);
 	}
 
 	public handleAppStateChange = (nextAppState: AppStateStatus): void => {
-		const isOlderThan15Minutes = global.Date.now() - this.recommendationDate.getTime() > Milliseconds.Minute * 15;
+		const time = this.recommendationDate.getTime();
+		const isOlderThan15Minutes = global.Date.now() - time > Milliseconds.Minute * 15;
 		if (nextAppState === `active` && isOlderThan15Minutes) {
 			this.showTimeoutModal();
 		}
 	};
+
 	public showTimeoutModal = (): void => {
 		this.setState({ showTimeoutModal: true }, (): void => this.props.showBolusBar(!this.state.showTimeoutModal));
 	};
 
-	public recalculateInsulin = (calculatorParams: Calculator.IRecommendationParams): void => {
+	public recalculateInsulin = (calculatorParams: IRecommendationParams): void => {
 		const { bolus, wasLimited, activityReduction } = Calculator.calculateRecommendation(calculatorParams);
 		this.setState({
 			insulinRecommendation: Utils.roundValue(bolus, this.props.injectionMethod),
-			enteredInsulin: undefined,
+			enteredInsulin: null,
 			wasLimited,
 			activityReduction,
 			showLimitationMessage: wasLimited,
@@ -174,12 +180,15 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 	public hideAttentionModal = (): void => {
 		this.setState({ recommendationModal: false });
 	};
+
 	public hideLimitationMessage = (): void => {
 		this.setState({ showLimitationMessage: false });
 	};
+
 	public hideExitModal = (): void => {
 		this.setState({ showExitModal: false }, (): void => this.props.showBolusBar(!this.state.showExitModal));
 	};
+
 	public hideTimeoutModal = (): void => {
 		this.setState({ showTimeoutModal: false }, (): void => this.props.showBolusBar(!this.state.showTimeoutModal));
 	};
@@ -198,9 +207,9 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 
 	public updateCarbRecommendation = (enteredCarbs: number): void => {
 		const providedCarbs = this.props.calculatorParams.carbohydrates;
-		this.setState({ enteredCarbs }, (): void =>
-			this.recalculateInsulin({ ...this.props.calculatorParams, carbohydrates: providedCarbs + enteredCarbs }),
-		);
+		this.setState({ enteredCarbs }, (): void => {
+			this.recalculateInsulin({ ...this.props.calculatorParams, carbohydrates: providedCarbs + enteredCarbs });
+		});
 	};
 
 	public removeCarbRecommendation = (): void => {
@@ -214,6 +223,7 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 		this.removeCarbRecommendation();
 		this.props.carbRecommendationAnswer(false);
 	};
+
 	public acceptCarbRecommendation = (): void => {
 		this.hideAttentionModal();
 		this.props.carbRecommendationAnswer(true);
@@ -223,6 +233,7 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 		this.state.showExitModal ? this.hideExitModal() : this.hideTimeoutModal();
 		this.props.closeCalculationCallback();
 	};
+
 	public restartCalculation = (): void => {
 		this.hideTimeoutModal();
 		this.props.restartCalculation();
@@ -252,10 +263,11 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 		this.props.transferToLogbook(carbs, insulin, remeasureTime, this.recommendationDate, selectedMood);
 	};
 
-	public getBGLevelAttentionMessage = (): AttentionMessage => {
+	public getBGLevelAttentionMessage = (): AttentionMessage | null => {
 		const { calculatorParams, latestLogbookFrom6Hours } = this.props;
 		const { currentBGL, activity } = calculatorParams;
 		const bgLevel = getBGLevel(currentBGL, latestLogbookFrom6Hours);
+
 		return getAttentionMessage(bgLevel, activity);
 	};
 
@@ -263,11 +275,13 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 		const { calculatorParams, userReminder, latestLogbookFrom6Hours } = this.props;
 		const { currentBGL, activity, carbohydrates } = calculatorParams;
 		const bgLevel = getBGLevel(currentBGL, latestLogbookFrom6Hours);
+
 		return getReminder(bgLevel, carbohydrates, userReminder, activity);
 	};
 
-	public getLimitationAttentionMessage = (): AttentionMessage => {
+	public getLimitationAttentionMessage = (): AttentionMessage | null => {
 		const { wasLimited, activityReduction } = this.state;
+
 		return getLimitationMessage(wasLimited, activityReduction);
 	};
 
@@ -279,21 +293,32 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 		const {
 			activeInsulin,
 			recommendationModal,
-			carbRecommendation,
+			carbRecommendation: carbRecommendationProp,
 			enteredCarbs,
 			enteredInsulin,
 			insulinRecommendation,
 			activityReduction,
 			isRecommendationDisplayed,
 		} = this.state;
+
+		const carbRecommendation = carbRecommendationProp !== null ? Math.round(carbRecommendationProp) : null;
+		const recommendedCarbs = enteredCarbs ?? carbRecommendation;
+
 		const { calculatorParams, bloodGlucoseUnit, currentBKL, bloodKetoneUnit } = this.props;
-		const { currentBGL, carbohydrates } = calculatorParams;
+		const { currentBGL, carbohydrates: providedCarbs } = calculatorParams;
 		const displayedBGL = Utils.displayedBGLValue(currentBGL, bloodGlucoseUnit);
 		const displayedBKL = Utils.displayedBKLValue(currentBKL, bloodKetoneUnit);
 
 		return (
 			<I18nProvider language={this.props.language} i18n={i18n}>
-				<ScrollView style={containerStyles.container} ref={(view): ScrollView => (this.scrollView = view)}>
+				<ScrollView
+					style={containerStyles.container}
+					ref={(view): void => {
+						if (view !== null) {
+							this.scrollView = view;
+						}
+					}}
+				>
 					<Header exitCallback={this.onExit} />
 					<InfoBars
 						label={i18n._(t`Active Insulin`)}
@@ -319,16 +344,14 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 								style={[
 									containerStyles.calcBorder,
 									{
-										borderColor: Math.round(carbRecommendation)
-											? BORDER_COLOUR_TEAL
-											: BORDER_COLOUR_GREY,
+										borderColor: recommendedCarbs ? BORDER_COLOUR_TEAL : BORDER_COLOUR_GREY,
 									},
 								]}
 							>
 								<RecommendedCarbs
-									enteredCarbs={`${carbohydrates}`}
+									enteredCarbs={`${providedCarbs}`}
 									changedRecommendedCarbs={this.updateCarbRecommendation}
-									recommendedCarbs={`${enteredCarbs ?? Math.round(carbRecommendation)}`}
+									recommendedCarbs={`${recommendedCarbs}`}
 									removeRecommendedCarbs={this.removeCarbRecommendation}
 								/>
 							</View>
@@ -361,7 +384,7 @@ export default class RecommendationScreen extends React.Component<IRecommendatio
 					<TransferToLogbook visible={isRecommendationDisplayed} transfer={this.handleTransfer} />
 					<RecommendationModal
 						isVisible={recommendationModal}
-						suggestedCarbohydrates={Math.round(carbRecommendation)}
+						suggestedCarbohydrates={carbRecommendationProp}
 						attentionMessage={this.getBGLevelAttentionMessage()}
 						limitationMessage={this.getLimitationAttentionMessage()}
 						onClickOkButton={this.hideAttentionModal}