diff --git a/src/view/components/microbit/Microbit.tsx b/src/view/components/microbit/Microbit.tsx index 03f11fed9..01db1ddd1 100644 --- a/src/view/components/microbit/Microbit.tsx +++ b/src/view/components/microbit/Microbit.tsx @@ -81,4 +81,16 @@ const MICROBIT_TOOLBAR_BUTTONS: Array<{ label: string; image: JSX.Element }> = [ image: TOOLBAR_SVG.MOTION_SVG, label: MICROBIT_TOOLBAR_ID.ACCELEROMETER, }, + { + image: TOOLBAR_SVG.GPIO_SVG, + label: MICROBIT_TOOLBAR_ID.GPIO, + }, + { + image: TOOLBAR_SVG.SPEAKER_SVG, + label: MICROBIT_TOOLBAR_ID.SOUND, + }, + { + image: TOOLBAR_SVG.WIRELESS_SVG, + label: MICROBIT_TOOLBAR_ID.WIRELESS, + }, ]; diff --git a/src/view/components/microbit/__snapshots__/Microbit.spec.tsx.snap b/src/view/components/microbit/__snapshots__/Microbit.spec.tsx.snap index 7efb97e8e..4719a7d11 100644 --- a/src/view/components/microbit/__snapshots__/Microbit.spec.tsx.snap +++ b/src/view/components/microbit/__snapshots__/Microbit.spec.tsx.snap @@ -2968,6 +2968,179 @@ Array [ +
+ +
+
+ +
+
+ +
, diff --git a/src/view/components/toolbar/SensorModalUtils.tsx b/src/view/components/toolbar/SensorModalUtils.tsx index bed745313..b22b2303a 100644 --- a/src/view/components/toolbar/SensorModalUtils.tsx +++ b/src/view/components/toolbar/SensorModalUtils.tsx @@ -45,6 +45,7 @@ export const TOOLBAR_ICON_LABEL = { TAG_INPUT: "Tag Input", TAG_OUTPUT: "Tag Output", TEMPERATURE: "Temperature Sensor", + WIRELESS: "Bluetooth and Radio", }; export const CPX_TOOLBAR_ICON_ID = { GPIO: "toolbar-gpio", @@ -68,6 +69,9 @@ export const MICROBIT_TOOLBAR_ID = { ACCELEROMETER: "toolbar-accelerometer-sensor", LEDS: "toolbar-microbit-led", PUSH_BUTTON: "toolbar-microbit-button", + GPIO: "toolbar-gpio", + SOUND: "toolbar-microbit-sound", + WIRELESS: "toolbar-microbit-wireless", }; export interface IModalContent { @@ -321,6 +325,48 @@ export const MICROBIT_BUTTON_CONTENT = ( id: "microbit_button", }; }; +export const MICROBIT_SOUND_MODAL_CONTENT = ( + onUpdateValue: (sensor: SENSOR_LIST, value: number) => void, + sensorValues: { [key: string]: number } +): IModalContent => { + return { + descriptionTitle: "toolbar-microbit-sound.title", + tagInput: undefined, + tagOutput: TAG_OUTPUT_SVG, + descriptionText: "toolbar-microbit-sound.description", + tryItDescription: "toolbar-microbit-sound.tryItDescription", + components: [FEATURE_REQUEST_ON_GITHUB], + id: "microbit_sound", + }; +}; +export const MICROBIT_GPIO_MODAL_CONTENT = ( + onUpdateValue: (sensor: SENSOR_LIST, value: number) => void, + sensorValues: { [key: string]: number } +): IModalContent => { + return { + descriptionTitle: "toolbar-microbit-gpio.title", + tagInput: TAG_INPUT_SVG, + tagOutput: TAG_OUTPUT_SVG, + descriptionText: "toolbar-microbit-gpio.description", + tryItDescription: "toolbar-microbit-gpio.tryItDescription", + components: [FEATURE_REQUEST_ON_GITHUB], + id: "microbit_gpio", + }; +}; +export const MICROBIT_WIRELESS_MODAL_CONTENT = ( + onUpdateValue: (sensor: SENSOR_LIST, value: number) => void, + sensorValues: { [key: string]: number } +): IModalContent => { + return { + descriptionTitle: "toolbar-microbit-wireless.title", + tagInput: TAG_INPUT_SVG, + tagOutput: TAG_OUTPUT_SVG, + descriptionText: "toolbar-microbit-wireless.description", + tryItDescription: "toolbar-microbit-wireless.tryItDescription", + components: [FEATURE_REQUEST_ON_GITHUB], + id: "microbit_wireless", + }; +}; export const LABEL_TO_MODAL_CONTENT_CONSTRUCTOR = new Map([ [CPX_TOOLBAR_ICON_ID.GPIO, GPIO_MODAL_CONTENT], @@ -337,6 +383,9 @@ export const LABEL_TO_MODAL_CONTENT_CONSTRUCTOR = new Map([ [MICROBIT_TOOLBAR_ID.ACCELEROMETER, ACCELEROMETER_MODAL_CONTENT], [MICROBIT_TOOLBAR_ID.LEDS, MICROBIT_LED_CONTENT], [MICROBIT_TOOLBAR_ID.PUSH_BUTTON, MICROBIT_BUTTON_CONTENT], + [MICROBIT_TOOLBAR_ID.GPIO, MICROBIT_GPIO_MODAL_CONTENT], + [MICROBIT_TOOLBAR_ID.SOUND, MICROBIT_SOUND_MODAL_CONTENT], + [MICROBIT_TOOLBAR_ID.WIRELESS, MICROBIT_WIRELESS_MODAL_CONTENT], ]); export const getModalContent = ( diff --git a/src/view/container/device/__snapshots__/Device.spec.tsx.snap b/src/view/container/device/__snapshots__/Device.spec.tsx.snap index bc04b0685..9ce4af5ab 100644 --- a/src/view/container/device/__snapshots__/Device.spec.tsx.snap +++ b/src/view/container/device/__snapshots__/Device.spec.tsx.snap @@ -2970,6 +2970,179 @@ exports[`Device component should render correctly 1`] = ` +
+ +
+
+ +
+
+ +
diff --git a/src/view/svgs/toolbar_svg.tsx b/src/view/svgs/toolbar_svg.tsx index fccd752f3..21eb734ab 100644 --- a/src/view/svgs/toolbar_svg.tsx +++ b/src/view/svgs/toolbar_svg.tsx @@ -476,4 +476,30 @@ export const TEMPERATURE_SVG = ( ); + +export const WIRELESS_SVG = ( + + {TOOLBAR_ICON_LABEL.WIRELESS} + + + + + + + + + +); export default LEFT_EDGE_SVG; diff --git a/src/view/translations/en.json b/src/view/translations/en.json index 697cbf9aa..43d47b6f9 100644 --- a/src/view/translations/en.json +++ b/src/view/translations/en.json @@ -40,5 +40,14 @@ "toolbar-microbit-led.tryItDescription": "Run your code and see the LEDs light up!", "toolbar-microbit-button.title": "Buttons", "toolbar-microbit-button.description": "There are two buttons on the front of the micro:bit (labelled A and B). The third button is to trigger both A and B buttons. You can detect when these buttons are pressed, allowing you to trigger code on the device.", - "toolbar-microbit-button.tryItDescription": "Click them with your mouse or by pressing “A” and/or “B” on your keyboard!" + "toolbar-microbit-button.tryItDescription": "Click them with your mouse or by pressing “A” and/or “B” on your keyboard!", + "toolbar-microbit-sound.title": "Sound", + "toolbar-microbit-sound.description": "Your BBC micro:bit can be programmed to make a wide variety of sounds - from single notes, tones and beats to your own musical compositions.", + "toolbar-microbit-sound.tryItDescription": "If you would like to see this sensor supported, please +1 the feature addition issue on GitHub! For now, you can try it on MakeCode!", + "toolbar-microbit-gpio.title": "GPIO (Pins)", + "toolbar-microbit-gpio.description": "On the bottom edge of your BBC micro:bit there are 25 gold strips, called pins. These pins allow you to really get creative. You can create circuits, connect external things like buzzers and motors and make your own fun projects.", + "toolbar-microbit-gpio.tryItDescription": "If you would like to see this sensor supported, please +1 the feature addition issue on GitHub! For now, you can try it on MakeCode!", + "toolbar-microbit-wireless.title": "Bluetooth & Radio", + "toolbar-microbit-wireless.description": "micro:bits can use radio waves and bluetooth services to communicate with each other", + "toolbar-microbit-wireless.tryItDescription": "If you would like to see this sensor supported, please +1 the feature addition issue on GitHub! For now, you can try it on MakeCode!" }