@hedia/recommendation-screen 1.8.2 → 2.0.2

package/src/__tests__/components/Activity.test.tsx

@@ -1,43 +1,57 @@
-import { ActivityIntensity } from "@hedia/recommendation-calculator/src/RecommendationCalculator";
+import { Activity, Languages } from "@hedia/types";
 import { I18nProvider } from "@lingui/react";
 import React from "react";
 import { cleanup, render } from "react-native-testing-library";
-import Activity from "../../components/activity/Activity";
+import { default as ActivityComponent } from "../../components/activity/Activity";
 import { i18n } from "../../locale/i18nUtils";
-import { Language } from "../../types/enum";
-import { expectTextExists, generateActivityProps, getRecommendationProps, i18nProvided } from "../utils";
+import { ActivityTestIds } from "../../types/enum";
+import { ActivityIntensityTranslations } from "../../utils/Translations";
+import {
+	expectTextExists,
+	generateActivityProps,
+	getRecommendationProps,
+	i18nProvided,
+	queryTextFromComponent,
+} from "../utils";
+
+const ActivityIntensity = Activity.Enums.ActivityIntensity;
+const { light, moderate, hard } = ActivityIntensity;
 
 describe(`Activity - Component`, (): void => {
 	afterEach(cleanup);
+
 	beforeEach((): void => {
-		i18n.activate(`en`);
+		i18n.activate(Languages.en);
 	});
 
 	test.each`
 		activityIntensity
-		${ActivityIntensity.Light}
-		${ActivityIntensity.Moderate}
-		${ActivityIntensity.Hard}
-	`(`Renders $activityIntensity`, ({ activityIntensity }: { activityIntensity: ActivityIntensity }): void => {
-		const { activityDisplayProps } = getRecommendationProps();
-		const activity = generateActivityProps();
-		const wrapper = render(
-			i18nProvided(
-				<Activity
-					activity={{ ...activity, activityIntensity }}
-					activityType={activityDisplayProps.activityType}
-					activityTitle={activityDisplayProps.activityTitle}
-					activityReduction={0}
-				/>,
-			),
-		);
+		${light}
+		${moderate}
+		${hard}
+	`(
+		`Renders $activityIntensity`,
+		({ activityIntensity }: { activityIntensity: Activity.Enums.ActivityIntensity }): void => {
+			const { activityDisplayProps } = getRecommendationProps();
+			const activity = generateActivityProps();
+			const wrapper = render(
+				i18nProvided(
+					<ActivityComponent
+						activity={{ ...activity, activityIntensity }}
+						activityType={activityDisplayProps?.activityType ?? null}
+						activityTitle={activityDisplayProps?.activityTitle ?? null}
+						activityReduction={0}
+					/>,
+				),
+			);
 
-		expectTextExists(wrapper, `Activity`);
-		expectTextExists(wrapper, `30`);
-		expectTextExists(wrapper, `min`);
-		expectTextExists(wrapper, `Based on the selected activity your insulin recommendation is reduced by:`);
-		expectTextExists(wrapper, activityIntensity);
-	});
+			expectTextExists(wrapper, `Activity`);
+			expectTextExists(wrapper, `30`);
+			expectTextExists(wrapper, `min`);
+			expectTextExists(wrapper, `Based on the selected activity your insulin recommendation is reduced by:`);
+			expectTextExists(wrapper, ActivityIntensityTranslations[activityIntensity]());
+		},
+	);
 
 	test.each`
 		reduction
@@ -53,11 +67,11 @@ describe(`Activity - Component`, (): void => {
 			const activity = generateActivityProps();
 			const wrapper = render(
 				i18nProvided(
-					<Activity
+					<ActivityComponent
 						activity={activity}
-						activityType={activityDisplayProps.activityType}
+						activityType={activityDisplayProps?.activityType ?? null}
 						activityReduction={reduction}
-						activityTitle={activityDisplayProps.activityTitle}
+						activityTitle={activityDisplayProps?.activityTitle ?? null}
 					/>,
 				),
 			);
@@ -66,44 +80,84 @@ describe(`Activity - Component`, (): void => {
 		},
 	);
 
+	test(`Renders activity reduction as 0 when null is passed`, (): void => {
+		const { activityDisplayProps } = getRecommendationProps();
+		const activity = generateActivityProps();
+		const reduction = null;
+		const wrapper = render(
+			i18nProvided(
+				<ActivityComponent
+					activity={activity}
+					activityType={activityDisplayProps?.activityType ?? null}
+					activityReduction={reduction}
+					activityTitle={activityDisplayProps?.activityTitle ?? null}
+				/>,
+			),
+		);
+
+		const text = queryTextFromComponent(wrapper, ActivityTestIds.ActivityReduction);
+		expect(text).toBe(`0%`);
+	});
+
 	test(`Can render activity title`, (): void => {
 		const { activityDisplayProps } = getRecommendationProps();
 		const activity = generateActivityProps();
 		const wrapper = render(
 			i18nProvided(
-				<Activity
+				<ActivityComponent
 					activity={{ ...activity }}
-					activityType={activityDisplayProps.activityType}
-					activityTitle={activityDisplayProps.activityTitle}
+					activityType={activityDisplayProps?.activityType ?? null}
+					activityTitle={activityDisplayProps?.activityTitle ?? null}
 					activityReduction={0}
 				/>,
 			),
 		);
-		expectTextExists(wrapper, activityDisplayProps.activityTitle);
+		expectTextExists(wrapper, activityDisplayProps?.activityTitle!);
 	});
 
 	test.each`
-		language     | locale         | message
-		${`English`} | ${Language.en} | ${`Activity`}
-		${`Danish`}  | ${Language.da} | ${`Aktivitet`}
-		${`German`}  | ${Language.de} | ${`Aktivität`}
-		${`Spanish`} | ${Language.es} | ${`Actividad`}
-		${`Italian`} | ${Language.it} | ${`Attività fisica`}
-		${`French`}  | ${Language.fr} | ${`Activité`}
-	`(`Can render in $language`, ({ message, locale }: { locale: Language; message: string }): void => {
+		language     | locale          | message
+		${`English`} | ${Languages.en} | ${`Activity`}
+		${`Danish`}  | ${Languages.da} | ${`Aktivitet`}
+		${`German`}  | ${Languages.de} | ${`Aktivität`}
+		${`Spanish`} | ${Languages.es} | ${`Actividad`}
+		${`Italian`} | ${Languages.it} | ${`Attività fisica`}
+		${`French`}  | ${Languages.fr} | ${`Activité`}
+	`(`Can render in $language`, ({ message, locale }: { locale: Languages; message: string }): void => {
 		const { activityDisplayProps } = getRecommendationProps();
 		const activity = generateActivityProps();
 		i18n.activate(locale);
 		const wrapper = render(
 			<I18nProvider language={locale} i18n={i18n}>
-				<Activity
+				<ActivityComponent
 					activity={activity}
-					activityType={activityDisplayProps.activityType}
-					activityTitle={activityDisplayProps.activityTitle}
+					activityType={activityDisplayProps?.activityType ?? null}
+					activityTitle={activityDisplayProps?.activityTitle ?? null}
 					activityReduction={0}
 				/>
 			</I18nProvider>,
 		);
 		expectTextExists(wrapper, message);
 	});
+
+	test(`ActivityIcon defaults to other if activityType is null`, (): void => {
+		const { activityDisplayProps } = getRecommendationProps();
+		const activity = generateActivityProps();
+		const wrapper = render(
+			i18nProvided(
+				<ActivityComponent
+					activity={{ ...activity }}
+					activityType={null}
+					activityTitle={activityDisplayProps?.activityTitle ?? null}
+					activityReduction={0}
+				/>,
+			),
+		);
+		expectTextExists(wrapper, activityDisplayProps?.activityTitle!);
+		const existingLabel = `${Activity.Enums.ActivityEnum[Activity.Enums.ActivityEnum.Other]}_activity`;
+		const nonExistingLabel = `${Activity.Enums.ActivityEnum[Activity.Enums.ActivityEnum.Run]}_activity`;
+
+		expect(wrapper.queryByA11yLabel(existingLabel)).not.toBeNull();
+		expect(wrapper.queryByA11yLabel(nonExistingLabel)).toBeNull();
+	});
 });

package/src/__tests__/components/Emotion.test.jsx

@@ -3,16 +3,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+const types_1 = require("@hedia/types");
 const react_1 = __importDefault(require("react"));
 const react_native_testing_library_1 = require("react-native-testing-library");
 const Emotion_1 = __importDefault(require("../../components/mood/Emotion"));
 const i18nUtils_1 = require("../../locale/i18nUtils");
-const enum_1 = require("../../types/enum");
 const utils_1 = require("../utils");
+const MoodEnum = types_1.Logbook.Enums.MoodEnum;
 describe(`Emotion - Component`, () => {
     afterEach(react_native_testing_library_1.cleanup);
     beforeEach(() => {
-        i18nUtils_1.i18n.activate(`en`);
+        i18nUtils_1.i18n.activate(types_1.Languages.en);
     });
     test(`Can mount component in `, () => {
         const mockSelected = jest.fn();
@@ -21,47 +22,55 @@ describe(`Emotion - Component`, () => {
     });
     test.each `
 		mood                  | moodName                        | preselected           | preselectedName
-		${enum_1.MoodEnum.Happy}     | ${enum_1.MoodEnum[enum_1.MoodEnum.Happy]}     | ${enum_1.MoodEnum.Sad}       | ${enum_1.MoodEnum[enum_1.MoodEnum.Sad]}
-		${enum_1.MoodEnum.SemiHappy} | ${enum_1.MoodEnum[enum_1.MoodEnum.SemiHappy]} | ${enum_1.MoodEnum.Happy}     | ${enum_1.MoodEnum[enum_1.MoodEnum.Happy]}
-		${enum_1.MoodEnum.Neutral}   | ${enum_1.MoodEnum[enum_1.MoodEnum.Neutral]}   | ${enum_1.MoodEnum.SemiHappy} | ${enum_1.MoodEnum[enum_1.MoodEnum.SemiHappy]}
-		${enum_1.MoodEnum.SemiSad}   | ${enum_1.MoodEnum[enum_1.MoodEnum.SemiSad]}   | ${enum_1.MoodEnum.Neutral}   | ${enum_1.MoodEnum[enum_1.MoodEnum.Neutral]}
-		${enum_1.MoodEnum.Sad}       | ${enum_1.MoodEnum[enum_1.MoodEnum.Sad]}       | ${enum_1.MoodEnum.SemiSad}   | ${enum_1.MoodEnum[enum_1.MoodEnum.SemiSad]}
+		${MoodEnum.Happy}     | ${MoodEnum[MoodEnum.Happy]}     | ${MoodEnum.Sad}       | ${MoodEnum[MoodEnum.Sad]}
+		${MoodEnum.SemiHappy} | ${MoodEnum[MoodEnum.SemiHappy]} | ${MoodEnum.Happy}     | ${MoodEnum[MoodEnum.Happy]}
+		${MoodEnum.Neutral}   | ${MoodEnum[MoodEnum.Neutral]}   | ${MoodEnum.SemiHappy} | ${MoodEnum[MoodEnum.SemiHappy]}
+		${MoodEnum.SemiSad}   | ${MoodEnum[MoodEnum.SemiSad]}   | ${MoodEnum.Neutral}   | ${MoodEnum[MoodEnum.Neutral]}
+		${MoodEnum.Sad}       | ${MoodEnum[MoodEnum.Sad]}       | ${MoodEnum.SemiSad}   | ${MoodEnum[MoodEnum.SemiSad]}
 	`(`Pressing on $moodName icon deselects others`, ({ mood, moodName, preselected, preselectedName, }) => {
         let mockedStateMood = preselected;
         const mockSelected = jest.fn((selectedMood) => (mockedStateMood = selectedMood));
         const wrapper = react_native_testing_library_1.render(<Emotion_1.default moodSelected={mockSelected} currentMood={mockedStateMood}/>);
-        const getIcon = (name, active) => wrapper.queryByA11yLabel(`${name}_${active}`);
-        // Select a different mood than current
-        expect(getIcon(preselectedName, true)).not.toBeNull();
+        const preIcon = utils_1.getIcon(wrapper, preselectedName, true);
+        if (preIcon === null) {
+            return fail(`No icon found for queryByA11yLabel: ${preselectedName}_${true}`);
+        }
+        const newIcon = utils_1.getIcon(wrapper, moodName, false);
+        if (newIcon === null) {
+            return fail(`No icon found for queryByA11yLabel: ${moodName}_${false}`);
+        }
         // Select a different mood
-        react_native_testing_library_1.fireEvent(getIcon(moodName, false), `onPress`);
+        react_native_testing_library_1.fireEvent(newIcon, `onPress`);
         expect(mockedStateMood).toBe(mood);
         wrapper.update(<Emotion_1.default moodSelected={mockSelected} currentMood={mockedStateMood}/>);
-        Object.keys(enum_1.MoodEnum)
+        Object.keys(MoodEnum)
             .filter((key) => /[0-9]/.test(key))
             .forEach((key) => {
-            if (moodName === enum_1.MoodEnum[key]) {
-                expect(getIcon(enum_1.MoodEnum[key], true)).not.toBeNull();
-                expect(getIcon(enum_1.MoodEnum[key], false)).toBeNull();
+            if (moodName === MoodEnum[key]) {
+                expect(utils_1.getIcon(wrapper, MoodEnum[key], true)).not.toBeNull();
+                expect(utils_1.getIcon(wrapper, MoodEnum[key], false)).toBeNull();
             }
             else {
-                expect(getIcon(enum_1.MoodEnum[key], false)).not.toBeNull();
-                expect(getIcon(enum_1.MoodEnum[key], true)).toBeNull();
+                expect(utils_1.getIcon(wrapper, MoodEnum[key], false)).not.toBeNull();
+                expect(utils_1.getIcon(wrapper, MoodEnum[key], true)).toBeNull();
             }
         });
     });
     test(`Deselecting selected icon by pressing it again`, () => {
-        let mockedStateMood = enum_1.MoodEnum.Happy;
+        let mockedStateMood = MoodEnum.Happy;
         const mockSelected = jest.fn((newMood) => (mockedStateMood = newMood));
-        const mood = enum_1.MoodEnum[mockedStateMood];
+        const mood = MoodEnum[mockedStateMood];
         const wrapper = react_native_testing_library_1.render(<Emotion_1.default moodSelected={mockSelected} currentMood={mockedStateMood}/>);
-        const getIcon = (name, active) => wrapper.queryByA11yLabel(`${name}_${active}`);
         // current mood has already been selected: Happy
-        expect(getIcon(mood, true)).not.toBeNull();
-        expect(getIcon(mood, false)).toBeNull();
-        react_native_testing_library_1.fireEvent(getIcon(mood, true), `onPress`);
+        expect(utils_1.getIcon(wrapper, mood, true)).not.toBeNull();
+        expect(utils_1.getIcon(wrapper, mood, false)).toBeNull();
+        const icon = utils_1.getIcon(wrapper, mood, true);
+        if (icon === null) {
+            return fail(`No icon found for queryByA11yLabel: ${mood}_${true}`);
+        }
+        react_native_testing_library_1.fireEvent(icon, `onPress`);
         wrapper.update(<Emotion_1.default moodSelected={mockSelected} currentMood={mockedStateMood}/>);
-        expect(getIcon(mood, true)).toBeNull();
-        expect(getIcon(mood, false)).not.toBeNull();
+        expect(utils_1.getIcon(wrapper, mood, true)).toBeNull();
+        expect(utils_1.getIcon(wrapper, mood, false)).not.toBeNull();
     });
 });

package/src/__tests__/components/Emotion.test.tsx

@@ -1,14 +1,16 @@
+import { Languages, Logbook } from "@hedia/types";
 import React from "react";
 import { cleanup, fireEvent, render } from "react-native-testing-library";
 import Emotion from "../../components/mood/Emotion";
 import { i18n } from "../../locale/i18nUtils";
-import { MoodEnum } from "../../types/enum";
-import { expectTextExists, i18nProvided } from "../utils";
+import { expectTextExists, getIcon, i18nProvided } from "../utils";
+
+const MoodEnum = Logbook.Enums.MoodEnum;
 
 describe(`Emotion - Component`, (): void => {
 	afterEach(cleanup);
 	beforeEach((): void => {
-		i18n.activate(`en`);
+		i18n.activate(Languages.en);
 	});
 
 	test(`Can mount component in `, (): void => {
@@ -33,23 +35,32 @@ describe(`Emotion - Component`, (): void => {
 			preselected,
 			preselectedName,
 		}: {
-			mood: MoodEnum;
+			mood: Logbook.Enums.MoodEnum;
 			moodName: string;
-			preselected: MoodEnum;
+			preselected: Logbook.Enums.MoodEnum;
 			preselectedName: string;
 		}): void => {
-			let mockedStateMood: MoodEnum = preselected;
-			const mockSelected = jest.fn((selectedMood: MoodEnum): MoodEnum => (mockedStateMood = selectedMood));
+			let mockedStateMood: Logbook.Enums.MoodEnum = preselected;
+			const mockSelected = jest.fn(
+				(selectedMood: Logbook.Enums.MoodEnum): Logbook.Enums.MoodEnum => (mockedStateMood = selectedMood),
+			);
 
 			const wrapper = render(<Emotion moodSelected={mockSelected} currentMood={mockedStateMood} />);
 
-			const getIcon = (name: string, active: boolean): void => wrapper.queryByA11yLabel(`${name}_${active}`);
+			const preIcon = getIcon(wrapper, preselectedName, true);
+
+			if (preIcon === null) {
+				return fail(`No icon found for queryByA11yLabel: ${preselectedName}_${true}`);
+			}
+
+			const newIcon = getIcon(wrapper, moodName, false);
 
-			// Select a different mood than current
-			expect(getIcon(preselectedName, true)).not.toBeNull();
+			if (newIcon === null) {
+				return fail(`No icon found for queryByA11yLabel: ${moodName}_${false}`);
+			}
 
 			// Select a different mood
-			fireEvent(getIcon(moodName, false), `onPress`);
+			fireEvent(newIcon, `onPress`);
 
 			expect(mockedStateMood).toBe(mood);
 
@@ -59,35 +70,41 @@ describe(`Emotion - Component`, (): void => {
 				.filter((key): boolean => /[0-9]/.test(key))
 				.forEach((key): void => {
 					if (moodName === MoodEnum[key]) {
-						expect(getIcon(MoodEnum[key], true)).not.toBeNull();
-						expect(getIcon(MoodEnum[key], false)).toBeNull();
+						expect(getIcon(wrapper, MoodEnum[key], true)).not.toBeNull();
+						expect(getIcon(wrapper, MoodEnum[key], false)).toBeNull();
 					} else {
-						expect(getIcon(MoodEnum[key], false)).not.toBeNull();
-						expect(getIcon(MoodEnum[key], true)).toBeNull();
+						expect(getIcon(wrapper, MoodEnum[key], false)).not.toBeNull();
+						expect(getIcon(wrapper, MoodEnum[key], true)).toBeNull();
 					}
 				});
 		},
 	);
 
 	test(`Deselecting selected icon by pressing it again`, (): void => {
-		let mockedStateMood: MoodEnum = MoodEnum.Happy;
-		const mockSelected = jest.fn((newMood: MoodEnum): MoodEnum => (mockedStateMood = newMood));
+		let mockedStateMood: Logbook.Enums.MoodEnum = MoodEnum.Happy;
+		const mockSelected = jest.fn(
+			(newMood: Logbook.Enums.MoodEnum): Logbook.Enums.MoodEnum => (mockedStateMood = newMood),
+		);
 
 		const mood = MoodEnum[mockedStateMood];
 
 		const wrapper = render(<Emotion moodSelected={mockSelected} currentMood={mockedStateMood} />);
 
-		const getIcon = (name: string, active: boolean): void => wrapper.queryByA11yLabel(`${name}_${active}`);
-
 		// current mood has already been selected: Happy
-		expect(getIcon(mood, true)).not.toBeNull();
-		expect(getIcon(mood, false)).toBeNull();
+		expect(getIcon(wrapper, mood, true)).not.toBeNull();
+		expect(getIcon(wrapper, mood, false)).toBeNull();
+
+		const icon = getIcon(wrapper, mood, true);
+
+		if (icon === null) {
+			return fail(`No icon found for queryByA11yLabel: ${mood}_${true}`);
+		}
 
-		fireEvent(getIcon(mood, true), `onPress`);
+		fireEvent(icon, `onPress`);
 
 		wrapper.update(<Emotion moodSelected={mockSelected} currentMood={mockedStateMood} />);
 
-		expect(getIcon(mood, true)).toBeNull();
-		expect(getIcon(mood, false)).not.toBeNull();
+		expect(getIcon(wrapper, mood, true)).toBeNull();
+		expect(getIcon(wrapper, mood, false)).not.toBeNull();
 	});
 });

package/src/__tests__/components/Header.test.jsx

@@ -8,25 +8,26 @@ const react_native_testing_library_1 = require("react-native-testing-library");
 const utils_1 = require("../utils");
 const react_2 = require("@lingui/react");
 const Header_1 = __importDefault(require("../../components/Header"));
+const types_1 = require("@hedia/types");
 const i18nUtils_1 = require("../../locale/i18nUtils");
 const enum_1 = require("../../types/enum");
 describe(`Header Component`, () => {
     afterEach(react_native_testing_library_1.cleanup);
     test(`Exit button calls exitCallback`, () => {
         const props = utils_1.getRecommendationProps();
-        const { queryByA11yLabel } = react_native_testing_library_1.render(<Header_1.default exitCallback={props.exitCallback}/>);
+        const { getByTestId } = react_native_testing_library_1.render(<Header_1.default exitCallback={props.exitCallback}/>);
         expect(props.exitCallback).not.toBeCalled();
-        react_native_testing_library_1.fireEvent.press(queryByA11yLabel(`exitButton`));
+        react_native_testing_library_1.fireEvent.press(getByTestId(enum_1.HeaderTestIds.ExitCalculation));
         expect(props.exitCallback).toBeCalled();
     });
     test.each `
-		language     | locale         | header
-		${`English`} | ${enum_1.Language.en} | ${`INSULIN\nRECOMMENDATION`}
-		${`Danish`}  | ${enum_1.Language.da} | ${`INSULIN\nANBEFALING`}
-		${`German`}  | ${enum_1.Language.de} | ${`INSULIN\nEMPFEHLUNG`}
-		${`Spanish`} | ${enum_1.Language.es} | ${`RECOMENDACIÓN\nDE INSULINA`}
-		${`Italian`} | ${enum_1.Language.it} | ${`PRESCRIZIONE DI\nINSULINA`}
-		${`French`}  | ${enum_1.Language.fr} | ${`RECOMMANDATION\nD’INSULINE`}
+		language     | locale          | header
+		${`English`} | ${types_1.Languages.en} | ${`INSULIN\nRECOMMENDATION`}
+		${`Danish`}  | ${types_1.Languages.da} | ${`INSULIN\nANBEFALING`}
+		${`German`}  | ${types_1.Languages.de} | ${`INSULIN\nEMPFEHLUNG`}
+		${`Spanish`} | ${types_1.Languages.es} | ${`RECOMENDACIÓN\nDE INSULINA`}
+		${`Italian`} | ${types_1.Languages.it} | ${`PRESCRIZIONE DI\nINSULINA`}
+		${`French`}  | ${types_1.Languages.fr} | ${`RECOMMANDATION\nD’INSULINE`}
 	`(`Header is translated to $language`, ({ header, locale }) => {
         const props = utils_1.getRecommendationProps({
             language: locale,

package/src/__tests__/components/Header.test.tsx

@@ -5,28 +5,29 @@ import { expectTextExists, getRecommendationProps } from "../utils";
 import { I18nProvider } from "@lingui/react";
 import Header from "../../components/Header";
 
+import { Languages } from "@hedia/types";
 import { i18n } from "../../locale/i18nUtils";
-import { Language } from "../../types/enum";
+import { HeaderTestIds } from "../../types/enum";
 
 describe(`Header Component`, (): void => {
 	afterEach(cleanup);
 
 	test(`Exit button calls exitCallback`, (): void => {
 		const props = getRecommendationProps();
-		const { queryByA11yLabel } = render(<Header exitCallback={props.exitCallback} />);
+		const { getByTestId } = render(<Header exitCallback={props.exitCallback} />);
 		expect(props.exitCallback).not.toBeCalled();
-		fireEvent.press(queryByA11yLabel(`exitButton`));
+		fireEvent.press(getByTestId(HeaderTestIds.ExitCalculation));
 		expect(props.exitCallback).toBeCalled();
 	});
 	test.each`
-		language     | locale         | header
-		${`English`} | ${Language.en} | ${`INSULIN\nRECOMMENDATION`}
-		${`Danish`}  | ${Language.da} | ${`INSULIN\nANBEFALING`}
-		${`German`}  | ${Language.de} | ${`INSULIN\nEMPFEHLUNG`}
-		${`Spanish`} | ${Language.es} | ${`RECOMENDACIÓN\nDE INSULINA`}
-		${`Italian`} | ${Language.it} | ${`PRESCRIZIONE DI\nINSULINA`}
-		${`French`}  | ${Language.fr} | ${`RECOMMANDATION\nD’INSULINE`}
-	`(`Header is translated to $language`, ({ header, locale }: { locale: Language; header: string }): void => {
+		language     | locale          | header
+		${`English`} | ${Languages.en} | ${`INSULIN\nRECOMMENDATION`}
+		${`Danish`}  | ${Languages.da} | ${`INSULIN\nANBEFALING`}
+		${`German`}  | ${Languages.de} | ${`INSULIN\nEMPFEHLUNG`}
+		${`Spanish`} | ${Languages.es} | ${`RECOMENDACIÓN\nDE INSULINA`}
+		${`Italian`} | ${Languages.it} | ${`PRESCRIZIONE DI\nINSULINA`}
+		${`French`}  | ${Languages.fr} | ${`RECOMMANDATION\nD’INSULINE`}
+	`(`Header is translated to $language`, ({ header, locale }: { locale: Languages; header: string }): void => {
 		const props = getRecommendationProps({
 			language: locale,
 		});

package/src/__tests__/components/InfoBars.test.jsx

@@ -33,6 +33,7 @@ describe(`Info Bars Component`, () => {
             label: `Active Insulin`,
             unit: `units`,
             showNullAsDash: true,
+            value: null,
         };
         const InfoBarsComponent = react_native_testing_library_1.render(<InfoBars_1.default {...props}/>);
         utils_1.expectTextNotExists(InfoBarsComponent, `${types_1.BloodGlucoseUnit.MG_DL}`);

package/src/__tests__/components/InfoBars.test.tsx

@@ -23,7 +23,7 @@ describe(`Info Bars Component`, (): void => {
 		expectTextNotExists(InfoBarsComponent, `${BloodGlucoseUnit.MMOL_L}`);
 		expectTextExists(InfoBarsComponent, props.label);
 		expectTextExists(InfoBarsComponent, `${props.unit}`);
-		expectTextExists(InfoBarsComponent, props.value);
+		expectTextExists(InfoBarsComponent, props.value!);
 	});
 
 	test(`Active Insulin info bar - showNullAsDash`, (): void => {
@@ -31,6 +31,7 @@ describe(`Info Bars Component`, (): void => {
 			label: `Active Insulin`,
 			unit: `units`,
 			showNullAsDash: true,
+			value: null,
 		};
 		const InfoBarsComponent = render(<InfoBars {...props} />);
 		expectTextNotExists(InfoBarsComponent, `${BloodGlucoseUnit.MG_DL}`);
@@ -50,7 +51,7 @@ describe(`Info Bars Component`, (): void => {
 		expectTextNotExists(InfoBarsComponent, `${BloodGlucoseUnit.MG_DL}`);
 		expectTextExists(InfoBarsComponent, props.label);
 		expectTextExists(InfoBarsComponent, `${props.unit}`);
-		expectTextExists(InfoBarsComponent, props.value);
+		expectTextExists(InfoBarsComponent, props.value!);
 	});
 
 	test(`Blood Glucose mmol/l can be displayed`, (): void => {
@@ -66,7 +67,7 @@ describe(`Info Bars Component`, (): void => {
 
 		expectTextExists(InfoBarsComponent, props.label);
 		expectTextExists(InfoBarsComponent, DisplayedUnit.MMOL_L);
-		expectTextExists(InfoBarsComponent, props.value);
+		expectTextExists(InfoBarsComponent, props.value!);
 	});
 
 	test(`Blood Glucose mg/dl can be displayed`, (): void => {
@@ -82,7 +83,7 @@ describe(`Info Bars Component`, (): void => {
 
 		expectTextExists(InfoBarsComponent, props.label);
 		expectTextExists(InfoBarsComponent, DisplayedUnit.MG_DL);
-		expectTextExists(InfoBarsComponent, props.value);
+		expectTextExists(InfoBarsComponent, props.value!);
 	});
 
 	test(`Blood Ketones mmol/l can be displayed`, (): void => {
@@ -98,7 +99,7 @@ describe(`Info Bars Component`, (): void => {
 
 		expectTextExists(InfoBarsComponent, props.label);
 		expectTextExists(InfoBarsComponent, DisplayedUnit.MMOL_L);
-		expectTextExists(InfoBarsComponent, props.value);
+		expectTextExists(InfoBarsComponent, props.value!);
 	});
 
 	test(`Blood Ketones mg/dl can be displayed`, (): void => {
@@ -114,7 +115,7 @@ describe(`Info Bars Component`, (): void => {
 
 		expectTextExists(InfoBarsComponent, props.label);
 		expectTextExists(InfoBarsComponent, DisplayedUnit.MG_DL);
-		expectTextExists(InfoBarsComponent, props.value);
+		expectTextExists(InfoBarsComponent, props.value!);
 	});
 
 	interface IShowNullAsDash {