Refactor sensor for microbit & clue

Author: xnkevinnguyen

src/view/components/toolbar/SensorModalUtils.tsx

@@ -65,7 +65,7 @@ export const CPX_TOOLBAR_ICON_ID = {
 };
 
 export const MICROBIT_TOOLBAR_ICON_ID = {
-    TEMPERATURE: "toolbar-temperature-sensor",
+    TEMPERATURE: "toolbar-microbit-temperature-sensor",
     LIGHT: "toolbar-microbit-light-sensor",
     ACCELEROMETER: "toolbar-accelerometer-sensor",
     LEDS: "toolbar-microbit-led",
@@ -309,6 +309,7 @@ export const LABEL_TO_MODAL_CONTENT_CONSTRUCTOR = new Map([
         MICROBIT_TOOLBAR_ICON_ID.ACCELEROMETER,
         MICROBIT_MODAL.ACCELEROMETER_CONTENT,
     ],
+    [MICROBIT_TOOLBAR_ICON_ID.TEMPERATURE, MICROBIT_MODAL.TEMPERATURE_CONTENT],
     [MICROBIT_TOOLBAR_ICON_ID.LIGHT, MICROBIT_MODAL.LIGHT_CONTENT],
     [MICROBIT_TOOLBAR_ICON_ID.COMPASS, MICROBIT_MODAL.COMPASS_CONTENT],
     [MICROBIT_TOOLBAR_ICON_ID.LEDS, MICROBIT_MODAL.LED_CONTENT],

src/view/components/toolbar/clue/ClueModalContent.tsx

@@ -12,11 +12,15 @@ export const TEMPERATURE_CONTENT = (
     onUpdateValue: (sensor: SENSOR_LIST, value: number) => void,
     sensorValues: { [key: string]: number }
 ): IModalContent => {
+    const temperatureSensorValues = {
+        T: sensorValues[SENSOR_LIST.TEMPERATURE]
+    }
     return {
         components: [
-            <TemperatureSensorBar
-                onUpdateSensor={onUpdateValue}
-                value={sensorValues[SENSOR_LIST.TEMPERATURE]}
+            <GenericSliderComponent
+                onUpdateValue={onUpdateValue}
+                axisValues={temperatureSensorValues}
+                axisProperties={SENSOR_PROPERTIES.TEMPERATURE_SENSOR_PROPERTIES}
             />,
         ],
         descriptionText: "toolbar-clue-temperature-sensor.description",

src/view/components/toolbar/clue/ClueSensorProperties.tsx

@@ -181,4 +181,19 @@ export const MOTION_SENSOR_PROPERTIES: ISensorProps = {
         MOTION_SLIDER_PROPS_Z,
     ],
     unitLabel: "m/s2",
+};
+
+const TEMPERATURE_SLIDER_PROPS: ISliderProps = {
+    axisLabel: "T",
+    maxLabel: "Hot",
+    maxValue: 125,
+    minLabel: "Cold",
+    minValue: -55,
+    type: SENSOR_LIST.TEMPERATURE,
+};
+
+export const TEMPERATURE_SENSOR_PROPERTIES: ISensorProps = {
+    LABEL: "Temperature sensor",
+    sliderProps: [TEMPERATURE_SLIDER_PROPS],
+    unitLabel: "°C",
 };

src/view/components/toolbar/microbit/MicrobitSensorProperties.tsx

@@ -55,7 +55,7 @@ export const MOTION_SENSOR_PROPERTIES: ISensorProps = {
 };
 
 const TEMPERATURE_SLIDER_PROPS: ISliderProps = {
-    axisLabel: " ",
+    axisLabel: "T",
     maxLabel: "Hot",
     maxValue: 125,
     minLabel: "Cold",