Merge branch 'users/t-xunguy/typescript' into users/t-xunguy/slider-refactor

Author: xnkevinnguyen

src/extension.ts

@@ -595,7 +595,7 @@ export async function activate(context: vscode.ExtensionContext) {
                     // base_64 strings on UNIX systems.
 
                     // added any incomplete data to beginning
-                    let processedData = pythonProcessDataBuffer
+                    const processedData = pythonProcessDataBuffer
                         .join("")
                         .concat(dataFromTheProcess);
                     pythonProcessDataBuffer = [];

src/view/components/clue/ClueImage.tsx

@@ -49,7 +49,6 @@ export class ClueImage extends React.Component<IProps, {}> {
                 this.svgRef.current.getButtons()
             );
         }
-
     }
     componentWillUnmount() {
         window.document.removeEventListener("keydown", this.handleKeyDown);
@@ -87,7 +86,6 @@ export class ClueImage extends React.Component<IProps, {}> {
         );
     }
     public updateButtonAttributes(key: BUTTONS_KEYS, isActive: boolean) {
-
         const button = this.svgRef.current?.getButtons()[key].current;
         if (button) {
             button.focus();
@@ -105,7 +103,6 @@ export class ClueImage extends React.Component<IProps, {}> {
             button.setAttribute("pressed", `${isActive}`);
             button.setAttribute("aria-pressed", `${isActive}`);
         }
-
     }
 }
 

src/view/components/clue/ClueSimulator.tsx

@@ -7,14 +7,14 @@ import {
     VIEW_STATE,
     WEBVIEW_MESSAGES,
 } from "../../constants";
+import { ViewStateContext } from "../../context";
+import "../../styles/Simulator.css";
 import "../../styles/Simulator.css";
 import PlayLogo from "../../svgs/play_svg";
 import StopLogo from "../../svgs/stop_svg";
 import { sendMessage } from "../../utils/MessageUtils";
 import ActionBar from "../simulator/ActionBar";
 import { BUTTONS_KEYS, ClueImage } from "./ClueImage";
-import "../../styles/Simulator.css";
-import { ViewStateContext } from "../../context";
 
 export const DEFAULT_CLUE_STATE: IClueState = {
     buttons: { button_a: false, button_b: false },

src/view/components/clue/Clue_svg.tsx

@@ -2,10 +2,10 @@
 // Licensed under the MIT license.
 
 import * as React from "react";
+import { CLUE_LEDS_COLORS, CONSTANTS } from "../../constants";
 import "../../styles/SimulatorSvg.css";
-import { DEFAULT_CLUE_STATE } from "./ClueSimulator";
-import { CONSTANTS, CLUE_LEDS_COLORS } from "../../constants";
 import svg from "../cpx/Svg_utils";
+import { DEFAULT_CLUE_STATE } from "./ClueSimulator";
 export interface IRefObject {
     [key: string]: React.RefObject<SVGRectElement>;
 }
@@ -1157,7 +1157,6 @@ export class ClueSvg extends React.Component<IProps, {}> {
             "stop-color",
             rgbColor
         );
-
     }
     private updateLeds() {
         // update white led
@@ -1172,7 +1171,6 @@ export class ClueSvg extends React.Component<IProps, {}> {
                     ledRef.current,
                     this.gradientRefs.whiteLed.current
                 );
-
             }
         );
         svg.setLed(
@@ -1182,6 +1180,5 @@ export class ClueSvg extends React.Component<IProps, {}> {
             this.ledsRefs.redLed.current,
             this.gradientRefs.redLed.current
         );
-
     }
 }

src/view/components/microbit/MicrobitImage.tsx

@@ -96,7 +96,6 @@ export class MicrobitImage extends React.Component<IProps, {}> {
             button.setAttribute("pressed", `${isActive}`);
             button.setAttribute("aria-pressed", `${isActive}`);
         }
-
     }
 }
 

src/view/components/microbit/MicrobitSimulator.tsx

@@ -218,7 +218,6 @@ export class MicrobitSimulator extends React.Component<any, IState> {
                     BUTTONS_KEYS.BTN_AB,
                     active
                 );
-
             }
         } else if (
             [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.A) &&
@@ -230,7 +229,6 @@ export class MicrobitSimulator extends React.Component<any, IState> {
                 BUTTONS_KEYS.BTN_A,
                 active
             );
-
         } else if (
             [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.B) &&
             this.context === VIEW_STATE.RUNNING
@@ -241,7 +239,6 @@ export class MicrobitSimulator extends React.Component<any, IState> {
                 BUTTONS_KEYS.BTN_B,
                 active
             );
-
         } else if (
             [event.code, event.key].includes(CONSTANTS.KEYBOARD_KEYS.C) &&
             this.context === VIEW_STATE.RUNNING
@@ -252,7 +249,6 @@ export class MicrobitSimulator extends React.Component<any, IState> {
                 BUTTONS_KEYS.BTN_AB,
                 active
             );
-
         } else if (event.key === CONSTANTS.KEYBOARD_KEYS.CAPITAL_F) {
             this.togglePlayClick();
         } else if (event.key === CONSTANTS.KEYBOARD_KEYS.CAPITAL_R) {

src/view/pages/gettingStarted.tsx

@@ -6,9 +6,7 @@ export class GettingStartedPage extends React.Component {
 
     componentDidMount() {
         this.selectRef.current?.addEventListener("change", (event: any) => {
-            const visibleElement = document.querySelector(
-                ".visibleElement"
-            );
+            const visibleElement = document.querySelector(".visibleElement");
             const target = document.getElementById(event!.target!.value);
             if (visibleElement !== null) {
                 visibleElement.className = "inv";
@@ -17,7 +15,6 @@ export class GettingStartedPage extends React.Component {
                 target.className = "visibleElement";
             }
         });
-
     }
 
     render() {