Merge branch 'vite' of github.com:microbit-foundation/python-editor-v…

…3 into vite

src/common/ErrorBoundary.tsx

@@ -20,7 +20,7 @@ class ErrorBoundary extends React.Component<
   ErrorBoundaryProps,
   ErrorBoundaryState
 > {
-  context!: React.ContextType<typeof LoggingContext>;
+  declare context: React.ContextType<typeof LoggingContext>;
 
   constructor(props: ErrorBoundaryProps) {
     super(props);

src/common/FileDropTarget.tsx

@@ -43,9 +43,12 @@ const FileDropTarget = ({
       event.dataTransfer.dropEffect = "copy";
     }
   }, []);
-  const handleDragLeave = useCallback((event: React.DragEvent<HTMLElement>) => {
-    setDragOver(false);
-  }, []);
+  const handleDragLeave = useCallback(
+    (_event: React.DragEvent<HTMLElement>) => {
+      setDragOver(false);
+    },
+    []
+  );
   const intl = useIntl();
   return (
     <Box

src/common/SplitView/SplitView.tsx

@@ -55,7 +55,7 @@ export const SplitView = ({
   const splitViewRef = useRef<HTMLDivElement>(null);
 
   const handleMouseDown = useCallback(
-    (e: React.MouseEvent) => {
+    (_: React.MouseEvent) => {
       setDragging(true);
       const cursor = direction === "row" ? "col-resize" : "row-resize";
       // Avoids cursor flicker.
@@ -65,14 +65,14 @@ export const SplitView = ({
   );
 
   const handleTouchStart = useCallback(
-    (e: React.TouchEvent) => {
+    (_: React.TouchEvent) => {
       setDragging(true);
     },
     [setDragging]
   );
 
   const handleMove = useCallback(
-    (e: Event, clientPos: number) => {
+    (_: Event, clientPos: number) => {
       if (dragging) {
         const rect = splitViewRef.current!.getBoundingClientRect();
         const relativeTo =

src/common/use-action-feedback.tsx

@@ -28,11 +28,9 @@ export class ActionFeedback {
   expectedError({
     title,
     description,
-    error,
   }: {
     title: string;
     description: ReactNode;
-    error?: any;
   }) {
     this.toast({
       title,
@@ -47,15 +45,7 @@ export class ActionFeedback {
   /**
    * Handles a warning.
    */
-  warning({
-    title,
-    description,
-    error,
-  }: {
-    title: string;
-    description: ReactNode;
-    error?: any;
-  }) {
+  warning({ title, description }: { title: string; description: ReactNode }) {
     this.toast({
       title,
       status: "warning",

src/common/use-local-storage.test.tsx

@@ -12,7 +12,7 @@ interface TestState {
   z: number;
 }
 
-const validate = (o: unknown): o is TestState => true;
+const validate = (_o: unknown): _o is TestState => true;
 
 const Test = () => {
   const [state, setState] = useStorage<TestState>(

src/deployment/default/logging.ts

@@ -6,7 +6,7 @@
 import { Event, Logging } from "../../logging/logging";
 
 export class NullLogging implements Logging {
-  event(event: Event): void {}
-  error(e: any): void {}
-  log(e: any): void {}
+  event(_event: Event): void {}
+  error(_e: any): void {}
+  log(_e: any): void {}
 }

src/device/mock.ts

@@ -69,7 +69,7 @@ export class MockDeviceConnection
    * @param options Flash options and progress callback.
    */
   async flash(
-    dataSource: FlashDataSource,
+    _dataSource: FlashDataSource,
     options: {
       /**
        * True to use a partial flash where possible, false to force a full flash.

src/documentation/api/ApiNode.tsx

@@ -407,7 +407,7 @@ const DraggableSignature = ({
     [fullName, kind, id, dragImage, logging]
   );
 
-  const handleDragEnd = useCallback((event: React.DragEvent) => {
+  const handleDragEnd = useCallback((_event: React.DragEvent) => {
     dndDebug("dragend");
     setDragContext(undefined);
   }, []);

src/documentation/common/CodeEmbed.tsx

@@ -307,7 +307,7 @@ const Code = forwardRef<CodeProps, "pre">(
       [full, dragImage, parentSlug, toolkitType, logging]
     );
     const handleDragEnd = useCallback(
-      (event: React.DragEvent) => {
+      (_event: React.DragEvent) => {
         onCodeDragEnd();
         dndDebug("dragend");
         setDragContext(undefined);

src/e2e/app.ts

@@ -510,7 +510,7 @@ export class App {
       },
       {
         ...defaultWaitForOptions,
-        onTimeout: (e) =>
+        onTimeout: (_e) =>
           new Error(
             `Timeout waiting for ${match} but content was:\n${lastText}}\n\nJSON version:\n${JSON.stringify(
               lastText
@@ -1249,15 +1249,6 @@ export class App {
     await keyboard.press(key);
   }
 
-  private async getElementByRoleAndLabel(
-    role: string,
-    name: string
-  ): Promise<ElementHandle<Element>> {
-    return (await this.document()).findByRole(role, {
-      name,
-    });
-  }
-
   private async getElementByQuerySelector(
     query: string
   ): Promise<ElementHandle<Element>> {

src/editor/ActiveFileInfo.tsx

@@ -21,7 +21,6 @@ interface ActiveFileInfoProps extends BoxProps {
 const ActiveFileInfo = ({
   filename,
   onSelectedFileChanged,
-  ...props
 }: ActiveFileInfoProps) => {
   return (
     <HStack>

src/editor/codemirror/structure-highlighting/view.ts

@@ -69,7 +69,7 @@ export const codeStructureView = (option: "full" | "simple") =>
         view.requestMeasure(this.measureReq);
       }
 
-      update(update: ViewUpdate) {
+      update(_update: ViewUpdate) {
         // We can probably limit this but we need to know when the language state has changed as parsing has occurred.
         this.view.requestMeasure(this.measureReq);
       }

src/fs/fs.ts

@@ -162,7 +162,7 @@ export class FileSystem extends EventEmitter implements FlashDataSource {
   project: Project;
 
   constructor(
-    private logging: Logging,
+    logging: Logging,
     private host: Host,
     private microPythonSource: MicroPythonSource
   ) {
@@ -193,7 +193,7 @@ export class FileSystem extends EventEmitter implements FlashDataSource {
   async initializeInBackground() {
     // It's been observed that this can be slow after the fetch on low-end devices,
     // so it might be good to move the FS work to a worker if we can't make it fast.
-    this.initialize().catch((e) => {
+    this.initialize().catch((_) => {
       this.initializing = undefined;
     });
   }

src/fs/host.ts

@@ -87,10 +87,10 @@ export class IframeHost implements Host {
     private window: Window,
     private debounceDelay: number = 1_000
   ) {}
-  createStorage(logging: Logging): FSStorage {
+  createStorage(_logging: Logging): FSStorage {
     return new InMemoryFSStorage(undefined);
   }
-  async shouldReinitializeProject(storage: FSStorage): Promise<boolean> {
+  async shouldReinitializeProject(_storage: FSStorage): Promise<boolean> {
     // If there is persistence then it is the embedder's problem.
     return true;
   }

src/fs/lzma.d.ts

@@ -0,0 +1 @@
+declare module "lzma/src/lzma-d-min";

src/index.tsx

@@ -3,7 +3,7 @@
  *
  * SPDX-License-Identifier: MIT
  */
-import React, { StrictMode } from "react";
+import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import App from "./App";
 import reportWebVitals from "./reportWebVitals";

src/project/OpenButton.tsx

@@ -3,7 +3,6 @@
  *
  * SPDX-License-Identifier: MIT
  */
-import React from "react";
 import { RiFolderOpenLine } from "react-icons/ri";
 import { useIntl } from "react-intl";
 import { CollapsibleButtonComposableProps } from "../common/CollapsibleButton";

src/project/project-actions.tsx

@@ -336,7 +336,6 @@ export class ProjectActions {
               ) : (
                 e.message
               ),
-              error: e,
             });
           }
         }
@@ -809,7 +808,7 @@ export class ProjectActions {
   }
 
   private async handleFirmwareUpdate(
-    errorCode: WebUSBErrorCode,
+    _errorCode: WebUSBErrorCode,
     userAction: ConnectionAction,
     finalFocusRef: React.RefObject<HTMLButtonElement>
   ) {

src/serial/XTerm.tsx

@@ -74,7 +74,7 @@ const useManagedTermimal = (
       },
     });
 
-    const tracebackLinkHandler = (e: MouseEvent, traceLine: string) => {
+    const tracebackLinkHandler = (_e: MouseEvent, traceLine: string) => {
       const { file, line } = parseTraceLine(traceLine);
       if (file) {
         setSelection({ file, location: { line } });

src/settings/SettingsArea.tsx

@@ -15,7 +15,7 @@ import {
   NumberInputStepper,
   VStack,
 } from "@chakra-ui/react";
-import React, { useCallback, useMemo } from "react";
+import { useCallback, useMemo } from "react";
 import { FormattedMessage, useIntl } from "react-intl";
 import SelectFormControl, { createOptions } from "./SelectFormControl";
 import {

src/simulator/scroll-hooks.tsx

@@ -13,7 +13,7 @@ export const useAutoScrollToBottom = (
   const [enabled, setEnabled] = useState<boolean>(true);
   const ref = useRef<HTMLDivElement>(null);
   const handleScroll = useCallback(
-    (e: React.UIEvent) => {
+    (_: React.UIEvent) => {
       const element = ref.current!;
       const isAtBottom =
         element.scrollHeight - element.scrollTop === element.clientHeight;

src/workbench/AboutDialog/AboutDialog.tsx

@@ -266,7 +266,7 @@ const MicroPythonSection = (props: BoxProps) => {
                   {chunks}
                 </Link>
               ),
-              linkV2: (chunks: ReactNode) => (
+              linkV2: (_: ReactNode) => (
                 <Link
                   color="brand.500"
                   href="https://github.com/microbit-foundation/micropython-microbit-v2"

src/workbench/SideBarTab.tsx

@@ -23,7 +23,6 @@ const SideBarTab = ({
   mb,
   handleTabClick,
   active,
-  tabIndex,
 }: SideBarTabProps) => {
   const width = "5rem";
   const ref = useRef<HTMLButtonElement>(null);

tsconfig.json

@@ -1,8 +1,8 @@
 {
   "compilerOptions": {
-    "target": "ES2020",
+    "target": "ES2021",
     "useDefineForClassFields": true,
-    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "lib": ["ES2021", "DOM", "DOM.Iterable"],
     "module": "ESNext",
     "skipLibCheck": true,