2.0.0-rc9.2 (#1312)

* 2.0.0-rc9.2

* use arduino-cli version 0.26.0-rc1

.github/ISSUE_TEMPLATE/bug-report.yml

@@ -0,0 +1,74 @@
+name: Bug report
+description: Report a problem with the code or documentation in this repository.
+labels:
+  - "type: imperfection"
+body:
+  - type: textarea
+    id: description
+    attributes:
+      label: Describe the problem
+    validations:
+      required: true
+  - type: textarea
+    id: reproduce
+    attributes:
+      label: To reproduce
+      description: Provide the specific set of steps we can follow to reproduce the problem.
+    validations:
+      required: true
+  - type: textarea
+    id: expected
+    attributes:
+      label: Expected behavior
+      description: What would you expect to happen after following those instructions?
+    validations:
+      required: true
+  - type: input
+    id: project-version
+    attributes:
+      label: Arduino IDE version
+      description: |
+        Which version of the Arduino IDE are you using?
+        See **Help > About Arduino IDE** in the Arduino IDE menus (**Arduino IDE > About Arduino IDE** on macOS).
+        This should be the latest [nightly build](https://github.com/arduino/arduino-ide#nightly-builds).
+    validations:
+      required: true
+  - type: dropdown
+    id: os
+    attributes:
+      label: Operating system
+      description: Which operating system(s) are you using on your computer?
+      multiple: true
+      options:
+        - Windows
+        - Linux
+        - macOS
+        - N/A
+    validations:
+      required: true
+  - type: input
+    id: os-version
+    attributes:
+      label: Operating system version
+      description: Which version of the operating system are you using on your computer?
+    validations:
+      required: true
+  - type: textarea
+    id: additional
+    attributes:
+      label: Additional context
+      description: Add any additional information here.
+    validations:
+      required: false
+  - type: checkboxes
+    id: checklist
+    attributes:
+      label: Issue checklist
+      description: Please double-check that you have done each of the following things before submitting the issue.
+      options:
+        - label: I searched for previous reports in [the issue tracker](https://github.com/arduino/arduino-ide/issues?q=)
+          required: true
+        - label: I verified the problem still occurs when using the latest [nightly build](https://github.com/arduino/arduino-ide#nightly-builds)
+          required: true
+        - label: My report contains all necessary details
+          required: true

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,32 +0,0 @@
----
-name: Bug report
-about: Create a report to help us improve
-title: ''
-labels: 'type: imperfection'
-assignees: ''
-
----
-
-**Describe the bug**
-A clear and concise description of what the bug is.
-
-**To Reproduce**
-Steps to reproduce the behavior:
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
-
-**Expected behavior**
-A clear and concise description of what you expected to happen.
-
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
-
-**Desktop (please complete the following information):**
- - OS: [e.g. Windows]
- - Version: [e.g. 2.0.0]
-
-
-**Additional context**
-Add any other context about the problem here.

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,13 @@
+# Source:
+# https://github.com/arduino/tooling-project-assets/blob/main/issue-templates/template-choosers/general/config.yml
+blank_issues_enabled: false
+contact_links:
+  - name: Learn about using this project
+    url: https://github.com/arduino/arduino-ide#readme
+    about: Detailed usage documentation is available here.
+  - name: Support request
+    url: https://forum.arduino.cc/
+    about: We can help you out on the Arduino Forum!
+  - name: Discuss development work on the project
+    url: https://groups.google.com/a/arduino.cc/g/developers
+    about: Arduino Developers Mailing List

.github/ISSUE_TEMPLATE/feature-request.yml

@@ -0,0 +1,69 @@
+name: Feature request
+description: Suggest an enhancement to this project.
+labels:
+  - "type: enhancement"
+body:
+  - type: textarea
+    id: description
+    attributes:
+      label: Describe the request
+    validations:
+      required: true
+  - type: textarea
+    id: current
+    attributes:
+      label: Describe the current behavior
+      description: |
+        What is the current behavior of the Arduino IDE in relation to your request?
+        How can we reproduce that behavior?
+    validations:
+      required: true
+  - type: input
+    id: project-version
+    attributes:
+      label: Arduino IDE version
+      description: |
+        Which version of the Arduino IDE are you using?
+        See **Help > About Arduino IDE** in the Arduino IDE menus (**Arduino IDE > About Arduino IDE** on macOS).
+        This should be the latest [nightly build](https://github.com/arduino/arduino-ide#nightly-builds).
+    validations:
+      required: true
+  - type: dropdown
+    id: os
+    attributes:
+      label: Operating system
+      description: Which operating system(s) are you using on your computer?
+      multiple: true
+      options:
+        - Windows
+        - Linux
+        - macOS
+        - N/A
+    validations:
+      required: true
+  - type: input
+    id: os-version
+    attributes:
+      label: Operating system version
+      description: Which version of the operating system are you using on your computer?
+    validations:
+      required: true
+  - type: textarea
+    id: additional
+    attributes:
+      label: Additional context
+      description: Add any additional information here.
+    validations:
+      required: false
+  - type: checkboxes
+    id: checklist
+    attributes:
+      label: Issue checklist
+      description: Please double-check that you have done each of the following things before submitting the issue.
+      options:
+        - label: I searched for previous requests in [the issue tracker](https://github.com/arduino/arduino-ide/issues?q=)
+          required: true
+        - label: I verified the feature was still missing when using the latest [nightly build](https://github.com/arduino/arduino-ide#nightly-builds)
+          required: true
+        - label: My request contains all necessary details
+          required: true

.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,20 +0,0 @@
----
-name: Feature request
-about: Suggest an idea for this project
-title: ''
-labels: 'type: enhancement'
-assignees: ''
-
----
-
-**Is your feature request related to a problem? Please describe.**
-A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
-
-**Describe the solution you'd like**
-A clear and concise description of what you want to happen.
-
-**Describe alternatives you've considered**
-A clear and concise description of any alternative solutions or features you've considered.
-
-**Additional context**
-Add any other context or screenshots about the feature request here.

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,15 @@
+### Motivation
+<!-- Why this pull request? -->
+
+### Change description
+<!-- What does your code do? -->
+
+### Other information
+<!-- Any additional information that could help the review process -->
+
+### Reviewer checklist
+
+* [ ] PR addresses a single concern.
+* [ ] The PR has no duplicates (please search among the [Pull Requests](https://github.com/arduino/arduino-ide/pulls) before creating one)
+* [ ] PR title and description are properly filled.
+* [ ] Docs have been added / updated (for bug fixes / features)

.github/workflows/build.yml

@@ -4,12 +4,26 @@ on:
   push:
     branches:
       - main
+    paths-ignore:
+      - '.github/**'
+      - '!.github/workflows/build.yml'
+      - '.vscode/**'
+      - 'docs/**'
+      - 'scripts/**'
+      - 'static/**'
+      - '*.md'
     tags:
       - '[0-9]+.[0-9]+.[0-9]+*'
   workflow_dispatch:
   pull_request:
-    branches:
-      - main
+    paths-ignore:
+      - '.github/**'
+      - '!.github/workflows/build.yml'
+      - '.vscode/**'
+      - 'docs/**'
+      - 'scripts/**'
+      - 'static/**'
+      - '*.md'
   schedule:
     - cron: '0 3 * * *' # run every day at 3AM (https://docs.github.com/en/actions/reference/events-that-trigger-workflows#scheduled-events-schedule)
 
@@ -19,13 +33,21 @@ env:
 
 jobs:
   build:
-    if: github.repository == 'arduino/arduino-ide'
+    name: build (${{ matrix.config.os }})
     strategy:
       matrix:
         config:
-          - os: windows-latest
+          - os: windows-2019
+            certificate-secret: WINDOWS_SIGNING_CERTIFICATE_PFX # Name of the secret that contains the certificate.
+            certificate-password-secret: WINDOWS_SIGNING_CERTIFICATE_PASSWORD # Name of the secret that contains the certificate password.
+            certificate-extension: pfx  # File extension for the certificate.
           - os: ubuntu-18.04 # https://github.com/arduino/arduino-ide/issues/259
           - os: macos-latest
+            # APPLE_SIGNING_CERTIFICATE_P12 secret was produced by following the procedure from:
+            # https://www.kencochrane.com/2020/08/01/build-and-sign-golang-binaries-for-macos-with-github-actions/#exporting-the-developer-certificate
+            certificate-secret: APPLE_SIGNING_CERTIFICATE_P12
+            certificate-password-secret: KEYCHAIN_PASSWORD
+            certificate-extension: p12
     runs-on: ${{ matrix.config.os }}
     timeout-minutes: 90
 
@@ -33,16 +55,16 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v2
 
-      - name: Install Node.js 12.x
+      - name: Install Node.js 14.x
         uses: actions/setup-node@v1
         with:
-          node-version: '12.14.1'
+          node-version: '14.x'
           registry-url: 'https://registry.npmjs.org'
 
-      - name: Install Python 2.7
+      - name: Install Python 3.x
         uses: actions/setup-python@v2
         with:
-          python-version: '2.7'
+          python-version: '3.x'
 
       - name: Package
         shell: bash
@@ -50,33 +72,26 @@ jobs:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
           AC_USERNAME: ${{ secrets.AC_USERNAME }}
           AC_PASSWORD: ${{ secrets.AC_PASSWORD }}
+          AC_TEAM_ID: ${{ secrets.AC_TEAM_ID }}
           AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
           AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
           IS_NIGHTLY: ${{ github.event_name == 'schedule' || (github.event_name == 'workflow_dispatch' && github.ref == 'refs/heads/main') }}
           IS_RELEASE: ${{ startsWith(github.ref, 'refs/tags/') }}
-          IS_FORK: ${{ github.event.pull_request.head.repo.fork == true }}
+          CAN_SIGN: ${{ secrets[matrix.config.certificate-secret] != '' }}
         run: |
           # See: https://www.electron.build/code-signing
-          if [ $IS_FORK = true ]; then
-            echo "Skipping the app signing: building from a fork."
+          if [ $CAN_SIGN = false ]; then
+            echo "Skipping the app signing: certificate not provided."
           else
-            if [ "${{ runner.OS }}" = "macOS" ]; then
-              export CSC_LINK="${{ runner.temp }}/signing_certificate.p12"
-              # APPLE_SIGNING_CERTIFICATE_P12 secret was produced by following the procedure from:
-              # https://www.kencochrane.com/2020/08/01/build-and-sign-golang-binaries-for-macos-with-github-actions/#exporting-the-developer-certificate
-              echo "${{ secrets.APPLE_SIGNING_CERTIFICATE_P12 }}" | base64 --decode > "$CSC_LINK"
-
-              export CSC_KEY_PASSWORD="${{ secrets.KEYCHAIN_PASSWORD }}"
-
-            elif [ "${{ runner.OS }}" = "Windows" ]; then
-              export CSC_LINK="${{ runner.temp }}/signing_certificate.pfx"
-              npm config set msvs_version 2017 --global
-              echo "${{ secrets.WINDOWS_SIGNING_CERTIFICATE_PFX }}" | base64 --decode > "$CSC_LINK"
-
-              export CSC_KEY_PASSWORD="${{ secrets.WINDOWS_SIGNING_CERTIFICATE_PASSWORD }}"
-            fi
+            export CSC_LINK="${{ runner.temp }}/signing_certificate.${{ matrix.config.certificate-extension }}"
+            echo "${{ secrets[matrix.config.certificate-secret] }}" | base64 --decode > "$CSC_LINK"
+            export CSC_KEY_PASSWORD="${{ secrets[matrix.config.certificate-password-secret] }}"
           fi
 
+          if [ "${{ runner.OS }}" = "Windows" ]; then
+            npm config set msvs_version 2017 --global
+          fi
+          npx node-gyp install
           yarn --cwd ./electron/packager/
           yarn --cwd ./electron/packager/ package
 
@@ -96,9 +111,13 @@ jobs:
       matrix:
         artifact:
           - path: '*Linux_64bit.zip'
-            name: Linux_X86-64
+            name: Linux_X86-64_zip
+          - path: '*Linux_64bit.AppImage'
+            name: Linux_X86-64_app_image
           - path: '*macOS_64bit.dmg'
-            name: macOS
+            name: macOS_dmg
+          - path: '*macOS_64bit.zip'
+            name: macOS_zip
           - path: '*Windows_64bit.exe'
             name: Windows_X86-64_interactive_installer
           - path: '*Windows_64bit.msi'
@@ -184,7 +203,7 @@ jobs:
 
   release:
     needs: changelog
-    if: github.repository == 'arduino/arduino-ide' && startsWith(github.ref, 'refs/tags/')
+    if: startsWith(github.ref, 'refs/tags/')
     runs-on: ubuntu-latest
     steps:
       - name: Download [GitHub Actions]
@@ -209,6 +228,7 @@ jobs:
           body: ${{ needs.changelog.outputs.BODY }}
 
       - name: Publish Release [S3]
+        if: github.repository == 'arduino/arduino-ide'
         uses: docker://plugins/s3
         env:
           PLUGIN_SOURCE: '${{ env.JOB_TRANSFER_ARTIFACT }}/*'

.github/workflows/check-i18n-task.yml

@@ -25,10 +25,10 @@ jobs:
       - name: Checkout repository
         uses: actions/checkout@v2
 
-      - name: Install Node.js 12.x
+      - name: Install Node.js 14.x
         uses: actions/setup-node@v2
         with:
-          node-version: '12.14.1'
+          node-version: '14.x'
           registry-url: 'https://registry.npmjs.org'
 
       - name: Install dependencies

.github/workflows/compose-full-changelog.yaml

@@ -2,10 +2,13 @@ name: Compose full changelog
 
 on:
   release:
-    types: [created, edited]
+    types:
+      - edited
 
 env:
   CHANGELOG_ARTIFACTS: changelog
+  # See: https://github.com/actions/setup-node/#readme
+  NODE_VERSION: 14.x
 
 jobs:
   create-changelog:
@@ -15,6 +18,12 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v2
 
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          registry-url: 'https://registry.npmjs.org'
+
       - name: Get Tag
         id: tag_name
         run: |
@@ -23,10 +32,11 @@ jobs:
       - name: Create full changelog
         id: full-changelog
         run: |
+          yarn add @octokit/rest --ignore-workspace-root-check
           mkdir "${{ github.workspace }}/${{ env.CHANGELOG_ARTIFACTS }}"
 
           # Get the changelog file name to build
-          CHANGELOG_FILE_NAME="${{ steps.tag_name.outputs.TAG_NAME }}-$(date --iso-8601=s).md"
+          CHANGELOG_FILE_NAME="${{ steps.tag_name.outputs.TAG_NAME }}-$(date +%s).md"
 
           # Create manifest file pointing to latest changelog file name
           echo "$CHANGELOG_FILE_NAME" >> "${{ github.workspace }}/${{ env.CHANGELOG_ARTIFACTS }}/latest.txt"

.github/workflows/i18n-nightly-push.yml

@@ -12,10 +12,10 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v2
 
-      - name: Install Node.js 12.x
+      - name: Install Node.js 14.x
         uses: actions/setup-node@v2
         with:
-          node-version: '12.14.1'
+          node-version: '14.x'
           registry-url: 'https://registry.npmjs.org'
 
       - name: Install dependencies

.github/workflows/i18n-weekly-pull.yml

@@ -12,10 +12,10 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v2
 
-      - name: Install Node.js 12.x
+      - name: Install Node.js 14.x
         uses: actions/setup-node@v2
         with:
-          node-version: '12.14.1'
+          node-version: '14.x'
           registry-url: 'https://registry.npmjs.org'
 
       - name: Install dependencies

.github/workflows/themes-weekly-pull.yml

@@ -0,0 +1,49 @@
+name: themes-weekly-pull
+
+on:
+  schedule:
+    # run every friday at 5AM
+    - cron: '0 5 * * 5'
+  workflow_dispatch:
+
+env:
+  NODE_VERSION: 14.x
+
+jobs:
+  pull-from-jsonbin:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Install Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          registry-url: 'https://registry.npmjs.org'
+
+      - name: Install dependencies
+        run: yarn
+
+      - name: Run themes:pull script
+        run: yarn run themes:pull
+        env:
+          JSONBIN_MASTER_KEY: ${{ secrets.JSONBIN_MASTER_KEY }}
+          JSONBIN_ID: ${{ secrets.JSONBIN_ID }}
+
+      - name: Generate dark tokens
+        run: npx token-transformer scripts/themes/tokens/arduino-tokens.json scripts/themes/tokens/dark.json core,ide-default,ide-dark,theia core,ide-default,ide-dark
+
+      - name: Generate default tokens
+        run: npx token-transformer scripts/themes/tokens/arduino-tokens.json scripts/themes/tokens/default.json core,ide-default,theia core,ide-default
+
+      - name: Run themes:generate script
+        run: yarn run themes:generate
+
+      - name: Create Pull Request
+        uses: peter-evans/create-pull-request@v4
+        with:
+          commit-message: Updated themes
+          title: Update themes
+          branch: themes/themes-update
+          author: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

.gitignore

@@ -17,3 +17,9 @@ yarn*.log
 plugins
 # the config files for the CLI
 arduino-ide-extension/data/cli/config
+# the tokens folder for the themes
+scripts/themes/tokens
+# environment variables
+.env
+# content trace files for electron
+electron-app/traces

.prettierrc

@@ -2,5 +2,6 @@
 	"singleQuote": true,
 	"tabWidth": 2,
 	"useTabs": false,
-	"printWidth": 80
+	"printWidth": 80,
+	"endOfLine": "auto"
 }

.vscode/launch.json

@@ -1,6 +1,43 @@
 {
   "version": "0.2.0",
   "configurations": [
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "App (Electron) [Dev]",
+      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron",
+      "windows": {
+        "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd",
+      },
+      "cwd": "${workspaceFolder}/electron-app",
+      "args": [
+        ".",
+        "--log-level=debug",
+        "--hostname=localhost",
+        "--no-cluster",
+        "--app-project-path=${workspaceRoot}/electron-app",
+        "--remote-debugging-port=9222",
+        "--no-app-auto-install",
+        "--plugins=local-dir:../plugins",
+        "--hosted-plugin-inspect=9339",
+        "--content-trace",
+        "--open-devtools"
+      ],
+      "env": {
+        "NODE_ENV": "development"
+      },
+      "sourceMaps": true,
+      "outFiles": [
+        "${workspaceRoot}/electron-app/src-gen/backend/*.js",
+        "${workspaceRoot}/electron-app/src-gen/frontend/*.js",
+        "${workspaceRoot}/electron-app/lib/**/*.js",
+        "${workspaceRoot}/arduino-ide-extension/lib/**/*.js",
+        "${workspaceRoot}/node_modules/@theia/**/*.js"
+      ],
+      "smartStep": true,
+      "internalConsoleOptions": "openOnSessionStart",
+      "outputCapture": "std"
+    },
     {
       "type": "node",
       "request": "launch",
@@ -10,7 +47,6 @@
         "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/electron.cmd",
       },
       "cwd": "${workspaceFolder}/electron-app",
-      "protocol": "inspector",
       "args": [
         ".",
         "--log-level=debug",
@@ -37,6 +73,13 @@
       "internalConsoleOptions": "openOnSessionStart",
       "outputCapture": "std"
     },
+    {
+      "type": "chrome",
+      "request": "attach",
+      "name": "Attach to Electron Frontend",
+      "port": 9222,
+      "webRoot": "${workspaceFolder}/electron-app"
+    },
     {
       "type": "node",
       "request": "launch",
@@ -71,7 +114,6 @@
     {
       "type": "node",
       "request": "launch",
-      "protocol": "inspector",
       "name": "Run Test [current]",
       "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
       "args": [
@@ -104,5 +146,14 @@
       "program": "${workspaceRoot}/electron/packager/index.js",
       "cwd": "${workspaceFolder}/electron/packager"
     }
+  ],
+  "compounds": [
+    {
+      "name": "Launch Electron Backend & Frontend",
+      "configurations": [
+        "App (Electron)",
+        "Attach to Electron Frontend"
+      ]
+    }
   ]
 }

BUILDING.md

@@ -41,7 +41,8 @@ The _frontend_ is running as an Electron renderer process and can invoke service
 
 If you’re familiar with TypeScript, the [Theia IDE](https://theia-ide.org/), and if you want to contribute to the
 project, you should be able to build the Arduino IDE locally.
-Please refer to the [Theia IDE prerequisites](https://github.com/theia-ide/theia/blob/master/doc/) documentation for the setup instructions.
+Please refer to the [Theia IDE prerequisites](https://github.com/eclipse-theia/theia/blob/master/doc/Developing.md#prerequisites) documentation for the setup instructions.
+> **Note**: Node.js 14 must be used instead of the version 12 recommended at the link above.
 
 Once you have all the tools installed, you can build the editor following these steps
 
@@ -57,9 +58,7 @@ Once you have all the tools installed, you can build the editor following these
 
 3. Rebuild the electron dependencies
     ```sh
-    cd electron-app
-    yarn theia rebuild:electron
-    cd ..
+    yarn rebuild:electron
     ```
 
 4. Start the application
@@ -67,6 +66,13 @@ Once you have all the tools installed, you can build the editor following these
     yarn start
     ```
 
+### Notes for Windows contributors
+Windows requires the Microsoft Visual C++ (MSVC) compiler toolset to be installed on your development machine.
+
+In case it's not already present, it can be downloaded from the "**Tools for Visual Studio 20XX**" section of the Visual Studio [downloads page](https://visualstudio.microsoft.com/downloads/#build-tools-for-visual-studio-2022) via the "**Build Tools for Visual Studio 20XX**" (e.g., "**Build Tools for Visual Studio 2022**") download link.
+
+Select "**Desktop development with C++**" from the "**Workloads**" tab during the installation procedure.
+
 ### CI
 
 This project is built on [GitHub Actions](https://github.com/arduino/arduino-ide/actions).

README.md

@@ -23,13 +23,14 @@ should be considered unstable:
 
 | Platform  | 32 bit                   | 64 bit                                                                                                 |
 | --------- | ------------------------ | ------------------------------------------------------------------------------------------------------ |
-| Linux     |                          | [Nightly Linux 64 bit]                                                                                 |
+| Linux     |                          | [Nightly Linux AppImage 64 bit]<br />[Nightly Linux ZIP file 64 bit]                                   |
 | Linux ARM | [🚧 Work in progress...] | [🚧 Work in progress...]                                                                               |
 | Windows   |                          | [Nightly Windows 64 bit installer]<br />[Nightly Windows 64 bit MSI]<br />[Nightly Windows 64 bit ZIP] |
 | macOS     |                          | [Nightly macOS 64 bit]                                                                                 |
 
 [🚧 work in progress...]: https://github.com/arduino/arduino-ide/issues/107
-[nightly linux 64 bit]: https://downloads.arduino.cc/arduino-ide/nightly/arduino-ide_nightly-latest_Linux_64bit.zip
+[nightly linux appimage 64 bit]: https://downloads.arduino.cc/arduino-ide/nightly/arduino-ide_nightly-latest_Linux_64bit.AppImage
+[nightly linux zip file 64 bit]: https://downloads.arduino.cc/arduino-ide/nightly/arduino-ide_nightly-latest_Linux_64bit.zip
 [nightly windows 64 bit installer]: https://downloads.arduino.cc/arduino-ide/nightly/arduino-ide_nightly-latest_Windows_64bit.exe
 [nightly windows 64 bit msi]: https://downloads.arduino.cc/arduino-ide/nightly/arduino-ide_nightly-latest_Windows_64bit.msi
 [nightly windows 64 bit zip]: https://downloads.arduino.cc/arduino-ide/nightly/arduino-ide_nightly-latest_Windows_64bit.zip

arduino-ide-extension/package.json

@@ -1,15 +1,15 @@
 {
   "name": "arduino-ide-extension",
-  "version": "2.0.0-rc3",
+  "version": "2.0.0-rc9.2",
   "description": "An extension for Theia building the Arduino IDE",
   "license": "AGPL-3.0-or-later",
   "scripts": {
-    "prepare": "yarn download-cli && yarn download-fwuploader && yarn download-ls && yarn copy-serial-plotter && yarn clean && yarn download-examples && yarn build && yarn test",
+    "prepare": "yarn download-cli && yarn download-fwuploader && yarn download-ls && yarn copy-i18n && yarn clean && yarn download-examples && yarn build && yarn test",
     "clean": "rimraf lib",
     "compose-changelog": "node ./scripts/compose-changelog.js",
     "download-cli": "node ./scripts/download-cli.js",
     "download-fwuploader": "node ./scripts/download-fwuploader.js",
-    "copy-serial-plotter": "npx ncp ../node_modules/arduino-serial-plotter-webapp ./build/arduino-serial-plotter-webapp",
+    "copy-i18n": "npx ncp ../i18n ./build/i18n",
     "download-ls": "node ./scripts/download-ls.js",
     "download-examples": "node ./scripts/download-examples.js",
     "generate-protocol": "node ./scripts/generate-protocol.js",
@@ -20,30 +20,30 @@
     "test:watch": "mocha --watch --watch-files lib \"./lib/test/**/*.test.js\""
   },
   "dependencies": {
-    "@grpc/grpc-js": "^1.3.7",
-    "@theia/application-package": "1.19.0",
-    "@theia/core": "1.19.0",
-    "@theia/editor": "1.19.0",
-    "@theia/editor-preview": "1.19.0",
-    "@theia/filesystem": "1.19.0",
-    "@theia/git": "1.19.0",
-    "@theia/keymaps": "1.19.0",
-    "@theia/markers": "1.19.0",
-    "@theia/monaco": "1.19.0",
-    "@theia/navigator": "1.19.0",
-    "@theia/outline-view": "1.19.0",
-    "@theia/output": "1.19.0",
-    "@theia/preferences": "1.19.0",
-    "@theia/search-in-workspace": "1.19.0",
-    "@theia/terminal": "1.19.0",
-    "@theia/workspace": "1.19.0",
+    "@grpc/grpc-js": "^1.6.7",
+    "@theia/application-package": "1.25.0",
+    "@theia/core": "1.25.0",
+    "@theia/editor": "1.25.0",
+    "@theia/electron": "1.25.0",
+    "@theia/filesystem": "1.25.0",
+    "@theia/keymaps": "1.25.0",
+    "@theia/markers": "1.25.0",
+    "@theia/monaco": "1.25.0",
+    "@theia/navigator": "1.25.0",
+    "@theia/outline-view": "1.25.0",
+    "@theia/output": "1.25.0",
+    "@theia/preferences": "1.25.0",
+    "@theia/search-in-workspace": "1.25.0",
+    "@theia/terminal": "1.25.0",
+    "@theia/workspace": "1.25.0",
     "@tippyjs/react": "^4.2.5",
     "@types/atob": "^2.1.2",
     "@types/auth0-js": "^9.14.0",
     "@types/btoa": "^1.2.3",
     "@types/dateformat": "^3.0.1",
+    "@types/deep-equal": "^1.0.1",
     "@types/deepmerge": "^2.2.0",
-    "@types/glob": "^5.0.35",
+    "@types/glob": "^7.2.0",
     "@types/google-protobuf": "^3.7.2",
     "@types/js-yaml": "^3.12.2",
     "@types/keytar": "^4.4.0",
@@ -56,18 +56,19 @@
     "@types/temp": "^0.8.34",
     "@types/which": "^1.3.1",
     "ajv": "^6.5.3",
-    "arduino-serial-plotter-webapp": "0.0.17",
+    "arduino-serial-plotter-webapp": "0.1.0",
     "async-mutex": "^0.3.0",
     "atob": "^2.1.2",
     "auth0-js": "^9.14.0",
     "btoa": "^1.2.1",
-    "css-element-queries": "^1.2.0",
+    "classnames": "^2.3.1",
     "dateformat": "^3.0.3",
+    "deep-equal": "^2.0.5",
     "deepmerge": "2.0.1",
-    "fuzzy": "^0.1.3",
+    "electron-updater": "^4.6.5",
+    "fast-safe-stringify": "^2.1.1",
     "glob": "^7.1.6",
-    "google-protobuf": "^3.11.4",
-    "grpc": "^1.24.11",
+    "google-protobuf": "^3.20.1",
     "hash.js": "^1.1.7",
     "is-valid-path": "^0.1.1",
     "js-yaml": "^3.13.1",
@@ -81,12 +82,14 @@
     "ps-tree": "^1.2.0",
     "query-string": "^7.0.1",
     "react-disable": "^0.1.0",
+    "react-markdown": "^8.0.0",
     "react-select": "^3.0.4",
     "react-tabs": "^3.1.2",
     "react-window": "^1.8.6",
     "semver": "^7.3.2",
     "string-natural-compare": "^2.0.3",
     "temp": "^0.9.1",
+    "temp-dir": "^2.0.0",
     "tree-kill": "^1.2.1",
     "upath": "^1.1.2",
     "url": "^0.11.0",
@@ -147,22 +150,26 @@
       "frontend": "lib/browser/theia/core/browser-menu-module",
       "frontendElectron": "lib/electron-browser/theia/core/electron-menu-module"
     },
+    {
+      "frontend": "lib/browser/theia/core/browser-window-module",
+      "frontendElectron": "lib/electron-browser/theia/core/electron-window-module"
+    },
     {
       "electronMain": "lib/electron-main/arduino-electron-main-module"
     }
   ],
   "arduino": {
     "cli": {
-      "version": "0.20.2"
+      "version": "0.26.0-rc.1"
     },
     "fwuploader": {
-      "version": "2.0.0"
+      "version": "2.2.0"
     },
     "clangd": {
-      "version": "13.0.0"
+      "version": "14.0.0"
     },
     "languageServer": {
-      "version": "0.6.0"
+      "version": "0.7.1"
     }
   }
 }

arduino-ide-extension/scripts/compose-changelog.js

@@ -1,36 +1,42 @@
 // @ts-check
 
-
 (async () => {
   const { Octokit } = require('@octokit/rest');
-  const fs = require("fs");
-  const path = require("path");
+  const fs = require('fs');
+  const path = require('path');
 
   const octokit = new Octokit({
     userAgent: 'Arduino IDE compose-changelog.js',
   });
 
-  const response = await octokit.rest.repos.listReleases({
-    owner: 'arduino',
-    repo: 'arduino-ide',
-  }).catch(err => {
-    console.error(err);
-    process.exit(1);
-  })
+  const response = await octokit.rest.repos
+    .listReleases({
+      owner: 'arduino',
+      repo: 'arduino-ide',
+    })
+    .catch((err) => {
+      console.error(err);
+      process.exit(1);
+    });
 
   const releases = response.data;
 
-  let fullChangelog = releases.reduce((acc, item) => {
+  let fullChangelog = releases.reduce((acc, item, index) => {
     // Process each line separately
-    const body = item.body.split('\n').map(processLine).join('\n')
+    const body = item.body.split('\n').map(processLine).join('\n');
     // item.name is the name of the release changelog
-    return acc + `# ${item.name}\n\n${body}\n\n---\n\n`;
+    return (
+      acc +
+      `## ${item.name}\n\n${body}${
+        index !== releases.length - 1 ? '\n\n---\n\n' : '\n'
+      }`
+    );
   }, '');
 
-  const args = process.argv.slice(2)
+  const args = process.argv.slice(2);
   if (args.length == 0) {
-    console.error("Missing argument to destination file")
-    process.exit(1)
+    console.error('Missing argument to destination file');
+    process.exit(1);
   }
   const changelogFile = path.resolve(args[0]);
 
@@ -38,19 +44,18 @@
     changelogFile,
     fullChangelog,
     {
-      flag: "w+",
+      flag: 'w+',
     },
-    err => {
+    (err) => {
       if (err) {
         console.error(err);
         process.exit(1);
       }
-      console.log("Changelog written to", changelogFile);
+      console.log('Changelog written to', changelogFile);
     }
-  )
+  );
 })();
 
-
 // processLine applies different substitutions to line string.
 // We're assuming that there are no more than one substitution
 // per line to be applied.
@@ -61,7 +66,8 @@ const processLine = (line) => {
   // * [#123](https://github.com/arduino/arduino-ide/pull/123/)
   // * [#123](https://github.com/arduino/arduino-ide/issues/123/)
   // If it does return the line as is.
-  let r = /(\(|\[)#\d+(\)|\])(\(|\[)https:\/\/github\.com\/arduino\/arduino-ide\/(pull|issues)\/(\d+)\/?(\)|\])/gm;
+  let r =
+    /(\(|\[)#\d+(\)|\])(\(|\[)https:\/\/github\.com\/arduino\/arduino-ide\/(pull|issues)\/(\d+)\/?(\)|\])/gm;
   if (r.test(line)) {
     return line;
   }
@@ -70,9 +76,12 @@ const processLine = (line) => {
   // * #123
   // If it does it's changed to:
   // * [#123](https://github.com/arduino/arduino-ide/pull/123)
-  r = /#(\d+)/gm;
+  r = /(?<![\w\d\/_]{1})#((\d)+)(?![\w\d\/_]{1})/gm;
   if (r.test(line)) {
-    return line.replace(r, `[#$1](https://github.com/arduino/arduino-ide/pull/$1)`)
+    return line.replace(
+      r,
+      `[#$1](https://github.com/arduino/arduino-ide/pull/$1)`
+    );
   }
 
   // Check if a link with one of the following format exists:
@@ -85,7 +94,8 @@ const processLine = (line) => {
   // * [#123](https://github.com/arduino/arduino-ide/issues/123)
   // * [#123](https://github.com/arduino/arduino-ide/pull/123/)
   // * [#123](https://github.com/arduino/arduino-ide/issues/123/)
-  r = /(https:\/\/github\.com\/arduino\/arduino-ide\/(pull|issues)\/(\d+)\/?)/gm;
+  r =
+    /(https:\/\/github\.com\/arduino\/arduino-ide\/(pull|issues)\/(\d+)\/?)/gm;
   if (r.test(line)) {
     return line.replace(r, `[#$3]($1)`);
   }
@@ -95,11 +105,12 @@ const processLine = (line) => {
   // * https://github.com/arduino/arduino-ide/compare/2.0.0-rc2...2.0.0-rc3/
   // If it does it's changed to:
   // * [`2.0.0-rc2...2.0.0-rc3`](https://github.com/arduino/arduino-ide/compare/2.0.0-rc2...2.0.0-rc3)
-  r = /(https:\/\/github\.com\/arduino\/arduino-ide\/compare\/([^\/]*))\/?\s?/gm;
+  r =
+    /(https:\/\/github\.com\/arduino\/arduino-ide\/compare\/([^\/]*))\/?\s?/gm;
   if (r.test(line)) {
-    return line.replace(r, '[`$2`]($1)');;
+    return line.replace(r, '[`$2`]($1)');
   }
 
   // If nothing matches just return the line as is
   return line;
-}
+};

arduino-ide-extension/scripts/download-cli.js

@@ -1,141 +1,87 @@
 // @ts-check
 
 (async () => {
+  const path = require('path');
+  const shell = require('shelljs');
+  const semver = require('semver');
+  const moment = require('moment');
+  const downloader = require('./downloader');
+  const { goBuildFromGit } = require('./utils');
 
-    const fs = require('fs');
-    const path = require('path');
-    const temp = require('temp');
-    const shell = require('shelljs');
-    const semver = require('semver');
-    const moment = require('moment');
-    const downloader = require('./downloader');
+  const version = (() => {
+    const pkg = require(path.join(__dirname, '..', 'package.json'));
+    if (!pkg) {
+      return undefined;
+    }
 
-    const version = (() => {
-        const pkg = require(path.join(__dirname, '..', 'package.json'));
-        if (!pkg) {
-            return undefined;
+    const { arduino } = pkg;
+    if (!arduino) {
+      return undefined;
+    }
+
+    const { cli } = arduino;
+    if (!cli) {
+      return undefined;
+    }
+
+    const { version } = cli;
+    return version;
+  })();
+
+  if (!version) {
+    shell.echo(`Could not retrieve CLI version info from the 'package.json'.`);
+    shell.exit(1);
+  }
+
+  const { platform, arch } = process;
+  const buildFolder = path.join(__dirname, '..', 'build');
+  const cliName = `arduino-cli${platform === 'win32' ? '.exe' : ''}`;
+  const destinationPath = path.join(buildFolder, cliName);
+
+  if (typeof version === 'string') {
+    const suffix = (() => {
+      switch (platform) {
+        case 'darwin':
+          return 'macOS_64bit.tar.gz';
+        case 'win32':
+          return 'Windows_64bit.zip';
+        case 'linux': {
+          switch (arch) {
+            case 'arm':
+              return 'Linux_ARMv7.tar.gz';
+            case 'arm64':
+              return 'Linux_ARM64.tar.gz';
+            case 'x64':
+              return 'Linux_64bit.tar.gz';
+            default:
+              return undefined;
+          }
         }
-
-        const { arduino } = pkg;
-        if (!arduino) {
-            return undefined;
-        }
-
-        const { cli } = arduino;
-        if (!cli) {
-            return undefined;
-        }
-
-        const { version } = cli;
-        return version;
+        default:
+          return undefined;
+      }
     })();
-
-    if (!version) {
-        shell.echo(`Could not retrieve CLI version info from the 'package.json'.`);
-        shell.exit(1);
+    if (!suffix) {
+      shell.echo(`The CLI is not available for ${platform} ${arch}.`);
+      shell.exit(1);
     }
-
-    const { platform, arch } = process;
-    const buildFolder = path.join(__dirname, '..', 'build');
-    const cliName = `arduino-cli${platform === 'win32' ? '.exe' : ''}`;
-    const destinationPath = path.join(buildFolder, cliName);
-
-    if (typeof version === 'string') {
-        const suffix = (() => {
-            switch (platform) {
-                case 'darwin': return 'macOS_64bit.tar.gz';
-                case 'win32': return 'Windows_64bit.zip';
-                case 'linux': {
-                    switch (arch) {
-                        case 'arm': return 'Linux_ARMv7.tar.gz';
-                        case 'arm64': return 'Linux_ARM64.tar.gz';
-                        case 'x64': return 'Linux_64bit.tar.gz';
-                        default: return undefined;
-                    }
-                }
-                default: return undefined;
-            }
-        })();
-        if (!suffix) {
-            shell.echo(`The CLI is not available for ${platform} ${arch}.`);
-            shell.exit(1);
-        }
-        if (semver.valid(version)) {
-            const url = `https://downloads.arduino.cc/arduino-cli/arduino-cli_${version}_${suffix}`;
-            shell.echo(`📦  Identified released version of the CLI. Downloading version ${version} from '${url}'`);
-            await downloader.downloadUnzipFile(url, destinationPath, 'arduino-cli');
-        } else if (moment(version, 'YYYYMMDD', true).isValid()) {
-            const url = `https://downloads.arduino.cc/arduino-cli/nightly/arduino-cli_nightly-${version}_${suffix}`;
-            shell.echo(`🌙  Identified nightly version of the CLI. Downloading version ${version} from '${url}'`);
-            await downloader.downloadUnzipFile(url, destinationPath, 'arduino-cli');
-        } else {
-            shell.echo(`🔥  Could not interpret 'version': ${version}`);
-            shell.exit(1);
-        }
+    if (semver.valid(version)) {
+      const url = `https://downloads.arduino.cc/arduino-cli/arduino-cli_${version}_${suffix}`;
+      shell.echo(
+        `📦  Identified released version of the CLI. Downloading version ${version} from '${url}'`
+      );
+      await downloader.downloadUnzipFile(url, destinationPath, 'arduino-cli');
+    } else if (moment(version, 'YYYYMMDD', true).isValid()) {
+      const url = `https://downloads.arduino.cc/arduino-cli/nightly/arduino-cli_nightly-${version}_${suffix}`;
+      shell.echo(
+        `🌙  Identified nightly version of the CLI. Downloading version ${version} from '${url}'`
+      );
+      await downloader.downloadUnzipFile(url, destinationPath, 'arduino-cli');
     } else {
-
-        // We assume an object with `owner`, `repo`, commitish?` properties.
-        const { owner, repo, commitish } = version;
-        if (!owner) {
-            shell.echo(`Could not retrieve 'owner' from ${JSON.stringify(version)}`);
-            shell.exit(1);
-        }
-        if (!repo) {
-            shell.echo(`Could not retrieve 'repo' from ${JSON.stringify(version)}`);
-            shell.exit(1);
-        }
-        const url = `https://github.com/${owner}/${repo}.git`;
-        shell.echo(`Building CLI from ${url}. Commitish: ${commitish ? commitish : 'HEAD'}`);
-
-        if (fs.existsSync(destinationPath)) {
-            shell.echo(`Skipping the CLI build because it already exists: ${destinationPath}`);
-            return;
-        }
-
-        if (shell.mkdir('-p', buildFolder).code !== 0) {
-            shell.echo('Could not create build folder.');
-            shell.exit(1);
-        }
-
-        const tempRepoPath = temp.mkdirSync();
-        shell.echo(`>>> Cloning CLI source to ${tempRepoPath}...`);
-        if (shell.exec(`git clone ${url} ${tempRepoPath}`).code !== 0) {
-            shell.exit(1);
-        }
-        shell.echo('<<< Cloned CLI repo.')
-
-        if (commitish) {
-            shell.echo(`>>> Checking out ${commitish}...`);
-            if (shell.exec(`git -C ${tempRepoPath} checkout ${commitish}`).code !== 0) {
-                shell.exit(1);
-            }
-            shell.echo(`<<< Checked out ${commitish}.`);
-        }
-
-        shell.echo(`>>> Building the CLI...`);
-        if (shell.exec('go build', { cwd: tempRepoPath }).code !== 0) {
-            shell.exit(1);
-        }
-        shell.echo('<<< CLI build done.')
-
-        if (!fs.existsSync(path.join(tempRepoPath, cliName))) {
-            shell.echo(`Could not find the CLI at ${path.join(tempRepoPath, cliName)}.`);
-            shell.exit(1);
-        }
-
-        const builtCliPath = path.join(tempRepoPath, cliName);
-        shell.echo(`>>> Copying CLI from ${builtCliPath} to ${destinationPath}...`);
-        if (shell.cp(builtCliPath, destinationPath).code !== 0) {
-            shell.exit(1);
-        }
-        shell.echo(`<<< Copied the CLI.`);
-
-        shell.echo('<<< Verifying CLI...');
-        if (!fs.existsSync(destinationPath)) {
-            shell.exit(1);
-        }
-        shell.echo('>>> Verified CLI.');
-
+      shell.echo(`🔥  Could not interpret 'version': ${version}`);
+      shell.exit(1);
     }
-
+  } else {
+    goBuildFromGit(version, destinationPath, 'CLI');
+  }
 })();

arduino-ide-extension/scripts/download-examples.js

@@ -4,30 +4,93 @@
 const version = '1.9.1';
 
 (async () => {
+  const os = require('os');
+  const { promises: fs } = require('fs');
+  const path = require('path');
+  const shell = require('shelljs');
+  const { v4 } = require('uuid');
 
-    const os = require('os');
-    const path = require('path');
-    const shell = require('shelljs');
-    const { v4 } = require('uuid');
+  const repository = path.join(os.tmpdir(), `${v4()}-arduino-examples`);
+  if (shell.mkdir('-p', repository).code !== 0) {
+    shell.exit(1);
+  }
 
-    const repository = path.join(os.tmpdir(), `${v4()}-arduino-examples`);
-    if (shell.mkdir('-p', repository).code !== 0) {
-        shell.exit(1);
-        process.exit(1);
+  if (
+    shell.exec(
+      `git clone https://github.com/arduino/arduino-examples.git ${repository}`
+    ).code !== 0
+  ) {
+    shell.exit(1);
+  }
+
+  if (
+    shell.exec(`git -C ${repository} checkout tags/${version} -b ${version}`)
+      .code !== 0
+  ) {
+    shell.exit(1);
+  }
+
+  const destination = path.join(__dirname, '..', 'Examples');
+  shell.mkdir('-p', destination);
+  shell.cp('-fR', path.join(repository, 'examples', '*'), destination);
+
+  const isSketch = async (pathLike) => {
+    try {
+      const names = await fs.readdir(pathLike);
+      const dirName = path.basename(pathLike);
+      return names.indexOf(`${dirName}.ino`) !== -1;
+    } catch (e) {
+      if (e.code === 'ENOTDIR') {
+        return false;
+      }
+      throw e;
     }
-
-    if (shell.exec(`git clone https://github.com/arduino/arduino-examples.git ${repository}`).code !== 0) {
-        shell.exit(1);
-        process.exit(1);
+  };
+  const examples = [];
+  const categories = await fs.readdir(destination);
+  const visit = async (pathLike, container) => {
+    const stat = await fs.lstat(pathLike);
+    if (stat.isDirectory()) {
+      if (await isSketch(pathLike)) {
+        container.sketches.push({
+          name: path.basename(pathLike),
+          relativePath: path.relative(destination, pathLike),
+        });
+      } else {
+        const names = await fs.readdir(pathLike);
+        for (const name of names) {
+          const childPath = path.join(pathLike, name);
+          if (await isSketch(childPath)) {
+            container.sketches.push({
+              name,
+              relativePath: path.relative(destination, childPath),
+            });
+          } else {
+            const child = {
+              label: name,
+              children: [],
+              sketches: [],
+            };
+            container.children.push(child);
+            await visit(childPath, child);
+          }
+        }
+      }
     }
-
-    if (shell.exec(`git -C ${repository} checkout tags/${version} -b ${version}`).code !== 0) {
-        shell.exit(1);
-        process.exit(1);
-    }
-
-    const destination = path.join(__dirname, '..', 'Examples');
-    shell.mkdir('-p', destination);
-    shell.cp('-fR', path.join(repository, 'examples', '*'), destination);
-
+  };
+  for (const category of categories) {
+    const example = {
+      label: category,
+      children: [],
+      sketches: [],
+    };
+    await visit(path.join(destination, category), example);
+    examples.push(example);
+  }
+  await fs.writeFile(
+    path.join(destination, 'examples.json'),
+    JSON.stringify(examples, null, 2),
+    { encoding: 'utf8' }
+  );
+  shell.echo(`Generated output to ${path.join(destination, 'examples.json')}`);
 })();

arduino-ide-extension/scripts/download-ls.js

@@ -7,22 +7,23 @@
   const path = require('path');
   const shell = require('shelljs');
   const downloader = require('./downloader');
+  const { goBuildFromGit } = require('./utils');
 
-  const [DEFAULT_ALS_VERSION, DEFAULT_CLANGD_VERSION] = (() => {
+  const [DEFAULT_LS_VERSION, DEFAULT_CLANGD_VERSION] = (() => {
     const pkg = require(path.join(__dirname, '..', 'package.json'));
-    if (!pkg) return undefined;
+    if (!pkg) return [undefined, undefined];
 
     const { arduino } = pkg;
-    if (!arduino) return undefined;
+    if (!arduino) return [undefined, undefined];
 
     const { languageServer, clangd } = arduino;
-    if (!languageServer) return undefined;
-    if (!clangd) return undefined;
+    if (!languageServer) return [undefined, undefined];
+    if (!clangd) return [undefined, undefined];
 
     return [languageServer.version, clangd.version];
   })();
 
-  if (!DEFAULT_ALS_VERSION) {
+  if (!DEFAULT_LS_VERSION) {
     shell.echo(
       `Could not retrieve Arduino Language Server version info from the 'package.json'.`
     );
@@ -39,8 +40,8 @@
   const yargs = require('yargs')
     .option('ls-version', {
       alias: 'lv',
-      default: DEFAULT_ALS_VERSION,
-      describe: `The version of the 'arduino-language-server' to download. Defaults to ${DEFAULT_ALS_VERSION}.`,
+      default: DEFAULT_LS_VERSION,
+      describe: `The version of the 'arduino-language-server' to download. Defaults to ${DEFAULT_LS_VERSION}.`,
     })
     .option('clangd-version', {
       alias: 'cv',
@@ -56,7 +57,7 @@
     .version(false)
     .parse();
 
-  const alsVersion = yargs['ls-version'];
+  const lsVersion = yargs['ls-version'];
   const clangdVersion = yargs['clangd-version'];
   const force = yargs['force-download'];
   const { platform, arch } = process;
@@ -66,24 +67,29 @@
     build,
     `arduino-language-server${platform === 'win32' ? '.exe' : ''}`
   );
-  let clangdExecutablePath, lsSuffix, clangdSuffix;
+  let clangdExecutablePath, clangFormatExecutablePath, lsSuffix, clangdSuffix;
 
   switch (platformArch) {
     case 'darwin-x64':
       clangdExecutablePath = path.join(build, 'clangd');
+      clangFormatExecutablePath = path.join(build, 'clang-format');
       lsSuffix = 'macOS_64bit.tar.gz';
       clangdSuffix = 'macOS_64bit';
       break;
     case 'linux-x64':
       clangdExecutablePath = path.join(build, 'clangd');
+      clangFormatExecutablePath = path.join(build, 'clang-format');
       lsSuffix = 'Linux_64bit.tar.gz';
       clangdSuffix = 'Linux_64bit';
       break;
     case 'win32-x64':
       clangdExecutablePath = path.join(build, 'clangd.exe');
+      clangFormatExecutablePath = path.join(build, 'clang-format.exe');
       lsSuffix = 'Windows_64bit.zip';
       clangdSuffix = 'Windows_64bit';
       break;
+    default:
+      throw new Error(`Unsupported platform/arch: ${platformArch}.`);
   }
   if (!lsSuffix || !clangdSuffix) {
     shell.echo(
@@ -92,15 +98,30 @@
     shell.exit(1);
   }
 
-  const alsUrl = `https://downloads.arduino.cc/arduino-language-server/${
-    alsVersion === 'nightly'
-      ? 'nightly/arduino-language-server'
-      : 'arduino-language-server_' + alsVersion
-  }_${lsSuffix}`;
-  downloader.downloadUnzipAll(alsUrl, build, lsExecutablePath, force);
+  if (typeof lsVersion === 'string') {
+    const lsUrl = `https://downloads.arduino.cc/arduino-language-server/${
+      lsVersion === 'nightly'
+        ? 'nightly/arduino-language-server'
+        : 'arduino-language-server_' + lsVersion
+    }_${lsSuffix}`;
+    downloader.downloadUnzipAll(lsUrl, build, lsExecutablePath, force);
+  } else {
+    goBuildFromGit(lsVersion, lsExecutablePath, 'language-server');
+  }
 
   const clangdUrl = `https://downloads.arduino.cc/tools/clangd_${clangdVersion}_${clangdSuffix}.tar.bz2`;
   downloader.downloadUnzipAll(clangdUrl, build, clangdExecutablePath, force, {
     strip: 1,
   }); // `strip`: the new clangd (12.x) is zipped into a folder, so we have to strip the outmost folder.
+
+  const clangdFormatUrl = `https://downloads.arduino.cc/tools/clang-format_${clangdVersion}_${clangdSuffix}.tar.bz2`;
+  downloader.downloadUnzipAll(
+    clangdFormatUrl,
+    build,
+    clangFormatExecutablePath,
+    force,
+    {
+      strip: 1,
+    }
+  );
 })();

arduino-ide-extension/scripts/downloader.js

@@ -86,6 +86,7 @@ exports.downloadUnzipFile = async (
  * @param targetDir {string}  Directory into which to decompress the archive
  * @param targetFile {string} Path to the main file expected after decompressing
  * @param force {boolean}     Whether to download even if the target file exists
+ * @param decompressOptions {import('decompress').DecompressOptions}
  */
 exports.downloadUnzipAll = async (
   url,

arduino-ide-extension/scripts/utils.js

@@ -0,0 +1,92 @@
+/**
+ * Clones something from GitHub and builds it with `Golang`.
+ *
+ * @param version {object} the version object.
+ * @param destinationPath {string} the absolute path of the output binary. For example, `C:\\folder\\arduino-cli.exe` or `/path/to/arduino-language-server`
+ * @param taskName {string} for the CLI logging . Can be `'CLI'` or `'language-server'`, etc.
+ */
+exports.goBuildFromGit = (version, destinationPath, taskName) => {
+  const fs = require('fs');
+  const path = require('path');
+  const temp = require('temp');
+  const shell = require('shelljs');
+
+  // We assume an object with `owner`, `repo`, commitish?` properties.
+  if (typeof version !== 'object') {
+    shell.echo(
+      `Expected a \`{ owner, repo, commitish }\` object. Got <${version}> instead.`
+    );
+  }
+  const { owner, repo, commitish } = version;
+  if (!owner) {
+    shell.echo(`Could not retrieve 'owner' from ${JSON.stringify(version)}`);
+    shell.exit(1);
+  }
+  if (!repo) {
+    shell.echo(`Could not retrieve 'repo' from ${JSON.stringify(version)}`);
+    shell.exit(1);
+  }
+  const url = `https://github.com/${owner}/${repo}.git`;
+  shell.echo(
+    `Building ${taskName} from ${url}. Commitish: ${
+      commitish ? commitish : 'HEAD'
+    }`
+  );
+
+  if (fs.existsSync(destinationPath)) {
+    shell.echo(
+      `Skipping the ${taskName} build because it already exists: ${destinationPath}`
+    );
+    return;
+  }
+
+  const buildFolder = path.join(__dirname, '..', 'build');
+  if (shell.mkdir('-p', buildFolder).code !== 0) {
+    shell.echo('Could not create build folder.');
+    shell.exit(1);
+  }
+
+  const tempRepoPath = temp.mkdirSync();
+  shell.echo(`>>> Cloning ${taskName} source to ${tempRepoPath}...`);
+  if (shell.exec(`git clone ${url} ${tempRepoPath}`).code !== 0) {
+    shell.exit(1);
+  }
+  shell.echo(`<<< Cloned ${taskName} repo.`);
+
+  if (commitish) {
+    shell.echo(`>>> Checking out ${commitish}...`);
+    if (shell.exec(`git -C ${tempRepoPath} checkout ${commitish}`).code !== 0) {
+      shell.exit(1);
+    }
+    shell.echo(`<<< Checked out ${commitish}.`);
+  }
+
+  shell.echo(`>>> Building the ${taskName}...`);
+  if (shell.exec('go build', { cwd: tempRepoPath }).code !== 0) {
+    shell.exit(1);
+  }
+  shell.echo(`<<< Done ${taskName} build.`);
+
+  const binName = path.basename(destinationPath);
+  if (!fs.existsSync(path.join(tempRepoPath, binName))) {
+    shell.echo(
+      `Could not find the ${taskName} at ${path.join(tempRepoPath, binName)}.`
+    );
+    shell.exit(1);
+  }
+
+  const binPath = path.join(tempRepoPath, binName);
+  shell.echo(
+    `>>> Copying ${taskName} from ${binPath} to ${destinationPath}...`
+  );
+  if (shell.cp(binPath, destinationPath).code !== 0) {
+    shell.exit(1);
+  }
+  shell.echo(`<<< Copied the ${taskName}.`);
+
+  shell.echo(`<<< Verifying ${taskName}...`);
+  if (!fs.existsSync(destinationPath)) {
+    shell.exit(1);
+  }
+  shell.echo(`>>> Verified ${taskName}.`);
+};

arduino-ide-extension/src/browser/arduino-commands.ts

@@ -1,21 +0,0 @@
-import { Command } from '@theia/core/lib/common/command';
-
-/**
- * @deprecated all these commands should go under contributions and have their command, menu, keybinding, and toolbar contributions.
- */
-export namespace ArduinoCommands {
-  export const TOGGLE_COMPILE_FOR_DEBUG: Command = {
-    id: 'arduino-toggle-compile-for-debug',
-  };
-
-  /**
-   * Unlike `OPEN_SKETCH`, it opens all files from a sketch folder. (ino, cpp, etc...)
-   */
-  export const OPEN_SKETCH_FILES: Command = {
-    id: 'arduino-open-sketch-files',
-  };
-
-  export const OPEN_BOARDS_DIALOG: Command = {
-    id: 'arduino-open-boards-dialog',
-  };
-}

arduino-ide-extension/src/browser/arduino-frontend-contribution.tsx

@@ -1,29 +1,22 @@
-import { inject, injectable, postConstruct } from 'inversify';
-import * as React from 'react';
-import { remote } from 'electron';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import {
-  BoardsService,
-  SketchesService,
-  ExecutableService,
-  Sketch,
-  LibraryService,
-} from '../common/protocol';
-import { Mutex } from 'async-mutex';
+  inject,
+  injectable,
+  postConstruct,
+} from '@theia/core/shared/inversify';
+import * as React from '@theia/core/shared/react';
+import { SketchesService } from '../common/protocol';
 import {
   MAIN_MENU_BAR,
   MenuContribution,
   MenuModelRegistry,
-  ILogger,
-  DisposableCollection,
 } from '@theia/core';
 import {
+  Dialog,
   FrontendApplication,
   FrontendApplicationContribution,
-  LocalStorageService,
-  StatusBar,
-  StatusBarAlignment,
+  OnWillStopAction,
 } from '@theia/core/lib/browser';
-import { nls } from '@theia/core/lib/common';
 import { ColorContribution } from '@theia/core/lib/browser/color-application-contribution';
 import { ColorRegistry } from '@theia/core/lib/browser/color-registry';
 import { CommonMenus } from '@theia/core/lib/browser/common-frontend-contribution';
@@ -31,45 +24,29 @@ import {
   TabBarToolbarContribution,
   TabBarToolbarRegistry,
 } from '@theia/core/lib/browser/shell/tab-bar-toolbar';
+import { nls } from '@theia/core/lib/common';
 import {
   CommandContribution,
   CommandRegistry,
 } from '@theia/core/lib/common/command';
 import { MessageService } from '@theia/core/lib/common/message-service';
-import URI from '@theia/core/lib/common/uri';
-import {
-  EditorMainMenu,
-  EditorManager,
-  EditorOpenerOptions,
-} from '@theia/editor/lib/browser';
-import { ProblemContribution } from '@theia/markers/lib/browser/problem/problem-contribution';
+import { EditorCommands, EditorMainMenu } from '@theia/editor/lib/browser';
 import { MonacoMenus } from '@theia/monaco/lib/browser/monaco-menu';
-import { FileNavigatorContribution } from '@theia/navigator/lib/browser/navigator-contribution';
-import { OutlineViewContribution } from '@theia/outline-view/lib/browser/outline-view-contribution';
-import { OutputContribution } from '@theia/output/lib/browser/output-contribution';
-import { ScmContribution } from '@theia/scm/lib/browser/scm-contribution';
-import { SearchInWorkspaceFrontendContribution } from '@theia/search-in-workspace/lib/browser/search-in-workspace-frontend-contribution';
+import { FileNavigatorCommands } from '@theia/navigator/lib/browser/navigator-contribution';
 import { TerminalMenus } from '@theia/terminal/lib/browser/terminal-frontend-contribution';
-import { HostedPluginSupport } from '@theia/plugin-ext/lib/hosted/browser/hosted-plugin';
-import { FileService } from '@theia/filesystem/lib/browser/file-service';
-import { FileChangeType } from '@theia/filesystem/lib/browser';
-import { FrontendApplicationStateService } from '@theia/core/lib/browser/frontend-application-state';
-import { ConfigService } from '../common/protocol/config-service';
-import { ArduinoCommands } from './arduino-commands';
-import { BoardsConfig } from './boards/boards-config';
-import { BoardsConfigDialog } from './boards/boards-config-dialog';
+import {
+  CurrentSketch,
+  SketchesServiceClientImpl,
+} from '../common/protocol/sketches-service-client-impl';
+import { ArduinoPreferences } from './arduino-preferences';
 import { BoardsServiceProvider } from './boards/boards-service-provider';
 import { BoardsToolBarItem } from './boards/boards-toolbar-item';
-import { EditorMode } from './editor-mode';
+import { SaveAsSketch } from './contributions/save-as-sketch';
 import { ArduinoMenus } from './menu/arduino-menus';
 import { MonitorViewContribution } from './serial/monitor/monitor-view-contribution';
 import { ArduinoToolbar } from './toolbar/arduino-toolbar';
-import { ArduinoPreferences } from './arduino-preferences';
-import { SketchesServiceClientImpl } from '../common/protocol/sketches-service-client-impl';
-import { SaveAsSketch } from './contributions/save-as-sketch';
-import { SketchbookWidgetContribution } from './widgets/sketchbook/sketchbook-widget-contribution';
-
-const INIT_LIBS_AND_PACKAGES = 'initializedLibsAndPackages';
+import { FrontendApplicationStateService } from '@theia/core/lib/browser/frontend-application-state';
+import { SerialPlotterContribution } from './serial/plotter/plotter-frontend-contribution';
 
 @injectable()
 export class ArduinoFrontendContribution
@@ -80,111 +57,29 @@ export class ArduinoFrontendContribution
     MenuContribution,
     ColorContribution
 {
-  @inject(ILogger)
-  protected logger: ILogger;
-
   @inject(MessageService)
-  protected readonly messageService: MessageService;
-
-  @inject(BoardsService)
-  protected readonly boardsService: BoardsService;
-
-  @inject(LibraryService)
-  protected readonly libraryService: LibraryService;
+  private readonly messageService: MessageService;
 
   @inject(BoardsServiceProvider)
-  protected readonly boardsServiceClientImpl: BoardsServiceProvider;
-
-  @inject(EditorManager)
-  protected readonly editorManager: EditorManager;
-
-  @inject(FileService)
-  protected readonly fileService: FileService;
+  private readonly boardsServiceProvider: BoardsServiceProvider;
 
   @inject(SketchesService)
-  protected readonly sketchService: SketchesService;
-
-  @inject(BoardsConfigDialog)
-  protected readonly boardsConfigDialog: BoardsConfigDialog;
+  private readonly sketchService: SketchesService;
 
   @inject(CommandRegistry)
-  protected readonly commandRegistry: CommandRegistry;
-
-  @inject(StatusBar)
-  protected readonly statusBar: StatusBar;
-
-  @inject(FileNavigatorContribution)
-  protected readonly fileNavigatorContributions: FileNavigatorContribution;
-
-  @inject(OutputContribution)
-  protected readonly outputContribution: OutputContribution;
-
-  @inject(OutlineViewContribution)
-  protected readonly outlineContribution: OutlineViewContribution;
-
-  @inject(ProblemContribution)
-  protected readonly problemContribution: ProblemContribution;
-
-  @inject(ScmContribution)
-  protected readonly scmContribution: ScmContribution;
-
-  @inject(SearchInWorkspaceFrontendContribution)
-  protected readonly siwContribution: SearchInWorkspaceFrontendContribution;
-
-  @inject(SketchbookWidgetContribution)
-  protected readonly sketchbookWidgetContribution: SketchbookWidgetContribution;
-
-  @inject(EditorMode)
-  protected readonly editorMode: EditorMode;
-
-  @inject(ConfigService)
-  protected readonly configService: ConfigService;
-
-  @inject(HostedPluginSupport)
-  protected hostedPluginSupport: HostedPluginSupport;
-
-  @inject(ExecutableService)
-  protected executableService: ExecutableService;
+  private readonly commandRegistry: CommandRegistry;
 
   @inject(ArduinoPreferences)
-  protected readonly arduinoPreferences: ArduinoPreferences;
+  private readonly arduinoPreferences: ArduinoPreferences;
 
   @inject(SketchesServiceClientImpl)
-  protected readonly sketchServiceClient: SketchesServiceClientImpl;
+  private readonly sketchServiceClient: SketchesServiceClientImpl;
 
-  protected readonly appStateService: FrontendApplicationStateService;
-
-  @inject(LocalStorageService)
-  protected readonly localStorageService: LocalStorageService;
-
-  protected invalidConfigPopup:
-    | Promise<void | 'No' | 'Yes' | undefined>
-    | undefined;
-  protected toDisposeOnStop = new DisposableCollection();
+  @inject(FrontendApplicationStateService)
+  private readonly appStateService: FrontendApplicationStateService;
 
   @postConstruct()
   protected async init(): Promise<void> {
-    const isFirstStartup = !(await this.localStorageService.getData(
-      INIT_LIBS_AND_PACKAGES
-    ));
-    if (isFirstStartup) {
-      await this.localStorageService.setData(INIT_LIBS_AND_PACKAGES, true);
-      const avrPackage = await this.boardsService.getBoardPackage({
-        id: 'arduino:avr',
-      });
-      const builtInLibrary = (
-        await this.libraryService.search({
-          query: 'Arduino_BuiltIn',
-        })
-      )[0];
-
-      !!avrPackage && (await this.boardsService.install({ item: avrPackage }));
-      !!builtInLibrary &&
-        (await this.libraryService.install({
-          item: builtInLibrary,
-          installDependencies: true,
-        }));
-    }
     if (!window.navigator.onLine) {
       // tslint:disable-next-line:max-line-length
       this.messageService.warn(
@@ -194,202 +89,32 @@ export class ArduinoFrontendContribution
         )
       );
     }
-    const updateStatusBar = ({
-      selectedBoard,
-      selectedPort,
-    }: BoardsConfig.Config) => {
-      this.statusBar.setElement('arduino-selected-board', {
-        alignment: StatusBarAlignment.RIGHT,
-        text: selectedBoard
-          ? `$(microchip) ${selectedBoard.name}`
-          : `$(close) ${nls.localize(
-              'arduino/common/noBoardSelected',
-              'No board selected'
-            )}`,
-        className: 'arduino-selected-board',
-      });
-      if (selectedBoard) {
-        this.statusBar.setElement('arduino-selected-port', {
-          alignment: StatusBarAlignment.RIGHT,
-          text: selectedPort
-            ? nls.localize(
-                'arduino/common/selectedOn',
-                'on {0}',
-                selectedPort.address
-              )
-            : nls.localize('arduino/common/notConnected', '[not connected]'),
-          className: 'arduino-selected-port',
-        });
-      }
-    };
-    this.boardsServiceClientImpl.onBoardsConfigChanged(updateStatusBar);
-    updateStatusBar(this.boardsServiceClientImpl.boardsConfig);
-    this.appStateService.reachedState('ready').then(async () => {
-      const sketch = await this.sketchServiceClient.currentSketch();
-      if (sketch && !(await this.sketchService.isTemp(sketch))) {
-        this.toDisposeOnStop.push(this.fileService.watch(new URI(sketch.uri)));
-        this.toDisposeOnStop.push(
-          this.fileService.onDidFilesChange(async (event) => {
-            for (const { type, resource } of event.changes) {
-              if (
-                type === FileChangeType.ADDED &&
-                resource.parent.toString() === sketch.uri
-              ) {
-                const reloadedSketch = await this.sketchService.loadSketch(
-                  sketch.uri
-                );
-                if (Sketch.isInSketch(resource, reloadedSketch)) {
-                  this.ensureOpened(resource.toString(), true, {
-                    mode: 'open',
-                  });
-                }
-              }
+  }
+
+  async onStart(app: FrontendApplication): Promise<void> {
+    this.arduinoPreferences.onPreferenceChanged((event) => {
+      if (event.newValue !== event.oldValue) {
+        switch (event.preferenceName) {
+          case 'arduino.window.zoomLevel':
+            if (typeof event.newValue === 'number') {
+              const webContents = remote.getCurrentWebContents();
+              webContents.setZoomLevel(event.newValue || 0);
             }
-          })
-        );
-      }
-    });
-  }
-
-  onStart(app: FrontendApplication): void {
-    // Initialize all `pro-mode` widgets. This is a NOOP if in normal mode.
-    for (const viewContribution of [
-      this.fileNavigatorContributions,
-      this.outputContribution,
-      this.outlineContribution,
-      this.problemContribution,
-      this.scmContribution,
-      this.siwContribution,
-      this.sketchbookWidgetContribution,
-    ] as Array<FrontendApplicationContribution>) {
-      if (viewContribution.initializeLayout) {
-        viewContribution.initializeLayout(app);
-      }
-    }
-    const start = async ({ selectedBoard }: BoardsConfig.Config) => {
-      if (selectedBoard) {
-        const { name, fqbn } = selectedBoard;
-        if (fqbn) {
-          this.startLanguageServer(fqbn, name);
+            break;
         }
       }
-    };
-    this.boardsServiceClientImpl.onBoardsConfigChanged(start);
-    this.arduinoPreferences.onPreferenceChanged((event) => {
-      if (
-        event.preferenceName === 'arduino.language.log' &&
-        event.newValue !== event.oldValue
-      ) {
-        start(this.boardsServiceClientImpl.boardsConfig);
-      }
     });
-    this.arduinoPreferences.ready.then(() => {
-      const webContents = remote.getCurrentWebContents();
-      const zoomLevel = this.arduinoPreferences.get('arduino.window.zoomLevel');
-      webContents.setZoomLevel(zoomLevel);
-    });
-    this.arduinoPreferences.onPreferenceChanged((event) => {
-      if (
-        event.preferenceName === 'arduino.window.zoomLevel' &&
-        typeof event.newValue === 'number' &&
-        event.newValue !== event.oldValue
-      ) {
+    this.appStateService.reachedState('ready').then(() =>
+      this.arduinoPreferences.ready.then(() => {
         const webContents = remote.getCurrentWebContents();
-        webContents.setZoomLevel(event.newValue || 0);
-      }
-    });
-    app.shell.leftPanelHandler.removeBottomMenu('settings-menu');
-  }
-
-  onStop(): void {
-    this.toDisposeOnStop.dispose();
-  }
-
-  protected languageServerFqbn?: string;
-  protected languageServerStartMutex = new Mutex();
-  protected async startLanguageServer(
-    fqbn: string,
-    name: string | undefined
-  ): Promise<void> {
-    const release = await this.languageServerStartMutex.acquire();
-    try {
-      await this.hostedPluginSupport.didStart;
-      const details = await this.boardsService.getBoardDetails({ fqbn });
-      if (!details) {
-        // Core is not installed for the selected board.
-        console.info(
-          `Could not start language server for ${fqbn}. The core is not installed for the board.`
+        const zoomLevel = this.arduinoPreferences.get(
+          'arduino.window.zoomLevel'
         );
-        if (this.languageServerFqbn) {
-          try {
-            await this.commandRegistry.executeCommand(
-              'arduino.languageserver.stop'
-            );
-            console.info(
-              `Stopped language server process for ${this.languageServerFqbn}.`
-            );
-            this.languageServerFqbn = undefined;
-          } catch (e) {
-            console.error(
-              `Failed to start language server process for ${this.languageServerFqbn}`,
-              e
-            );
-            throw e;
-          }
-        }
-        return;
-      }
-      if (fqbn === this.languageServerFqbn) {
-        // NOOP
-        return;
-      }
-      this.logger.info(`Starting language server: ${fqbn}`);
-      const log = this.arduinoPreferences.get('arduino.language.log');
-      let currentSketchPath: string | undefined = undefined;
-      if (log) {
-        const currentSketch = await this.sketchServiceClient.currentSketch();
-        if (currentSketch) {
-          currentSketchPath = await this.fileService.fsPath(
-            new URI(currentSketch.uri)
-          );
-        }
-      }
-      const { clangdUri, lsUri } = await this.executableService.list();
-      const [clangdPath, lsPath] = await Promise.all([
-        this.fileService.fsPath(new URI(clangdUri)),
-        this.fileService.fsPath(new URI(lsUri)),
-      ]);
-
-      const config = await this.configService.getConfiguration();
-
-      this.languageServerFqbn = await Promise.race([
-        new Promise<undefined>((_, reject) =>
-          setTimeout(
-            () => reject(new Error(`Timeout after ${20_000} ms.`)),
-            20_000
-          )
-        ),
-        this.commandRegistry.executeCommand<string>(
-          'arduino.languageserver.start',
-          {
-            lsPath,
-            cliDaemonAddr: `localhost:${config.daemon.port}`, // TODO: verify if this port is coming from the BE
-            clangdPath,
-            log: currentSketchPath ? currentSketchPath : log,
-            cliDaemonInstance: '1',
-            board: {
-              fqbn,
-              name: name ? `"${name}"` : undefined,
-            },
-          }
-        ),
-      ]);
-    } catch (e) {
-      console.log(`Failed to start language server for ${fqbn}`, e);
-      this.languageServerFqbn = undefined;
-    } finally {
-      release();
-    }
+        webContents.setZoomLevel(zoomLevel);
+      })
+    );
+    // Removes the _Settings_ (cog) icon from the left sidebar
+    app.shell.leftPanelHandler.removeBottomMenu('settings-menu');
   }
 
   registerToolbarItems(registry: TabBarToolbarRegistry): void {
@@ -399,13 +124,21 @@ export class ArduinoFrontendContribution
         <BoardsToolBarItem
           key="boardsToolbarItem"
           commands={this.commandRegistry}
-          boardsServiceClient={this.boardsServiceClientImpl}
+          boardsServiceProvider={this.boardsServiceProvider}
         />
       ),
       isVisible: (widget) =>
         ArduinoToolbar.is(widget) && widget.side === 'left',
       priority: 7,
     });
+    registry.registerItem({
+      id: 'toggle-serial-plotter',
+      command: SerialPlotterContribution.Commands.OPEN_TOOLBAR.id,
+      tooltip: nls.localize(
+        'arduino/serial/openSerialPlotter',
+        'Serial Plotter'
+      ),
+    });
     registry.registerItem({
       id: 'toggle-serial-monitor',
       command: MonitorViewContribution.TOGGLE_SERIAL_MONITOR_TOOLBAR,
@@ -414,26 +147,20 @@ export class ArduinoFrontendContribution
   }
 
   registerCommands(registry: CommandRegistry): void {
-    registry.registerCommand(ArduinoCommands.TOGGLE_COMPILE_FOR_DEBUG, {
-      execute: () => this.editorMode.toggleCompileForDebug(),
-      isToggled: () => this.editorMode.compileForDebug,
-    });
-    registry.registerCommand(ArduinoCommands.OPEN_SKETCH_FILES, {
-      execute: async (uri: URI) => {
-        this.openSketchFiles(uri);
-      },
-    });
-    registry.registerCommand(ArduinoCommands.OPEN_BOARDS_DIALOG, {
-      execute: async (query?: string | undefined) => {
-        const boardsConfig = await this.boardsConfigDialog.open(query);
-        if (boardsConfig) {
-          this.boardsServiceClientImpl.boardsConfig = boardsConfig;
-        }
-      },
-    });
+    for (const command of [
+      EditorCommands.SPLIT_EDITOR_DOWN,
+      EditorCommands.SPLIT_EDITOR_LEFT,
+      EditorCommands.SPLIT_EDITOR_RIGHT,
+      EditorCommands.SPLIT_EDITOR_UP,
+      EditorCommands.SPLIT_EDITOR_VERTICAL,
+      EditorCommands.SPLIT_EDITOR_HORIZONTAL,
+      FileNavigatorCommands.REVEAL_IN_NAVIGATOR,
+    ]) {
+      registry.unregisterCommand(command);
+    }
   }
 
-  registerMenus(registry: MenuModelRegistry) {
+  registerMenus(registry: MenuModelRegistry): void {
     const menuId = (menuPath: string[]): string => {
       const index = menuPath.length - 1;
       const menuId = menuPath[index];
@@ -452,97 +179,12 @@ export class ArduinoFrontendContribution
       ArduinoMenus.TOOLS,
       nls.localize('arduino/menu/tools', 'Tools')
     );
-    registry.registerMenuAction(ArduinoMenus.SKETCH__MAIN_GROUP, {
-      commandId: ArduinoCommands.TOGGLE_COMPILE_FOR_DEBUG.id,
-      label: nls.localize(
-        'arduino/debug/optimizeForDebugging',
-        'Optimize for Debugging'
-      ),
-      order: '5',
-    });
-  }
-
-  protected async openSketchFiles(uri: URI): Promise<void> {
-    try {
-      const sketch = await this.sketchService.loadSketch(uri.toString());
-      const { mainFileUri, rootFolderFileUris } = sketch;
-      for (const uri of [mainFileUri, ...rootFolderFileUris]) {
-        await this.ensureOpened(uri);
-      }
-      if (mainFileUri.endsWith('.pde')) {
-        const message = nls.localize(
-          'arduino/common/oldFormat',
-          "The '{0}' still uses the old `.pde` format. Do you want to switch to the new `.ino` extension?",
-          sketch.name
-        );
-        const yes = nls.localize('vscode/extensionsUtils/yes', 'Yes');
-        this.messageService
-          .info(message, nls.localize('arduino/common/later', 'Later'), yes)
-          .then(async (answer) => {
-            if (answer === yes) {
-              this.commandRegistry.executeCommand(
-                SaveAsSketch.Commands.SAVE_AS_SKETCH.id,
-                {
-                  execOnlyIfTemp: false,
-                  openAfterMove: true,
-                  wipeOriginal: false,
-                }
-              );
-            }
-          });
-      }
-    } catch (e) {
-      console.error(e);
-      const message = e instanceof Error ? e.message : JSON.stringify(e);
-      this.messageService.error(message);
-    }
-  }
-
-  protected async ensureOpened(
-    uri: string,
-    forceOpen = false,
-    options?: EditorOpenerOptions | undefined
-  ): Promise<any> {
-    const widget = this.editorManager.all.find(
-      (widget) => widget.editor.uri.toString() === uri
-    );
-    if (!widget || forceOpen) {
-      return this.editorManager.open(new URI(uri), options);
-    }
   }
 
   registerColors(colors: ColorRegistry): void {
     colors.register(
       {
-        id: 'arduino.branding.primary',
-        defaults: {
-          dark: 'statusBar.background',
-          light: 'statusBar.background',
-        },
-        description:
-          'The primary branding color, such as dialog titles, library, and board manager list labels.',
-      },
-      {
-        id: 'arduino.branding.secondary',
-        defaults: {
-          dark: 'statusBar.background',
-          light: 'statusBar.background',
-        },
-        description:
-          'Secondary branding color for list selections, dropdowns, and widget borders.',
-      },
-      {
-        id: 'arduino.foreground',
-        defaults: {
-          dark: 'editorWidget.background',
-          light: 'editorWidget.background',
-          hc: 'editorWidget.background',
-        },
-        description:
-          'Color of the Arduino IDE foreground which is used for dialogs, such as the Select Board dialog.',
-      },
-      {
-        id: 'arduino.toolbar.background',
+        id: 'arduino.toolbar.button.background',
         defaults: {
           dark: 'button.background',
           light: 'button.background',
@@ -552,15 +194,35 @@ export class ArduinoFrontendContribution
           'Background color of the toolbar items. Such as Upload, Verify, etc.',
       },
       {
-        id: 'arduino.toolbar.hoverBackground',
+        id: 'arduino.toolbar.button.hoverBackground',
         defaults: {
           dark: 'button.hoverBackground',
-          light: 'button.foreground',
-          hc: 'textLink.foreground',
+          light: 'button.hoverBackground',
+          hc: 'button.background',
         },
         description:
           'Background color of the toolbar items when hovering over them. Such as Upload, Verify, etc.',
       },
+      {
+        id: 'arduino.toolbar.button.secondary.label',
+        defaults: {
+          dark: 'secondaryButton.foreground',
+          light: 'button.foreground',
+          hc: 'activityBar.inactiveForeground',
+        },
+        description:
+          'Foreground color of the toolbar items. Such as Serial Monitor and Serial Plotter',
+      },
+      {
+        id: 'arduino.toolbar.button.secondary.hoverBackground',
+        defaults: {
+          dark: 'secondaryButton.hoverBackground',
+          light: 'button.hoverBackground',
+          hc: 'textLink.foreground',
+        },
+        description:
+          'Background color of the toolbar items when hovering over them, such as "Serial Monitor" and "Serial Plotter"',
+      },
       {
         id: 'arduino.toolbar.toggleBackground',
         defaults: {
@@ -572,23 +234,127 @@ export class ArduinoFrontendContribution
           'Toggle color of the toolbar items when they are currently toggled (the command is in progress)',
       },
       {
-        id: 'arduino.output.foreground',
+        id: 'arduino.toolbar.dropdown.border',
         defaults: {
-          dark: 'editor.foreground',
-          light: 'editor.foreground',
-          hc: 'editor.foreground',
+          dark: 'dropdown.border',
+          light: 'dropdown.border',
+          hc: 'dropdown.border',
         },
-        description: 'Color of the text in the Output view.',
+        description: 'Border color of the Board Selector.',
+      },
+
+      {
+        id: 'arduino.toolbar.dropdown.borderActive',
+        defaults: {
+          dark: 'focusBorder',
+          light: 'focusBorder',
+          hc: 'focusBorder',
+        },
+        description: "Border color of the Board Selector when it's active",
+      },
+
+      {
+        id: 'arduino.toolbar.dropdown.background',
+        defaults: {
+          dark: 'tab.unfocusedActiveBackground',
+          light: 'dropdown.background',
+          hc: 'dropdown.background',
+        },
+        description: 'Background color of the Board Selector.',
+      },
+
+      {
+        id: 'arduino.toolbar.dropdown.label',
+        defaults: {
+          dark: 'dropdown.foreground',
+          light: 'dropdown.foreground',
+          hc: 'dropdown.foreground',
+        },
+        description: 'Font color of the Board Selector.',
       },
       {
-        id: 'arduino.output.background',
+        id: 'arduino.toolbar.dropdown.iconSelected',
         defaults: {
-          dark: 'editor.background',
-          light: 'editor.background',
-          hc: 'editor.background',
+          dark: 'list.activeSelectionIconForeground',
+          light: 'list.activeSelectionIconForeground',
+          hc: 'list.activeSelectionIconForeground',
         },
-        description: 'Background color of the Output view.',
+        description:
+          'Color of the selected protocol icon in the Board Selector.',
+      },
+      {
+        id: 'arduino.toolbar.dropdown.option.backgroundHover',
+        defaults: {
+          dark: 'list.hoverBackground',
+          light: 'list.hoverBackground',
+          hc: 'list.hoverBackground',
+        },
+        description: 'Background color on hover of the Board Selector options.',
+      },
+      {
+        id: 'arduino.toolbar.dropdown.option.backgroundSelected',
+        defaults: {
+          dark: 'list.activeSelectionBackground',
+          light: 'list.activeSelectionBackground',
+          hc: 'list.activeSelectionBackground',
+        },
+        description:
+          'Background color of the selected board in the Board Selector.',
       }
     );
   }
+
+  // TODO: should be handled by `Close` contribution. https://github.com/arduino/arduino-ide/issues/1016
+  onWillStop(): OnWillStopAction {
+    return {
+      reason: 'temp-sketch',
+      action: () => {
+        return this.showTempSketchDialog();
+      },
+    };
+  }
+
+  private async showTempSketchDialog(): Promise<boolean> {
+    const sketch = await this.sketchServiceClient.currentSketch();
+    if (!CurrentSketch.isValid(sketch)) {
+      return true;
+    }
+    const isTemp = await this.sketchService.isTemp(sketch);
+    if (!isTemp) {
+      return true;
+    }
+    const messageBoxResult = await remote.dialog.showMessageBox(
+      remote.getCurrentWindow(),
+      {
+        message: nls.localize(
+          'arduino/sketch/saveTempSketch',
+          'Save your sketch to open it again later.'
+        ),
+        title: nls.localize(
+          'theia/core/quitTitle',
+          'Are you sure you want to quit?'
+        ),
+        type: 'question',
+        buttons: [
+          Dialog.CANCEL,
+          nls.localizeByDefault('Save As...'),
+          nls.localizeByDefault("Don't Save"),
+        ],
+      }
+    );
+    const result = messageBoxResult.response;
+    if (result === 2) {
+      return true;
+    } else if (result === 1) {
+      return !!(await this.commandRegistry.executeCommand(
+        SaveAsSketch.Commands.SAVE_AS_SKETCH.id,
+        {
+          execOnlyIfTemp: false,
+          openAfterMove: false,
+          wipeOriginal: true,
+        }
+      ));
+    }
+    return false;
+  }
 }

arduino-ide-extension/src/browser/arduino-ide-frontend-module.ts

@@ -1,5 +1,5 @@
 import '../../src/browser/style/index.css';
-import { ContainerModule } from 'inversify';
+import { ContainerModule } from '@theia/core/shared/inversify';
 import { WidgetFactory } from '@theia/core/lib/browser/widget-manager';
 import { CommandContribution } from '@theia/core/lib/common/command';
 import { bindViewContribution } from '@theia/core/lib/browser/shell/view-contribution';
@@ -42,22 +42,25 @@ import { FileNavigatorContribution as TheiaFileNavigatorContribution } from '@th
 import { KeymapsFrontendContribution } from './theia/keymaps/keymaps-frontend-contribution';
 import { KeymapsFrontendContribution as TheiaKeymapsFrontendContribution } from '@theia/keymaps/lib/browser/keymaps-frontend-contribution';
 import { ArduinoToolbarContribution } from './toolbar/arduino-toolbar-contribution';
-import { EditorPreviewContribution as TheiaEditorPreviewContribution } from '@theia/editor-preview/lib/browser/editor-preview-contribution';
-import { EditorPreviewContribution } from './theia/editor/editor-contribution';
+import { EditorContribution as TheiaEditorContribution } from '@theia/editor/lib/browser/editor-contribution';
+import { EditorContribution } from './theia/editor/editor-contribution';
 import { MonacoStatusBarContribution as TheiaMonacoStatusBarContribution } from '@theia/monaco/lib/browser/monaco-status-bar-contribution';
 import { MonacoStatusBarContribution } from './theia/monaco/monaco-status-bar-contribution';
 import {
   ApplicationShell as TheiaApplicationShell,
   ShellLayoutRestorer as TheiaShellLayoutRestorer,
   CommonFrontendContribution as TheiaCommonFrontendContribution,
-  KeybindingRegistry as TheiaKeybindingRegistry,
+  DockPanelRenderer as TheiaDockPanelRenderer,
   TabBarRendererFactory,
   ContextMenuRenderer,
   createTreeContainer,
   TreeWidget,
 } from '@theia/core/lib/browser';
 import { MenuContribution } from '@theia/core/lib/common/menu';
-import { ApplicationShell } from './theia/core/application-shell';
+import {
+  ApplicationShell,
+  DockPanelRenderer,
+} from './theia/core/application-shell';
 import { FrontendApplication } from './theia/core/frontend-application';
 import {
   BoardsConfigDialog,
@@ -69,30 +72,24 @@ import { ScmContribution } from './theia/scm/scm-contribution';
 import { SearchInWorkspaceFrontendContribution as TheiaSearchInWorkspaceFrontendContribution } from '@theia/search-in-workspace/lib/browser/search-in-workspace-frontend-contribution';
 import { SearchInWorkspaceFrontendContribution } from './theia/search-in-workspace/search-in-workspace-frontend-contribution';
 import { LibraryListWidgetFrontendContribution } from './library/library-widget-frontend-contribution';
-import { SerialServiceClientImpl } from './serial/serial-service-client-impl';
-import {
-  SerialServicePath,
-  SerialService,
-  SerialServiceClient,
-} from '../common/protocol/serial-service';
 import {
   ConfigService,
   ConfigServicePath,
 } from '../common/protocol/config-service';
 import { MonitorWidget } from './serial/monitor/monitor-widget';
 import { MonitorViewContribution } from './serial/monitor/monitor-view-contribution';
-import { SerialConnectionManager } from './serial/serial-connection-manager';
-import { SerialModel } from './serial/serial-model';
 import { TabBarDecoratorService as TheiaTabBarDecoratorService } from '@theia/core/lib/browser/shell/tab-bar-decorator';
 import { TabBarDecoratorService } from './theia/core/tab-bar-decorator';
 import { ProblemManager as TheiaProblemManager } from '@theia/markers/lib/browser';
 import { ProblemManager } from './theia/markers/problem-manager';
 import { BoardsAutoInstaller } from './boards/boards-auto-installer';
 import { ShellLayoutRestorer } from './theia/core/shell-layout-restorer';
-import { EditorMode } from './editor-mode';
 import { ListItemRenderer } from './widgets/component-list/list-item-renderer';
 import { ColorContribution } from '@theia/core/lib/browser/color-application-contribution';
-import { MonacoThemingService } from '@theia/monaco/lib/browser/monaco-theming-service';
+import {
+  MonacoThemeJson,
+  MonacoThemingService,
+} from '@theia/monaco/lib/browser/monaco-theming-service';
 import {
   ArduinoDaemonPath,
   ArduinoDaemon,
@@ -138,7 +135,6 @@ import { PreferencesContribution } from './theia/preferences/preferences-contrib
 import { QuitApp } from './contributions/quit-app';
 import { SketchControl } from './contributions/sketch-control';
 import { Settings } from './contributions/settings';
-import { KeybindingRegistry } from './theia/core/keybindings';
 import { WorkspaceCommandContribution } from './theia/workspace/workspace-commands';
 import { WorkspaceDeleteHandler as TheiaWorkspaceDeleteHandler } from '@theia/workspace/lib/browser/workspace-delete-handler';
 import { WorkspaceDeleteHandler } from './theia/workspace/workspace-delete-handler';
@@ -160,13 +156,20 @@ import {
   OutputChannelRegistryMainImpl as TheiaOutputChannelRegistryMainImpl,
   OutputChannelRegistryMainImpl,
 } from './theia/plugin-ext/output-channel-registry-main';
-import { ExecutableService, ExecutableServicePath } from '../common/protocol';
+import {
+  ExecutableService,
+  ExecutableServicePath,
+  MonitorManagerProxy,
+  MonitorManagerProxyClient,
+  MonitorManagerProxyFactory,
+  MonitorManagerProxyPath,
+} from '../common/protocol';
 import { MonacoTextModelService as TheiaMonacoTextModelService } from '@theia/monaco/lib/browser/monaco-text-model-service';
 import { MonacoTextModelService } from './theia/monaco/monaco-text-model-service';
 import { ResponseServiceImpl } from './response-service-impl';
 import {
   ResponseService,
-  ResponseServiceArduino,
+  ResponseServiceClient,
   ResponseServicePath,
 } from '../common/protocol/response-service';
 import { NotificationCenter } from './notification-center';
@@ -262,20 +265,90 @@ import {
   UserFieldsDialogWidget,
 } from './dialogs/user-fields/user-fields-dialog';
 import { nls } from '@theia/core/lib/common';
+import { IDEUpdaterCommands } from './ide-updater/ide-updater-commands';
+import {
+  IDEUpdater,
+  IDEUpdaterClient,
+  IDEUpdaterPath,
+} from '../common/protocol/ide-updater';
+import { IDEUpdaterClientImpl } from './ide-updater/ide-updater-client-impl';
+import {
+  IDEUpdaterDialog,
+  IDEUpdaterDialogProps,
+  IDEUpdaterDialogWidget,
+} from './dialogs/ide-updater/ide-updater-dialog';
+import { ElectronIpcConnectionProvider } from '@theia/core/lib/electron-browser/messaging/electron-ipc-connection-provider';
+import { MonitorModel } from './monitor-model';
+import { MonitorManagerProxyClientImpl } from './monitor-manager-proxy-client-impl';
+import { EditorManager as TheiaEditorManager } from '@theia/editor/lib/browser/editor-manager';
+import { EditorManager } from './theia/editor/editor-manager';
+import { HostedPluginEvents } from './hosted-plugin-events';
+import { HostedPluginSupport } from './theia/plugin-ext/hosted-plugin';
+import { HostedPluginSupport as TheiaHostedPluginSupport } from '@theia/plugin-ext/lib/hosted/browser/hosted-plugin';
+import { Formatter, FormatterPath } from '../common/protocol/formatter';
+import { Format } from './contributions/format';
+import { MonacoFormattingConflictsContribution } from './theia/monaco/monaco-formatting-conflicts';
+import { MonacoFormattingConflictsContribution as TheiaMonacoFormattingConflictsContribution } from '@theia/monaco/lib/browser/monaco-formatting-conflicts';
+import { DefaultJsonSchemaContribution } from './theia/core/json-schema-store';
+import { DefaultJsonSchemaContribution as TheiaDefaultJsonSchemaContribution } from '@theia/core/lib/browser/json-schema-store';
+import { EditorNavigationContribution } from './theia/editor/editor-navigation-contribution';
+import { EditorNavigationContribution as TheiaEditorNavigationContribution } from '@theia/editor/lib/browser/editor-navigation-contribution';
+import { PreferenceTreeGenerator } from './theia/preferences/preference-tree-generator';
+import { PreferenceTreeGenerator as TheiaPreferenceTreeGenerator } from '@theia/preferences/lib/browser/util/preference-tree-generator';
+import { AboutDialog } from './theia/core/about-dialog';
+import { AboutDialog as TheiaAboutDialog } from '@theia/core/lib/browser/about-dialog';
+import {
+  SurveyNotificationService,
+  SurveyNotificationServicePath,
+} from '../common/protocol/survey-service';
+import { WindowContribution } from './theia/core/window-contribution';
+import { WindowContribution as TheiaWindowContribution } from '@theia/core/lib/browser/window-contribution';
+import { CoreErrorHandler } from './contributions/core-error-handler';
+import { CompilerErrors } from './contributions/compiler-errors';
+import { WidgetManager } from './theia/core/widget-manager';
+import { WidgetManager as TheiaWidgetManager } from '@theia/core/lib/browser/widget-manager';
+import { StartupTasks } from './widgets/sketchbook/startup-task';
+import { IndexesUpdateProgress } from './contributions/indexes-update-progress';
+import { Daemon } from './contributions/daemon';
+import { FirstStartupInstaller } from './contributions/first-startup-installer';
+import { OpenSketchFiles } from './contributions/open-sketch-files';
+import { InoLanguage } from './contributions/ino-language';
+import { SelectedBoard } from './contributions/selected-board';
+import { CheckForUpdates } from './contributions/check-for-updates';
+import { OpenBoardsConfig } from './contributions/open-boards-config';
+import { SketchFilesTracker } from './contributions/sketch-files-tracker';
+import { MonacoThemeServiceIsReady } from './utils/window';
+import { Deferred } from '@theia/core/lib/common/promise-util';
+import { StatusBarImpl } from './theia/core/status-bar';
+import { StatusBarImpl as TheiaStatusBarImpl } from '@theia/core/lib/browser';
 
-const ElementQueries = require('css-element-queries/src/ElementQueries');
-
-MonacoThemingService.register({
-  id: 'arduino-theme',
-  label: 'Light (Arduino)',
-  uiTheme: 'vs',
-  json: require('../../src/browser/data/arduino.color-theme.json'),
-});
+const registerArduinoThemes = () => {
+  const themes: MonacoThemeJson[] = [
+    {
+      id: 'arduino-theme',
+      label: 'Light (Arduino)',
+      uiTheme: 'vs',
+      json: require('../../src/browser/data/default.color-theme.json'),
+    },
+    {
+      id: 'arduino-theme-dark',
+      label: 'Dark (Arduino)',
+      uiTheme: 'vs-dark',
+      json: require('../../src/browser/data/dark.color-theme.json'),
+    },
+  ];
+  themes.forEach((theme) => MonacoThemingService.register(theme));
+};
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const global = window as any;
+const ready = global[MonacoThemeServiceIsReady] as Deferred;
+if (ready) {
+  ready.promise.then(registerArduinoThemes);
+} else {
+  registerArduinoThemes();
+}
 
 export default new ContainerModule((bind, unbind, isBound, rebind) => {
-  ElementQueries.listen();
-  ElementQueries.init();
-
   // Commands and toolbar items
   bind(ArduinoFrontendContribution).toSelf().inSingletonScope();
   bind(CommandContribution).toService(ArduinoFrontendContribution);
@@ -392,30 +465,47 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
       )
     )
     .inSingletonScope();
+  bind(CoreErrorHandler).toSelf().inSingletonScope();
 
   // Serial monitor
-  bind(SerialModel).toSelf().inSingletonScope();
-  bind(FrontendApplicationContribution).toService(SerialModel);
   bind(MonitorWidget).toSelf();
+  bind(FrontendApplicationContribution).toService(MonitorModel);
+  bind(MonitorModel).toSelf().inSingletonScope();
   bindViewContribution(bind, MonitorViewContribution);
   bind(TabBarToolbarContribution).toService(MonitorViewContribution);
   bind(WidgetFactory).toDynamicValue((context) => ({
     id: MonitorWidget.ID,
-    createWidget: () => context.container.get(MonitorWidget),
+    createWidget: () => {
+      return new MonitorWidget(
+        context.container.get<MonitorModel>(MonitorModel),
+        context.container.get<MonitorManagerProxyClient>(
+          MonitorManagerProxyClient
+        ),
+        context.container.get<BoardsServiceProvider>(BoardsServiceProvider)
+      );
+    },
   }));
-  // Frontend binding for the serial service
-  bind(SerialService)
-    .toDynamicValue((context) => {
-      const connection = context.container.get(WebSocketConnectionProvider);
-      const client =
-        context.container.get<SerialServiceClient>(SerialServiceClient);
-      return connection.createProxy(SerialServicePath, client);
-    })
-    .inSingletonScope();
-  bind(SerialConnectionManager).toSelf().inSingletonScope();
 
-  // Serial service client to receive and delegate notifications from the backend.
-  bind(SerialServiceClient).to(SerialServiceClientImpl).inSingletonScope();
+  bind(MonitorManagerProxyFactory).toFactory(
+    (context) => () =>
+      context.container.get<MonitorManagerProxy>(MonitorManagerProxy)
+  );
+
+  bind(MonitorManagerProxy)
+    .toDynamicValue((context) =>
+      WebSocketConnectionProvider.createProxy(
+        context.container,
+        MonitorManagerProxyPath,
+        context.container.get(MonitorManagerProxyClient)
+      )
+    )
+    .inSingletonScope();
+
+  // Monitor manager proxy client to receive and delegate pluggable monitors
+  // notifications from the backend
+  bind(MonitorManagerProxyClient)
+    .to(MonitorManagerProxyClientImpl)
+    .inSingletonScope();
 
   bind(WorkspaceService).toSelf().inSingletonScope();
   rebind(TheiaWorkspaceService).toService(WorkspaceService);
@@ -424,9 +514,14 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
     WorkspaceVariableContribution
   );
 
-  // Customizing default Theia layout based on the editor mode: `pro-mode` or `classic`.
-  bind(EditorMode).toSelf().inSingletonScope();
-  bind(FrontendApplicationContribution).toService(EditorMode);
+  bind(SurveyNotificationService)
+    .toDynamicValue((context) => {
+      return ElectronIpcConnectionProvider.createProxy(
+        context.container,
+        SurveyNotificationServicePath
+      );
+    })
+    .inSingletonScope();
 
   // Layout and shell customizations.
   rebind(TheiaOutlineViewContribution)
@@ -439,9 +534,7 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
   rebind(TheiaKeymapsFrontendContribution)
     .to(KeymapsFrontendContribution)
     .inSingletonScope();
-  rebind(TheiaEditorPreviewContribution)
-    .to(EditorPreviewContribution)
-    .inSingletonScope();
+  rebind(TheiaEditorContribution).to(EditorContribution).inSingletonScope();
   rebind(TheiaMonacoStatusBarContribution)
     .to(MonacoStatusBarContribution)
     .inSingletonScope();
@@ -463,7 +556,6 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
   rebind(TheiaPreferencesContribution)
     .to(PreferencesContribution)
     .inSingletonScope();
-  rebind(TheiaKeybindingRegistry).to(KeybindingRegistry).inSingletonScope();
   rebind(TheiaWorkspaceCommandContribution)
     .to(WorkspaceCommandContribution)
     .inSingletonScope();
@@ -495,6 +587,10 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
   bind(SearchInWorkspaceWidget).toSelf();
   rebind(TheiaSearchInWorkspaceWidget).toService(SearchInWorkspaceWidget);
 
+  // Disabled reference counter in the editor manager to avoid opening the same editor (with different opener options) multiple times.
+  bind(EditorManager).toSelf().inSingletonScope();
+  rebind(TheiaEditorManager).toService(EditorManager);
+
   // replace search icon
   rebind(TheiaSearchInWorkspaceFactory)
     .to(SearchInWorkspaceFactory)
@@ -537,6 +633,10 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
   bind(OutputToolbarContribution).toSelf().inSingletonScope();
   rebind(TheiaOutputToolbarContribution).toService(OutputToolbarContribution);
 
+  // To remove `New Window` from the `File` menu
+  bind(WindowContribution).toSelf().inSingletonScope();
+  rebind(TheiaWindowContribution).toService(WindowContribution);
+
   bind(ArduinoDaemon)
     .toDynamicValue((context) =>
       WebSocketConnectionProvider.createProxy(
@@ -546,6 +646,12 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
     )
     .inSingletonScope();
 
+  bind(Formatter)
+    .toDynamicValue(({ container }) =>
+      WebSocketConnectionProvider.createProxy(container, FormatterPath)
+    )
+    .inSingletonScope();
+
   bind(ArduinoFirmwareUploader)
     .toDynamicValue((context) =>
       WebSocketConnectionProvider.createProxy(
@@ -613,6 +719,25 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
   Contribution.configure(bind, ArchiveSketch);
   Contribution.configure(bind, AddZipLibrary);
   Contribution.configure(bind, PlotterFrontendContribution);
+  Contribution.configure(bind, Format);
+  Contribution.configure(bind, CompilerErrors);
+  Contribution.configure(bind, StartupTasks);
+  Contribution.configure(bind, IndexesUpdateProgress);
+  Contribution.configure(bind, Daemon);
+  Contribution.configure(bind, FirstStartupInstaller);
+  Contribution.configure(bind, OpenSketchFiles);
+  Contribution.configure(bind, InoLanguage);
+  Contribution.configure(bind, SelectedBoard);
+  Contribution.configure(bind, CheckForUpdates);
+  Contribution.configure(bind, OpenBoardsConfig);
+  Contribution.configure(bind, SketchFilesTracker);
+
+  // Disabled the quick-pick customization from Theia when multiple formatters are available.
+  // Use the default VS Code behavior, and pick the first one. In the IDE2, clang-format has `exclusive` selectors.
+  bind(MonacoFormattingConflictsContribution).toSelf().inSingletonScope();
+  rebind(TheiaMonacoFormattingConflictsContribution).toService(
+    MonacoFormattingConflictsContribution
+  );
 
   bind(ResponseServiceImpl)
     .toSelf()
@@ -627,7 +752,7 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
     });
 
   bind(ResponseService).toService(ResponseServiceImpl);
-  bind(ResponseServiceArduino).toService(ResponseServiceImpl);
+  bind(ResponseServiceClient).toService(ResponseServiceImpl);
 
   bind(NotificationCenter).toSelf().inSingletonScope();
   bind(FrontendApplicationContribution).toService(NotificationCenter);
@@ -658,6 +783,8 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
 
   // Workaround for https://github.com/eclipse-theia/theia/issues/8722
   // Do not trigger a save on IDE startup if `"editor.autoSave": "on"` was set as a preference.
+  // Note: `"editor.autoSave" was renamed to `"files.autoSave" and `"on"` was replaced with three
+  // different cases, but we treat `!== 'off'` as auto save enabled. (https://github.com/eclipse-theia/theia/issues/10812)
   bind(EditorCommandContribution).toSelf().inSingletonScope();
   rebind(TheiaEditorCommandContribution).toService(EditorCommandContribution);
 
@@ -665,6 +792,26 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
   bind(NavigatorTabBarDecorator).toSelf().inSingletonScope();
   rebind(TheiaNavigatorTabBarDecorator).toService(NavigatorTabBarDecorator);
 
+  // Do not fetch the `catalog.json` from Azure on FE load.
+  bind(DefaultJsonSchemaContribution).toSelf().inSingletonScope();
+  rebind(TheiaDefaultJsonSchemaContribution).toService(
+    DefaultJsonSchemaContribution
+  );
+
+  // Do not block the app startup when initializing the editor navigation history.
+  bind(EditorNavigationContribution).toSelf().inSingletonScope();
+  rebind(TheiaEditorNavigationContribution).toService(
+    EditorNavigationContribution
+  );
+
+  // IDE2 does not use the Theia preferences widget, no need to create and sync the underlying tree model.
+  bind(PreferenceTreeGenerator).toSelf().inSingletonScope();
+  rebind(TheiaPreferenceTreeGenerator).toService(PreferenceTreeGenerator);
+
+  // IDE2 has a custom about dialog, so there is no need to load the Theia extensions on FE load
+  bind(AboutDialog).toSelf().inSingletonScope();
+  rebind(TheiaAboutDialog).toService(AboutDialog);
+
   // To avoid running `Save All` when there are no dirty editors before starting the debug session.
   bind(DebugSessionManager).toSelf().inSingletonScope();
   rebind(TheiaDebugSessionManager).toService(DebugSessionManager);
@@ -677,6 +824,18 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
   bind(DebugConfigurationManager).toSelf().inSingletonScope();
   rebind(TheiaDebugConfigurationManager).toService(DebugConfigurationManager);
 
+  // To avoid duplicate tabs use deepEqual instead of string equal: https://github.com/eclipse-theia/theia/issues/11309
+  bind(WidgetManager).toSelf().inSingletonScope();
+  rebind(TheiaWidgetManager).toService(WidgetManager);
+
+  // To avoid running a status bar update on every single `keypress` event from the editor.
+  bind(StatusBarImpl).toSelf().inSingletonScope();
+  rebind(TheiaStatusBarImpl).toService(StatusBarImpl);
+
+  // Debounced update for the tab-bar toolbar when typing in the editor.
+  bind(DockPanelRenderer).toSelf();
+  rebind(TheiaDockPanelRenderer).toService(DockPanelRenderer);
+
   // Preferences
   bindArduinoPreferences(bind);
 
@@ -756,9 +915,37 @@ export default new ContainerModule((bind, unbind, isBound, rebind) => {
     title: 'UploadCertificate',
   });
 
+  bind(IDEUpdaterDialogWidget).toSelf().inSingletonScope();
+  bind(IDEUpdaterDialog).toSelf().inSingletonScope();
+  bind(IDEUpdaterDialogProps).toConstantValue({
+    title: 'IDEUpdater',
+  });
+
   bind(UserFieldsDialogWidget).toSelf().inSingletonScope();
   bind(UserFieldsDialog).toSelf().inSingletonScope();
   bind(UserFieldsDialogProps).toConstantValue({
     title: 'UserFields',
   });
+
+  bind(IDEUpdaterCommands).toSelf().inSingletonScope();
+  bind(CommandContribution).toService(IDEUpdaterCommands);
+
+  // Frontend binding for the IDE Updater service
+  bind(IDEUpdaterClientImpl).toSelf().inSingletonScope();
+  bind(IDEUpdaterClient).toService(IDEUpdaterClientImpl);
+  bind(IDEUpdater)
+    .toDynamicValue((context) => {
+      const client = context.container.get(IDEUpdaterClientImpl);
+      return ElectronIpcConnectionProvider.createProxy(
+        context.container,
+        IDEUpdaterPath,
+        client
+      );
+    })
+    .inSingletonScope();
+
+  bind(HostedPluginSupport).toSelf().inSingletonScope();
+  rebind(TheiaHostedPluginSupport).toService(HostedPluginSupport);
+  bind(HostedPluginEvents).toSelf().inSingletonScope();
+  bind(FrontendApplicationContribution).toService(HostedPluginEvents);
 });

arduino-ide-extension/src/browser/arduino-preferences.ts

@@ -1,4 +1,4 @@
-import { interfaces } from 'inversify';
+import { interfaces } from '@theia/core/shared/inversify';
 import {
   createPreferenceProxy,
   PreferenceProxy,
@@ -9,6 +9,37 @@ import {
 import { nls } from '@theia/core/lib/common';
 import { CompilerWarningLiterals, CompilerWarnings } from '../common/protocol';
 
+export enum UpdateChannel {
+  Stable = 'stable',
+  Nightly = 'nightly',
+}
+export const ErrorRevealStrategyLiterals = [
+  /**
+   * Scroll vertically as necessary and reveal a line.
+   */
+  'auto',
+  /**
+   * Scroll vertically as necessary and reveal a line centered vertically.
+   */
+  'center',
+  /**
+   * Scroll vertically as necessary and reveal a line close to the top of the viewport, optimized for viewing a code definition.
+   */
+  'top',
+  /**
+   * Scroll vertically as necessary and reveal a line centered vertically only if it lies outside the viewport.
+   */
+  'centerIfOutsideViewport',
+] as const;
+export type ErrorRevealStrategy = typeof ErrorRevealStrategyLiterals[number];
+export namespace ErrorRevealStrategy {
+  // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types, @typescript-eslint/no-explicit-any
+  export function is(arg: any): arg is ErrorRevealStrategy {
+    return !!arg && ErrorRevealStrategyLiterals.includes(arg);
+  }
+  export const Default: ErrorRevealStrategy = 'centerIfOutsideViewport';
+}
+
 export const ArduinoConfigSchema: PreferenceSchema = {
   type: 'object',
   properties: {
@@ -20,6 +51,14 @@ export const ArduinoConfigSchema: PreferenceSchema = {
       ),
       default: false,
     },
+    'arduino.language.realTimeDiagnostics': {
+      type: 'boolean',
+      description: nls.localize(
+        'arduino/preferences/language.realTimeDiagnostics',
+        "If true, the language server provides real-time diagnostics when typing in the editor. It's false by default."
+      ),
+      default: false,
+    },
     'arduino.compile.verbose': {
       type: 'boolean',
       description: nls.localize(
@@ -28,6 +67,23 @@ export const ArduinoConfigSchema: PreferenceSchema = {
       ),
       default: false,
     },
+    'arduino.compile.experimental': {
+      type: 'boolean',
+      description: nls.localize(
+        'arduino/preferences/compile.experimental',
+        'True if the IDE should handle multiple compiler errors. False by default'
+      ),
+      default: false,
+    },
+    'arduino.compile.revealRange': {
+      enum: [...ErrorRevealStrategyLiterals],
+      description: nls.localize(
+        'arduino/preferences/compile.revealRange',
+        "Adjusts how compiler errors are revealed in the editor after a failed verify/upload. Possible values: 'auto': Scroll vertically as necessary and reveal a line. 'center': Scroll vertically as necessary and reveal a line centered vertically. 'top': Scroll vertically as necessary and reveal a line close to the top of the viewport, optimized for viewing a code definition. 'centerIfOutsideViewport': Scroll vertically as necessary and reveal a line centered vertically only if it lies outside the viewport. The default value is '{0}'.",
+        ErrorRevealStrategy.Default
+      ),
+      default: ErrorRevealStrategy.Default,
+    },
     'arduino.compile.warnings': {
       enum: [...CompilerWarningLiterals],
       description: nls.localize(
@@ -64,13 +120,22 @@ export const ArduinoConfigSchema: PreferenceSchema = {
       ),
       default: 0,
     },
-    'arduino.ide.autoUpdate': {
-      type: 'boolean',
+    'arduino.ide.updateChannel': {
+      type: 'string',
+      enum: Object.values(UpdateChannel) as UpdateChannel[],
+      default: UpdateChannel.Stable,
       description: nls.localize(
-        'arduino/preferences/ide.autoUpdate',
-        'True to enable automatic update checks. The IDE will check for updates automatically and periodically.'
+        'arduino/preferences/ide.updateChannel',
+        "Release channel to get updated from. 'stable' is the stable release, 'nightly' is the latest development build."
+      ),
+    },
+    'arduino.ide.updateBaseUrl': {
+      type: 'string',
+      default: 'https://downloads.arduino.cc/arduino-ide',
+      description: nls.localize(
+        'arduino/preferences/ide.updateBaseUrl',
+        "The base URL where to download updates from. Defaults to 'https://downloads.arduino.cc/arduino-ide'"
       ),
-      default: true,
     },
     'arduino.board.certificates': {
       type: 'string',
@@ -120,10 +185,10 @@ export const ArduinoConfigSchema: PreferenceSchema = {
       ),
       default: true,
     },
-    'arduino.cloud.sketchSyncEnpoint': {
+    'arduino.cloud.sketchSyncEndpoint': {
       type: 'string',
       description: nls.localize(
-        'arduino/preferences/cloud.sketchSyncEnpoint',
+        'arduino/preferences/cloud.sketchSyncEndpoint',
         'The endpoint used to push and pull sketches from a backend. By default it points to Arduino Cloud API.'
       ),
       default: 'https://api2.arduino.cc/create',
@@ -160,44 +225,60 @@ export const ArduinoConfigSchema: PreferenceSchema = {
       ),
       default: 'https://auth.arduino.cc/login#/register',
     },
+    'arduino.survey.notification': {
+      type: 'boolean',
+      description: nls.localize(
+        'arduino/preferences/survey.notification',
+        'True if users should be notified if a survey is available. True by default.'
+      ),
+      default: true,
+    },
+    'arduino.cli.daemon.debug': {
+      type: 'boolean',
+      description: nls.localize(
+        'arduino/preferences/cli.daemonDebug',
+        "Enable debug logging of the gRPC calls to the Arduino CLI. A restart of the IDE is needed for this setting to take effect. It's false by default."
+      ),
+      default: false,
+    },
   },
 };
 
 export interface ArduinoConfiguration {
   'arduino.language.log': boolean;
+  'arduino.language.realTimeDiagnostics': boolean;
   'arduino.compile.verbose': boolean;
+  'arduino.compile.experimental': boolean;
+  'arduino.compile.revealRange': ErrorRevealStrategy;
   'arduino.compile.warnings': CompilerWarnings;
   'arduino.upload.verbose': boolean;
   'arduino.upload.verify': boolean;
   'arduino.window.autoScale': boolean;
   'arduino.window.zoomLevel': number;
-  'arduino.ide.autoUpdate': boolean;
+  'arduino.ide.updateChannel': UpdateChannel;
+  'arduino.ide.updateBaseUrl': string;
   'arduino.board.certificates': string;
   'arduino.sketchbook.showAllFiles': boolean;
   'arduino.cloud.enabled': boolean;
   'arduino.cloud.pull.warn': boolean;
   'arduino.cloud.push.warn': boolean;
   'arduino.cloud.pushpublic.warn': boolean;
-  'arduino.cloud.sketchSyncEnpoint': string;
+  'arduino.cloud.sketchSyncEndpoint': string;
   'arduino.auth.clientID': string;
   'arduino.auth.domain': string;
   'arduino.auth.audience': string;
   'arduino.auth.registerUri': string;
+  'arduino.survey.notification': boolean;
+  'arduino.cli.daemon.debug': boolean;
 }
 
 export const ArduinoPreferences = Symbol('ArduinoPreferences');
 export type ArduinoPreferences = PreferenceProxy<ArduinoConfiguration>;
 
-export function createArduinoPreferences(
-  preferences: PreferenceService
-): ArduinoPreferences {
-  return createPreferenceProxy(preferences, ArduinoConfigSchema);
-}
-
 export function bindArduinoPreferences(bind: interfaces.Bind): void {
   bind(ArduinoPreferences).toDynamicValue((ctx) => {
     const preferences = ctx.container.get<PreferenceService>(PreferenceService);
-    return createArduinoPreferences(preferences);
+    return createPreferenceProxy(preferences, ArduinoConfigSchema);
   });
   bind(PreferenceContribution).toConstantValue({
     schema: ArduinoConfigSchema,

arduino-ide-extension/src/browser/arduino-workspace-resolver.ts

@@ -1,5 +1,4 @@
-import { toUnix } from 'upath';
-import URI from '@theia/core/lib/common/uri';
+import { URI } from '@theia/core/shared/vscode-uri';
 import { isWindows } from '@theia/core/lib/common/os';
 import { notEmpty } from '@theia/core/lib/common/objects';
 import { MaybePromise } from '@theia/core/lib/common/types';
@@ -61,12 +60,8 @@ export class ArduinoWorkspaceRootResolver {
   // - https://github.com/eclipse-theia/theia/blob/8196e9dcf9c8de8ea0910efeb5334a974f426966/packages/workspace/src/browser/workspace-service.ts#L423
   protected hashToUri(hash: string | undefined): string | undefined {
     if (hash && hash.length > 1 && hash.startsWith('#')) {
-      const path = hash.slice(1); // Trim the leading `#`.
-      return new URI(
-        toUnix(path.slice(isWindows && hash.startsWith('/') ? 1 : 0))
-      )
-        .withScheme('file')
-        .toString();
+      const path = decodeURI(hash.slice(1)).replace(/\\/g, '/'); // Trim the leading `#`, decode the URI and replace Windows separators
+      return URI.file(path.slice(isWindows && hash.startsWith('/') ? 1 : 0)).toString();
     }
     return undefined;
   }

arduino-ide-extension/src/browser/auth/authentication-client-service.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { Emitter } from '@theia/core/lib/common/event';
 import { JsonRpcProxy } from '@theia/core/lib/common/messaging/proxy-factory';
 import { WindowService } from '@theia/core/lib/browser/window/window-service';
@@ -43,13 +43,15 @@ export class AuthenticationClientService
 
   readonly onSessionDidChange = this.onSessionDidChangeEmitter.event;
 
-  onStart(): void {
+  async onStart(): Promise<void> {
     this.toDispose.push(this.onSessionDidChangeEmitter);
     this.service.setClient(this);
     this.service
       .session()
       .then((session) => this.notifySessionDidChange(session));
-    this.setOptions();
+
+    this.setOptions().then(() => this.service.initAuthSession());
+
     this.arduinoPreferences.onPreferenceChanged((event) => {
       if (event.preferenceName.startsWith('arduino.auth.')) {
         this.setOptions();
@@ -57,8 +59,8 @@ export class AuthenticationClientService
     });
   }
 
-  setOptions(): void {
-    this.service.setOptions({
+  setOptions(): Promise<void> {
+    return this.service.setOptions({
       redirectUri: `http://localhost:${serverPort}/callback`,
       responseType: 'code',
       clientID: this.arduinoPreferences['arduino.auth.clientID'],

arduino-ide-extension/src/browser/boards/boards-auto-installer.ts

@@ -1,23 +1,41 @@
-import { injectable, inject } from 'inversify';
+import { injectable, inject } from '@theia/core/shared/inversify';
 import { MessageService } from '@theia/core/lib/common/message-service';
 import { FrontendApplicationContribution } from '@theia/core/lib/browser/frontend-application';
 import {
   BoardsService,
   BoardsPackage,
   Board,
+  Port,
 } from '../../common/protocol/boards-service';
 import { BoardsServiceProvider } from './boards-service-provider';
-import { BoardsConfig } from './boards-config';
-import { Installable, ResponseServiceArduino } from '../../common/protocol';
+import { Installable, ResponseServiceClient } from '../../common/protocol';
 import { BoardsListWidgetFrontendContribution } from './boards-widget-frontend-contribution';
 import { nls } from '@theia/core/lib/common';
+import { NotificationCenter } from '../notification-center';
+
+interface AutoInstallPromptAction {
+  // isAcceptance, whether or not the action indicates acceptance of auto-install proposal
+  isAcceptance?: boolean;
+  key: string;
+  handler: (...args: unknown[]) => unknown;
+}
+
+type AutoInstallPromptActions = AutoInstallPromptAction[];
 
 /**
  * Listens on `BoardsConfig.Config` changes, if a board is selected which does not
  * have the corresponding core installed, it proposes the user to install the core.
  */
+
+// * Cases in which we do not show the auto-install prompt:
+// 1. When a related platform is already installed
+// 2. When a prompt is already showing in the UI
+// 3. When a board is unplugged
 @injectable()
 export class BoardsAutoInstaller implements FrontendApplicationContribution {
+  @inject(NotificationCenter)
+  private readonly notificationCenter: NotificationCenter;
+
   @inject(MessageService)
   protected readonly messageService: MessageService;
 
@@ -27,8 +45,8 @@ export class BoardsAutoInstaller implements FrontendApplicationContribution {
   @inject(BoardsServiceProvider)
   protected readonly boardsServiceClient: BoardsServiceProvider;
 
-  @inject(ResponseServiceArduino)
-  protected readonly responseService: ResponseServiceArduino;
+  @inject(ResponseServiceClient)
+  protected readonly responseService: ResponseServiceClient;
 
   @inject(BoardsListWidgetFrontendContribution)
   protected readonly boardsManagerFrontendContribution: BoardsListWidgetFrontendContribution;
@@ -36,97 +54,228 @@ export class BoardsAutoInstaller implements FrontendApplicationContribution {
   // Workaround for https://github.com/eclipse-theia/theia/issues/9349
   protected notifications: Board[] = [];
 
+  // * "refusal" meaning a "prompt action" not accepting the auto-install offer ("X" or "install manually")
+  // we can use "portSelectedOnLastRefusal" to deduce when a board is unplugged after a user has "refused"
+  // an auto-install prompt. Important to know as we do not want "an unplug" to trigger a "refused" prompt
+  // showing again
+  private portSelectedOnLastRefusal: Port | undefined;
+  private lastRefusedPackageId: string | undefined;
+
   onStart(): void {
-    this.boardsServiceClient.onBoardsConfigChanged(
-      this.ensureCoreExists.bind(this)
-    );
-    this.ensureCoreExists(this.boardsServiceClient.boardsConfig);
-  }
+    const setEventListeners = () => {
+      this.boardsServiceClient.onBoardsConfigChanged((config) => {
+        const { selectedBoard, selectedPort } = config;
 
-  protected ensureCoreExists(config: BoardsConfig.Config): void {
-    const { selectedBoard, selectedPort } = config;
-    if (
-      selectedBoard &&
-      selectedPort &&
-      !this.notifications.find((board) => Board.sameAs(board, selectedBoard))
-    ) {
-      this.notifications.push(selectedBoard);
-      this.boardsService.search({}).then((packages) => {
-        // filter packagesForBoard selecting matches from the cli (installed packages)
-        // and matches based on the board name
-        // NOTE: this ensures the Deprecated & new packages are all in the array
-        // so that we can check if any of the valid packages is already installed
-        const packagesForBoard = packages.filter(
-          (pkg) =>
-            BoardsPackage.contains(selectedBoard, pkg) ||
-            pkg.boards.some((board) => board.name === selectedBoard.name)
-        );
+        const boardWasUnplugged =
+          !selectedPort && this.portSelectedOnLastRefusal;
+
+        this.clearLastRefusedPromptInfo();
 
-        // check if one of the packages for the board is already installed. if so, no hint
         if (
-          packagesForBoard.some(({ installedVersion }) => !!installedVersion)
+          boardWasUnplugged ||
+          !selectedBoard ||
+          this.promptAlreadyShowingForBoard(selectedBoard)
         ) {
           return;
         }
 
-        // filter the installable (not installed) packages,
-        // CLI returns the packages already sorted with the deprecated ones at the end of the list
-        // in order to ensure the new ones are preferred
-        const candidates = packagesForBoard.filter(
-          ({ installable, installedVersion }) =>
-            installable && !installedVersion
-        );
+        this.ensureCoreExists(selectedBoard, selectedPort);
+      });
 
-        const candidate = candidates[0];
-        if (candidate) {
-          const version = candidate.availableVersions[0]
-            ? `[v ${candidate.availableVersions[0]}]`
-            : '';
-          const yes = nls.localize('vscode/extensionsUtils/yes', 'Yes');
-          const manualInstall = nls.localize(
-            'arduino/board/installManually',
-            'Install Manually'
-          );
-          // tslint:disable-next-line:max-line-length
-          this.messageService
-            .info(
-              nls.localize(
-                'arduino/board/installNow',
-                'The "{0} {1}" core has to be installed for the currently selected "{2}" board. Do you want to install it now?',
-                candidate.name,
-                version,
-                selectedBoard.name
-              ),
-              manualInstall,
-              yes
-            )
-            .then(async (answer) => {
-              const index = this.notifications.findIndex((board) =>
-                Board.sameAs(board, selectedBoard)
-              );
-              if (index !== -1) {
-                this.notifications.splice(index, 1);
-              }
-              if (answer === yes) {
-                await Installable.installWithProgress({
-                  installable: this.boardsService,
-                  item: candidate,
-                  messageService: this.messageService,
-                  responseService: this.responseService,
-                  version: candidate.availableVersions[0],
-                });
-                return;
-              }
-              if (answer === manualInstall) {
-                this.boardsManagerFrontendContribution
-                  .openView({ reveal: true })
-                  .then((widget) =>
-                    widget.refresh(candidate.name.toLocaleLowerCase())
-                  );
-              }
-            });
+      // we "clearRefusedPackageInfo" if a "refused" package is eventually
+      // installed, though this is not strictly necessary. It's more of a
+      // cleanup, to ensure the related variables are representative of
+      // current state.
+      this.notificationCenter.onPlatformDidInstall((installed) => {
+        if (this.lastRefusedPackageId === installed.item.id) {
+          this.clearLastRefusedPromptInfo();
         }
       });
+    };
+
+    // we should invoke this.ensureCoreExists only once we're sure
+    // everything has been reconciled
+    this.boardsServiceClient.reconciled.then(() => {
+      const { selectedBoard, selectedPort } =
+        this.boardsServiceClient.boardsConfig;
+
+      if (selectedBoard) {
+        this.ensureCoreExists(selectedBoard, selectedPort);
+      }
+
+      setEventListeners();
+    });
+  }
+
+  private removeNotificationByBoard(selectedBoard: Board): void {
+    const index = this.notifications.findIndex((notification) =>
+      Board.sameAs(notification, selectedBoard)
+    );
+    if (index !== -1) {
+      this.notifications.splice(index, 1);
     }
   }
+
+  private clearLastRefusedPromptInfo(): void {
+    this.lastRefusedPackageId = undefined;
+    this.portSelectedOnLastRefusal = undefined;
+  }
+
+  private setLastRefusedPromptInfo(
+    packageId: string,
+    selectedPort?: Port
+  ): void {
+    this.lastRefusedPackageId = packageId;
+    this.portSelectedOnLastRefusal = selectedPort;
+  }
+
+  private promptAlreadyShowingForBoard(board: Board): boolean {
+    return Boolean(
+      this.notifications.find((notification) =>
+        Board.sameAs(notification, board)
+      )
+    );
+  }
+
+  protected ensureCoreExists(selectedBoard: Board, selectedPort?: Port): void {
+    this.notifications.push(selectedBoard);
+    this.boardsService.search({}).then((packages) => {
+      const candidate = this.getInstallCandidate(packages, selectedBoard);
+
+      if (candidate) {
+        this.showAutoInstallPrompt(candidate, selectedBoard, selectedPort);
+      } else {
+        this.removeNotificationByBoard(selectedBoard);
+      }
+    });
+  }
+
+  private getInstallCandidate(
+    packages: BoardsPackage[],
+    selectedBoard: Board
+  ): BoardsPackage | undefined {
+    // filter packagesForBoard selecting matches from the cli (installed packages)
+    // and matches based on the board name
+    // NOTE: this ensures the Deprecated & new packages are all in the array
+    // so that we can check if any of the valid packages is already installed
+    const packagesForBoard = packages.filter(
+      (pkg) =>
+        BoardsPackage.contains(selectedBoard, pkg) ||
+        pkg.boards.some((board) => board.name === selectedBoard.name)
+    );
+
+    // check if one of the packages for the board is already installed. if so, no hint
+    if (packagesForBoard.some(({ installedVersion }) => !!installedVersion)) {
+      return;
+    }
+
+    // filter the installable (not installed) packages,
+    // CLI returns the packages already sorted with the deprecated ones at the end of the list
+    // in order to ensure the new ones are preferred
+    const candidates = packagesForBoard.filter(
+      ({ installable, installedVersion }) => installable && !installedVersion
+    );
+
+    return candidates[0];
+  }
+
+  private showAutoInstallPrompt(
+    candidate: BoardsPackage,
+    selectedBoard: Board,
+    selectedPort?: Port
+  ): void {
+    const candidateName = candidate.name;
+    const version = candidate.availableVersions[0]
+      ? `[v ${candidate.availableVersions[0]}]`
+      : '';
+
+    const info = this.generatePromptInfoText(
+      candidateName,
+      version,
+      selectedBoard.name
+    );
+
+    const actions = this.createPromptActions(candidate);
+
+    const onRefuse = () => {
+      this.setLastRefusedPromptInfo(candidate.id, selectedPort);
+    };
+    const handleAction = this.createOnAnswerHandler(actions, onRefuse);
+
+    const onAnswer = (answer: string) => {
+      this.removeNotificationByBoard(selectedBoard);
+
+      handleAction(answer);
+    };
+
+    this.messageService
+      .info(info, ...actions.map((action) => action.key))
+      .then(onAnswer);
+  }
+
+  private generatePromptInfoText(
+    candidateName: string,
+    version: string,
+    boardName: string
+  ): string {
+    return nls.localize(
+      'arduino/board/installNow',
+      'The "{0} {1}" core has to be installed for the currently selected "{2}" board. Do you want to install it now?',
+      candidateName,
+      version,
+      boardName
+    );
+  }
+
+  private createPromptActions(
+    candidate: BoardsPackage
+  ): AutoInstallPromptActions {
+    const yes = nls.localize('vscode/extensionsUtils/yes', 'Yes');
+    const manualInstall = nls.localize(
+      'arduino/board/installManually',
+      'Install Manually'
+    );
+
+    const actions: AutoInstallPromptActions = [
+      {
+        key: manualInstall,
+        handler: () => {
+          this.boardsManagerFrontendContribution
+            .openView({ reveal: true })
+            .then((widget) =>
+              widget.refresh(candidate.name.toLocaleLowerCase())
+            );
+        },
+      },
+      {
+        isAcceptance: true,
+        key: yes,
+        handler: () => {
+          return Installable.installWithProgress({
+            installable: this.boardsService,
+            item: candidate,
+            messageService: this.messageService,
+            responseService: this.responseService,
+            version: candidate.availableVersions[0],
+          });
+        },
+      },
+    ];
+
+    return actions;
+  }
+
+  private createOnAnswerHandler(
+    actions: AutoInstallPromptActions,
+    onRefuse?: () => void
+  ): (answer: string) => void {
+    return (answer) => {
+      const actionToHandle = actions.find((action) => action.key === answer);
+      actionToHandle?.handler();
+
+      if (!actionToHandle?.isAcceptance && onRefuse) {
+        onRefuse();
+      }
+    };
+  }
 }

arduino-ide-extension/src/browser/boards/boards-config-dialog-widget.tsx

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import { injectable, inject } from 'inversify';
+import * as React from '@theia/core/shared/react';
+import { injectable, inject } from '@theia/core/shared/inversify';
 import { Emitter } from '@theia/core/lib/common/event';
 import { ReactWidget, Message } from '@theia/core/lib/browser';
 import { BoardsService } from '../../common/protocol/boards-service';
@@ -55,12 +55,13 @@ export class BoardsConfigDialogWidget extends ReactWidget {
           onConfigChange={this.fireConfigChanged}
           onFocusNodeSet={this.setFocusNode}
           onFilteredTextDidChangeEvent={this.onFilterTextDidChangeEmitter.event}
+          onAppStateDidChange={this.notificationCenter.onAppStateDidChange}
         />
       </div>
     );
   }
 
-  protected onActivateRequest(msg: Message): void {
+  protected override onActivateRequest(msg: Message): void {
     super.onActivateRequest(msg);
     if (this.focusNode instanceof HTMLInputElement) {
       this.focusNode.select();

arduino-ide-extension/src/browser/boards/boards-config-dialog.ts

@@ -1,5 +1,5 @@
-import { injectable, inject, postConstruct } from 'inversify';
-import { Message } from '@phosphor/messaging';
+import { injectable, inject, postConstruct } from '@theia/core/shared/inversify';
+import { Message } from '@theia/core/shared/@phosphor/messaging';
 import { DialogProps, Widget, DialogError } from '@theia/core/lib/browser';
 import { AbstractDialog } from '../theia/dialogs/dialogs';
 import { BoardsConfig } from './boards-config';
@@ -26,7 +26,7 @@ export class BoardsConfigDialog extends AbstractDialog<BoardsConfig.Config> {
 
   constructor(
     @inject(BoardsConfigDialogProps)
-    protected readonly props: BoardsConfigDialogProps
+    protected override readonly props: BoardsConfigDialogProps
   ) {
     super(props);
 
@@ -52,7 +52,7 @@ export class BoardsConfigDialog extends AbstractDialog<BoardsConfig.Config> {
   /**
    * Pass in an empty string if you want to reset the search term. Using `undefined` has no effect.
    */
-  async open(
+  override async open(
     query: string | undefined = undefined
   ): Promise<BoardsConfig.Config | undefined> {
     if (typeof query === 'string') {
@@ -95,7 +95,7 @@ export class BoardsConfigDialog extends AbstractDialog<BoardsConfig.Config> {
     return head;
   }
 
-  protected onAfterAttach(msg: Message): void {
+  protected override onAfterAttach(msg: Message): void {
     if (this.widget.isAttached) {
       Widget.detach(this.widget);
     }
@@ -110,23 +110,23 @@ export class BoardsConfigDialog extends AbstractDialog<BoardsConfig.Config> {
     this.update();
   }
 
-  protected onUpdateRequest(msg: Message) {
+  protected override onUpdateRequest(msg: Message): void {
     super.onUpdateRequest(msg);
     this.widget.update();
   }
 
-  protected onActivateRequest(msg: Message): void {
+  protected override onActivateRequest(msg: Message): void {
     super.onActivateRequest(msg);
     this.widget.activate();
   }
 
-  protected handleEnter(event: KeyboardEvent): boolean | void {
+  protected override handleEnter(event: KeyboardEvent): boolean | void {
     if (event.target instanceof HTMLTextAreaElement) {
       return false;
     }
   }
 
-  protected isValid(value: BoardsConfig.Config): DialogError {
+  protected override isValid(value: BoardsConfig.Config): DialogError {
     if (!value.selectedBoard) {
       if (value.selectedPort) {
         return nls.localize(

arduino-ide-extension/src/browser/boards/boards-config.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import * as React from '@theia/core/shared/react';
 import { Event } from '@theia/core/lib/common/event';
 import { notEmpty } from '@theia/core/lib/common/objects';
 import { MaybePromise } from '@theia/core/lib/common/types';
@@ -16,6 +16,7 @@ import {
 } from './boards-service-provider';
 import { naturalCompare } from '../../common/utils';
 import { nls } from '@theia/core/lib/common';
+import { FrontendApplicationState } from '@theia/core/lib/common/frontend-application-state';
 
 export namespace BoardsConfig {
   export interface Config {
@@ -29,6 +30,7 @@ export namespace BoardsConfig {
     readonly onConfigChange: (config: Config) => void;
     readonly onFocusNodeSet: (element: HTMLElement | undefined) => void;
     readonly onFilteredTextDidChangeEvent: Event<string>;
+    readonly onAppStateDidChange: Event<FrontendApplicationState>;
   }
 
   export interface State extends Config {
@@ -47,7 +49,7 @@ export abstract class Item<T> extends React.Component<{
   missing?: boolean;
   details?: string;
 }> {
-  render(): React.ReactNode {
+  override render(): React.ReactNode {
     const { selected, label, missing, details } = this.props;
     const classNames = ['item'];
     if (selected) {
@@ -99,15 +101,19 @@ export class BoardsConfig extends React.Component<
     };
   }
 
-  componentDidMount() {
-    this.updateBoards();
-    this.updatePorts(
-      this.props.boardsServiceProvider.availableBoards
-        .map(({ port }) => port)
-        .filter(notEmpty)
-    );
+  override componentDidMount(): void {
     this.toDispose.pushAll([
-      this.props.notificationCenter.onAttachedBoardsChanged((event) =>
+      this.props.onAppStateDidChange((state) => {
+        if (state === 'ready') {
+          this.updateBoards();
+          this.updatePorts(
+            this.props.boardsServiceProvider.availableBoards
+              .map(({ port }) => port)
+              .filter(notEmpty)
+          );
+        }
+      }),
+      this.props.notificationCenter.onAttachedBoardsDidChange((event) =>
         this.updatePorts(
           event.newState.ports,
           AttachedBoardsChangeEvent.diff(event).detached.ports
@@ -120,19 +126,19 @@ export class BoardsConfig extends React.Component<
           );
         }
       ),
-      this.props.notificationCenter.onPlatformInstalled(() =>
+      this.props.notificationCenter.onPlatformDidInstall(() =>
         this.updateBoards(this.state.query)
       ),
-      this.props.notificationCenter.onPlatformUninstalled(() =>
+      this.props.notificationCenter.onPlatformDidUninstall(() =>
         this.updateBoards(this.state.query)
       ),
-      this.props.notificationCenter.onIndexUpdated(() =>
+      this.props.notificationCenter.onIndexDidUpdate(() =>
         this.updateBoards(this.state.query)
       ),
-      this.props.notificationCenter.onDaemonStarted(() =>
+      this.props.notificationCenter.onDaemonDidStart(() =>
         this.updateBoards(this.state.query)
       ),
-      this.props.notificationCenter.onDaemonStopped(() =>
+      this.props.notificationCenter.onDaemonDidStop(() =>
         this.setState({ searchResults: [] })
       ),
       this.props.onFilteredTextDidChangeEvent((query) =>
@@ -141,11 +147,11 @@ export class BoardsConfig extends React.Component<
     ]);
   }
 
-  componentWillUnmount(): void {
+  override componentWillUnmount(): void {
     this.toDispose.dispose();
   }
 
-  protected fireConfigChanged() {
+  protected fireConfigChanged(): void {
     const { selectedBoard, selectedPort } = this.state;
     this.props.onConfigChange({ selectedBoard, selectedPort });
   }
@@ -250,7 +256,7 @@ export class BoardsConfig extends React.Component<
     this.props.onFocusNodeSet(element || undefined);
   };
 
-  render(): React.ReactNode {
+  override render(): React.ReactNode {
     return (
       <div className="body">
         {this.renderContainer('boards', this.renderBoards.bind(this))}

arduino-ide-extension/src/browser/boards/boards-data-menu-updater.ts

@@ -1,5 +1,5 @@
 import * as PQueue from 'p-queue';
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { CommandRegistry } from '@theia/core/lib/common/command';
 import { MenuModelRegistry } from '@theia/core/lib/common/menu';
 import {
@@ -13,6 +13,7 @@ import { BoardsDataStore } from './boards-data-store';
 import { MainMenuManager } from '../../common/main-menu-manager';
 import { ArduinoMenus, unregisterSubmenu } from '../menu/arduino-menus';
 import { nls } from '@theia/core/lib/common';
+import { FrontendApplicationStateService } from '@theia/core/lib/browser/frontend-application-state';
 
 @injectable()
 export class BoardsDataMenuUpdater implements FrontendApplicationContribution {
@@ -31,11 +32,20 @@ export class BoardsDataMenuUpdater implements FrontendApplicationContribution {
   @inject(BoardsServiceProvider)
   protected readonly boardsServiceClient: BoardsServiceProvider;
 
+  @inject(FrontendApplicationStateService)
+  private readonly appStateService: FrontendApplicationStateService;
+
   protected readonly queue = new PQueue({ autoStart: true, concurrency: 1 });
   protected readonly toDisposeOnBoardChange = new DisposableCollection();
 
   async onStart(): Promise<void> {
-    this.updateMenuActions(this.boardsServiceClient.boardsConfig.selectedBoard);
+    this.appStateService
+      .reachedState('ready')
+      .then(() =>
+        this.updateMenuActions(
+          this.boardsServiceClient.boardsConfig.selectedBoard
+        )
+      );
     this.boardsDataStore.onChanged(() =>
       this.updateMenuActions(
         this.boardsServiceClient.boardsConfig.selectedBoard

arduino-ide-extension/src/browser/boards/boards-data-store.ts

@@ -1,7 +1,6 @@
-import { injectable, inject, named } from 'inversify';
+import { injectable, inject, named } from '@theia/core/shared/inversify';
 import { ILogger } from '@theia/core/lib/common/logger';
 import { deepClone } from '@theia/core/lib/common/objects';
-import { MaybePromise } from '@theia/core/lib/common/types';
 import { Event, Emitter } from '@theia/core/lib/common/event';
 import {
   FrontendApplicationContribution,
@@ -11,7 +10,6 @@ import { notEmpty } from '../../common/utils';
 import {
   BoardsService,
   ConfigOption,
-  Installable,
   BoardDetails,
   Programmer,
 } from '../../common/protocol';
@@ -35,17 +33,13 @@ export class BoardsDataStore implements FrontendApplicationContribution {
   protected readonly onChangedEmitter = new Emitter<void>();
 
   onStart(): void {
-    this.notificationCenter.onPlatformInstalled(async ({ item }) => {
-      const { installedVersion: version } = item;
-      if (!version) {
-        return;
-      }
+    this.notificationCenter.onPlatformDidInstall(async ({ item }) => {
       let shouldFireChanged = false;
       for (const fqbn of item.boards
         .map(({ fqbn }) => fqbn)
         .filter(notEmpty)
         .filter((fqbn) => !!fqbn)) {
-        const key = this.getStorageKey(fqbn, version);
+        const key = this.getStorageKey(fqbn);
         let data = await this.storageService.getData<
           ConfigOption[] | undefined
         >(key);
@@ -72,33 +66,20 @@ export class BoardsDataStore implements FrontendApplicationContribution {
 
   async appendConfigToFqbn(
     fqbn: string | undefined,
-    boardsPackageVersion: MaybePromise<
-      Installable.Version | undefined
-    > = this.getBoardsPackageVersion(fqbn)
   ): Promise<string | undefined> {
     if (!fqbn) {
       return undefined;
     }
-
-    const { configOptions } = await this.getData(fqbn, boardsPackageVersion);
+    const { configOptions } = await this.getData(fqbn);
     return ConfigOption.decorate(fqbn, configOptions);
   }
 
-  async getData(
-    fqbn: string | undefined,
-    boardsPackageVersion: MaybePromise<
-      Installable.Version | undefined
-    > = this.getBoardsPackageVersion(fqbn)
-  ): Promise<BoardsDataStore.Data> {
+  async getData(fqbn: string | undefined): Promise<BoardsDataStore.Data> {
     if (!fqbn) {
       return BoardsDataStore.Data.EMPTY;
     }
 
-    const version = await boardsPackageVersion;
-    if (!version) {
-      return BoardsDataStore.Data.EMPTY;
-    }
-    const key = this.getStorageKey(fqbn, version);
+    const key = this.getStorageKey(fqbn);
     let data = await this.storageService.getData<
       BoardsDataStore.Data | undefined
     >(key, undefined);
@@ -124,25 +105,16 @@ export class BoardsDataStore implements FrontendApplicationContribution {
       fqbn,
       selectedProgrammer,
     }: { fqbn: string; selectedProgrammer: Programmer },
-    boardsPackageVersion: MaybePromise<
-      Installable.Version | undefined
-    > = this.getBoardsPackageVersion(fqbn)
   ): Promise<boolean> {
-    const data = deepClone(await this.getData(fqbn, boardsPackageVersion));
+    const data = deepClone(await this.getData(fqbn));
     const { programmers } = data;
     if (!programmers.find((p) => Programmer.equals(selectedProgrammer, p))) {
       return false;
     }
 
-    const version = await boardsPackageVersion;
-    if (!version) {
-      return false;
-    }
-
     await this.setData({
       fqbn,
       data: { ...data, selectedProgrammer },
-      version,
     });
     this.fireChanged();
     return true;
@@ -153,12 +125,9 @@ export class BoardsDataStore implements FrontendApplicationContribution {
       fqbn,
       option,
       selectedValue,
-    }: { fqbn: string; option: string; selectedValue: string },
-    boardsPackageVersion: MaybePromise<
-      Installable.Version | undefined
-    > = this.getBoardsPackageVersion(fqbn)
+    }: { fqbn: string; option: string; selectedValue: string }
   ): Promise<boolean> {
-    const data = deepClone(await this.getData(fqbn, boardsPackageVersion));
+    const data = deepClone(await this.getData(fqbn));
     const { configOptions } = data;
     const configOption = configOptions.find((c) => c.option === option);
     if (!configOption) {
@@ -176,12 +145,7 @@ export class BoardsDataStore implements FrontendApplicationContribution {
     if (!updated) {
       return false;
     }
-    const version = await boardsPackageVersion;
-    if (!version) {
-      return false;
-    }
-
-    await this.setData({ fqbn, data, version });
+    await this.setData({ fqbn, data });
     this.fireChanged();
     return true;
   }
@@ -189,18 +153,16 @@ export class BoardsDataStore implements FrontendApplicationContribution {
   protected async setData({
     fqbn,
     data,
-    version,
   }: {
     fqbn: string;
     data: BoardsDataStore.Data;
-    version: Installable.Version;
   }): Promise<void> {
-    const key = this.getStorageKey(fqbn, version);
+    const key = this.getStorageKey(fqbn);
     return this.storageService.setData(key, data);
   }
 
-  protected getStorageKey(fqbn: string, version: Installable.Version): string {
-    return `.arduinoIDE-configOptions-${version}-${fqbn}`;
+  protected getStorageKey(fqbn: string): string {
+    return `.arduinoIDE-configOptions-${fqbn}`;
   }
 
   protected async getBoardDetailsSafe(
@@ -231,21 +193,6 @@ export class BoardsDataStore implements FrontendApplicationContribution {
   protected fireChanged(): void {
     this.onChangedEmitter.fire();
   }
-
-  protected async getBoardsPackageVersion(
-    fqbn: string | undefined
-  ): Promise<Installable.Version | undefined> {
-    if (!fqbn) {
-      return undefined;
-    }
-    const boardsPackage = await this.boardsService.getContainerBoardPackage({
-      fqbn,
-    });
-    if (!boardsPackage) {
-      return undefined;
-    }
-    return boardsPackage.installedVersion;
-  }
 }
 
 export namespace BoardsDataStore {

arduino-ide-extension/src/browser/boards/boards-list-widget.ts

@@ -1,4 +1,8 @@
-import { inject, injectable, postConstruct } from 'inversify';
+import {
+  inject,
+  injectable,
+  postConstruct,
+} from '@theia/core/shared/inversify';
 import {
   BoardsPackage,
   BoardsService,
@@ -30,19 +34,19 @@ export class BoardsListWidget extends ListWidget<BoardsPackage> {
   }
 
   @postConstruct()
-  protected init(): void {
+  protected override init(): void {
     super.init();
     this.toDispose.pushAll([
-      this.notificationCenter.onPlatformInstalled(() =>
+      this.notificationCenter.onPlatformDidInstall(() =>
         this.refresh(undefined)
       ),
-      this.notificationCenter.onPlatformUninstalled(() =>
+      this.notificationCenter.onPlatformDidUninstall(() =>
         this.refresh(undefined)
       ),
     ]);
   }
 
-  protected async install({
+  protected override async install({
     item,
     progressId,
     version,
@@ -63,7 +67,7 @@ export class BoardsListWidget extends ListWidget<BoardsPackage> {
     );
   }
 
-  protected async uninstall({
+  protected override async uninstall({
     item,
     progressId,
   }: {

arduino-ide-extension/src/browser/boards/boards-service-provider.ts

@@ -1,4 +1,4 @@
-import { injectable, inject } from 'inversify';
+import { injectable, inject } from '@theia/core/shared/inversify';
 import { Emitter } from '@theia/core/lib/common/event';
 import { ILogger } from '@theia/core/lib/common/logger';
 import { CommandService } from '@theia/core/lib/common/command';
@@ -17,9 +17,10 @@ import {
 import { BoardsConfig } from './boards-config';
 import { naturalCompare } from '../../common/utils';
 import { NotificationCenter } from '../notification-center';
-import { ArduinoCommands } from '../arduino-commands';
 import { StorageWrapper } from '../storage-wrapper';
 import { nls } from '@theia/core/lib/common';
+import { Deferred } from '@theia/core/lib/common/promise-util';
+import { FrontendApplicationStateService } from '@theia/core/lib/browser/frontend-application-state';
 
 @injectable()
 export class BoardsServiceProvider implements FrontendApplicationContribution {
@@ -38,6 +39,9 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
   @inject(NotificationCenter)
   protected notificationCenter: NotificationCenter;
 
+  @inject(FrontendApplicationStateService)
+  private readonly appStateService: FrontendApplicationStateService;
+
   protected readonly onBoardsConfigChangedEmitter =
     new Emitter<BoardsConfig.Config>();
   protected readonly onAvailableBoardsChangedEmitter = new Emitter<
@@ -73,29 +77,40 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
     this.onAvailableBoardsChangedEmitter.event;
   readonly onAvailablePortsChanged = this.onAvailablePortsChangedEmitter.event;
 
+  private readonly _reconciled = new Deferred<void>();
+
   onStart(): void {
-    this.notificationCenter.onAttachedBoardsChanged(
+    this.notificationCenter.onAttachedBoardsDidChange(
       this.notifyAttachedBoardsChanged.bind(this)
     );
-    this.notificationCenter.onPlatformInstalled(
+    this.notificationCenter.onPlatformDidInstall(
       this.notifyPlatformInstalled.bind(this)
     );
-    this.notificationCenter.onPlatformUninstalled(
+    this.notificationCenter.onPlatformDidUninstall(
       this.notifyPlatformUninstalled.bind(this)
     );
 
-    Promise.all([
-      this.boardsService.getAttachedBoards(),
-      this.boardsService.getAvailablePorts(),
-      this.loadState(),
-    ]).then(([attachedBoards, availablePorts]) => {
+    this.appStateService.reachedState('ready').then(async () => {
+      const [attachedBoards, availablePorts] = await Promise.all([
+        this.boardsService.getAttachedBoards(),
+        this.boardsService.getAvailablePorts(),
+        this.loadState(),
+      ]);
       this._attachedBoards = attachedBoards;
       this._availablePorts = availablePorts;
       this.onAvailablePortsChangedEmitter.fire(this._availablePorts);
-      this.reconcileAvailableBoards().then(() => this.tryReconnect());
+
+      await this.reconcileAvailableBoards();
+
+      this.tryReconnect();
+      this._reconciled.resolve();
     });
   }
 
+  get reconciled(): Promise<void> {
+    return this._reconciled.promise;
+  }
+
   protected notifyAttachedBoardsChanged(
     event: AttachedBoardsChangeEvent
   ): void {
@@ -155,7 +170,7 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
           .then(async (answer) => {
             if (answer === yes) {
               this.commandService.executeCommand(
-                ArduinoCommands.OPEN_BOARDS_DIALOG.id,
+                'arduino-open-boards-dialog',
                 selectedBoard.name
               );
             }
@@ -185,8 +200,8 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
         const selectedAvailableBoard = AvailableBoard.is(selectedBoard)
           ? selectedBoard
           : this._availableBoards.find((availableBoard) =>
-            Board.sameAs(availableBoard, selectedBoard)
-          );
+              Board.sameAs(availableBoard, selectedBoard)
+            );
         if (
           selectedAvailableBoard &&
           selectedAvailableBoard.selected &&
@@ -209,7 +224,7 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
     }
   }
 
-  protected async tryReconnect(): Promise<boolean> {
+  protected tryReconnect(): boolean {
     if (this.latestValidBoardsConfig && !this.canUploadTo(this.boardsConfig)) {
       for (const board of this.availableBoards.filter(
         ({ state }) => state !== AvailableBoard.State.incomplete
@@ -231,7 +246,8 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
         if (
           this.latestValidBoardsConfig.selectedBoard.fqbn === board.fqbn &&
           this.latestValidBoardsConfig.selectedBoard.name === board.name &&
-          this.latestValidBoardsConfig.selectedPort.protocol === board.port?.protocol
+          this.latestValidBoardsConfig.selectedPort.protocol ===
+            board.port?.protocol
         ) {
           this.boardsConfig = {
             ...this.latestValidBoardsConfig,
@@ -258,7 +274,7 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
   }
 
   protected setBoardsConfig(config: BoardsConfig.Config): void {
-    this.logger.info('Board config changed: ', JSON.stringify(config));
+    this.logger.debug('Board config changed: ', JSON.stringify(config));
     this._boardsConfig = config;
     this.latestBoardsConfig = this._boardsConfig;
     if (this.canUploadTo(this._boardsConfig)) {
@@ -376,14 +392,14 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
     const timeoutTask =
       !!timeout && timeout > 0
         ? new Promise<void>((_, reject) =>
-          setTimeout(
-            () => reject(new Error(`Timeout after ${timeout} ms.`)),
-            timeout
+            setTimeout(
+              () => reject(new Error(`Timeout after ${timeout} ms.`)),
+              timeout
+            )
           )
-        )
         : new Promise<void>(() => {
-          /* never */
-        });
+            /* never */
+          });
     const waitUntilTask = new Promise<void>((resolve) => {
       let candidate = find(what, this.availableBoards);
       if (candidate) {
@@ -500,6 +516,7 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
     for (let i = 0; !hasChanged && i < availableBoards.length; i++) {
       const [left, right] = [availableBoards[i], currentAvailableBoards[i]];
       hasChanged =
+        left.fqbn !== right.fqbn ||
         !!AvailableBoard.compare(left, right) ||
         left.selected !== right.selected;
     }
@@ -534,8 +551,9 @@ export class BoardsServiceProvider implements FrontendApplicationContribution {
 
   protected getLastSelectedBoardOnPortKey(port: Port | string): string {
     // TODO: we lose the port's `protocol` info (`serial`, `network`, etc.) here if the `port` is a `string`.
-    return `last-selected-board-on-port:${typeof port === 'string' ? port : port.address
-      }`;
+    return `last-selected-board-on-port:${
+      typeof port === 'string' ? port : port.address
+    }`;
   }
 
   protected async loadState(): Promise<void> {

arduino-ide-extension/src/browser/boards/boards-toolbar-item.tsx

@@ -1,15 +1,16 @@
-import * as React from 'react';
-import * as ReactDOM from 'react-dom';
+import * as React from '@theia/core/shared/react';
+import * as ReactDOM from '@theia/core/shared/react-dom';
 import { CommandRegistry } from '@theia/core/lib/common/command';
 import { DisposableCollection } from '@theia/core/lib/common/disposable';
 import { Port } from '../../common/protocol';
-import { BoardsConfig } from './boards-config';
-import { ArduinoCommands } from '../arduino-commands';
+import { OpenBoardsConfig } from '../contributions/open-boards-config';
 import {
   BoardsServiceProvider,
   AvailableBoard,
 } from './boards-service-provider';
 import { nls } from '@theia/core/lib/common';
+import classNames from 'classnames';
+import { BoardsConfig } from './boards-config';
 
 export interface BoardsDropDownListCoords {
   readonly top: number;
@@ -28,10 +29,12 @@ export namespace BoardsDropDown {
 
 export class BoardsDropDown extends React.Component<BoardsDropDown.Props> {
   protected dropdownElement: HTMLElement;
+  private listRef: React.RefObject<HTMLDivElement>;
 
   constructor(props: BoardsDropDown.Props) {
     super(props);
 
+    this.listRef = React.createRef();
     let list = document.getElementById('boards-dropdown-container');
     if (!list) {
       list = document.createElement('div');
@@ -41,7 +44,13 @@ export class BoardsDropDown extends React.Component<BoardsDropDown.Props> {
     }
   }
 
-  render(): React.ReactNode {
+  override componentDidUpdate(prevProps: BoardsDropDown.Props): void {
+    if (prevProps.coords === 'hidden' && this.listRef.current) {
+      this.listRef.current.focus();
+    }
+  }
+
+  override render(): React.ReactNode {
     return ReactDOM.createPortal(this.renderNode(), this.dropdownElement);
   }
 
@@ -61,21 +70,22 @@ export class BoardsDropDown extends React.Component<BoardsDropDown.Props> {
           position: 'absolute',
           ...coords,
         }}
+        ref={this.listRef}
+        tabIndex={0}
       >
-        {items
-          .map(({ name, port, selected, onClick }) => ({
-            label: nls.localize(
-              'arduino/board/boardListItem',
-              '{0} at {1}',
-              name,
-              Port.toString(port)
-            ),
-            selected,
-            onClick,
-          }))
-          .map(this.renderItem)}
+        <div className="arduino-boards-dropdown-list--items-container">
+          {items
+            .map(({ name, port, selected, onClick }) => ({
+              boardLabel: name,
+              port,
+              selected,
+              onClick,
+            }))
+            .map(this.renderItem)}
+        </div>
         <div
           key={footerLabel}
+          tabIndex={0}
           className="arduino-boards-dropdown-item arduino-board-dropdown-footer"
           onClick={() => this.props.openBoardsConfig()}
         >
@@ -86,22 +96,52 @@ export class BoardsDropDown extends React.Component<BoardsDropDown.Props> {
   }
 
   protected renderItem({
-    label,
+    boardLabel,
+    port,
     selected,
     onClick,
   }: {
-    label: string;
+    boardLabel: string;
+    port: Port;
     selected?: boolean;
     onClick: () => void;
   }): React.ReactNode {
+    const protocolIcon = iconNameFromProtocol(port.protocol);
+    const onKeyUp = (e: React.KeyboardEvent) => {
+      if (e.key === 'Enter') {
+        onClick();
+      }
+    };
+
     return (
       <div
-        key={label}
-        className={`arduino-boards-dropdown-item ${selected ? 'selected' : ''}`}
+        key={`board-item--${boardLabel}-${port.address}`}
+        className={classNames('arduino-boards-dropdown-item', {
+          'arduino-boards-dropdown-item--selected': selected,
+        })}
         onClick={onClick}
+        onKeyUp={onKeyUp}
+        tabIndex={0}
       >
-        <div>{label}</div>
-        {selected ? <span className="fa fa-check" /> : ''}
+        <div
+          className={classNames(
+            'arduino-boards-dropdown-item--protocol',
+            'fa',
+            protocolIcon
+          )}
+        />
+        <div
+          className="arduino-boards-dropdown-item--label"
+          title={`${boardLabel}\n${port.address}`}
+        >
+          <div className="arduino-boards-dropdown-item--board-label noWrapInfo noselect">
+            {boardLabel}
+          </div>
+          <div className="arduino-boards-dropdown-item--port-label noWrapInfo noselect">
+            {port.address}
+          </div>
+        </div>
+        {selected ? <div className="fa fa-check" /> : ''}
       </div>
     );
   }
@@ -119,7 +159,7 @@ export class BoardsToolBarItem extends React.Component<
   constructor(props: BoardsToolBarItem.Props) {
     super(props);
 
-    const { availableBoards } = props.boardsServiceClient;
+    const { availableBoards } = props.boardsServiceProvider;
     this.state = {
       availableBoards,
       coords: 'hidden',
@@ -130,17 +170,17 @@ export class BoardsToolBarItem extends React.Component<
     });
   }
 
-  componentDidMount() {
-    this.props.boardsServiceClient.onAvailableBoardsChanged((availableBoards) =>
-      this.setState({ availableBoards })
+  override componentDidMount(): void {
+    this.props.boardsServiceProvider.onAvailableBoardsChanged(
+      (availableBoards) => this.setState({ availableBoards })
     );
   }
 
-  componentWillUnmount(): void {
+  override componentWillUnmount(): void {
     this.toDispose.dispose();
   }
 
-  protected readonly show = (event: React.MouseEvent<HTMLElement>) => {
+  protected readonly show = (event: React.MouseEvent<HTMLElement>): void => {
     const { currentTarget: element } = event;
     if (element instanceof HTMLElement) {
       if (this.state.coords === 'hidden') {
@@ -161,38 +201,45 @@ export class BoardsToolBarItem extends React.Component<
     event.nativeEvent.stopImmediatePropagation();
   };
 
-  render(): React.ReactNode {
+  override render(): React.ReactNode {
     const { coords, availableBoards } = this.state;
-    const boardsConfig = this.props.boardsServiceClient.boardsConfig;
-    const title = BoardsConfig.Config.toString(boardsConfig, {
-      default: nls.localize(
-        'arduino/common/noBoardSelected',
-        'No board selected'
-      ),
-    });
-    const decorator = (() => {
-      const selectedBoard = availableBoards.find(({ selected }) => selected);
-      if (!selectedBoard || !selectedBoard.port) {
-        return 'fa fa-times notAttached';
-      }
-      if (selectedBoard.state === AvailableBoard.State.guessed) {
-        return 'fa fa-exclamation-triangle guessed';
-      }
-      return '';
-    })();
+    const { selectedBoard, selectedPort } =
+      this.props.boardsServiceProvider.boardsConfig;
+
+    const boardLabel =
+      selectedBoard?.name ||
+      nls.localize('arduino/board/selectBoard', 'Select Board');
+    const selectedPortLabel = portLabel(selectedPort?.address);
+
+    const isConnected = Boolean(selectedBoard && selectedPort);
+    const protocolIcon = isConnected
+      ? iconNameFromProtocol(selectedPort?.protocol || '')
+      : null;
+    const protocolIconClassNames = classNames(
+      'arduino-boards-toolbar-item--protocol',
+      'fa',
+      protocolIcon
+    );
 
     return (
       <React.Fragment>
-        <div className="arduino-boards-toolbar-item-container">
-          <div className="arduino-boards-toolbar-item" title={title}>
-            <div className="inner-container" onClick={this.show}>
-              <span className={decorator} />
-              <div className="label noWrapInfo">
-                <div className="noWrapInfo noselect">{title}</div>
-              </div>
-              <span className="fa fa-caret-down caret" />
-            </div>
+        <div
+          className="arduino-boards-toolbar-item-container"
+          title={selectedPortLabel}
+          onClick={this.show}
+        >
+          {protocolIcon && <div className={protocolIconClassNames} />}
+          <div
+            className={classNames(
+              'arduino-boards-toolbar-item--label',
+              'noWrapInfo',
+              'noselect',
+              { 'arduino-boards-toolbar-item--label-connected': isConnected }
+            )}
+          >
+            {boardLabel}
           </div>
+          <div className="fa fa-caret-down caret" />
         </div>
         <BoardsDropDown
           coords={coords}
@@ -201,17 +248,20 @@ export class BoardsToolBarItem extends React.Component<
             .map((board) => ({
               ...board,
               onClick: () => {
-                if (board.state === AvailableBoard.State.incomplete) {
-                  this.props.boardsServiceClient.boardsConfig = {
+                if (!board.fqbn) {
+                  const previousBoardConfig =
+                    this.props.boardsServiceProvider.boardsConfig;
+                  this.props.boardsServiceProvider.boardsConfig = {
                     selectedPort: board.port,
                   };
-                  this.openDialog();
+                  this.openDialog(previousBoardConfig);
                 } else {
-                  this.props.boardsServiceClient.boardsConfig = {
+                  this.props.boardsServiceProvider.boardsConfig = {
                     selectedBoard: board,
                     selectedPort: board.port,
                   };
                 }
+                this.setState({ coords: 'hidden' });
               },
             }))}
           openBoardsConfig={this.openDialog}
@@ -220,14 +270,25 @@ export class BoardsToolBarItem extends React.Component<
     );
   }
 
-  protected openDialog = () => {
-    this.props.commands.executeCommand(ArduinoCommands.OPEN_BOARDS_DIALOG.id);
-    this.setState({ coords: 'hidden' });
+  protected openDialog = async (
+    previousBoardConfig?: BoardsConfig.Config
+  ): Promise<void> => {
+    const selectedBoardConfig =
+      await this.props.commands.executeCommand<BoardsConfig.Config>(
+        OpenBoardsConfig.Commands.OPEN_DIALOG.id
+      );
+    if (
+      previousBoardConfig &&
+      (!selectedBoardConfig?.selectedPort ||
+        !selectedBoardConfig?.selectedBoard)
+    ) {
+      this.props.boardsServiceProvider.boardsConfig = previousBoardConfig;
+    }
   };
 }
 export namespace BoardsToolBarItem {
   export interface Props {
-    readonly boardsServiceClient: BoardsServiceProvider;
+    readonly boardsServiceProvider: BoardsServiceProvider;
     readonly commands: CommandRegistry;
   }
 
@@ -236,3 +297,26 @@ export namespace BoardsToolBarItem {
     coords: BoardsDropDownListCoords | 'hidden';
   }
 }
+
+function iconNameFromProtocol(protocol: string): string {
+  switch (protocol) {
+    case 'serial':
+      return 'fa-arduino-technology-usb';
+    case 'network':
+      return 'fa-arduino-technology-connection';
+    /* 
+      Bluetooth ports are not listed yet from the CLI;
+      Not sure about the naming ('bluetooth'); make sure it's correct before uncommenting the following lines
+    */
+    // case 'bluetooth':
+    //   return 'fa-arduino-technology-bluetooth';
+    default:
+      return 'fa-arduino-technology-3dimensionscube';
+  }
+}
+
+function portLabel(portName?: string): string {
+  return portName
+    ? nls.localize('arduino/board/portLabel', 'Port: {0}', portName)
+    : nls.localize('arduino/board/disconnected', 'Disconnected');
+}

arduino-ide-extension/src/browser/boards/boards-widget-frontend-contribution.ts

@@ -1,4 +1,4 @@
-import { injectable } from 'inversify';
+import { injectable } from '@theia/core/shared/inversify';
 import { BoardsListWidget } from './boards-list-widget';
 import { BoardsPackage } from '../../common/protocol/boards-service';
 import { ListWidgetFrontendContribution } from '../widgets/component-list/list-widget-frontend-contribution';
@@ -18,7 +18,7 @@ export class BoardsListWidgetFrontendContribution extends ListWidgetFrontendCont
     });
   }
 
-  async initializeLayout(): Promise<void> {
+  override async initializeLayout(): Promise<void> {
     this.openView();
   }
 }

arduino-ide-extension/src/browser/components/ProgressBar.tsx

@@ -0,0 +1,28 @@
+import * as React from '@theia/core/shared/react';
+
+export type ProgressBarProps = {
+  percent?: number;
+  showPercentage?: boolean;
+};
+
+export default function ProgressBar({
+  percent = 0,
+  showPercentage = false,
+}: ProgressBarProps): React.ReactElement {
+  const roundedPercent = Math.round(percent);
+  return (
+    <div className="progress-bar">
+      <div className="progress-bar--outer">
+        <div
+          className="progress-bar--inner"
+          style={{ width: `${roundedPercent}%` }}
+        />
+      </div>
+      {showPercentage && (
+        <div className="progress-bar--percentage">
+          <div className="progress-bar--percentage-text">{roundedPercent}%</div>
+        </div>
+      )}
+    </div>
+  );
+}

arduino-ide-extension/src/browser/contributions/about.ts

@@ -1,6 +1,6 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import * as moment from 'moment';
-import { remote } from 'electron';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import { isOSX, isWindows } from '@theia/core/lib/common/os';
 import { ClipboardService } from '@theia/core/lib/browser/clipboard-service';
 import { FrontendApplicationConfigProvider } from '@theia/core/lib/browser/frontend-application-config-provider';
@@ -22,13 +22,13 @@ export class About extends Contribution {
   @inject(ConfigService)
   protected readonly configService: ConfigService;
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(About.Commands.ABOUT_APP, {
       execute: () => this.showAbout(),
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.HELP__ABOUT_GROUP, {
       commandId: About.Commands.ABOUT_APP.id,
       label: nls.localize(

arduino-ide-extension/src/browser/contributions/add-file.ts

@@ -1,5 +1,5 @@
-import { inject, injectable } from 'inversify';
-import { remote } from 'electron';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import { ArduinoMenus } from '../menu/arduino-menus';
 import {
   SketchContribution,
@@ -10,19 +10,20 @@ import {
 } from './contribution';
 import { FileDialogService } from '@theia/filesystem/lib/browser';
 import { nls } from '@theia/core/lib/common';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
 
 @injectable()
 export class AddFile extends SketchContribution {
   @inject(FileDialogService)
   protected readonly fileDialogService: FileDialogService;
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(AddFile.Commands.ADD_FILE, {
       execute: () => this.addFile(),
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.SKETCH__UTILS_GROUP, {
       commandId: AddFile.Commands.ADD_FILE.id,
       label: nls.localize('arduino/contributions/addFile', 'Add File') + '...',
@@ -32,7 +33,7 @@ export class AddFile extends SketchContribution {
 
   protected async addFile(): Promise<void> {
     const sketch = await this.sketchServiceClient.currentSketch();
-    if (!sketch) {
+    if (!CurrentSketch.isValid(sketch)) {
       return;
     }
     const toAddUri = await this.fileDialogService.showOpenDialog({

arduino-ide-extension/src/browser/contributions/add-zip-library.ts

@@ -1,14 +1,11 @@
-import { inject, injectable } from 'inversify';
-import { remote } from 'electron';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import URI from '@theia/core/lib/common/uri';
 import { ConfirmDialog } from '@theia/core/lib/browser/dialogs';
 import { EnvVariablesServer } from '@theia/core/lib/common/env-variables';
 import { ArduinoMenus } from '../menu/arduino-menus';
-import {
-  Installable,
-  LibraryService,
-  ResponseServiceArduino,
-} from '../../common/protocol';
+import { LibraryService, ResponseServiceClient } from '../../common/protocol';
+import { ExecuteWithProgress } from '../../common/protocol/progressible';
 import {
   SketchContribution,
   Command,
@@ -22,27 +19,23 @@ export class AddZipLibrary extends SketchContribution {
   @inject(EnvVariablesServer)
   protected readonly envVariableServer: EnvVariablesServer;
 
-  @inject(ResponseServiceArduino)
-  protected readonly responseService: ResponseServiceArduino;
+  @inject(ResponseServiceClient)
+  protected readonly responseService: ResponseServiceClient;
 
   @inject(LibraryService)
   protected readonly libraryService: LibraryService;
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(AddZipLibrary.Commands.ADD_ZIP_LIBRARY, {
       execute: () => this.addZipLibrary(),
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     const includeLibMenuPath = [
       ...ArduinoMenus.SKETCH__UTILS_GROUP,
       '0_include',
     ];
-    // TODO: do we need it? calling `registerSubmenu` multiple times is noop, so it does not hurt.
-    registry.registerSubmenu(includeLibMenuPath, 'Include Library', {
-      order: '1',
-    });
     registry.registerMenuAction([...includeLibMenuPath, '1_install'], {
       commandId: AddZipLibrary.Commands.ADD_ZIP_LIBRARY.id,
       label: nls.localize('arduino/library/addZip', 'Add .ZIP Library...'),
@@ -92,7 +85,7 @@ export class AddZipLibrary extends SketchContribution {
 
   private async doInstall(zipUri: string, overwrite?: boolean): Promise<void> {
     try {
-      await Installable.doWithProgress({
+      await ExecuteWithProgress.doWithProgress({
         messageService: this.messageService,
         progressText:
           nls.localize('arduino/common/processing', 'Processing') +

arduino-ide-extension/src/browser/contributions/archive-sketch.ts

@@ -1,5 +1,5 @@
-import { injectable } from 'inversify';
-import { remote } from 'electron';
+import { injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import * as dateFormat from 'dateformat';
 import URI from '@theia/core/lib/common/uri';
 import { ArduinoMenus } from '../menu/arduino-menus';
@@ -10,16 +10,17 @@ import {
   MenuModelRegistry,
 } from './contribution';
 import { nls } from '@theia/core/lib/common';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
 
 @injectable()
 export class ArchiveSketch extends SketchContribution {
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(ArchiveSketch.Commands.ARCHIVE_SKETCH, {
       execute: () => this.archiveSketch(),
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.TOOLS__MAIN_GROUP, {
       commandId: ArchiveSketch.Commands.ARCHIVE_SKETCH.id,
       label: nls.localize('arduino/sketch/archiveSketch', 'Archive Sketch'),
@@ -32,7 +33,7 @@ export class ArchiveSketch extends SketchContribution {
       this.sketchServiceClient.currentSketch(),
       this.configService.getConfiguration(),
     ]);
-    if (!sketch) {
+    if (!CurrentSketch.isValid(sketch)) {
       return;
     }
     const archiveBasename = `${sketch.name}-${dateFormat(

arduino-ide-extension/src/browser/contributions/board-selection.ts

@@ -1,5 +1,5 @@
-import { inject, injectable } from 'inversify';
-import { remote } from 'electron';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import { MenuModelRegistry } from '@theia/core/lib/common/menu';
 import {
   DisposableCollection,
@@ -47,7 +47,7 @@ export class BoardSelection extends SketchContribution {
 
   protected readonly toDisposeBeforeMenuRebuild = new DisposableCollection();
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(BoardSelection.Commands.GET_BOARD_INFO, {
       execute: async () => {
         const { selectedBoard, selectedPort } =
@@ -100,19 +100,20 @@ PID: ${PID}`;
     });
   }
 
-  onStart(): void {
+  override onStart(): void {
+    this.notificationCenter.onPlatformDidInstall(() => this.updateMenus());
+    this.notificationCenter.onPlatformDidUninstall(() => this.updateMenus());
+    this.boardsServiceProvider.onBoardsConfigChanged(() => this.updateMenus());
+    this.boardsServiceProvider.onAvailableBoardsChanged(() =>
+      this.updateMenus()
+    );
+    this.boardsServiceProvider.onAvailablePortsChanged(() =>
+      this.updateMenus()
+    );
+  }
+
+  override async onReady(): Promise<void> {
     this.updateMenus();
-    this.notificationCenter.onPlatformInstalled(this.updateMenus.bind(this));
-    this.notificationCenter.onPlatformUninstalled(this.updateMenus.bind(this));
-    this.boardsServiceProvider.onBoardsConfigChanged(
-      this.updateMenus.bind(this)
-    );
-    this.boardsServiceProvider.onAvailableBoardsChanged(
-      this.updateMenus.bind(this)
-    );
-    this.boardsServiceProvider.onAvailablePortsChanged(
-      this.updateMenus.bind(this)
-    );
   }
 
   protected async updateMenus(): Promise<void> {

arduino-ide-extension/src/browser/contributions/burn-bootloader.ts

@@ -1,42 +1,23 @@
-import { inject, injectable } from 'inversify';
-import { OutputChannelManager } from '@theia/output/lib/browser/output-channel';
+import { nls } from '@theia/core/lib/common';
+import { injectable } from '@theia/core/shared/inversify';
 import { CoreService } from '../../common/protocol';
 import { ArduinoMenus } from '../menu/arduino-menus';
-import { BoardsDataStore } from '../boards/boards-data-store';
-import { SerialConnectionManager } from '../serial/serial-connection-manager';
-import { BoardsServiceProvider } from '../boards/boards-service-provider';
 import {
-  SketchContribution,
   Command,
   CommandRegistry,
+  CoreServiceContribution,
   MenuModelRegistry,
 } from './contribution';
-import { nls } from '@theia/core/lib/common';
 
 @injectable()
-export class BurnBootloader extends SketchContribution {
-  @inject(CoreService)
-  protected readonly coreService: CoreService;
-
-  @inject(SerialConnectionManager)
-  protected readonly serialConnection: SerialConnectionManager;
-
-  @inject(BoardsDataStore)
-  protected readonly boardsDataStore: BoardsDataStore;
-
-  @inject(BoardsServiceProvider)
-  protected readonly boardsServiceClientImpl: BoardsServiceProvider;
-
-  @inject(OutputChannelManager)
-  protected readonly outputChannelManager: OutputChannelManager;
-
-  registerCommands(registry: CommandRegistry): void {
+export class BurnBootloader extends CoreServiceContribution {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(BurnBootloader.Commands.BURN_BOOTLOADER, {
       execute: () => this.burnBootloader(),
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.TOOLS__BOARD_SETTINGS_GROUP, {
       commandId: BurnBootloader.Commands.BURN_BOOTLOADER.id,
       label: nls.localize(
@@ -47,26 +28,19 @@ export class BurnBootloader extends SketchContribution {
     });
   }
 
-  async burnBootloader(): Promise<void> {
+  private async burnBootloader(): Promise<void> {
+    const options = await this.options();
     try {
-      const { boardsConfig } = this.boardsServiceClientImpl;
-      const port = boardsConfig.selectedPort;
-      const [fqbn, { selectedProgrammer: programmer }, verify, verbose] =
-        await Promise.all([
-          this.boardsDataStore.appendConfigToFqbn(
-            boardsConfig.selectedBoard?.fqbn
-          ),
-          this.boardsDataStore.getData(boardsConfig.selectedBoard?.fqbn),
-          this.preferences.get('arduino.upload.verify'),
-          this.preferences.get('arduino.upload.verbose'),
-        ]);
-      this.outputChannelManager.getChannel('Arduino').clear();
-      await this.coreService.burnBootloader({
-        fqbn,
-        programmer,
-        port,
-        verify,
-        verbose,
+      await this.doWithProgress({
+        progressText: nls.localize(
+          'arduino/bootloader/burningBootloader',
+          'Burning bootloader...'
+        ),
+        task: (progressId, coreService) =>
+          coreService.burnBootloader({
+            ...options,
+            progressId,
+          }),
       });
       this.messageService.info(
         nls.localize(
@@ -78,17 +52,30 @@ export class BurnBootloader extends SketchContribution {
         }
       );
     } catch (e) {
-      let errorMessage = "";
-      if (typeof e === "string") {
-        errorMessage = e;
-      } else {
-        errorMessage = e.toString();
-      }
-      this.messageService.error(errorMessage);
-    } finally {
-      await this.serialConnection.reconnectAfterUpload();
+      this.handleError(e);
     }
   }
+
+  private async options(): Promise<CoreService.Options.Bootloader> {
+    const { boardsConfig } = this.boardsServiceProvider;
+    const port = boardsConfig.selectedPort;
+    const [fqbn, { selectedProgrammer: programmer }, verify, verbose] =
+      await Promise.all([
+        this.boardsDataStore.appendConfigToFqbn(
+          boardsConfig.selectedBoard?.fqbn
+        ),
+        this.boardsDataStore.getData(boardsConfig.selectedBoard?.fqbn),
+        this.preferences.get('arduino.upload.verify'),
+        this.preferences.get('arduino.upload.verbose'),
+      ]);
+    return {
+      fqbn,
+      programmer,
+      port,
+      verify,
+      verbose,
+    };
+  }
 }
 
 export namespace BurnBootloader {

arduino-ide-extension/src/browser/contributions/check-for-updates.ts

@@ -0,0 +1,64 @@
+import { nls } from '@theia/core/lib/common/nls';
+import { LocalStorageService } from '@theia/core/lib/browser/storage-service';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import {
+  IDEUpdater,
+  SKIP_IDE_VERSION,
+} from '../../common/protocol/ide-updater';
+import { IDEUpdaterDialog } from '../dialogs/ide-updater/ide-updater-dialog';
+import { Contribution } from './contribution';
+
+@injectable()
+export class CheckForUpdates extends Contribution {
+  @inject(IDEUpdater)
+  private readonly updater: IDEUpdater;
+
+  @inject(IDEUpdaterDialog)
+  private readonly updaterDialog: IDEUpdaterDialog;
+
+  @inject(LocalStorageService)
+  private readonly localStorage: LocalStorageService;
+
+  override onStart(): void {
+    this.preferences.onPreferenceChanged(
+      ({ preferenceName, newValue, oldValue }) => {
+        if (newValue !== oldValue) {
+          switch (preferenceName) {
+            case 'arduino.ide.updateChannel':
+            case 'arduino.ide.updateBaseUrl':
+              this.updater.init(
+                this.preferences.get('arduino.ide.updateChannel'),
+                this.preferences.get('arduino.ide.updateBaseUrl')
+              );
+          }
+        }
+      }
+    );
+  }
+
+  override onReady(): void {
+    this.updater
+      .init(
+        this.preferences.get('arduino.ide.updateChannel'),
+        this.preferences.get('arduino.ide.updateBaseUrl')
+      )
+      .then(() => this.updater.checkForUpdates(true))
+      .then(async (updateInfo) => {
+        if (!updateInfo) return;
+        const versionToSkip = await this.localStorage.getData<string>(
+          SKIP_IDE_VERSION
+        );
+        if (versionToSkip === updateInfo.version) return;
+        this.updaterDialog.open(updateInfo);
+      })
+      .catch((e) => {
+        this.messageService.error(
+          nls.localize(
+            'arduino/ide-updater/errorCheckingForUpdates',
+            'Error while checking for Arduino IDE updates.\n{0}',
+            e.message
+          )
+        );
+      });
+  }
+}

arduino-ide-extension/src/browser/contributions/close.ts

@@ -1,12 +1,10 @@
-import { inject, injectable } from 'inversify';
-import { toArray } from '@phosphor/algorithm';
-import { remote } from 'electron';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import { MonacoEditor } from '@theia/monaco/lib/browser/monaco-editor';
 import { EditorManager } from '@theia/editor/lib/browser/editor-manager';
 import { ApplicationShell } from '@theia/core/lib/browser/shell/application-shell';
 import { FrontendApplication } from '@theia/core/lib/browser/frontend-application';
 import { ArduinoMenus } from '../menu/arduino-menus';
-import { SaveAsSketch } from './save-as-sketch';
 import {
   SketchContribution,
   Command,
@@ -23,90 +21,21 @@ import { nls } from '@theia/core/lib/common';
 @injectable()
 export class Close extends SketchContribution {
   @inject(EditorManager)
-  protected readonly editorManager: EditorManager;
+  protected override readonly editorManager: EditorManager;
 
   protected shell: ApplicationShell;
 
-  onStart(app: FrontendApplication): void {
+  override onStart(app: FrontendApplication): void {
     this.shell = app.shell;
   }
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(Close.Commands.CLOSE, {
-      execute: async () => {
-        // Close current editor if closeable.
-        const { currentEditor } = this.editorManager;
-        if (currentEditor && currentEditor.title.closable) {
-          currentEditor.close();
-          return;
-        }
-
-        // Close current widget from the main area if possible.
-        const { currentWidget } = this.shell;
-        if (currentWidget) {
-          const currentWidgetInMain = toArray(
-            this.shell.mainPanel.widgets()
-          ).find((widget) => widget === currentWidget);
-          if (currentWidgetInMain && currentWidgetInMain.title.closable) {
-            return currentWidgetInMain.close();
-          }
-        }
-
-        // Close the sketch (window).
-        const sketch = await this.sketchServiceClient.currentSketch();
-        if (!sketch) {
-          return;
-        }
-        const isTemp = await this.sketchService.isTemp(sketch);
-        const uri = await this.sketchServiceClient.currentSketchFile();
-        if (!uri) {
-          return;
-        }
-        if (isTemp && (await this.wasTouched(uri))) {
-          const { response } = await remote.dialog.showMessageBox({
-            type: 'question',
-            buttons: [
-              nls.localize(
-                'vscode/abstractTaskService/saveBeforeRun.dontSave',
-                "Don't Save"
-              ),
-              nls.localize('vscode/issueMainService/cancel', 'Cancel'),
-              nls.localize(
-                'vscode/abstractTaskService/saveBeforeRun.save',
-                'Save'
-              ),
-            ],
-            message: nls.localize(
-              'arduino/common/saveChangesToSketch',
-              'Do you want to save changes to this sketch before closing?'
-            ),
-            detail: nls.localize(
-              'arduino/common/loseChanges',
-              "If you don't save, your changes will be lost."
-            ),
-          });
-          if (response === 1) {
-            // Cancel
-            return;
-          }
-          if (response === 2) {
-            // Save
-            const saved = await this.commandService.executeCommand(
-              SaveAsSketch.Commands.SAVE_AS_SKETCH.id,
-              { openAfterMove: false, execOnlyIfTemp: true }
-            );
-            if (!saved) {
-              // If it was not saved, do bail the close.
-              return;
-            }
-          }
-        }
-        window.close();
-      },
+      execute: () => remote.getCurrentWindow().close()
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.FILE__SKETCH_GROUP, {
       commandId: Close.Commands.CLOSE.id,
       label: nls.localize('vscode/editor.contribution/close', 'Close'),
@@ -114,7 +43,7 @@ export class Close extends SketchContribution {
     });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: Close.Commands.CLOSE.id,
       keybinding: 'CtrlCmd+W',

arduino-ide-extension/src/browser/contributions/compiler-errors.ts

@@ -0,0 +1,650 @@
+import {
+  Command,
+  CommandRegistry,
+  Disposable,
+  DisposableCollection,
+  Emitter,
+  MaybePromise,
+  nls,
+  notEmpty,
+} from '@theia/core';
+import { ApplicationShell, FrontendApplication } from '@theia/core/lib/browser';
+import URI from '@theia/core/lib/common/uri';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import {
+  Location,
+  Range,
+} from '@theia/core/shared/vscode-languageserver-protocol';
+import {
+  EditorWidget,
+  TextDocumentChangeEvent,
+} from '@theia/editor/lib/browser';
+import {
+  EditorDecoration,
+  TrackedRangeStickiness,
+} from '@theia/editor/lib/browser/decorations/editor-decoration';
+import { EditorManager } from '@theia/editor/lib/browser/editor-manager';
+import * as monaco from '@theia/monaco-editor-core';
+import { MonacoEditor } from '@theia/monaco/lib/browser/monaco-editor';
+import { MonacoToProtocolConverter } from '@theia/monaco/lib/browser/monaco-to-protocol-converter';
+import { ProtocolToMonacoConverter } from '@theia/monaco/lib/browser/protocol-to-monaco-converter';
+import { CoreError } from '../../common/protocol/core-service';
+import { ErrorRevealStrategy } from '../arduino-preferences';
+import { InoSelector } from '../ino-selectors';
+import { fullRange } from '../utils/monaco';
+import { Contribution } from './contribution';
+import { CoreErrorHandler } from './core-error-handler';
+
+interface ErrorDecoration {
+  /**
+   * This is the unique ID of the decoration given by `monaco`.
+   */
+  readonly id: string;
+  /**
+   * The resource this decoration belongs to.
+   */
+  readonly uri: string;
+}
+namespace ErrorDecoration {
+  export function rangeOf(
+    { id, uri }: ErrorDecoration,
+    editorProvider: (uri: string) => Promise<MonacoEditor | undefined>
+  ): Promise<monaco.Range | undefined>;
+  export function rangeOf(
+    { id, uri }: ErrorDecoration,
+    editorProvider: MonacoEditor
+  ): monaco.Range | undefined;
+  export function rangeOf(
+    { id, uri }: ErrorDecoration,
+    editorProvider:
+      | ((uri: string) => Promise<MonacoEditor | undefined>)
+      | MonacoEditor
+  ): MaybePromise<monaco.Range | undefined> {
+    if (editorProvider instanceof MonacoEditor) {
+      const control = editorProvider.getControl();
+      const model = control.getModel();
+      if (model) {
+        return control
+          .getDecorationsInRange(fullRange(model))
+          ?.find(({ id: candidateId }) => id === candidateId)?.range;
+      }
+      return undefined;
+    }
+    return editorProvider(uri).then((editor) => {
+      if (editor) {
+        return rangeOf({ id, uri }, editor);
+      }
+      return undefined;
+    });
+  }
+
+  // export async function rangeOf(
+  //   { id, uri }: ErrorDecoration,
+  //   editorProvider:
+  //     | ((uri: string) => Promise<MonacoEditor | undefined>)
+  //     | MonacoEditor
+  // ): Promise<monaco.Range | undefined> {
+  //   const editor =
+  //     editorProvider instanceof MonacoEditor
+  //       ? editorProvider
+  //       : await editorProvider(uri);
+  //   if (editor) {
+  //     const control = editor.getControl();
+  //     const model = control.getModel();
+  //     if (model) {
+  //       return control
+  //         .getDecorationsInRange(fullRange(model))
+  //         ?.find(({ id: candidateId }) => id === candidateId)?.range;
+  //     }
+  //   }
+  //   return undefined;
+  // }
+  export function sameAs(
+    left: ErrorDecoration,
+    right: ErrorDecoration
+  ): boolean {
+    return left.id === right.id && left.uri === right.uri;
+  }
+}
+
+@injectable()
+export class CompilerErrors
+  extends Contribution
+  implements monaco.languages.CodeLensProvider
+{
+  @inject(EditorManager)
+  private readonly editorManager: EditorManager;
+
+  @inject(ProtocolToMonacoConverter)
+  private readonly p2m: ProtocolToMonacoConverter;
+
+  @inject(MonacoToProtocolConverter)
+  private readonly mp2: MonacoToProtocolConverter;
+
+  @inject(CoreErrorHandler)
+  private readonly coreErrorHandler: CoreErrorHandler;
+
+  private readonly errors: ErrorDecoration[] = [];
+  private readonly onDidChangeEmitter = new monaco.Emitter<this>();
+  private readonly currentErrorDidChangEmitter = new Emitter<ErrorDecoration>();
+  private readonly onCurrentErrorDidChange =
+    this.currentErrorDidChangEmitter.event;
+  private readonly toDisposeOnCompilerErrorDidChange =
+    new DisposableCollection();
+  private shell: ApplicationShell | undefined;
+  private revealStrategy = ErrorRevealStrategy.Default;
+  private currentError: ErrorDecoration | undefined;
+  private get currentErrorIndex(): number {
+    const current = this.currentError;
+    if (!current) {
+      return -1;
+    }
+    return this.errors.findIndex((error) =>
+      ErrorDecoration.sameAs(error, current)
+    );
+  }
+
+  override onStart(app: FrontendApplication): void {
+    this.shell = app.shell;
+    monaco.languages.registerCodeLensProvider(InoSelector, this);
+    this.coreErrorHandler.onCompilerErrorsDidChange((errors) =>
+      this.filter(errors).then(this.handleCompilerErrorsDidChange.bind(this))
+    );
+    this.onCurrentErrorDidChange(async (error) => {
+      const range = await ErrorDecoration.rangeOf(error, (uri) =>
+        this.monacoEditor(uri)
+      );
+      if (!range) {
+        console.warn(
+          'compiler-errors',
+          `Could not find range of decoration: ${error.id}`
+        );
+        return;
+      }
+      const editor = await this.revealLocationInEditor({
+        uri: error.uri,
+        range: this.mp2.asRange(range),
+      });
+      if (!editor) {
+        console.warn(
+          'compiler-errors',
+          `Failed to mark error ${error.id} as the current one.`
+        );
+      }
+    });
+    this.preferences.ready.then(() => {
+      this.preferences.onPreferenceChanged(({ preferenceName, newValue }) => {
+        if (preferenceName === 'arduino.compile.revealRange') {
+          this.revealStrategy = ErrorRevealStrategy.is(newValue)
+            ? newValue
+            : ErrorRevealStrategy.Default;
+        }
+      });
+    });
+  }
+
+  override registerCommands(registry: CommandRegistry): void {
+    registry.registerCommand(CompilerErrors.Commands.NEXT_ERROR, {
+      execute: () => {
+        const index = this.currentErrorIndex;
+        if (index < 0) {
+          console.warn(
+            'compiler-errors',
+            `Could not advance to next error. Unknown current error.`
+          );
+          return;
+        }
+        const nextError =
+          this.errors[index === this.errors.length - 1 ? 0 : index + 1];
+        this.markAsCurrentError(nextError);
+      },
+      isEnabled: () => !!this.currentError && this.errors.length > 1,
+    });
+    registry.registerCommand(CompilerErrors.Commands.PREVIOUS_ERROR, {
+      execute: () => {
+        const index = this.currentErrorIndex;
+        if (index < 0) {
+          console.warn(
+            'compiler-errors',
+            `Could not advance to previous error. Unknown current error.`
+          );
+          return;
+        }
+        const previousError =
+          this.errors[index === 0 ? this.errors.length - 1 : index - 1];
+        this.markAsCurrentError(previousError);
+      },
+      isEnabled: () => !!this.currentError && this.errors.length > 1,
+    });
+  }
+
+  get onDidChange(): monaco.IEvent<this> {
+    return this.onDidChangeEmitter.event;
+  }
+
+  async provideCodeLenses(
+    model: monaco.editor.ITextModel,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    _token: monaco.CancellationToken
+  ): Promise<monaco.languages.CodeLensList> {
+    const lenses: monaco.languages.CodeLens[] = [];
+    if (
+      this.currentError &&
+      this.currentError.uri === model.uri.toString() &&
+      this.errors.length > 1
+    ) {
+      const range = await ErrorDecoration.rangeOf(this.currentError, (uri) =>
+        this.monacoEditor(uri)
+      );
+      if (range) {
+        lenses.push(
+          {
+            range,
+            command: {
+              id: CompilerErrors.Commands.PREVIOUS_ERROR.id,
+              title: nls.localize(
+                'arduino/editor/previousError',
+                'Previous Error'
+              ),
+              arguments: [this.currentError],
+            },
+          },
+          {
+            range,
+            command: {
+              id: CompilerErrors.Commands.NEXT_ERROR.id,
+              title: nls.localize('arduino/editor/nextError', 'Next Error'),
+              arguments: [this.currentError],
+            },
+          }
+        );
+      }
+    }
+    return {
+      lenses,
+      dispose: () => {
+        /* NOOP */
+      },
+    };
+  }
+
+  private async handleCompilerErrorsDidChange(
+    errors: CoreError.ErrorLocation[]
+  ): Promise<void> {
+    this.toDisposeOnCompilerErrorDidChange.dispose();
+    const compilerErrorsPerResource = this.groupByResource(
+      await this.filter(errors)
+    );
+    const decorations = await this.decorateEditors(compilerErrorsPerResource);
+    this.errors.push(...decorations.errors);
+    this.toDisposeOnCompilerErrorDidChange.pushAll([
+      Disposable.create(() => (this.errors.length = 0)),
+      Disposable.create(() => this.onDidChangeEmitter.fire(this)),
+      ...(await Promise.all([
+        decorations.dispose,
+        this.trackEditors(
+          compilerErrorsPerResource,
+          (editor) =>
+            editor.editor.onSelectionChanged((selection) =>
+              this.handleSelectionChange(editor, selection)
+            ),
+          (editor) =>
+            editor.onDidDispose(() =>
+              this.handleEditorDidDispose(editor.editor.uri.toString())
+            ),
+          (editor) =>
+            editor.editor.onDocumentContentChanged((event) =>
+              this.handleDocumentContentChange(editor, event)
+            )
+        ),
+      ])),
+    ]);
+    const currentError = this.errors[0];
+    if (currentError) {
+      await this.markAsCurrentError(currentError);
+    }
+  }
+
+  private async filter(
+    errors: CoreError.ErrorLocation[]
+  ): Promise<CoreError.ErrorLocation[]> {
+    if (!errors.length) {
+      return [];
+    }
+    await this.preferences.ready;
+    if (this.preferences['arduino.compile.experimental']) {
+      return errors;
+    }
+    // Always shows maximum one error; hence the code lens navigation is unavailable.
+    return [errors[0]];
+  }
+
+  private async decorateEditors(
+    errors: Map<string, CoreError.ErrorLocation[]>
+  ): Promise<{ dispose: Disposable; errors: ErrorDecoration[] }> {
+    const composite = await Promise.all(
+      [...errors.entries()].map(([uri, errors]) =>
+        this.decorateEditor(uri, errors)
+      )
+    );
+    return {
+      dispose: new DisposableCollection(
+        ...composite.map(({ dispose }) => dispose)
+      ),
+      errors: composite.reduce(
+        (acc, { errors }) => acc.concat(errors),
+        [] as ErrorDecoration[]
+      ),
+    };
+  }
+
+  private async decorateEditor(
+    uri: string,
+    errors: CoreError.ErrorLocation[]
+  ): Promise<{ dispose: Disposable; errors: ErrorDecoration[] }> {
+    const editor = await this.editorManager.getByUri(new URI(uri));
+    if (!editor) {
+      return { dispose: Disposable.NULL, errors: [] };
+    }
+    const oldDecorations = editor.editor.deltaDecorations({
+      oldDecorations: [],
+      newDecorations: errors.map((error) =>
+        this.compilerErrorDecoration(error.location.range)
+      ),
+    });
+    return {
+      dispose: Disposable.create(() => {
+        if (editor) {
+          editor.editor.deltaDecorations({
+            oldDecorations,
+            newDecorations: [],
+          });
+        }
+      }),
+      errors: oldDecorations.map((id) => ({ id, uri })),
+    };
+  }
+
+  private compilerErrorDecoration(range: Range): EditorDecoration {
+    return {
+      range,
+      options: {
+        isWholeLine: true,
+        className: 'compiler-error',
+        stickiness: TrackedRangeStickiness.AlwaysGrowsWhenTypingAtEdges,
+      },
+    };
+  }
+
+  /**
+   * Tracks the selection in all editors that have an error. If the editor selection overlaps one of the compiler error's range, mark as current error.
+   */
+  private handleSelectionChange(editor: EditorWidget, selection: Range): void {
+    const monacoEditor = this.monacoEditor(editor);
+    if (!monacoEditor) {
+      return;
+    }
+    const uri = monacoEditor.uri.toString();
+    const monacoSelection = this.p2m.asRange(selection);
+    console.log(
+      'compiler-errors',
+      `Handling selection change in editor ${uri}. New (monaco) selection: ${monacoSelection.toJSON()}`
+    );
+    const calculatePriority = (
+      candidateErrorRange: monaco.Range,
+      currentSelection: monaco.Range
+    ) => {
+      console.trace(
+        'compiler-errors',
+        `Candidate error range: ${candidateErrorRange.toJSON()}`
+      );
+      console.trace(
+        'compiler-errors',
+        `Current selection range: ${currentSelection.toJSON()}`
+      );
+      if (candidateErrorRange.intersectRanges(currentSelection)) {
+        console.trace('Intersects.');
+        return { score: 2 };
+      }
+      if (
+        candidateErrorRange.startLineNumber <=
+          currentSelection.startLineNumber &&
+        candidateErrorRange.endLineNumber >= currentSelection.endLineNumber
+      ) {
+        console.trace('Same line.');
+        return { score: 1 };
+      }
+
+      console.trace('No match');
+      return undefined;
+    };
+    const error = this.errors
+      .filter((error) => error.uri === uri)
+      .map((error) => ({
+        error,
+        range: ErrorDecoration.rangeOf(error, monacoEditor),
+      }))
+      .map(({ error, range }) => {
+        if (range) {
+          const priority = calculatePriority(range, monacoSelection);
+          if (priority) {
+            return { ...priority, error };
+          }
+        }
+        return undefined;
+      })
+      .filter(notEmpty)
+      .sort((left, right) => right.score - left.score) // highest first
+      .map(({ error }) => error)
+      .shift();
+    if (error) {
+      this.markAsCurrentError(error);
+    } else {
+      console.info(
+        'compiler-errors',
+        `New (monaco) selection ${monacoSelection.toJSON()} does not intersect any error locations. Skipping.`
+      );
+    }
+  }
+
+  /**
+   * This code does not deal with resource deletion, but tracks editor dispose events. It does not matter what was the cause of the editor disposal.
+   * If editor closes, delete the decorators.
+   */
+  private handleEditorDidDispose(uri: string): void {
+    let i = this.errors.length;
+    // `splice` re-indexes the array. It's better to "iterate and modify" from the last element.
+    while (i--) {
+      const error = this.errors[i];
+      if (error.uri === uri) {
+        this.errors.splice(i, 1);
+      }
+    }
+    this.onDidChangeEmitter.fire(this);
+  }
+
+  /**
+   * If a document change "destroys" the range of the decoration, the decoration must be removed.
+   */
+  private handleDocumentContentChange(
+    editor: EditorWidget,
+    event: TextDocumentChangeEvent
+  ): void {
+    const monacoEditor = this.monacoEditor(editor);
+    if (!monacoEditor) {
+      return;
+    }
+    // A decoration location can be "destroyed", hence should be deleted when:
+    // - deleting range (start != end AND text is empty)
+    // - inserting text into range (start != end AND text is not empty)
+    // Filter unrelated delta changes to spare the CPU.
+    const relevantChanges = event.contentChanges.filter(
+      ({ range: { start, end } }) =>
+        start.line !== end.line || start.character !== end.character
+    );
+    if (!relevantChanges.length) {
+      return;
+    }
+
+    const resolvedMarkers = this.errors
+      .filter((error) => error.uri === event.document.uri)
+      .map((error, index) => {
+        const range = ErrorDecoration.rangeOf(error, monacoEditor);
+        if (range) {
+          return { error, range, index };
+        }
+        return undefined;
+      })
+      .filter(notEmpty);
+
+    const decorationIdsToRemove = relevantChanges
+      .map(({ range }) => this.p2m.asRange(range))
+      .map((changeRange) =>
+        resolvedMarkers.filter(({ range: decorationRange }) =>
+          changeRange.containsRange(decorationRange)
+        )
+      )
+      .reduce((acc, curr) => acc.concat(curr), [])
+      .map(({ error, index }) => {
+        this.errors.splice(index, 1);
+        return error.id;
+      });
+    if (!decorationIdsToRemove.length) {
+      return;
+    }
+    monacoEditor.getControl().deltaDecorations(decorationIdsToRemove, []);
+    this.onDidChangeEmitter.fire(this);
+  }
+
+  private async trackEditors(
+    errors: Map<string, CoreError.ErrorLocation[]>,
+    ...track: ((editor: EditorWidget) => Disposable)[]
+  ): Promise<Disposable> {
+    return new DisposableCollection(
+      ...(await Promise.all(
+        Array.from(errors.keys()).map(async (uri) => {
+          const editor = await this.editorManager.getByUri(new URI(uri));
+          if (!editor) {
+            return Disposable.NULL;
+          }
+          return new DisposableCollection(...track.map((t) => t(editor)));
+        })
+      ))
+    );
+  }
+
+  private async markAsCurrentError(error: ErrorDecoration): Promise<void> {
+    const index = this.errors.findIndex((candidate) =>
+      ErrorDecoration.sameAs(candidate, error)
+    );
+    if (index < 0) {
+      console.warn(
+        'compiler-errors',
+        `Failed to mark error ${
+          error.id
+        } as the current one. Error is unknown. Known errors are: ${this.errors.map(
+          ({ id }) => id
+        )}`
+      );
+      return;
+    }
+    const newError = this.errors[index];
+    if (
+      !this.currentError ||
+      !ErrorDecoration.sameAs(this.currentError, newError)
+    ) {
+      this.currentError = this.errors[index];
+      console.log(
+        'compiler-errors',
+        `Current error changed to ${this.currentError.id}`
+      );
+      this.currentErrorDidChangEmitter.fire(this.currentError);
+      this.onDidChangeEmitter.fire(this);
+    }
+  }
+
+  // The double editor activation logic is required: https://github.com/eclipse-theia/theia/issues/11284
+  private async revealLocationInEditor(
+    location: Location
+  ): Promise<EditorWidget | undefined> {
+    const { uri, range } = location;
+    const editor = await this.editorManager.getByUri(new URI(uri), {
+      mode: 'activate',
+    });
+    if (editor && this.shell) {
+      // to avoid flickering, reveal the range here and not with `getByUri`, because it uses `at: 'center'` for the reveal option.
+      // TODO: check the community reaction whether it is better to set the focus at the error marker. it might cause flickering even if errors are close to each other
+      editor.editor.revealRange(range, { at: this.revealStrategy });
+      const activeWidget = await this.shell.activateWidget(editor.id);
+      if (!activeWidget) {
+        console.warn(
+          'compiler-errors',
+          `editor widget activation has failed. editor widget ${editor.id} expected to be the active one.`
+        );
+        return editor;
+      }
+      if (editor !== activeWidget) {
+        console.warn(
+          'compiler-errors',
+          `active widget was not the same as previously activated editor. editor widget ID ${editor.id}, active widget ID: ${activeWidget.id}`
+        );
+      }
+      return editor;
+    }
+    console.warn(
+      'compiler-errors',
+      `could not found editor widget for URI: ${uri}`
+    );
+    return undefined;
+  }
+
+  private groupByResource(
+    errors: CoreError.ErrorLocation[]
+  ): Map<string, CoreError.ErrorLocation[]> {
+    return errors.reduce((acc, curr) => {
+      const {
+        location: { uri },
+      } = curr;
+      let errors = acc.get(uri);
+      if (!errors) {
+        errors = [];
+        acc.set(uri, errors);
+      }
+      errors.push(curr);
+      return acc;
+    }, new Map<string, CoreError.ErrorLocation[]>());
+  }
+
+  private monacoEditor(widget: EditorWidget): MonacoEditor | undefined;
+  private monacoEditor(uri: string): Promise<MonacoEditor | undefined>;
+  private monacoEditor(
+    uriOrWidget: string | EditorWidget
+  ): MaybePromise<MonacoEditor | undefined> {
+    if (uriOrWidget instanceof EditorWidget) {
+      const editor = uriOrWidget.editor;
+      if (editor instanceof MonacoEditor) {
+        return editor;
+      }
+      return undefined;
+    } else {
+      return this.editorManager
+        .getByUri(new URI(uriOrWidget))
+        .then((editor) => {
+          if (editor) {
+            return this.monacoEditor(editor);
+          }
+          return undefined;
+        });
+    }
+  }
+}
+export namespace CompilerErrors {
+  export namespace Commands {
+    export const NEXT_ERROR: Command = {
+      id: 'arduino-editor-next-error',
+    };
+    export const PREVIOUS_ERROR: Command = {
+      id: 'arduino-editor-previous-error',
+    };
+  }
+}

arduino-ide-extension/src/browser/contributions/contribution.ts

@@ -1,4 +1,9 @@
-import { inject, injectable, interfaces } from 'inversify';
+import {
+  inject,
+  injectable,
+  interfaces,
+  postConstruct,
+} from '@theia/core/shared/inversify';
 import URI from '@theia/core/lib/common/uri';
 import { ILogger } from '@theia/core/lib/common/logger';
 import { Saveable } from '@theia/core/lib/browser/saveable';
@@ -9,7 +14,7 @@ import { EditorManager } from '@theia/editor/lib/browser/editor-manager';
 import { MessageService } from '@theia/core/lib/common/message-service';
 import { WorkspaceService } from '@theia/workspace/lib/browser/workspace-service';
 import { open, OpenerService } from '@theia/core/lib/browser/opener-service';
-import { OutputChannelManager } from '@theia/output/lib/browser/output-channel';
+
 import {
   MenuModelRegistry,
   MenuContribution,
@@ -32,16 +37,28 @@ import {
   CommandContribution,
   CommandService,
 } from '@theia/core/lib/common/command';
-import { EditorMode } from '../editor-mode';
 import { SettingsService } from '../dialogs/settings/settings';
-import { SketchesServiceClientImpl } from '../../common/protocol/sketches-service-client-impl';
+import {
+  CurrentSketch,
+  SketchesServiceClientImpl,
+} from '../../common/protocol/sketches-service-client-impl';
 import {
   SketchesService,
   ConfigService,
   FileSystemExt,
   Sketch,
+  CoreService,
+  CoreError,
+  ResponseServiceClient,
 } from '../../common/protocol';
 import { ArduinoPreferences } from '../arduino-preferences';
+import { FrontendApplicationStateService } from '@theia/core/lib/browser/frontend-application-state';
+import { nls } from '@theia/core';
+import { OutputChannelManager } from '../theia/output/output-channel';
+import { ClipboardService } from '@theia/core/lib/browser/clipboard-service';
+import { ExecuteWithProgress } from '../../common/protocol/progressible';
+import { BoardsServiceProvider } from '../boards/boards-service-provider';
+import { BoardsDataStore } from '../boards/boards-data-store';
 
 export {
   Command,
@@ -75,24 +92,40 @@ export abstract class Contribution
   @inject(WorkspaceService)
   protected readonly workspaceService: WorkspaceService;
 
-  @inject(EditorMode)
-  protected readonly editorMode: EditorMode;
-
   @inject(LabelProvider)
   protected readonly labelProvider: LabelProvider;
 
   @inject(SettingsService)
   protected readonly settingsService: SettingsService;
 
+  @inject(ArduinoPreferences)
+  protected readonly preferences: ArduinoPreferences;
+
+  @inject(FrontendApplicationStateService)
+  protected readonly appStateService: FrontendApplicationStateService;
+
+  @postConstruct()
+  protected init(): void {
+    this.appStateService.reachedState('ready').then(() => this.onReady());
+  }
+
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function, unused-imports/no-unused-vars
   onStart(app: FrontendApplication): MaybePromise<void> {}
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function, unused-imports/no-unused-vars
   registerCommands(registry: CommandRegistry): void {}
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function, unused-imports/no-unused-vars
   registerMenus(registry: MenuModelRegistry): void {}
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function, unused-imports/no-unused-vars
   registerKeybindings(registry: KeybindingRegistry): void {}
 
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function, unused-imports/no-unused-vars
   registerToolbarItems(registry: TabBarToolbarRegistry): void {}
+
+  // eslint-disable-next-line @typescript-eslint/no-empty-function
+  onReady(): MaybePromise<void> {}
 }
 
 @injectable()
@@ -115,9 +148,6 @@ export abstract class SketchContribution extends Contribution {
   @inject(SketchesServiceClientImpl)
   protected readonly sketchServiceClient: SketchesServiceClientImpl;
 
-  @inject(ArduinoPreferences)
-  protected readonly preferences: ArduinoPreferences;
-
   @inject(EditorManager)
   protected readonly editorManager: EditorManager;
 
@@ -127,7 +157,7 @@ export abstract class SketchContribution extends Contribution {
   protected async sourceOverride(): Promise<Record<string, string>> {
     const override: Record<string, string> = {};
     const sketch = await this.sketchServiceClient.currentSketch();
-    if (sketch) {
+    if (CurrentSketch.isValid(sketch)) {
       for (const editor of this.editorManager.all) {
         const uri = editor.editor.uri;
         if (Saveable.isDirty(editor) && Sketch.isInSketch(uri, sketch)) {
@@ -139,8 +169,82 @@ export abstract class SketchContribution extends Contribution {
   }
 }
 
+@injectable()
+export abstract class CoreServiceContribution extends SketchContribution {
+  @inject(BoardsDataStore)
+  protected readonly boardsDataStore: BoardsDataStore;
+
+  @inject(BoardsServiceProvider)
+  protected readonly boardsServiceProvider: BoardsServiceProvider;
+
+  @inject(CoreService)
+  private readonly coreService: CoreService;
+
+  @inject(ClipboardService)
+  private readonly clipboardService: ClipboardService;
+
+  @inject(ResponseServiceClient)
+  private readonly responseService: ResponseServiceClient;
+
+  protected handleError(error: unknown): void {
+    this.tryToastErrorMessage(error);
+  }
+
+  private tryToastErrorMessage(error: unknown): void {
+    let message: undefined | string = undefined;
+    if (CoreError.is(error)) {
+      message = error.message;
+    } else if (error instanceof Error) {
+      message = error.message;
+    } else if (typeof error === 'string') {
+      message = error;
+    } else {
+      try {
+        message = JSON.stringify(error);
+      } catch {}
+    }
+    if (message) {
+      const copyAction = nls.localize(
+        'arduino/coreContribution/copyError',
+        'Copy error messages'
+      );
+      this.messageService.error(message, copyAction).then(async (action) => {
+        if (action === copyAction) {
+          const content = await this.outputChannelManager.contentOfChannel(
+            'Arduino'
+          );
+          if (content) {
+            this.clipboardService.writeText(content);
+          }
+        }
+      });
+    } else {
+      throw error;
+    }
+  }
+
+  protected async doWithProgress<T>(options: {
+    progressText: string;
+    keepOutput?: boolean;
+    task: (progressId: string, coreService: CoreService) => Promise<T>;
+  }): Promise<T> {
+    const { progressText, keepOutput, task } = options;
+    this.outputChannelManager
+      .getChannel('Arduino')
+      .show({ preserveFocus: true });
+    const result = await ExecuteWithProgress.doWithProgress({
+      messageService: this.messageService,
+      responseService: this.responseService,
+      progressText,
+      run: ({ progressId }) => task(progressId, this.coreService),
+      keepOutput,
+    });
+    return result;
+  }
+}
+
 export namespace Contribution {
-  export function configure<T>(
+  export function configure(
     bind: interfaces.Bind,
     serviceIdentifier: typeof Contribution
   ): void {

arduino-ide-extension/src/browser/contributions/core-error-handler.ts

@@ -0,0 +1,32 @@
+import { Emitter, Event } from '@theia/core';
+import { injectable } from '@theia/core/shared/inversify';
+import { CoreError } from '../../common/protocol/core-service';
+
+@injectable()
+export class CoreErrorHandler {
+  private readonly errors: CoreError.ErrorLocation[] = [];
+  private readonly compilerErrorsDidChangeEmitter = new Emitter<
+    CoreError.ErrorLocation[]
+  >();
+
+  tryHandle(error: unknown): void {
+    if (CoreError.is(error)) {
+      this.errors.length = 0;
+      this.errors.push(...error.data);
+      this.fireCompilerErrorsDidChange();
+    }
+  }
+
+  reset(): void {
+    this.errors.length = 0;
+    this.fireCompilerErrorsDidChange();
+  }
+
+  get onCompilerErrorsDidChange(): Event<CoreError.ErrorLocation[]> {
+    return this.compilerErrorsDidChangeEmitter.event;
+  }
+
+  private fireCompilerErrorsDidChange(): void {
+    this.compilerErrorsDidChangeEmitter.fire(this.errors.slice());
+  }
+}

arduino-ide-extension/src/browser/contributions/daemon.ts

@@ -0,0 +1,41 @@
+import { nls } from '@theia/core';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { ArduinoDaemon } from '../../common/protocol';
+import { Contribution, Command, CommandRegistry } from './contribution';
+
+@injectable()
+export class Daemon extends Contribution {
+  @inject(ArduinoDaemon)
+  private readonly daemon: ArduinoDaemon;
+
+  override registerCommands(registry: CommandRegistry): void {
+    registry.registerCommand(Daemon.Commands.START_DAEMON, {
+      execute: () => this.daemon.start(),
+    });
+    registry.registerCommand(Daemon.Commands.STOP_DAEMON, {
+      execute: () => this.daemon.stop(),
+    });
+    registry.registerCommand(Daemon.Commands.RESTART_DAEMON, {
+      execute: () => this.daemon.restart(),
+    });
+  }
+}
+export namespace Daemon {
+  export namespace Commands {
+    export const START_DAEMON: Command = {
+      id: 'arduino-start-daemon',
+      label: nls.localize('arduino/daemon/start', 'Start Daemon'),
+      category: 'Arduino',
+    };
+    export const STOP_DAEMON: Command = {
+      id: 'arduino-stop-daemon',
+      label: nls.localize('arduino/daemon/stop', 'Stop Daemon'),
+      category: 'Arduino',
+    };
+    export const RESTART_DAEMON: Command = {
+      id: 'arduino-restart-daemon',
+      label: nls.localize('arduino/daemon/restart', 'Restart Daemon'),
+      category: 'Arduino',
+    };
+  }
+}

arduino-ide-extension/src/browser/contributions/debug.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { Event, Emitter } from '@theia/core/lib/common/event';
 import { HostedPluginSupport } from '@theia/plugin-ext/lib/hosted/browser/hosted-plugin';
 import { ArduinoToolbar } from '../toolbar/arduino-toolbar';
@@ -12,45 +12,53 @@ import {
   SketchContribution,
   TabBarToolbarRegistry,
 } from './contribution';
-import { nls } from '@theia/core/lib/common';
+import { MaybePromise, MenuModelRegistry, nls } from '@theia/core/lib/common';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
+import { ArduinoMenus } from '../menu/arduino-menus';
 
+import { MainMenuManager } from '../../common/main-menu-manager';
+
+const COMPILE_FOR_DEBUG_KEY = 'arduino-compile-for-debug';
 @injectable()
 export class Debug extends SketchContribution {
   @inject(HostedPluginSupport)
-  protected hostedPluginSupport: HostedPluginSupport;
+  private readonly hostedPluginSupport: HostedPluginSupport;
 
   @inject(NotificationCenter)
-  protected readonly notificationCenter: NotificationCenter;
+  private readonly notificationCenter: NotificationCenter;
 
   @inject(ExecutableService)
-  protected readonly executableService: ExecutableService;
+  private readonly executableService: ExecutableService;
 
   @inject(BoardsService)
-  protected readonly boardService: BoardsService;
+  private readonly boardService: BoardsService;
 
   @inject(BoardsServiceProvider)
-  protected readonly boardsServiceProvider: BoardsServiceProvider;
+  private readonly boardsServiceProvider: BoardsServiceProvider;
+
+  @inject(MainMenuManager)
+  private readonly mainMenuManager: MainMenuManager;
 
   /**
    * If `undefined`, debugging is enabled. Otherwise, the reason why it's disabled.
    */
-  protected _disabledMessages?: string = nls.localize(
+  private _disabledMessages?: string = nls.localize(
     'arduino/common/noBoardSelected',
     'No board selected'
   ); // Initial pessimism.
-  protected disabledMessageDidChangeEmitter = new Emitter<string | undefined>();
-  protected onDisabledMessageDidChange =
+  private disabledMessageDidChangeEmitter = new Emitter<string | undefined>();
+  private onDisabledMessageDidChange =
     this.disabledMessageDidChangeEmitter.event;
 
-  protected get disabledMessage(): string | undefined {
+  private get disabledMessage(): string | undefined {
     return this._disabledMessages;
   }
-  protected set disabledMessage(message: string | undefined) {
+  private set disabledMessage(message: string | undefined) {
     this._disabledMessages = message;
     this.disabledMessageDidChangeEmitter.fire(this._disabledMessages);
   }
 
-  protected readonly debugToolbarItem = {
+  private readonly debugToolbarItem = {
     id: Debug.Commands.START_DEBUGGING.id,
     command: Debug.Commands.START_DEBUGGING.id,
     tooltip: `${
@@ -66,7 +74,7 @@ export class Debug extends SketchContribution {
     onDidChange: this.onDisabledMessageDidChange as Event<void>,
   };
 
-  onStart(): void {
+  override onStart(): void {
     this.onDisabledMessageDidChange(
       () =>
         (this.debugToolbarItem.tooltip = `${
@@ -79,68 +87,87 @@ export class Debug extends SketchContribution {
             : Debug.Commands.START_DEBUGGING.label
         }`)
     );
-    const refreshState = async (
-      board: Board | undefined = this.boardsServiceProvider.boardsConfig
-        .selectedBoard
-    ) => {
-      if (!board) {
-        this.disabledMessage = nls.localize(
-          'arduino/common/noBoardSelected',
-          'No board selected'
-        );
-        return;
-      }
-      const fqbn = board.fqbn;
-      if (!fqbn) {
-        this.disabledMessage = nls.localize(
-          'arduino/debug/noPlatformInstalledFor',
-          "Platform is not installed for '{0}'",
-          board.name
-        );
-        return;
-      }
-      const details = await this.boardService.getBoardDetails({ fqbn });
-      if (!details) {
-        this.disabledMessage = nls.localize(
-          'arduino/debug/noPlatformInstalledFor',
-          "Platform is not installed for '{0}'",
-          board.name
-        );
-        return;
-      }
-      const { debuggingSupported } = details;
-      if (!debuggingSupported) {
-        this.disabledMessage = nls.localize(
-          'arduino/debug/debuggingNotSupported',
-          "Debugging is not supported by '{0}'",
-          board.name
-        );
-      } else {
-        this.disabledMessage = undefined;
-      }
-    };
     this.boardsServiceProvider.onBoardsConfigChanged(({ selectedBoard }) =>
-      refreshState(selectedBoard)
+      this.refreshState(selectedBoard)
     );
-    this.notificationCenter.onPlatformInstalled(() => refreshState());
-    this.notificationCenter.onPlatformUninstalled(() => refreshState());
-    refreshState();
+    this.notificationCenter.onPlatformDidInstall(() => this.refreshState());
+    this.notificationCenter.onPlatformDidUninstall(() => this.refreshState());
   }
 
-  registerCommands(registry: CommandRegistry): void {
+  override onReady(): MaybePromise<void> {
+    this.refreshState();
+  }
+
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(Debug.Commands.START_DEBUGGING, {
       execute: () => this.startDebug(),
       isVisible: (widget) =>
         ArduinoToolbar.is(widget) && widget.side === 'left',
       isEnabled: () => !this.disabledMessage,
     });
+    registry.registerCommand(Debug.Commands.TOGGLE_OPTIMIZE_FOR_DEBUG, {
+      execute: () => this.toggleCompileForDebug(),
+      isToggled: () => this.compileForDebug,
+    });
+    registry.registerCommand(Debug.Commands.IS_OPTIMIZE_FOR_DEBUG, {
+      execute: () => this.compileForDebug,
+    });
   }
 
-  registerToolbarItems(registry: TabBarToolbarRegistry): void {
+  override registerToolbarItems(registry: TabBarToolbarRegistry): void {
     registry.registerItem(this.debugToolbarItem);
   }
 
-  protected async startDebug(
+  override registerMenus(registry: MenuModelRegistry): void {
+    registry.registerMenuAction(ArduinoMenus.SKETCH__MAIN_GROUP, {
+      commandId: Debug.Commands.TOGGLE_OPTIMIZE_FOR_DEBUG.id,
+      label: Debug.Commands.TOGGLE_OPTIMIZE_FOR_DEBUG.label,
+      order: '5',
+    });
+  }
+
+  private async refreshState(
+    board: Board | undefined = this.boardsServiceProvider.boardsConfig
+      .selectedBoard
+  ): Promise<void> {
+    if (!board) {
+      this.disabledMessage = nls.localize(
+        'arduino/common/noBoardSelected',
+        'No board selected'
+      );
+      return;
+    }
+    const fqbn = board.fqbn;
+    if (!fqbn) {
+      this.disabledMessage = nls.localize(
+        'arduino/debug/noPlatformInstalledFor',
+        "Platform is not installed for '{0}'",
+        board.name
+      );
+      return;
+    }
+    const details = await this.boardService.getBoardDetails({ fqbn });
+    if (!details) {
+      this.disabledMessage = nls.localize(
+        'arduino/debug/noPlatformInstalledFor',
+        "Platform is not installed for '{0}'",
+        board.name
+      );
+      return;
+    }
+    const { debuggingSupported } = details;
+    if (!debuggingSupported) {
+      this.disabledMessage = nls.localize(
+        'arduino/debug/debuggingNotSupported',
+        "Debugging is not supported by '{0}'",
+        board.name
+      );
+    } else {
+      this.disabledMessage = undefined;
+    }
+  }
+
+  private async startDebug(
     board: Board | undefined = this.boardsServiceProvider.boardsConfig
       .selectedBoard
   ): Promise<void> {
@@ -156,7 +183,7 @@ export class Debug extends SketchContribution {
       this.sketchServiceClient.currentSketch(),
       this.executableService.list(),
     ]);
-    if (!sketch) {
+    if (!CurrentSketch.isValid(sketch)) {
       return;
     }
     const ideTempFolderUri = await this.sketchService.getIdeTempFolderUri(
@@ -178,8 +205,19 @@ export class Debug extends SketchContribution {
     };
     return this.commandService.executeCommand('arduino.debug.start', config);
   }
-}
 
+  get compileForDebug(): boolean {
+    const value = window.localStorage.getItem(COMPILE_FOR_DEBUG_KEY);
+    return value === 'true';
+  }
+
+  async toggleCompileForDebug(): Promise<void> {
+    const oldState = this.compileForDebug;
+    const newState = !oldState;
+    window.localStorage.setItem(COMPILE_FOR_DEBUG_KEY, String(newState));
+    this.mainMenuManager.update();
+  }
+}
 export namespace Debug {
   export namespace Commands {
     export const START_DEBUGGING = Command.toLocalizedCommand(
@@ -190,5 +228,16 @@ export namespace Debug {
       },
       'vscode/debug.contribution/startDebuggingHelp'
     );
+    export const TOGGLE_OPTIMIZE_FOR_DEBUG = Command.toLocalizedCommand(
+      {
+        id: 'arduino-toggle-optimize-for-debug',
+        label: 'Optimize for Debugging',
+        category: 'Arduino',
+      },
+      'arduino/debug/optimizeForDebugging'
+    );
+    export const IS_OPTIMIZE_FOR_DEBUG: Command = {
+      id: 'arduino-is-optimize-for-debug',
+    };
   }
 }

arduino-ide-extension/src/browser/contributions/edit-contributions.ts

@@ -1,7 +1,6 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { CommonCommands } from '@theia/core/lib/browser/common-frontend-contribution';
 import { ClipboardService } from '@theia/core/lib/browser/clipboard-service';
-import { PreferenceService } from '@theia/core/lib/browser/preferences/preference-service';
 import { MonacoEditorService } from '@theia/monaco/lib/browser/monaco-editor-service';
 import {
   Contribution,
@@ -12,21 +11,20 @@ import {
 } from './contribution';
 import { ArduinoMenus } from '../menu/arduino-menus';
 import { nls } from '@theia/core/lib/common';
+import type { ICodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser';
+import type { StandaloneCodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor';
 
 // TODO: [macOS]: to remove `Start Dictation...` and `Emoji & Symbol` see this thread: https://github.com/electron/electron/issues/8283#issuecomment-269522072
 // Depends on https://github.com/eclipse-theia/theia/pull/7964
 @injectable()
 export class EditContributions extends Contribution {
   @inject(MonacoEditorService)
-  protected readonly codeEditorService: MonacoEditorService;
+  private readonly codeEditorService: MonacoEditorService;
 
   @inject(ClipboardService)
-  protected readonly clipboardService: ClipboardService;
+  private readonly clipboardService: ClipboardService;
 
-  @inject(PreferenceService)
-  protected readonly preferences: PreferenceService;
-
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(EditContributions.Commands.GO_TO_LINE, {
       execute: () => this.run('editor.action.gotoLine'),
     });
@@ -43,10 +41,10 @@ export class EditContributions extends Contribution {
       execute: () => this.run('actions.find'),
     });
     registry.registerCommand(EditContributions.Commands.FIND_NEXT, {
-      execute: () => this.run('actions.findWithSelection'),
+      execute: () => this.run('editor.action.nextMatchFindAction'),
     });
     registry.registerCommand(EditContributions.Commands.FIND_PREVIOUS, {
-      execute: () => this.run('editor.action.nextMatchFindAction'),
+      execute: () => this.run('editor.action.previousMatchFindAction'),
     });
     registry.registerCommand(EditContributions.Commands.USE_FOR_FIND, {
       execute: () => this.run('editor.action.previousSelectionMatchFindAction'),
@@ -91,7 +89,7 @@ ${value}
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.EDIT__TEXT_CONTROL_GROUP, {
       commandId: CommonCommands.CUT.id,
       order: '0',
@@ -143,6 +141,11 @@ ${value}
       label: nls.localize('arduino/editor/decreaseIndent', 'Decrease Indent'),
       order: '2',
     });
+    registry.registerMenuAction(ArduinoMenus.EDIT__CODE_CONTROL_GROUP, {
+      commandId: EditContributions.Commands.AUTO_FORMAT.id,
+      label: nls.localize('arduino/editor/autoFormat', 'Auto Format'),
+      order: '3',
+    });
 
     registry.registerMenuAction(ArduinoMenus.EDIT__FONT_CONTROL_GROUP, {
       commandId: EditContributions.Commands.INCREASE_FONT_SIZE.id,
@@ -199,7 +202,7 @@ ${value}
     });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: EditContributions.Commands.COPY_FOR_FORUM.id,
       keybinding: 'CtrlCmd+Shift+C',
@@ -250,10 +253,13 @@ ${value}
     });
   }
 
-  protected async current(): Promise<monaco.editor.ICodeEditor | undefined> {
+  protected async current(): Promise<
+    ICodeEditor | StandaloneCodeEditor | undefined
+  > {
     return (
       this.codeEditorService.getFocusedCodeEditor() ||
-      this.codeEditorService.getActiveCodeEditor()
+      this.codeEditorService.getActiveCodeEditor() ||
+      undefined
     );
   }
 

arduino-ide-extension/src/browser/contributions/examples.ts

@@ -1,5 +1,5 @@
 import * as PQueue from 'p-queue';
-import { inject, injectable, postConstruct } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { CommandHandler } from '@theia/core/lib/common/command';
 import {
   MenuPath,
@@ -21,7 +21,7 @@ import {
   MenuModelRegistry,
 } from './contribution';
 import { NotificationCenter } from '../notification-center';
-import { Board, Sketch, SketchContainer } from '../../common/protocol';
+import { Board, SketchRef, SketchContainer } from '../../common/protocol';
 import { nls } from '@theia/core/lib/common';
 
 @injectable()
@@ -43,8 +43,8 @@ export abstract class Examples extends SketchContribution {
 
   protected readonly toDispose = new DisposableCollection();
 
-  @postConstruct()
-  init(): void {
+  protected override init(): void {
+    super.init();
     this.boardsServiceClient.onBoardsConfigChanged(({ selectedBoard }) =>
       this.handleBoardChanged(selectedBoard)
     );
@@ -54,7 +54,7 @@ export abstract class Examples extends SketchContribution {
     // NOOP
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     try {
       // This is a hack the ensures the desired menu ordering! We cannot use https://github.com/eclipse-theia/theia/pull/8377 due to ATL-222.
       const index = ArduinoMenus.FILE__EXAMPLES_SUBMENU.length - 1;
@@ -82,7 +82,7 @@ export abstract class Examples extends SketchContribution {
   registerRecursively(
     sketchContainerOrPlaceholder:
       | SketchContainer
-      | (Sketch | SketchContainer)[]
+      | (SketchRef | SketchContainer)[]
       | string,
     menuPath: MenuPath,
     pushToDispose: DisposableCollection = new DisposableCollection(),
@@ -100,7 +100,7 @@ export abstract class Examples extends SketchContribution {
         )
       );
     } else {
-      const sketches: Sketch[] = [];
+      const sketches: SketchRef[] = [];
       const children: SketchContainer[] = [];
       let submenuPath = menuPath;
 
@@ -161,7 +161,7 @@ export abstract class Examples extends SketchContribution {
 
 @injectable()
 export class BuiltInExamples extends Examples {
-  onStart(): void {
+  override async onReady(): Promise<void> {
     this.register(); // no `await`
   }
 
@@ -201,13 +201,16 @@ export class LibraryExamples extends Examples {
 
   protected readonly queue = new PQueue({ autoStart: true, concurrency: 1 });
 
-  onStart(): void {
-    this.register(); // no `await`
-    this.notificationCenter.onLibraryInstalled(() => this.register());
-    this.notificationCenter.onLibraryUninstalled(() => this.register());
+  override onStart(): void {
+    this.notificationCenter.onLibraryDidInstall(() => this.register());
+    this.notificationCenter.onLibraryDidUninstall(() => this.register());
   }
 
-  protected handleBoardChanged(board: Board | undefined): void {
+  override async onReady(): Promise<void> {
+    this.register(); // no `await`
+  }
+
+  protected override handleBoardChanged(board: Board | undefined): void {
     this.register(board);
   }
 

arduino-ide-extension/src/browser/contributions/first-startup-installer.ts

@@ -0,0 +1,97 @@
+import { LocalStorageService } from '@theia/core/lib/browser';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { BoardsService, LibraryService } from '../../common/protocol';
+import { Contribution } from './contribution';
+
+@injectable()
+export class FirstStartupInstaller extends Contribution {
+  @inject(LocalStorageService)
+  private readonly localStorageService: LocalStorageService;
+  @inject(BoardsService)
+  private readonly boardsService: BoardsService;
+  @inject(LibraryService)
+  private readonly libraryService: LibraryService;
+
+  override async onReady(): Promise<void> {
+    const isFirstStartup = !(await this.localStorageService.getData(
+      FirstStartupInstaller.INIT_LIBS_AND_PACKAGES
+    ));
+    if (isFirstStartup) {
+      const avrPackage = await this.boardsService.getBoardPackage({
+        id: 'arduino:avr',
+      });
+      const builtInLibrary = (
+        await this.libraryService.search({ query: 'Arduino_BuiltIn' })
+      )[0];
+
+      let avrPackageError: Error | undefined;
+      let builtInLibraryError: Error | undefined;
+
+      if (avrPackage) {
+        try {
+          await this.boardsService.install({
+            item: avrPackage,
+            noOverwrite: true, // We don't want to automatically replace custom platforms the user might already have in place
+          });
+        } catch (e) {
+          // There's no error code, I need to parse the error message: https://github.com/arduino/arduino-cli/commit/ffe4232b359fcfa87238d68acf1c3b64a1621f14#diff-10ffbdde46838dd9caa881fd1f2a5326a49f8061f6cfd7c9d430b4875a6b6895R62
+          if (
+            e.message.includes(
+              `Platform ${avrPackage.id}@${avrPackage.installedVersion} already installed`
+            )
+          ) {
+            // If arduino:avr installation fails because it's already installed we don't want to retry on next start-up
+            console.error(e);
+          } else {
+            // But if there is any other error (e.g.: no Internet connection), we want to retry next time
+            avrPackageError = e;
+          }
+        }
+      } else {
+        avrPackageError = new Error('Could not find platform.');
+      }
+
+      if (builtInLibrary) {
+        try {
+          await this.libraryService.install({
+            item: builtInLibrary,
+            installDependencies: true,
+            noOverwrite: true, // We don't want to automatically replace custom libraries the user might already have in place
+          });
+        } catch (e) {
+          // There's no error code, I need to parse the error message: https://github.com/arduino/arduino-cli/commit/2ea3608453b17b1157f8a1dc892af2e13e40f4f0#diff-1de7569144d4e260f8dde0e0d00a4e2a218c57966d583da1687a70d518986649R95
+          if (/Library (.*) is already installed/.test(e.message)) {
+            // If Arduino_BuiltIn installation fails because it's already installed we don't want to retry on next start-up
+            console.log('error installing core', e);
+          } else {
+            // But if there is any other error (e.g.: no Internet connection), we want to retry next time
+            builtInLibraryError = e;
+          }
+        }
+      } else {
+        builtInLibraryError = new Error('Could not find library');
+      }
+
+      if (avrPackageError) {
+        this.messageService.error(
+          `Could not install Arduino AVR platform: ${avrPackageError}`
+        );
+      }
+      if (builtInLibraryError) {
+        this.messageService.error(
+          `Could not install ${builtInLibrary.name} library: ${builtInLibraryError}`
+        );
+      }
+
+      if (!avrPackageError && !builtInLibraryError) {
+        await this.localStorageService.setData(
+          FirstStartupInstaller.INIT_LIBS_AND_PACKAGES,
+          true
+        );
+      }
+    }
+  }
+}
+export namespace FirstStartupInstaller {
+  export const INIT_LIBS_AND_PACKAGES = 'initializedLibsAndPackages';
+}

arduino-ide-extension/src/browser/contributions/format.ts

@@ -0,0 +1,79 @@
+import { MaybePromise } from '@theia/core';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import * as monaco from '@theia/monaco-editor-core';
+import { Formatter } from '../../common/protocol/formatter';
+import { InoSelector } from '../ino-selectors';
+import { fullRange } from '../utils/monaco';
+import { Contribution, URI } from './contribution';
+
+@injectable()
+export class Format
+  extends Contribution
+  implements
+    monaco.languages.DocumentRangeFormattingEditProvider,
+    monaco.languages.DocumentFormattingEditProvider
+{
+  @inject(Formatter)
+  private readonly formatter: Formatter;
+
+  override onStart(): MaybePromise<void> {
+    monaco.languages.registerDocumentRangeFormattingEditProvider(
+      InoSelector,
+      this
+    );
+    monaco.languages.registerDocumentFormattingEditProvider(InoSelector, this);
+  }
+  async provideDocumentRangeFormattingEdits(
+    model: monaco.editor.ITextModel,
+    range: monaco.Range,
+    options: monaco.languages.FormattingOptions,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    _token: monaco.CancellationToken
+  ): Promise<monaco.languages.TextEdit[]> {
+    const text = await this.format(model, range, options);
+    return [{ range, text }];
+  }
+
+  async provideDocumentFormattingEdits(
+    model: monaco.editor.ITextModel,
+    options: monaco.languages.FormattingOptions,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    _token: monaco.CancellationToken
+  ): Promise<monaco.languages.TextEdit[]> {
+    const range = fullRange(model);
+    const text = await this.format(model, range, options);
+    return [{ range, text }];
+  }
+
+  /**
+   * From the currently opened workspaces (IDE2 has always one), it calculates all possible
+   * folder locations where the `.clang-format` file could be.
+   */
+  private formatterConfigFolderUris(model: monaco.editor.ITextModel): string[] {
+    const editorUri = new URI(model.uri.toString());
+    return this.workspaceService
+      .tryGetRoots()
+      .map(({ resource }) => resource)
+      .filter((workspaceUri) => workspaceUri.isEqualOrParent(editorUri))
+      .map((uri) => uri.toString());
+  }
+
+  private format(
+    model: monaco.editor.ITextModel,
+    range: monaco.Range,
+    options: monaco.languages.FormattingOptions
+  ): Promise<string> {
+    console.info(
+      `Formatting ${model.uri.toString()} [Range: ${JSON.stringify(
+        range.toJSON()
+      )}]`
+    );
+    const content = model.getValueInRange(range);
+    const formatterConfigFolderUris = this.formatterConfigFolderUris(model);
+    return this.formatter.format({
+      content,
+      formatterConfigFolderUris,
+      options,
+    });
+  }
+}

arduino-ide-extension/src/browser/contributions/help.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { MonacoEditor } from '@theia/monaco/lib/browser/monaco-editor';
 import { EditorManager } from '@theia/editor/lib/browser/editor-manager';
 import { WindowService } from '@theia/core/lib/browser/window/window-service';
@@ -13,6 +13,9 @@ import {
   KeybindingRegistry,
 } from './contribution';
 import { nls } from '@theia/core/lib/common';
+import { IDEUpdaterCommands } from '../ide-updater/ide-updater-commands';
+import { ElectronCommands } from '@theia/core/lib/electron-browser/menu/electron-menu-contribution';
+import * as monaco from '@theia/monaco-editor-core';
 
 @injectable()
 export class Help extends Contribution {
@@ -25,7 +28,7 @@ export class Help extends Contribution {
   @inject(QuickInputService)
   protected readonly quickInputService: QuickInputService;
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     const open = (url: string) =>
       this.windowService.openNewWindow(url, { external: true });
     const createOpenHandler = (url: string) =>
@@ -83,9 +86,17 @@ export class Help extends Contribution {
       Help.Commands.VISIT_ARDUINO,
       createOpenHandler('https://www.arduino.cc/')
     );
+    registry.registerCommand(
+      Help.Commands.PRIVACY_POLICY,
+      createOpenHandler('https://www.arduino.cc/en/privacy-policy')
+    );
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
+    registry.unregisterMenuAction({
+      commandId: ElectronCommands.TOGGLE_DEVELOPER_TOOLS.id,
+    });
+
     registry.registerMenuAction(ArduinoMenus.HELP__MAIN_GROUP, {
       commandId: Help.Commands.GETTING_STARTED.id,
       order: '0',
@@ -115,9 +126,17 @@ export class Help extends Contribution {
       commandId: Help.Commands.VISIT_ARDUINO.id,
       order: '6',
     });
+    registry.registerMenuAction(ArduinoMenus.HELP__FIND_GROUP, {
+      commandId: Help.Commands.PRIVACY_POLICY.id,
+      order: '7',
+    });
+    registry.registerMenuAction(ArduinoMenus.HELP__FIND_GROUP, {
+      commandId: IDEUpdaterCommands.CHECK_FOR_UPDATES.id,
+      order: '8',
+    });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: Help.Commands.FIND_IN_REFERENCE.id,
       keybinding: 'CtrlCmd+Shift+F',
@@ -162,5 +181,10 @@ export namespace Help {
       label: nls.localize('arduino/help/visit', 'Visit Arduino.cc'),
       category: 'Arduino',
     };
+    export const PRIVACY_POLICY: Command = {
+      id: 'arduino-privacy-policy',
+      label: nls.localize('arduino/help/privacyPolicy', 'Privacy Policy'),
+      category: 'Arduino',
+    };
   }
 }

arduino-ide-extension/src/browser/contributions/include-library.ts

@@ -1,5 +1,5 @@
 import * as PQueue from 'p-queue';
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import URI from '@theia/core/lib/common/uri';
 import { MonacoEditor } from '@theia/monaco/lib/browser/monaco-editor';
 import { EditorManager } from '@theia/editor/lib/browser';
@@ -16,6 +16,8 @@ import { BoardsServiceProvider } from '../boards/boards-service-provider';
 import { SketchContribution, Command, CommandRegistry } from './contribution';
 import { NotificationCenter } from '../notification-center';
 import { nls } from '@theia/core/lib/common';
+import * as monaco from '@theia/monaco-editor-core';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
 
 @injectable()
 export class IncludeLibrary extends SketchContribution {
@@ -29,7 +31,7 @@ export class IncludeLibrary extends SketchContribution {
   protected readonly mainMenuManager: MainMenuManager;
 
   @inject(EditorManager)
-  protected readonly editorManager: EditorManager;
+  protected override readonly editorManager: EditorManager;
 
   @inject(NotificationCenter)
   protected readonly notificationCenter: NotificationCenter;
@@ -43,18 +45,21 @@ export class IncludeLibrary extends SketchContribution {
   protected readonly queue = new PQueue({ autoStart: true, concurrency: 1 });
   protected readonly toDispose = new DisposableCollection();
 
-  onStart(): void {
-    this.updateMenuActions();
+  override onStart(): void {
     this.boardsServiceClient.onBoardsConfigChanged(() =>
       this.updateMenuActions()
     );
-    this.notificationCenter.onLibraryInstalled(() => this.updateMenuActions());
-    this.notificationCenter.onLibraryUninstalled(() =>
+    this.notificationCenter.onLibraryDidInstall(() => this.updateMenuActions());
+    this.notificationCenter.onLibraryDidUninstall(() =>
       this.updateMenuActions()
     );
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override async onReady(): Promise<void> {
+    this.updateMenuActions();
+  }
+
+  override registerMenus(registry: MenuModelRegistry): void {
     // `Include Library` submenu
     const includeLibMenuPath = [
       ...ArduinoMenus.SKETCH__UTILS_GROUP,
@@ -77,7 +82,7 @@ export class IncludeLibrary extends SketchContribution {
     });
   }
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(IncludeLibrary.Commands.INCLUDE_LIBRARY, {
       execute: async (arg) => {
         if (LibraryPackage.is(arg)) {
@@ -168,7 +173,7 @@ export class IncludeLibrary extends SketchContribution {
 
   protected async includeLibrary(library: LibraryPackage): Promise<void> {
     const sketch = await this.sketchServiceClient.currentSketch();
-    if (!sketch) {
+    if (!CurrentSketch.isValid(sketch)) {
       return;
     }
     // If the current editor is one of the additional files from the sketch, we use that.

arduino-ide-extension/src/browser/contributions/indexes-update-progress.ts

@@ -0,0 +1,71 @@
+import { Progress } from '@theia/core/lib/common/message-service-protocol';
+import { ProgressService } from '@theia/core/lib/common/progress-service';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { ProgressMessage } from '../../common/protocol';
+import { NotificationCenter } from '../notification-center';
+import { Contribution } from './contribution';
+
+@injectable()
+export class IndexesUpdateProgress extends Contribution {
+  @inject(NotificationCenter)
+  private readonly notificationCenter: NotificationCenter;
+  @inject(ProgressService)
+  private readonly progressService: ProgressService;
+  private currentProgress:
+    | (Progress & Readonly<{ progressId: string }>)
+    | undefined;
+
+  override onStart(): void {
+    this.notificationCenter.onIndexWillUpdate((progressId) =>
+      this.getOrCreateProgress(progressId)
+    );
+    this.notificationCenter.onIndexUpdateDidProgress((progress) => {
+      this.getOrCreateProgress(progress).then((delegate) =>
+        delegate.report(progress)
+      );
+    });
+    this.notificationCenter.onIndexDidUpdate((progressId) => {
+      this.cancelProgress(progressId);
+    });
+    this.notificationCenter.onIndexUpdateDidFail(({ progressId, message }) => {
+      this.cancelProgress(progressId);
+      this.messageService.error(message);
+    });
+  }
+
+  private async getOrCreateProgress(
+    progressOrId: ProgressMessage | string
+  ): Promise<Progress & { progressId: string }> {
+    const progressId = ProgressMessage.is(progressOrId)
+      ? progressOrId.progressId
+      : progressOrId;
+    if (this.currentProgress?.progressId === progressId) {
+      return this.currentProgress;
+    }
+    if (this.currentProgress) {
+      this.currentProgress.cancel();
+    }
+    this.currentProgress = undefined;
+    const progress = await this.progressService.showProgress({
+      text: '',
+      options: { location: 'notification' },
+    });
+    if (ProgressMessage.is(progressOrId)) {
+      progress.report(progressOrId);
+    }
+    this.currentProgress = { ...progress, progressId };
+    return this.currentProgress;
+  }
+
+  private cancelProgress(progressId: string) {
+    if (this.currentProgress) {
+      if (this.currentProgress.progressId !== progressId) {
+        console.warn(
+          `Mismatching progress IDs. Expected ${progressId}, got ${this.currentProgress.progressId}. Canceling anyway.`
+        );
+      }
+      this.currentProgress.cancel();
+      this.currentProgress = undefined;
+    }
+  }
+}

arduino-ide-extension/src/browser/contributions/ino-language.ts

@@ -0,0 +1,159 @@
+import { Mutex } from 'async-mutex';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import {
+  ArduinoDaemon,
+  BoardsService,
+  ExecutableService,
+} from '../../common/protocol';
+import { HostedPluginEvents } from '../hosted-plugin-events';
+import { SketchContribution, URI } from './contribution';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
+import { BoardsConfig } from '../boards/boards-config';
+import { BoardsServiceProvider } from '../boards/boards-service-provider';
+
+@injectable()
+export class InoLanguage extends SketchContribution {
+  @inject(HostedPluginEvents)
+  private readonly hostedPluginEvents: HostedPluginEvents;
+
+  @inject(ExecutableService)
+  private readonly executableService: ExecutableService;
+
+  @inject(ArduinoDaemon)
+  private readonly daemon: ArduinoDaemon;
+
+  @inject(BoardsService)
+  private readonly boardsService: BoardsService;
+
+  @inject(BoardsServiceProvider)
+  private readonly boardsServiceProvider: BoardsServiceProvider;
+
+  private languageServerFqbn?: string;
+  private languageServerStartMutex = new Mutex();
+
+  override onReady(): void {
+    const start = (
+      { selectedBoard }: BoardsConfig.Config,
+      forceStart = false
+    ) => {
+      if (selectedBoard) {
+        const { name, fqbn } = selectedBoard;
+        if (fqbn) {
+          this.startLanguageServer(fqbn, name, forceStart);
+        }
+      }
+    };
+    this.boardsServiceProvider.onBoardsConfigChanged(start);
+    this.hostedPluginEvents.onPluginsDidStart(() =>
+      start(this.boardsServiceProvider.boardsConfig)
+    );
+    this.hostedPluginEvents.onPluginsWillUnload(
+      () => (this.languageServerFqbn = undefined)
+    );
+    this.preferences.onPreferenceChanged(
+      ({ preferenceName, oldValue, newValue }) => {
+        if (oldValue !== newValue) {
+          switch (preferenceName) {
+            case 'arduino.language.log':
+            case 'arduino.language.realTimeDiagnostics':
+              start(this.boardsServiceProvider.boardsConfig, true);
+          }
+        }
+      }
+    );
+    start(this.boardsServiceProvider.boardsConfig);
+  }
+
+  private async startLanguageServer(
+    fqbn: string,
+    name: string | undefined,
+    forceStart = false
+  ): Promise<void> {
+    const port = await this.daemon.tryGetPort();
+    if (!port) {
+      return;
+    }
+    const release = await this.languageServerStartMutex.acquire();
+    try {
+      await this.hostedPluginEvents.didStart;
+      const details = await this.boardsService.getBoardDetails({ fqbn });
+      if (!details) {
+        // Core is not installed for the selected board.
+        console.info(
+          `Could not start language server for ${fqbn}. The core is not installed for the board.`
+        );
+        if (this.languageServerFqbn) {
+          try {
+            await this.commandService.executeCommand(
+              'arduino.languageserver.stop'
+            );
+            console.info(
+              `Stopped language server process for ${this.languageServerFqbn}.`
+            );
+            this.languageServerFqbn = undefined;
+          } catch (e) {
+            console.error(
+              `Failed to start language server process for ${this.languageServerFqbn}`,
+              e
+            );
+            throw e;
+          }
+        }
+        return;
+      }
+      if (!forceStart && fqbn === this.languageServerFqbn) {
+        // NOOP
+        return;
+      }
+      this.logger.info(`Starting language server: ${fqbn}`);
+      const log = this.preferences.get('arduino.language.log');
+      const realTimeDiagnostics = this.preferences.get(
+        'arduino.language.realTimeDiagnostics'
+      );
+      let currentSketchPath: string | undefined = undefined;
+      if (log) {
+        const currentSketch = await this.sketchServiceClient.currentSketch();
+        if (CurrentSketch.isValid(currentSketch)) {
+          currentSketchPath = await this.fileService.fsPath(
+            new URI(currentSketch.uri)
+          );
+        }
+      }
+      const { clangdUri, lsUri } = await this.executableService.list();
+      const [clangdPath, lsPath] = await Promise.all([
+        this.fileService.fsPath(new URI(clangdUri)),
+        this.fileService.fsPath(new URI(lsUri)),
+      ]);
+
+      this.languageServerFqbn = await Promise.race([
+        new Promise<undefined>((_, reject) =>
+          setTimeout(
+            () => reject(new Error(`Timeout after ${20_000} ms.`)),
+            20_000
+          )
+        ),
+        this.commandService.executeCommand<string>(
+          'arduino.languageserver.start',
+          {
+            lsPath,
+            cliDaemonAddr: `localhost:${port}`,
+            clangdPath,
+            log: currentSketchPath ? currentSketchPath : log,
+            cliDaemonInstance: '1',
+            board: {
+              fqbn,
+              name: name ? `"${name}"` : undefined,
+            },
+            realTimeDiagnostics,
+            silentOutput: true,
+          }
+        ),
+      ]);
+    } catch (e) {
+      console.log(`Failed to start language server for ${fqbn}`, e);
+      this.languageServerFqbn = undefined;
+    } finally {
+      release();
+    }
+  }
+}

arduino-ide-extension/src/browser/contributions/new-sketch.ts

@@ -1,5 +1,5 @@
 import { nls } from '@theia/core/lib/common';
-import { injectable } from 'inversify';
+import { injectable } from '@theia/core/shared/inversify';
 import { ArduinoMenus } from '../menu/arduino-menus';
 import { ArduinoToolbar } from '../toolbar/arduino-toolbar';
 import {
@@ -9,12 +9,11 @@ import {
   CommandRegistry,
   MenuModelRegistry,
   KeybindingRegistry,
-  TabBarToolbarRegistry,
 } from './contribution';
 
 @injectable()
 export class NewSketch extends SketchContribution {
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(NewSketch.Commands.NEW_SKETCH, {
       execute: () => this.newSketch(),
     });
@@ -25,7 +24,7 @@ export class NewSketch extends SketchContribution {
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.FILE__SKETCH_GROUP, {
       commandId: NewSketch.Commands.NEW_SKETCH.id,
       label: nls.localize('arduino/sketch/new', 'New'),
@@ -33,22 +32,13 @@ export class NewSketch extends SketchContribution {
     });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: NewSketch.Commands.NEW_SKETCH.id,
       keybinding: 'CtrlCmd+N',
     });
   }
 
-  registerToolbarItems(registry: TabBarToolbarRegistry): void {
-    registry.registerItem({
-      id: NewSketch.Commands.NEW_SKETCH__TOOLBAR.id,
-      command: NewSketch.Commands.NEW_SKETCH__TOOLBAR.id,
-      tooltip: nls.localize('arduino/sketch/new', 'New'),
-      priority: 3,
-    });
-  }
-
   async newSketch(): Promise<void> {
     try {
       const sketch = await this.sketchService.createNewSketch();

arduino-ide-extension/src/browser/contributions/open-boards-config.ts

@@ -0,0 +1,32 @@
+import { CommandRegistry } from '@theia/core';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { BoardsConfigDialog } from '../boards/boards-config-dialog';
+import { BoardsServiceProvider } from '../boards/boards-service-provider';
+import { Contribution, Command } from './contribution';
+
+@injectable()
+export class OpenBoardsConfig extends Contribution {
+  @inject(BoardsServiceProvider)
+  private readonly boardsServiceProvider: BoardsServiceProvider;
+
+  @inject(BoardsConfigDialog)
+  private readonly boardsConfigDialog: BoardsConfigDialog;
+
+  override registerCommands(registry: CommandRegistry): void {
+    registry.registerCommand(OpenBoardsConfig.Commands.OPEN_DIALOG, {
+      execute: async (query?: string | undefined) => {
+        const boardsConfig = await this.boardsConfigDialog.open(query);
+        if (boardsConfig) {
+          return (this.boardsServiceProvider.boardsConfig = boardsConfig);
+        }
+      },
+    });
+  }
+}
+export namespace OpenBoardsConfig {
+  export namespace Commands {
+    export const OPEN_DIALOG: Command = {
+      id: 'arduino-open-boards-dialog',
+    };
+  }
+}

arduino-ide-extension/src/browser/contributions/open-recent-sketch.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { WorkspaceServer } from '@theia/workspace/lib/common/workspace-protocol';
 import {
   Disposable,
@@ -35,18 +35,19 @@ export class OpenRecentSketch extends SketchContribution {
 
   protected toDisposeBeforeRegister = new Map<string, DisposableCollection>();
 
-  onStart(): void {
-    const refreshMenu = (sketches: Sketch[]) => {
-      this.register(sketches);
-      this.mainMenuManager.update();
-    };
-    this.notificationCenter.onRecentSketchesChanged(({ sketches }) =>
-      refreshMenu(sketches)
+  override onStart(): void {
+    this.notificationCenter.onRecentSketchesDidChange(({ sketches }) =>
+      this.refreshMenu(sketches)
     );
-    this.sketchService.recentlyOpenedSketches().then(refreshMenu);
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override async onReady(): Promise<void> {
+    this.sketchService
+      .recentlyOpenedSketches()
+      .then((sketches) => this.refreshMenu(sketches));
+  }
+
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerSubmenu(
       ArduinoMenus.FILE__OPEN_RECENT_SUBMENU,
       nls.localize('arduino/sketch/openRecent', 'Open Recent'),
@@ -54,6 +55,11 @@ export class OpenRecentSketch extends SketchContribution {
     );
   }
 
+  private refreshMenu(sketches: Sketch[]): void {
+    this.register(sketches);
+    this.mainMenuManager.update();
+  }
+
   protected register(sketches: Sketch[]): void {
     const order = 0;
     for (const sketch of sketches) {

arduino-ide-extension/src/browser/contributions/open-sketch-external.ts

@@ -1,5 +1,5 @@
-import { injectable } from 'inversify';
-import { remote } from 'electron';
+import { injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import URI from '@theia/core/lib/common/uri';
 import { ArduinoMenus } from '../menu/arduino-menus';
 import {
@@ -13,13 +13,13 @@ import { nls } from '@theia/core/lib/common';
 
 @injectable()
 export class OpenSketchExternal extends SketchContribution {
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(OpenSketchExternal.Commands.OPEN_EXTERNAL, {
       execute: () => this.openExternal(),
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.SKETCH__UTILS_GROUP, {
       commandId: OpenSketchExternal.Commands.OPEN_EXTERNAL.id,
       label: nls.localize('arduino/sketch/showFolder', 'Show Sketch Folder'),
@@ -27,7 +27,7 @@ export class OpenSketchExternal extends SketchContribution {
     });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: OpenSketchExternal.Commands.OPEN_EXTERNAL.id,
       keybinding: 'CtrlCmd+Alt+K',

arduino-ide-extension/src/browser/contributions/open-sketch-files.ts

@@ -0,0 +1,109 @@
+import { nls } from '@theia/core/lib/common/nls';
+import { injectable } from '@theia/core/shared/inversify';
+import type { EditorOpenerOptions } from '@theia/editor/lib/browser/editor-manager';
+import { SketchesError } from '../../common/protocol';
+import {
+  Command,
+  CommandRegistry,
+  SketchContribution,
+  URI,
+} from './contribution';
+import { SaveAsSketch } from './save-as-sketch';
+
+@injectable()
+export class OpenSketchFiles extends SketchContribution {
+  override registerCommands(registry: CommandRegistry): void {
+    registry.registerCommand(OpenSketchFiles.Commands.OPEN_SKETCH_FILES, {
+      execute: (uri: URI) => this.openSketchFiles(uri),
+    });
+    registry.registerCommand(OpenSketchFiles.Commands.ENSURE_OPENED, {
+      execute: (
+        uri: string,
+        forceOpen?: boolean,
+        options?: EditorOpenerOptions
+      ) => {
+        this.ensureOpened(uri, forceOpen, options);
+      },
+    });
+  }
+
+  private async openSketchFiles(uri: URI): Promise<void> {
+    try {
+      const sketch = await this.sketchService.loadSketch(uri.toString());
+      const { mainFileUri, rootFolderFileUris } = sketch;
+      for (const uri of [mainFileUri, ...rootFolderFileUris]) {
+        await this.ensureOpened(uri);
+      }
+      if (mainFileUri.endsWith('.pde')) {
+        const message = nls.localize(
+          'arduino/common/oldFormat',
+          "The '{0}' still uses the old `.pde` format. Do you want to switch to the new `.ino` extension?",
+          sketch.name
+        );
+        const yes = nls.localize('vscode/extensionsUtils/yes', 'Yes');
+        this.messageService
+          .info(message, nls.localize('arduino/common/later', 'Later'), yes)
+          .then(async (answer) => {
+            if (answer === yes) {
+              this.commandService.executeCommand(
+                SaveAsSketch.Commands.SAVE_AS_SKETCH.id,
+                {
+                  execOnlyIfTemp: false,
+                  openAfterMove: true,
+                  wipeOriginal: false,
+                }
+              );
+            }
+          });
+      }
+    } catch (err) {
+      if (SketchesError.NotFound.is(err)) {
+        this.openFallbackSketch();
+      } else {
+        console.error(err);
+        const message =
+          err instanceof Error
+            ? err.message
+            : typeof err === 'string'
+            ? err
+            : String(err);
+        this.messageService.error(message);
+      }
+    }
+  }
+
+  private async openFallbackSketch(): Promise<void> {
+    const sketch = await this.sketchService.createNewSketch();
+    this.workspaceService.open(new URI(sketch.uri), { preserveWindow: true });
+  }
+
+  private async ensureOpened(
+    uri: string,
+    forceOpen = false,
+    options?: EditorOpenerOptions
+  ): Promise<unknown> {
+    const widget = this.editorManager.all.find(
+      (widget) => widget.editor.uri.toString() === uri
+    );
+    if (!widget || forceOpen) {
+      return this.editorManager.open(
+        new URI(uri),
+        options ?? {
+          mode: 'reveal',
+          preview: false,
+          counter: 0,
+        }
+      );
+    }
+  }
+}
+export namespace OpenSketchFiles {
+  export namespace Commands {
+    export const OPEN_SKETCH_FILES: Command = {
+      id: 'arduino-open-sketch-files',
+    };
+    export const ENSURE_OPENED: Command = {
+      id: 'arduino-ensure-opened',
+    };
+  }
+}

arduino-ide-extension/src/browser/contributions/open-sketch.ts

@@ -1,5 +1,5 @@
-import { inject, injectable } from 'inversify';
-import { remote } from 'electron';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import { MaybePromise } from '@theia/core/lib/common/types';
 import { Widget, ContextMenuRenderer } from '@theia/core/lib/browser';
 import {
@@ -16,7 +16,6 @@ import {
   CommandRegistry,
   MenuModelRegistry,
   KeybindingRegistry,
-  TabBarToolbarRegistry,
 } from './contribution';
 import { ExamplesService } from '../../common/protocol/examples-service';
 import { BuiltInExamples } from './examples';
@@ -43,7 +42,7 @@ export class OpenSketch extends SketchContribution {
 
   protected readonly toDispose = new DisposableCollection();
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(OpenSketch.Commands.OPEN_SKETCH, {
       execute: (arg) =>
         Sketch.is(arg) ? this.openSketch(arg) : this.openSketch(),
@@ -116,7 +115,7 @@ export class OpenSketch extends SketchContribution {
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.FILE__SKETCH_GROUP, {
       commandId: OpenSketch.Commands.OPEN_SKETCH.id,
       label: nls.localize('vscode/workspaceActions/openFileFolder', 'Open...'),
@@ -124,22 +123,13 @@ export class OpenSketch extends SketchContribution {
     });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: OpenSketch.Commands.OPEN_SKETCH.id,
       keybinding: 'CtrlCmd+O',
     });
   }
 
-  registerToolbarItems(registry: TabBarToolbarRegistry): void {
-    registry.registerItem({
-      id: OpenSketch.Commands.OPEN_SKETCH__TOOLBAR.id,
-      command: OpenSketch.Commands.OPEN_SKETCH__TOOLBAR.id,
-      tooltip: nls.localize('vscode/dialogMainService/open', 'Open'),
-      priority: 4,
-    });
-  }
-
   async openSketch(
     toOpen: MaybePromise<Sketch | undefined> = this.selectSketch()
   ): Promise<void> {

arduino-ide-extension/src/browser/contributions/quit-app.ts

@@ -1,5 +1,5 @@
-import { injectable } from 'inversify';
-import { remote } from 'electron';
+import { injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import { isOSX } from '@theia/core/lib/common/os';
 import {
   Contribution,
@@ -13,7 +13,7 @@ import { nls } from '@theia/core/lib/common';
 
 @injectable()
 export class QuitApp extends Contribution {
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     if (!isOSX) {
       registry.registerCommand(QuitApp.Commands.QUIT_APP, {
         execute: () => remote.app.quit(),
@@ -21,7 +21,7 @@ export class QuitApp extends Contribution {
     }
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     // On macOS we will get the `Quit ${YOUR_APP_NAME}` menu item natively, no need to duplicate it.
     if (!isOSX) {
       registry.registerMenuAction(ArduinoMenus.FILE__QUIT_GROUP, {
@@ -32,7 +32,7 @@ export class QuitApp extends Contribution {
     }
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     if (!isOSX) {
       registry.registerKeybinding({
         command: QuitApp.Commands.QUIT_APP.id,

arduino-ide-extension/src/browser/contributions/save-as-sketch.ts

@@ -1,5 +1,5 @@
-import { injectable } from 'inversify';
-import { remote } from 'electron';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import * as remote from '@theia/core/electron-shared/@electron/remote';
 import * as dateFormat from 'dateformat';
 import { ArduinoMenus } from '../menu/arduino-menus';
 import {
@@ -11,16 +11,30 @@ import {
   KeybindingRegistry,
 } from './contribution';
 import { nls } from '@theia/core/lib/common';
+import { ApplicationShell, NavigatableWidget, Saveable } from '@theia/core/lib/browser';
+import { EditorManager } from '@theia/editor/lib/browser';
+import { WindowService } from '@theia/core/lib/browser/window/window-service';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
 
 @injectable()
 export class SaveAsSketch extends SketchContribution {
-  registerCommands(registry: CommandRegistry): void {
+
+  @inject(ApplicationShell)
+  protected readonly applicationShell: ApplicationShell;
+
+  @inject(EditorManager)
+  protected override readonly editorManager: EditorManager;
+
+  @inject(WindowService)
+  protected readonly windowService: WindowService;
+
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(SaveAsSketch.Commands.SAVE_AS_SKETCH, {
       execute: (args) => this.saveAs(args),
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.FILE__SKETCH_GROUP, {
       commandId: SaveAsSketch.Commands.SAVE_AS_SKETCH.id,
       label: nls.localize('vscode/fileCommands/saveAs', 'Save As...'),
@@ -28,7 +42,7 @@ export class SaveAsSketch extends SketchContribution {
     });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: SaveAsSketch.Commands.SAVE_AS_SKETCH.id,
       keybinding: 'CtrlCmd+Shift+S',
@@ -46,7 +60,7 @@ export class SaveAsSketch extends SketchContribution {
     }: SaveAsSketch.Options = SaveAsSketch.Options.DEFAULT
   ): Promise<boolean> {
     const sketch = await this.sketchServiceClient.currentSketch();
-    if (!sketch) {
+    if (!CurrentSketch.isValid(sketch)) {
       return false;
     }
 
@@ -63,15 +77,11 @@ export class SaveAsSketch extends SketchContribution {
     const exists = await this.fileService.exists(
       sketchDirUri.resolve(sketch.name)
     );
-    const defaultUri = exists
-      ? sketchDirUri.resolve(
-          sketchDirUri
-            .resolve(
-              `${sketch.name}_copy_${dateFormat(new Date(), 'yyyymmddHHMMss')}`
-            )
-            .toString()
-        )
-      : sketchDirUri.resolve(sketch.name);
+    const defaultUri = sketchDirUri.resolve(
+      exists
+        ? `${sketch.name}_copy_${dateFormat(new Date(), 'yyyymmddHHMMss')}`
+        : sketch.name
+    );
     const defaultPath = await this.fileService.fsPath(defaultUri);
     const { filePath, canceled } = await remote.dialog.showSaveDialog({
       title: nls.localize(
@@ -90,6 +100,9 @@ export class SaveAsSketch extends SketchContribution {
     const workspaceUri = await this.sketchService.copy(sketch, {
       destinationUri,
     });
+    if (workspaceUri) {
+      await this.saveOntoCopiedSketch(sketch.mainFileUri, sketch.uri, workspaceUri);
+    }
     if (workspaceUri && openAfterMove) {
       if (wipeOriginal || (openAfterMove && execOnlyIfTemp)) {
         try {
@@ -100,12 +113,48 @@ export class SaveAsSketch extends SketchContribution {
           /* NOOP: from time to time, it's not possible to wipe the old resource from the temp dir on Windows */
         }
       }
+      this.windowService.setSafeToShutDown();
       this.workspaceService.open(new URI(workspaceUri), {
         preserveWindow: true,
       });
     }
     return !!workspaceUri;
   }
+
+  private async saveOntoCopiedSketch(mainFileUri: string, sketchUri: string, newSketchUri: string): Promise<void> {
+    const widgets = this.applicationShell.widgets;
+    const snapshots = new Map<string, object>();
+    for (const widget of widgets) {
+      const saveable = Saveable.getDirty(widget);
+      const uri = NavigatableWidget.getUri(widget);
+      const uriString = uri?.toString();
+      let relativePath: string;
+      if (uri && uriString!.includes(sketchUri) && saveable && saveable.createSnapshot) {
+        // The main file will change its name during the copy process
+        // We need to store the new name in the map
+        if (mainFileUri === uriString) {
+          const lastPart = new URI(newSketchUri).path.base + uri.path.ext;
+          relativePath = '/' + lastPart;
+        } else {
+          relativePath = uri.toString().substring(sketchUri.length);
+        }
+        snapshots.set(relativePath, saveable.createSnapshot());
+      }
+    }
+    await Promise.all(Array.from(snapshots.entries()).map(async ([path, snapshot]) => {
+      const widgetUri = new URI(newSketchUri + path);
+      try {
+        const widget = await this.editorManager.getOrCreateByUri(widgetUri);
+        const saveable = Saveable.get(widget);
+        if (saveable && saveable.applySnapshot) {
+          saveable.applySnapshot(snapshot);
+          await saveable.save();
+        }
+      } catch (e) {
+        console.error(e);
+      }
+    }));
+  }
 }
 
 export namespace SaveAsSketch {

arduino-ide-extension/src/browser/contributions/save-sketch.ts

@@ -1,4 +1,4 @@
-import { injectable } from 'inversify';
+import { injectable } from '@theia/core/shared/inversify';
 import { CommonCommands } from '@theia/core/lib/browser/common-frontend-contribution';
 import { ArduinoMenus } from '../menu/arduino-menus';
 import { ArduinoToolbar } from '../toolbar/arduino-toolbar';
@@ -9,13 +9,13 @@ import {
   CommandRegistry,
   MenuModelRegistry,
   KeybindingRegistry,
-  TabBarToolbarRegistry,
 } from './contribution';
 import { nls } from '@theia/core/lib/common';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
 
 @injectable()
 export class SaveSketch extends SketchContribution {
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(SaveSketch.Commands.SAVE_SKETCH, {
       execute: () => this.saveSketch(),
     });
@@ -27,7 +27,7 @@ export class SaveSketch extends SketchContribution {
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.FILE__SKETCH_GROUP, {
       commandId: SaveSketch.Commands.SAVE_SKETCH.id,
       label: nls.localize('vscode/fileCommands/save', 'Save'),
@@ -35,25 +35,16 @@ export class SaveSketch extends SketchContribution {
     });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: SaveSketch.Commands.SAVE_SKETCH.id,
       keybinding: 'CtrlCmd+S',
     });
   }
 
-  registerToolbarItems(registry: TabBarToolbarRegistry): void {
-    registry.registerItem({
-      id: SaveSketch.Commands.SAVE_SKETCH__TOOLBAR.id,
-      command: SaveSketch.Commands.SAVE_SKETCH__TOOLBAR.id,
-      tooltip: nls.localize('vscode/fileCommands/save', 'Save'),
-      priority: 5,
-    });
-  }
-
   async saveSketch(): Promise<void> {
     const sketch = await this.sketchServiceClient.currentSketch();
-    if (!sketch) {
+    if (!CurrentSketch.isValid(sketch)) {
       return;
     }
     const isTemp = await this.sketchService.isTemp(sketch);

arduino-ide-extension/src/browser/contributions/selected-board.ts

@@ -0,0 +1,54 @@
+import {
+  StatusBar,
+  StatusBarAlignment,
+} from '@theia/core/lib/browser/status-bar/status-bar';
+import { nls } from '@theia/core/lib/common/nls';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { BoardsConfig } from '../boards/boards-config';
+import { BoardsServiceProvider } from '../boards/boards-service-provider';
+import { Contribution } from './contribution';
+
+@injectable()
+export class SelectedBoard extends Contribution {
+  @inject(StatusBar)
+  private readonly statusBar: StatusBar;
+
+  @inject(BoardsServiceProvider)
+  private readonly boardsServiceProvider: BoardsServiceProvider;
+
+  override onStart(): void {
+    this.boardsServiceProvider.onBoardsConfigChanged((config) =>
+      this.update(config)
+    );
+  }
+
+  override onReady(): void {
+    this.update(this.boardsServiceProvider.boardsConfig);
+  }
+
+  private update({ selectedBoard, selectedPort }: BoardsConfig.Config): void {
+    this.statusBar.setElement('arduino-selected-board', {
+      alignment: StatusBarAlignment.RIGHT,
+      text: selectedBoard
+        ? `$(microchip) ${selectedBoard.name}`
+        : `$(close) ${nls.localize(
+            'arduino/common/noBoardSelected',
+            'No board selected'
+          )}`,
+      className: 'arduino-selected-board',
+    });
+    if (selectedBoard) {
+      this.statusBar.setElement('arduino-selected-port', {
+        alignment: StatusBarAlignment.RIGHT,
+        text: selectedPort
+          ? nls.localize(
+              'arduino/common/selectedOn',
+              'on {0}',
+              selectedPort.address
+            )
+          : nls.localize('arduino/common/notConnected', '[not connected]'),
+        className: 'arduino-selected-port',
+      });
+    }
+  }
+}

arduino-ide-extension/src/browser/contributions/settings.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import {
   Command,
   MenuModelRegistry,
@@ -18,7 +18,7 @@ export class Settings extends SketchContribution {
 
   protected settingsOpened = false;
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(Settings.Commands.OPEN, {
       execute: async () => {
         let settings: Preferences | undefined = undefined;
@@ -39,7 +39,7 @@ export class Settings extends SketchContribution {
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.FILE__PREFERENCES_GROUP, {
       commandId: Settings.Commands.OPEN.id,
       label:
@@ -49,10 +49,13 @@ export class Settings extends SketchContribution {
         ) + '...',
       order: '0',
     });
-    registry.registerSubmenu(ArduinoMenus.FILE__ADVANCED_SUBMENU, 'Advanced');
+    registry.registerSubmenu(
+      ArduinoMenus.FILE__ADVANCED_SUBMENU,
+      nls.localize('arduino/menu/advanced', 'Advanced')
+    );
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: Settings.Commands.OPEN.id,
       keybinding: 'CtrlCmd+,',

arduino-ide-extension/src/browser/contributions/sketch-control.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { CommonCommands } from '@theia/core/lib/browser/common-frontend-contribution';
 import { ApplicationShell } from '@theia/core/lib/browser/shell/application-shell';
 import { WorkspaceCommands } from '@theia/workspace/lib/browser';
@@ -19,7 +19,10 @@ import {
 } from './contribution';
 import { ArduinoMenus, PlaceholderMenuNode } from '../menu/arduino-menus';
 import { EditorManager } from '@theia/editor/lib/browser/editor-manager';
-import { SketchesServiceClientImpl } from '../../common/protocol/sketches-service-client-impl';
+import {
+  CurrentSketch,
+  SketchesServiceClientImpl,
+} from '../../common/protocol/sketches-service-client-impl';
 import { LocalCacheFsProvider } from '../local-cache/local-cache-fs-provider';
 import { nls } from '@theia/core/lib/common';
 
@@ -35,7 +38,7 @@ export class SketchControl extends SketchContribution {
   protected readonly contextMenuRenderer: ContextMenuRenderer;
 
   @inject(EditorManager)
-  protected readonly editorManager: EditorManager;
+  protected override readonly editorManager: EditorManager;
 
   @inject(SketchesServiceClientImpl)
   protected readonly sketchesServiceClient: SketchesServiceClientImpl;
@@ -46,7 +49,7 @@ export class SketchControl extends SketchContribution {
   protected readonly toDisposeBeforeCreateNewContextMenu =
     new DisposableCollection();
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(
       SketchControl.Commands.OPEN_SKETCH_CONTROL__TOOLBAR,
       {
@@ -55,7 +58,7 @@ export class SketchControl extends SketchContribution {
         execute: async () => {
           this.toDisposeBeforeCreateNewContextMenu.dispose();
           const sketch = await this.sketchServiceClient.currentSketch();
-          if (!sketch) {
+          if (!CurrentSketch.isValid(sketch)) {
             return;
           }
 
@@ -70,25 +73,22 @@ export class SketchControl extends SketchContribution {
             return;
           }
 
-          const { mainFileUri, rootFolderFileUris } =
-            await this.sketchService.loadSketch(sketch.uri);
+          const { mainFileUri, rootFolderFileUris } = sketch;
           const uris = [mainFileUri, ...rootFolderFileUris];
 
-          const currentSketch =
-            await this.sketchesServiceClient.currentSketch();
-          const parentsketchUri = this.editorManager.currentEditor
+          const parentSketchUri = this.editorManager.currentEditor
             ?.getResourceUri()
             ?.toString();
-          const parentsketch = await this.sketchService.getSketchFolder(
-            parentsketchUri || ''
+          const parentSketch = await this.sketchService.getSketchFolder(
+            parentSketchUri || ''
           );
 
           // if the current file is in the current opened sketch, show extra menus
           if (
-            currentSketch &&
-            parentsketch &&
-            parentsketch.uri === currentSketch.uri &&
-            this.allowRename(parentsketch.uri)
+            sketch &&
+            parentSketch &&
+            parentSketch.uri === sketch.uri &&
+            this.allowRename(parentSketch.uri)
           ) {
             this.menuRegistry.registerMenuAction(
               ArduinoMenus.SKETCH_CONTROL__CONTEXT__MAIN_GROUP,
@@ -122,10 +122,10 @@ export class SketchControl extends SketchContribution {
           }
 
           if (
-            currentSketch &&
-            parentsketch &&
-            parentsketch.uri === currentSketch.uri &&
-            this.allowDelete(parentsketch.uri)
+            sketch &&
+            parentSketch &&
+            parentSketch.uri === sketch.uri &&
+            this.allowDelete(parentSketch.uri)
           ) {
             this.menuRegistry.registerMenuAction(
               ArduinoMenus.SKETCH_CONTROL__CONTEXT__MAIN_GROUP,
@@ -200,7 +200,7 @@ export class SketchControl extends SketchContribution {
     );
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(
       ArduinoMenus.SKETCH_CONTROL__CONTEXT__MAIN_GROUP,
       {
@@ -228,7 +228,7 @@ export class SketchControl extends SketchContribution {
     );
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: WorkspaceCommands.NEW_FILE.id,
       keybinding: 'CtrlCmd+Shift+N',
@@ -243,7 +243,7 @@ export class SketchControl extends SketchContribution {
     });
   }
 
-  registerToolbarItems(registry: TabBarToolbarRegistry): void {
+  override registerToolbarItems(registry: TabBarToolbarRegistry): void {
     registry.registerItem({
       id: SketchControl.Commands.OPEN_SKETCH_CONTROL__TOOLBAR.id,
       command: SketchControl.Commands.OPEN_SKETCH_CONTROL__TOOLBAR.id,
@@ -276,7 +276,7 @@ export namespace SketchControl {
   export namespace Commands {
     export const OPEN_SKETCH_CONTROL__TOOLBAR: Command = {
       id: 'arduino-open-sketch-control--toolbar',
-      iconClass: 'fa fa-caret-down',
+      iconClass: 'fa fa-arduino-sketch-tabs-menu',
     };
   }
 }

arduino-ide-extension/src/browser/contributions/sketch-files-tracker.ts

@@ -0,0 +1,69 @@
+import { SaveableWidget } from '@theia/core/lib/browser/saveable';
+import { DisposableCollection } from '@theia/core/lib/common/disposable';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { FileSystemFrontendContribution } from '@theia/filesystem/lib/browser/filesystem-frontend-contribution';
+import { FileChangeType } from '@theia/filesystem/lib/common/files';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
+import { Sketch, SketchContribution, URI } from './contribution';
+import { OpenSketchFiles } from './open-sketch-files';
+
+@injectable()
+export class SketchFilesTracker extends SketchContribution {
+  @inject(FileSystemFrontendContribution)
+  private readonly fileSystemFrontendContribution: FileSystemFrontendContribution;
+  private readonly toDisposeOnStop = new DisposableCollection();
+
+  override onStart(): void {
+    this.fileSystemFrontendContribution.onDidChangeEditorFile(
+      ({ type, editor }) => {
+        if (type === FileChangeType.DELETED) {
+          const editorWidget = editor;
+          if (SaveableWidget.is(editorWidget)) {
+            editorWidget.closeWithoutSaving();
+          } else {
+            editorWidget.close();
+          }
+        }
+      }
+    );
+  }
+
+  override onReady(): void {
+    this.sketchServiceClient.currentSketch().then(async (sketch) => {
+      if (
+        CurrentSketch.isValid(sketch) &&
+        !(await this.sketchService.isTemp(sketch))
+      ) {
+        this.toDisposeOnStop.push(this.fileService.watch(new URI(sketch.uri)));
+        this.toDisposeOnStop.push(
+          this.fileService.onDidFilesChange(async (event) => {
+            for (const { type, resource } of event.changes) {
+              if (
+                type === FileChangeType.ADDED &&
+                resource.parent.toString() === sketch.uri
+              ) {
+                const reloadedSketch = await this.sketchService.loadSketch(
+                  sketch.uri
+                );
+                if (Sketch.isInSketch(resource, reloadedSketch)) {
+                  this.commandService.executeCommand(
+                    OpenSketchFiles.Commands.ENSURE_OPENED.id,
+                    resource.toString(),
+                    true,
+                    {
+                      mode: 'open',
+                    }
+                  );
+                }
+              }
+            }
+          })
+        );
+      }
+    });
+  }
+
+  onStop(): void {
+    this.toDisposeOnStop.dispose();
+  }
+}

arduino-ide-extension/src/browser/contributions/sketchbook.ts

@@ -1,21 +1,25 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { CommandHandler } from '@theia/core/lib/common/command';
 import { CommandRegistry, MenuModelRegistry } from './contribution';
 import { ArduinoMenus } from '../menu/arduino-menus';
 import { MainMenuManager } from '../../common/main-menu-manager';
 import { NotificationCenter } from '../notification-center';
 import { Examples } from './examples';
-import { SketchContainer } from '../../common/protocol';
+import {
+  SketchContainer,
+  SketchesError,
+  SketchRef,
+} from '../../common/protocol';
 import { OpenSketch } from './open-sketch';
 import { nls } from '@theia/core/lib/common';
 
 @injectable()
 export class Sketchbook extends Examples {
   @inject(CommandRegistry)
-  protected readonly commandRegistry: CommandRegistry;
+  protected override readonly commandRegistry: CommandRegistry;
 
   @inject(MenuModelRegistry)
-  protected readonly menuRegistry: MenuModelRegistry;
+  protected override readonly menuRegistry: MenuModelRegistry;
 
   @inject(MainMenuManager)
   protected readonly mainMenuManager: MainMenuManager;
@@ -23,20 +27,22 @@ export class Sketchbook extends Examples {
   @inject(NotificationCenter)
   protected readonly notificationCenter: NotificationCenter;
 
-  onStart(): void {
+  override onStart(): void {
+    this.sketchServiceClient.onSketchbookDidChange(() => this.update());
+  }
+
+  override async onReady(): Promise<void> {
+    this.update();
+  }
+
+  private update() {
     this.sketchService.getSketches({}).then((container) => {
       this.register(container);
       this.mainMenuManager.update();
     });
-    this.sketchServiceClient.onSketchbookDidChange(() => {
-      this.sketchService.getSketches({}).then((container) => {
-        this.register(container);
-        this.mainMenuManager.update();
-      });
-    });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerSubmenu(
       ArduinoMenus.FILE__SKETCHBOOK_SUBMENU,
       nls.localize('arduino/sketch/sketchbook', 'Sketchbook'),
@@ -53,14 +59,27 @@ export class Sketchbook extends Examples {
     );
   }
 
-  protected createHandler(uri: string): CommandHandler {
+  protected override createHandler(uri: string): CommandHandler {
     return {
       execute: async () => {
-        const sketch = await this.sketchService.loadSketch(uri);
-        return this.commandService.executeCommand(
-          OpenSketch.Commands.OPEN_SKETCH.id,
-          sketch
-        );
+        let sketch: SketchRef | undefined = undefined;
+        try {
+          sketch = await this.sketchService.loadSketch(uri);
+        } catch (err) {
+          if (SketchesError.NotFound.is(err)) {
+            // To handle the following:
+            // Open IDE2, delete a sketch from sketchbook, click on File > Sketchbook > the deleted sketch.
+            // Filesystem watcher misses out delete events on macOS; hence IDE2 has no chance to update the menu items.
+            this.messageService.error(err.message);
+            this.update();
+          }
+        }
+        if (sketch) {
+          await this.commandService.executeCommand(
+            OpenSketch.Commands.OPEN_SKETCH.id,
+            sketch
+          );
+        }
       },
     };
   }

arduino-ide-extension/src/browser/contributions/survey-notification.ts

@@ -0,0 +1,78 @@
+import { MessageService } from '@theia/core';
+import { FrontendApplicationContribution } from '@theia/core/lib/browser';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { LocalStorageService } from '@theia/core/lib/browser';
+import { nls } from '@theia/core/lib/common';
+import { WindowService } from '@theia/core/lib/browser/window/window-service';
+import { ArduinoPreferences } from '../arduino-preferences';
+import { SurveyNotificationService } from '../../common/protocol/survey-service';
+
+const SURVEY_MESSAGE = nls.localize(
+  'arduino/survey/surveyMessage',
+  'Please help us improve by answering this super short survey. We value our community and would like to get to know our supporters a little better.'
+);
+const DO_NOT_SHOW_AGAIN = nls.localize(
+  'arduino/survey/dismissSurvey',
+  "Don't show again"
+);
+const GO_TO_SURVEY = nls.localize(
+  'arduino/survey/answerSurvey',
+  'Answer survey'
+);
+
+const SURVEY_BASE_URL = 'https://surveys.hotjar.com/';
+const surveyId = '17887b40-e1f0-4bd6-b9f0-a37f229ccd8b';
+
+@injectable()
+export class SurveyNotification implements FrontendApplicationContribution {
+  @inject(MessageService)
+  private readonly messageService: MessageService;
+
+  @inject(LocalStorageService)
+  private readonly localStorageService: LocalStorageService;
+
+  @inject(WindowService)
+  private readonly windowService: WindowService;
+
+  @inject(ArduinoPreferences)
+  private readonly arduinoPreferences: ArduinoPreferences;
+
+  @inject(SurveyNotificationService)
+  private readonly surveyNotificationService: SurveyNotificationService;
+
+  onStart(): void {
+    this.arduinoPreferences.ready.then(async () => {
+      if (
+        (await this.surveyNotificationService.isFirstInstance()) &&
+        this.arduinoPreferences.get('arduino.survey.notification')
+      ) {
+        const surveyAnswered = await this.localStorageService.getData(
+          this.surveyKey(surveyId)
+        );
+        if (surveyAnswered !== undefined) {
+          return;
+        }
+        const answer = await this.messageService.info(
+          SURVEY_MESSAGE,
+          DO_NOT_SHOW_AGAIN,
+          GO_TO_SURVEY
+        );
+        switch (answer) {
+          case GO_TO_SURVEY:
+            this.windowService.openNewWindow(SURVEY_BASE_URL + surveyId, {
+              external: true,
+            });
+            this.localStorageService.setData(this.surveyKey(surveyId), true);
+            break;
+          case DO_NOT_SHOW_AGAIN:
+            this.localStorageService.setData(this.surveyKey(surveyId), false);
+            break;
+        }
+      }
+    });
+  }
+
+  private surveyKey(id: string): string {
+    return `answered_survey:${id}`;
+  }
+}

arduino-ide-extension/src/browser/contributions/upload-certificate.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import {
   Command,
   MenuModelRegistry,
@@ -39,7 +39,7 @@ export class UploadCertificate extends Contribution {
 
   protected dialogOpened = false;
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(UploadCertificate.Commands.OPEN, {
       execute: async () => {
         try {
@@ -93,7 +93,7 @@ export class UploadCertificate extends Contribution {
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.TOOLS__FIRMWARE_UPLOADER_GROUP, {
       commandId: UploadCertificate.Commands.OPEN.id,
       label: UploadCertificate.Commands.OPEN.label,

arduino-ide-extension/src/browser/contributions/upload-firmware.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import {
   Command,
   MenuModelRegistry,
@@ -16,7 +16,7 @@ export class UploadFirmware extends Contribution {
 
   protected dialogOpened = false;
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(UploadFirmware.Commands.OPEN, {
       execute: async () => {
         try {
@@ -30,7 +30,7 @@ export class UploadFirmware extends Contribution {
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.TOOLS__FIRMWARE_UPLOADER_GROUP, {
       commandId: UploadFirmware.Commands.OPEN.id,
       label: UploadFirmware.Commands.OPEN.label,

arduino-ide-extension/src/browser/contributions/upload-sketch.ts

@@ -1,64 +1,49 @@
-import { inject, injectable, postConstruct } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { Emitter } from '@theia/core/lib/common/event';
 import { BoardUserField, CoreService } from '../../common/protocol';
 import { ArduinoMenus, PlaceholderMenuNode } from '../menu/arduino-menus';
 import { ArduinoToolbar } from '../toolbar/arduino-toolbar';
-import { BoardsDataStore } from '../boards/boards-data-store';
-import { SerialConnectionManager } from '../serial/serial-connection-manager';
-import { BoardsServiceProvider } from '../boards/boards-service-provider';
 import {
-  SketchContribution,
   Command,
   CommandRegistry,
   MenuModelRegistry,
   KeybindingRegistry,
   TabBarToolbarRegistry,
+  CoreServiceContribution,
 } from './contribution';
 import { UserFieldsDialog } from '../dialogs/user-fields/user-fields-dialog';
 import { DisposableCollection, nls } from '@theia/core/lib/common';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
+import type { VerifySketchParams } from './verify-sketch';
 
 @injectable()
-export class UploadSketch extends SketchContribution {
-  @inject(CoreService)
-  protected readonly coreService: CoreService;
-
-  @inject(SerialConnectionManager)
-  protected readonly serialConnection: SerialConnectionManager;
-
+export class UploadSketch extends CoreServiceContribution {
   @inject(MenuModelRegistry)
-  protected readonly menuRegistry: MenuModelRegistry;
-
-  @inject(BoardsDataStore)
-  protected readonly boardsDataStore: BoardsDataStore;
-
-  @inject(BoardsServiceProvider)
-  protected readonly boardsServiceClientImpl: BoardsServiceProvider;
+  private readonly menuRegistry: MenuModelRegistry;
 
   @inject(UserFieldsDialog)
-  protected readonly userFieldsDialog: UserFieldsDialog;
+  private readonly userFieldsDialog: UserFieldsDialog;
 
-  protected cachedUserFields: Map<string, BoardUserField[]> = new Map();
+  private boardRequiresUserFields = false;
+  private readonly cachedUserFields: Map<string, BoardUserField[]> = new Map();
+  private readonly menuActionsDisposables = new DisposableCollection();
 
-  protected readonly onDidChangeEmitter = new Emitter<Readonly<void>>();
-  readonly onDidChange = this.onDidChangeEmitter.event;
+  private readonly onDidChangeEmitter = new Emitter<void>();
+  private readonly onDidChange = this.onDidChangeEmitter.event;
+  private uploadInProgress = false;
 
-  protected uploadInProgress = false;
-  protected boardRequiresUserFields = false;
-
-  protected readonly menuActionsDisposables = new DisposableCollection();
-
-  @postConstruct()
-  protected init(): void {
-    this.boardsServiceClientImpl.onBoardsConfigChanged(async () => {
+  protected override init(): void {
+    super.init();
+    this.boardsServiceProvider.onBoardsConfigChanged(async () => {
       const userFields =
-        await this.boardsServiceClientImpl.selectedBoardUserFields();
+        await this.boardsServiceProvider.selectedBoardUserFields();
       this.boardRequiresUserFields = userFields.length > 0;
       this.registerMenus(this.menuRegistry);
     });
   }
 
   private selectedFqbnAddress(): string {
-    const { boardsConfig } = this.boardsServiceClientImpl;
+    const { boardsConfig } = this.boardsServiceProvider;
     const fqbn = boardsConfig.selectedBoard?.fqbn;
     if (!fqbn) {
       return '';
@@ -72,7 +57,7 @@ export class UploadSketch extends SketchContribution {
     return fqbn + '|' + address;
   }
 
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(UploadSketch.Commands.UPLOAD_SKETCH, {
       execute: async () => {
         const key = this.selectedFqbnAddress();
@@ -82,7 +67,7 @@ export class UploadSketch extends SketchContribution {
         if (this.boardRequiresUserFields && !this.cachedUserFields.has(key)) {
           // Deep clone the array of board fields to avoid editing the cached ones
           this.userFieldsDialog.value = (
-            await this.boardsServiceClientImpl.selectedBoardUserFields()
+            await this.boardsServiceProvider.selectedBoardUserFields()
           ).map((f) => ({ ...f }));
           const result = await this.userFieldsDialog.open();
           if (!result) {
@@ -104,8 +89,7 @@ export class UploadSketch extends SketchContribution {
         const cached = this.cachedUserFields.get(key);
         // Deep clone the array of board fields to avoid editing the cached ones
         this.userFieldsDialog.value = (
-          cached ??
-          (await this.boardsServiceClientImpl.selectedBoardUserFields())
+          cached ?? (await this.boardsServiceProvider.selectedBoardUserFields())
         ).map((f) => ({ ...f }));
 
         const result = await this.userFieldsDialog.open();
@@ -134,9 +118,8 @@ export class UploadSketch extends SketchContribution {
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     this.menuActionsDisposables.dispose();
-
     this.menuActionsDisposables.push(
       registry.registerMenuAction(ArduinoMenus.SKETCH__MAIN_GROUP, {
         commandId: UploadSketch.Commands.UPLOAD_SKETCH.id,
@@ -159,7 +142,7 @@ export class UploadSketch extends SketchContribution {
           new PlaceholderMenuNode(
             ArduinoMenus.SKETCH__MAIN_GROUP,
             // commandId: UploadSketch.Commands.UPLOAD_WITH_CONFIGURATION.id,
-            UploadSketch.Commands.UPLOAD_WITH_CONFIGURATION.label!,
+            UploadSketch.Commands.UPLOAD_WITH_CONFIGURATION.label,
             { order: '2' }
           )
         )
@@ -177,7 +160,7 @@ export class UploadSketch extends SketchContribution {
     );
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: UploadSketch.Commands.UPLOAD_SKETCH.id,
       keybinding: 'CtrlCmd+U',
@@ -188,7 +171,7 @@ export class UploadSketch extends SketchContribution {
     });
   }
 
-  registerToolbarItems(registry: TabBarToolbarRegistry): void {
+  override registerToolbarItems(registry: TabBarToolbarRegistry): void {
     registry.registerItem({
       id: UploadSketch.Commands.UPLOAD_SKETCH_TOOLBAR.id,
       command: UploadSketch.Commands.UPLOAD_SKETCH_TOOLBAR.id,
@@ -199,41 +182,42 @@ export class UploadSketch extends SketchContribution {
   }
 
   async uploadSketch(usingProgrammer = false): Promise<void> {
-    // even with buttons disabled, better to double check if an upload is already in progress
     if (this.uploadInProgress) {
       return;
     }
 
-    // toggle the toolbar button and menu item state.
-    // uploadInProgress will be set to false whether the upload fails or not
-    this.uploadInProgress = true;
-    this.onDidChangeEmitter.fire();
-    const sketch = await this.sketchServiceClient.currentSketch();
-    if (!sketch) {
-      return;
-    }
-
     try {
-      const { boardsConfig } = this.boardsServiceClientImpl;
-      const [fqbn, { selectedProgrammer }, verify, verbose, sourceOverride] =
-        await Promise.all([
-          this.boardsDataStore.appendConfigToFqbn(
-            boardsConfig.selectedBoard?.fqbn
-          ),
-          this.boardsDataStore.getData(boardsConfig.selectedBoard?.fqbn),
-          this.preferences.get('arduino.upload.verify'),
-          this.preferences.get('arduino.upload.verbose'),
-          this.sourceOverride(),
-        ]);
+      // toggle the toolbar button and menu item state.
+      // uploadInProgress will be set to false whether the upload fails or not
+      this.uploadInProgress = true;
+      this.onDidChangeEmitter.fire();
 
-      let options: CoreService.Upload.Options | undefined = undefined;
-      const sketchUri = sketch.uri;
-      const optimizeForDebug = this.editorMode.compileForDebug;
-      const { selectedPort } = boardsConfig;
-      const port = selectedPort;
-      const userFields =
-        this.cachedUserFields.get(this.selectedFqbnAddress()) ?? [];
-      if (userFields.length === 0 && this.boardRequiresUserFields) {
+      const verifyOptions =
+        await this.commandService.executeCommand<CoreService.Options.Compile>(
+          'arduino-verify-sketch',
+          <VerifySketchParams>{
+            exportBinaries: false,
+            silent: true,
+          }
+        );
+      if (!verifyOptions) {
+        return;
+      }
+
+      const uploadOptions = await this.uploadOptions(
+        usingProgrammer,
+        verifyOptions
+      );
+      if (!uploadOptions) {
+        return;
+      }
+
+      // TODO: This does not belong here.
+      // IDE2 should not do any preliminary checks but let the CLI fail and then toast a user consumable error message.
+      if (
+        uploadOptions.userFields.length === 0 &&
+        this.boardRequiresUserFields
+      ) {
         this.messageService.error(
           nls.localize(
             'arduino/sketch/userFieldsNotFoundError',
@@ -243,56 +227,70 @@ export class UploadSketch extends SketchContribution {
         return;
       }
 
-      if (usingProgrammer) {
-        const programmer = selectedProgrammer;
-        options = {
-          sketchUri,
-          fqbn,
-          optimizeForDebug,
-          programmer,
-          port,
-          verbose,
-          verify,
-          sourceOverride,
-          userFields,
-        };
-      } else {
-        options = {
-          sketchUri,
-          fqbn,
-          optimizeForDebug,
-          port,
-          verbose,
-          verify,
-          sourceOverride,
-          userFields,
-        };
-      }
-      this.outputChannelManager.getChannel('Arduino').clear();
-      if (usingProgrammer) {
-        await this.coreService.uploadUsingProgrammer(options);
-      } else {
-        await this.coreService.upload(options);
-      }
+      await this.doWithProgress({
+        progressText: nls.localize('arduino/sketch/uploading', 'Uploading...'),
+        task: (progressId, coreService) =>
+          coreService.upload({ ...uploadOptions, progressId }),
+        keepOutput: true,
+      });
+
       this.messageService.info(
         nls.localize('arduino/sketch/doneUploading', 'Done uploading.'),
         { timeout: 3000 }
       );
     } catch (e) {
-      let errorMessage = '';
-      if (typeof e === 'string') {
-        errorMessage = e;
-      } else {
-        errorMessage = e.toString();
-      }
-      this.messageService.error(errorMessage);
+      this.handleError(e);
     } finally {
       this.uploadInProgress = false;
       this.onDidChangeEmitter.fire();
-
-      setTimeout(() => this.serialConnection.reconnectAfterUpload(), 5000);
     }
   }
+
+  private async uploadOptions(
+    usingProgrammer: boolean,
+    verifyOptions: CoreService.Options.Compile
+  ): Promise<CoreService.Options.Upload | undefined> {
+    const sketch = await this.sketchServiceClient.currentSketch();
+    if (!CurrentSketch.isValid(sketch)) {
+      return undefined;
+    }
+    const userFields = this.userFields();
+    const { boardsConfig } = this.boardsServiceProvider;
+    const [fqbn, { selectedProgrammer: programmer }, verify, verbose] =
+      await Promise.all([
+        verifyOptions.fqbn, // already decorated FQBN
+        this.boardsDataStore.getData(this.sanitizeFqbn(verifyOptions.fqbn)),
+        this.preferences.get('arduino.upload.verify'),
+        this.preferences.get('arduino.upload.verbose'),
+      ]);
+    const port = boardsConfig.selectedPort;
+    return {
+      sketch,
+      fqbn,
+      ...(usingProgrammer && { programmer }),
+      port,
+      verbose,
+      verify,
+      userFields,
+    };
+  }
+
+  private userFields() {
+    return this.cachedUserFields.get(this.selectedFqbnAddress()) ?? [];
+  }
+
+  /**
+   * Converts the `VENDOR:ARCHITECTURE:BOARD_ID[:MENU_ID=OPTION_ID[,MENU2_ID=OPTION_ID ...]]` FQBN to
+   * `VENDOR:ARCHITECTURE:BOARD_ID` format.
+   * See the details of the `{build.fqbn}` entry in the [specs](https://arduino.github.io/arduino-cli/latest/platform-specification/#global-predefined-properties).
+   */
+  private sanitizeFqbn(fqbn: string | undefined): string | undefined {
+    if (!fqbn) {
+      return undefined;
+    }
+    const [vendor, arch, id] = fqbn.split(':');
+    return `${vendor}:${arch}:${id}`;
+  }
 }
 
 export namespace UploadSketch {
@@ -300,7 +298,7 @@ export namespace UploadSketch {
     export const UPLOAD_SKETCH: Command = {
       id: 'arduino-upload-sketch',
     };
-    export const UPLOAD_WITH_CONFIGURATION: Command = {
+    export const UPLOAD_WITH_CONFIGURATION: Command & { label: string } = {
       id: 'arduino-upload-with-configuration-sketch',
       label: nls.localize(
         'arduino/sketch/configureAndUpload',

arduino-ide-extension/src/browser/contributions/verify-sketch.ts

@@ -1,12 +1,9 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import { Emitter } from '@theia/core/lib/common/event';
-import { CoreService } from '../../common/protocol';
 import { ArduinoMenus } from '../menu/arduino-menus';
 import { ArduinoToolbar } from '../toolbar/arduino-toolbar';
-import { BoardsDataStore } from '../boards/boards-data-store';
-import { BoardsServiceProvider } from '../boards/boards-service-provider';
 import {
-  SketchContribution,
+  CoreServiceContribution,
   Command,
   CommandRegistry,
   MenuModelRegistry,
@@ -14,30 +11,37 @@ import {
   TabBarToolbarRegistry,
 } from './contribution';
 import { nls } from '@theia/core/lib/common';
+import { CurrentSketch } from '../../common/protocol/sketches-service-client-impl';
+import { CoreService } from '../../common/protocol';
+import { CoreErrorHandler } from './core-error-handler';
+
+export interface VerifySketchParams {
+  /**
+   * Same as `CoreService.Options.Compile#exportBinaries`
+   */
+  readonly exportBinaries?: boolean;
+  /**
+   * If `true`, there won't be any UI indication of the verify command. It's `false` by default.
+   */
+  readonly silent?: boolean;
+}
 
 @injectable()
-export class VerifySketch extends SketchContribution {
-  @inject(CoreService)
-  protected readonly coreService: CoreService;
+export class VerifySketch extends CoreServiceContribution {
+  @inject(CoreErrorHandler)
+  private readonly coreErrorHandler: CoreErrorHandler;
 
-  @inject(BoardsDataStore)
-  protected readonly boardsDataStore: BoardsDataStore;
+  private readonly onDidChangeEmitter = new Emitter<void>();
+  private readonly onDidChange = this.onDidChangeEmitter.event;
+  private verifyInProgress = false;
 
-  @inject(BoardsServiceProvider)
-  protected readonly boardsServiceClientImpl: BoardsServiceProvider;
-
-  protected readonly onDidChangeEmitter = new Emitter<Readonly<void>>();
-  readonly onDidChange = this.onDidChangeEmitter.event;
-
-  protected verifyInProgress = false;
-
-  registerCommands(registry: CommandRegistry): void {
+  override registerCommands(registry: CommandRegistry): void {
     registry.registerCommand(VerifySketch.Commands.VERIFY_SKETCH, {
-      execute: () => this.verifySketch(),
+      execute: (params?: VerifySketchParams) => this.verifySketch(params),
       isEnabled: () => !this.verifyInProgress,
     });
     registry.registerCommand(VerifySketch.Commands.EXPORT_BINARIES, {
-      execute: () => this.verifySketch(true),
+      execute: () => this.verifySketch({ exportBinaries: true }),
       isEnabled: () => !this.verifyInProgress,
     });
     registry.registerCommand(VerifySketch.Commands.VERIFY_SKETCH_TOOLBAR, {
@@ -50,7 +54,7 @@ export class VerifySketch extends SketchContribution {
     });
   }
 
-  registerMenus(registry: MenuModelRegistry): void {
+  override registerMenus(registry: MenuModelRegistry): void {
     registry.registerMenuAction(ArduinoMenus.SKETCH__MAIN_GROUP, {
       commandId: VerifySketch.Commands.VERIFY_SKETCH.id,
       label: nls.localize('arduino/sketch/verifyOrCompile', 'Verify/Compile'),
@@ -66,7 +70,7 @@ export class VerifySketch extends SketchContribution {
     });
   }
 
-  registerKeybindings(registry: KeybindingRegistry): void {
+  override registerKeybindings(registry: KeybindingRegistry): void {
     registry.registerKeybinding({
       command: VerifySketch.Commands.VERIFY_SKETCH.id,
       keybinding: 'CtrlCmd+R',
@@ -77,7 +81,7 @@ export class VerifySketch extends SketchContribution {
     });
   }
 
-  registerToolbarItems(registry: TabBarToolbarRegistry): void {
+  override registerToolbarItems(registry: TabBarToolbarRegistry): void {
     registry.registerItem({
       id: VerifySketch.Commands.VERIFY_SKETCH_TOOLBAR.id,
       command: VerifySketch.Commands.VERIFY_SKETCH_TOOLBAR.id,
@@ -87,58 +91,87 @@ export class VerifySketch extends SketchContribution {
     });
   }
 
-  async verifySketch(exportBinaries?: boolean): Promise<void> {
-    // even with buttons disabled, better to double check if a verify is already in progress
+  protected override handleError(error: unknown): void {
+    this.coreErrorHandler.tryHandle(error);
+    super.handleError(error);
+  }
+
+  private async verifySketch(
+    params?: VerifySketchParams
+  ): Promise<CoreService.Options.Compile | undefined> {
     if (this.verifyInProgress) {
-      return;
+      return undefined;
     }
 
-    // toggle the toolbar button and menu item state.
-    // verifyInProgress will be set to false whether the compilation fails or not
-    this.verifyInProgress = true;
-    this.onDidChangeEmitter.fire();
-    const sketch = await this.sketchServiceClient.currentSketch();
-
-    if (!sketch) {
-      return;
-    }
     try {
-      const { boardsConfig } = this.boardsServiceClientImpl;
-      const [fqbn, sourceOverride] = await Promise.all([
-        this.boardsDataStore.appendConfigToFqbn(
-          boardsConfig.selectedBoard?.fqbn
+      if (!params?.silent) {
+        this.verifyInProgress = true;
+        this.onDidChangeEmitter.fire();
+      }
+      this.coreErrorHandler.reset();
+
+      const options = await this.options(params?.exportBinaries);
+      if (!options) {
+        return undefined;
+      }
+
+      await this.doWithProgress({
+        progressText: nls.localize(
+          'arduino/sketch/compile',
+          'Compiling sketch...'
         ),
-        this.sourceOverride(),
-      ]);
-      const verbose = this.preferences.get('arduino.compile.verbose');
-      const compilerWarnings = this.preferences.get('arduino.compile.warnings');
-      this.outputChannelManager.getChannel('Arduino').clear();
-      await this.coreService.compile({
-        sketchUri: sketch.uri,
-        fqbn,
-        optimizeForDebug: this.editorMode.compileForDebug,
-        verbose,
-        exportBinaries,
-        sourceOverride,
-        compilerWarnings,
+        task: (progressId, coreService) =>
+          coreService.compile({
+            ...options,
+            progressId,
+          }),
       });
       this.messageService.info(
         nls.localize('arduino/sketch/doneCompiling', 'Done compiling.'),
         { timeout: 3000 }
       );
+      // Returns with the used options for the compilation
+      // so that follow-up tasks (such as upload) can reuse the compiled code.
+      // Note that the `fqbn` is already decorated with the board settings, if any.
+      return options;
     } catch (e) {
-      let errorMessage = "";
-      if (typeof e === "string") {
-        errorMessage = e;
-      } else {
-        errorMessage = e.toString();
-      }
-      this.messageService.error(errorMessage);
+      this.handleError(e);
+      return undefined;
     } finally {
       this.verifyInProgress = false;
-      this.onDidChangeEmitter.fire();
+      if (!params?.silent) {
+        this.onDidChangeEmitter.fire();
+      }
     }
   }
+
+  private async options(
+    exportBinaries?: boolean
+  ): Promise<CoreService.Options.Compile | undefined> {
+    const sketch = await this.sketchServiceClient.currentSketch();
+    if (!CurrentSketch.isValid(sketch)) {
+      return undefined;
+    }
+    const { boardsConfig } = this.boardsServiceProvider;
+    const [fqbn, sourceOverride, optimizeForDebug] = await Promise.all([
+      this.boardsDataStore.appendConfigToFqbn(boardsConfig.selectedBoard?.fqbn),
+      this.sourceOverride(),
+      this.commandService.executeCommand<boolean>(
+        'arduino-is-optimize-for-debug'
+      ),
+    ]);
+    const verbose = this.preferences.get('arduino.compile.verbose');
+    const compilerWarnings = this.preferences.get('arduino.compile.warnings');
+    return {
+      sketch,
+      fqbn,
+      optimizeForDebug: Boolean(optimizeForDebug),
+      verbose,
+      exportBinaries,
+      sourceOverride,
+      compilerWarnings,
+    };
+  }
 }
 
 export namespace VerifySketch {

arduino-ide-extension/src/browser/create/create-api.ts

@@ -1,4 +1,4 @@
-import { injectable, inject } from 'inversify';
+import { injectable, inject } from '@theia/core/shared/inversify';
 import * as createPaths from './create-paths';
 import { posix } from './create-paths';
 import { AuthenticationClientService } from '../auth/authentication-client-service';
@@ -100,14 +100,29 @@ export class CreateApi {
     return result;
   }
 
-  async sketches(): Promise<Create.Sketch[]> {
+  async sketches(limit = 50): Promise<Create.Sketch[]> {
     const url = new URL(`${this.domain()}/sketches`);
     url.searchParams.set('user_id', 'me');
+    url.searchParams.set('limit', limit.toString());
     const headers = await this.headers();
-    const result = await this.run<{ sketches: Create.Sketch[] }>(url, {
-      method: 'GET',
-      headers,
-    });
+    const result: { sketches: Create.Sketch[] } = { sketches: [] };
+
+    let partialSketches: Create.Sketch[] = [];
+    let currentOffset = 0;
+    do {
+      url.searchParams.set('offset', currentOffset.toString());
+      partialSketches = (
+        await this.run<{ sketches: Create.Sketch[] }>(url, {
+          method: 'GET',
+          headers,
+        })
+      ).sketches;
+      if (partialSketches.length !== 0) {
+        result.sketches = result.sketches.concat(partialSketches);
+      }
+      currentOffset = currentOffset + limit;
+    } while (partialSketches.length !== 0);
+
     result.sketches.forEach((sketch) => this.sketchCache.addSketch(sketch));
     return result.sketches;
   }
@@ -492,7 +507,8 @@ export class CreateApi {
   }
 
   private domain(apiVersion = 'v2'): string {
-    const endpoint = this.arduinoPreferences['arduino.cloud.sketchSyncEnpoint'];
+    const endpoint =
+      this.arduinoPreferences['arduino.cloud.sketchSyncEndpoint'];
     return `${endpoint}/${apiVersion}`;
   }
 

arduino-ide-extension/src/browser/create/create-fs-provider.ts

@@ -1,4 +1,4 @@
-import { inject, injectable } from 'inversify';
+import { inject, injectable } from '@theia/core/shared/inversify';
 import URI from '@theia/core/lib/common/uri';
 import { Event } from '@theia/core/lib/common/event';
 import {

arduino-ide-extension/src/browser/data/arduino.color-theme.json

@@ -1,128 +0,0 @@
-{
-  "tokenColors": [
-    {
-      "settings": {
-        "foreground": "#434f54"
-      }
-    },
-    {
-      "name": "Comments",
-      "scope": "comment",
-      "settings": {
-        "foreground": "#95a5a6cc"
-      }
-    },
-    {
-      "name": "Keywords Attributes",
-      "scope": [
-        "storage",
-        "support",
-        "string.quoted.single.c"
-      ],
-      "settings": {
-        "foreground": "#00979D"
-      }
-    },
-    {
-      "name": "literal",
-      "scope": [
-        "meta.function.c",
-        "entity.name.function",
-        "meta.function-call.c",
-        "variable.other"
-      ],
-      "settings": {
-        "foreground": "#D35400"
-      }
-    },
-    {
-      "name": "punctuation",
-      "scope": [
-        "punctuation.section",
-        "meta.function-call.c",
-        "meta.block.c",
-        "meta.function.c",
-        "entity.name.function.preprocessor.c",
-        "meta.preprocessor.macro.c",
-        "variable",
-        "variable.name"
-      ],
-      "settings": {
-        "foreground": "#434f54"
-      }
-    },
-    {
-      "name": "constants",
-      "scope": [
-        "string.quoted.double",
-        "constant"
-      ],
-      "settings": {
-        "foreground": "#005C5F"
-      }
-    },
-    {
-      "name": "meta keywords",
-      "scope": [
-        "keyword.control",
-        "meta.preprocessor.c"
-      ],
-      "settings": {
-        "foreground": "#728E00"
-      }
-    },
-    {
-      "name": "numeric preprocessor",
-      "scope": [
-        "meta.preprocessor.macro.c",
-        "constant.numeric.preprocessor.c",
-        "meta.preprocessor.c"
-      ],
-      "settings": {
-        "foreground": "#434f54"
-      }
-    }
-  ],
-  "colors": {
-    "list.highlightForeground": "#005c5f",
-    "list.activeSelectionForeground": "#424242",
-    "list.activeSelectionBackground": "#DAE3E3",
-    "list.inactiveSelectionForeground": "#424242",
-    "list.inactiveSelectionBackground": "#DAE3E3",
-    "list.hoverBackground": "#ECF1F1",
-    "progressBar.background": "#005c5f",
-    "editor.background": "#ffffff",
-    "editorCursor.foreground": "#434f54",
-    "editor.foreground": "#434f54",
-    "editorWhitespace.foreground": "#bfbfbf",
-    "editor.lineHighlightBackground": "#434f5410",
-    "editor.selectionBackground": "#ffcb00",
-    "editorWidget.background": "#F7F9F9",
-    "focusBorder": "#7fcbcd99",
-    "menubar.selectionBackground": "#ffffff",
-    "menubar.selectionForeground": "#212121",
-    "menu.selectionBackground": "#dae3e3",
-    "menu.selectionForeground": "#212121",
-    "editorGroupHeader.tabsBackground": "#f7f9f9",
-    "button.background": "#7fcbcd",
-    "titleBar.activeBackground": "#005c5f",
-    "titleBar.activeForeground": "#ffffff",
-    "terminal.background": "#000000",
-    "terminal.foreground": "#e0e0e0",
-    "dropdown.border": "#ececec",
-    "dropdown.background": "#ececec",
-    "activityBar.background": "#ececec",
-    "activityBar.foreground": "#616161",
-    "statusBar.background": "#005c5f",
-    "secondaryButton.background": "#b5c8c9",
-    "secondaryButton.foreground": "#ececec",
-    "secondaryButton.hoverBackground": "#dae3e3",
-    "arduino.branding.primary": "#00979d",
-    "arduino.branding.secondary": "#b5c8c9",
-    "arduino.foreground": "#edf1f1",
-    "arduino.output.foreground": "#FFFFFF",
-    "arduino.output.background": "#000000"
-  },
-  "type": "light",
-  "name": "Arduino"
-}

arduino-ide-extension/src/browser/data/dark.color-theme.json

@@ -0,0 +1,166 @@
+{
+  "name": "Arduino dark",
+  "type": "dark",
+  "colors": {
+    "list.highlightForeground": "#0ca1a6",
+    "list.activeSelectionForeground": "#dae3e3",
+    "list.activeSelectionBackground": "#0ca1a64d",
+    "list.inactiveSelectionForeground": "#dae3e3",
+    "list.inactiveSelectionBackground": "#434f54",
+    "list.hoverBackground": "#1f272a",
+    "list.activeSelectionIconForeground": "#0ca1a6",
+    "progressBar.background": "#005c5f",
+    "editor.background": "#1f272a",
+    "editor.foreground": "#dae3e3",
+    "editor.lineHighlightBackground": "#434f5410",
+    "editor.selectionBackground": "#00818480",
+    "editorCursor.foreground": "#434f54",
+    "editorWhitespace.foreground": "#bfbfbf",
+    "editorWidget.background": "#171e21",
+    "editorWidget.foreground": "#dae3e3",
+    "focusBorder": "#dae3e3",
+    "menubar.selectionBackground": "#ffffff",
+    "menubar.selectionForeground": "#212121",
+    "menu.selectionBackground": "#dae3e3",
+    "menu.selectionForeground": "#212121",
+    "editorGroupHeader.tabsBackground": "#171e21",
+    "button.background": "#0ca1a6",
+    "button.foreground": "#101618",
+    "button.hoverBackground": "#7fcbcd",
+    "titleBar.activeBackground": "#171e21",
+    "titleBar.activeForeground": "#dae3e3",
+    "terminal.background": "#000000",
+    "terminal.foreground": "#ffffff",
+    "dropdown.border": "#7fcbcd",
+    "dropdown.background": "#2c353a",
+    "dropdown.foreground": "#dae3e3",
+    "activityBar.background": "#171e21",
+    "activityBar.foreground": "#dae3e3",
+    "activityBar.inactiveForeground": "#4e5b61",
+    "activityBar.activeBorder": "#0ca1a6",
+    "statusBar.background": "#171e21",
+    "secondaryButton.background": "#ff000000",
+    "secondaryButton.foreground": "#dae3e3",
+    "secondaryButton.hoverBackground": "#ffffff1a",
+    "arduino.branding.primary": "#0ca1a6",
+    "arduino.branding.secondary": "#b5c8c9",
+    "arduino.foreground": "#edf1f1",
+    "arduino.output.foreground": "#ffffff",
+    "arduino.output.background": "#000000",
+    "arduino.toolbar.button.hoverBackground": "#dae3e3",
+    "arduino.toolbar.button.secondary.label": "#dae3e3",
+    "arduino.toolbar.button.secondary.hoverBackground": "#dae3e366",
+    "arduino.toolbar.button.background": "#0ca1a6",
+    "arduino.toolbar.dropdown.border": "#7fcbcd",
+    "arduino.toolbar.dropdown.borderActive": "#0ca1a6",
+    "arduino.toolbar.dropdown.background": "#2c353a",
+    "arduino.toolbar.dropdown.label": "#dae3e3",
+    "arduino.toolbar.dropdown.iconSelected": "#3fae98",
+    "arduino.toolbar.dropdown.option.backgroundHover": "#374146",
+    "arduino.toolbar.dropdown.option.backgroundSelected": "#4e5b61",
+    "arduino.toolbar.toggleBackground": "#f1c40f",
+    "sideBar.background": "#101618",
+    "sideBar.foreground": "#dae3e3",
+    "input.background": "#000000",
+    "foreground": "#dae3e3",
+    "settings.headerForeground": "#dae3e3",
+    "tree.indentGuidesStroke": "#374146",
+    "tab.unfocusedActiveForeground": "#dae3e3",
+    "tab.inactiveBackground": "#171e21",
+    "textLink.foreground": "#0ca1a6"
+  },
+  "tokenColors": [
+    {
+      "name": "",
+      "settings": {
+        "foreground": "#dae3e3"
+      }
+    },
+    {
+      "name": "Comments",
+      "scope": "comment",
+      "settings": {
+        "foreground": "#7f8c8d"
+      }
+    },
+    {
+      "name": "Keywords Attributes",
+      "scope": [
+        "storage",
+        "support",
+        "string.quoted.single.c"
+      ],
+      "settings": {
+        "foreground": "#0ca1a6"
+      }
+    },
+    {
+      "name": "literal",
+      "scope": [
+        "meta.function.c",
+        "entity.name.function",
+        "meta.function-call.c",
+        "variable.other"
+      ],
+      "settings": {
+        "foreground": "#F39C12"
+      }
+    },
+    {
+      "name": "punctuation",
+      "scope": [
+        "punctuation.section",
+        "meta.function-call.c",
+        "meta.block.c",
+        "meta.function.c",
+        "variable",
+        "variable.name"
+      ],
+      "settings": {
+        "foreground": "#dae3e3"
+      }
+    },
+    {
+      "name": "function preprocessor",
+      "scope": [
+        "entity.name.function.preprocessor.c",
+        "meta.preprocessor.macro.c"
+      ],
+      "settings": {
+        "foreground": "#569CD6"
+      }
+    },
+    {
+      "name": "constants",
+      "scope": [
+        "string.quoted.double",
+        "string.quoted.other.lt-gt",
+        "constant"
+      ],
+      "settings": {
+        "foreground": "#7fcbcd"
+      }
+    },
+    {
+      "name": "meta keywords",
+      "scope": [
+        "keyword.control",
+        "meta.preprocessor.c"
+      ],
+      "settings": {
+        "foreground": "#C586C0"
+      }
+    },
+    {
+      "name": "numeric preprocessor",
+      "scope": [
+        "meta.preprocessor.macro.c",
+        "constant.numeric.preprocessor.c",
+        "meta.preprocessor.c"
+      ],
+      "settings": {
+        "foreground": "#434f54"
+      }
+    }
+  ]
+}

arduino-ide-extension/src/browser/data/default.color-theme.json

@@ -0,0 +1,166 @@
+{
+  "name": "Arduino default",
+  "type": "default",
+  "colors": {
+    "list.highlightForeground": "#008184",
+    "list.activeSelectionForeground": "#4e5b61",
+    "list.activeSelectionBackground": "#00818433",
+    "list.inactiveSelectionForeground": "#4e5b61",
+    "list.inactiveSelectionBackground": "#dae3e3",
+    "list.hoverBackground": "#ecf1f1",
+    "list.activeSelectionIconForeground": "#008184",
+    "progressBar.background": "#005c5f",
+    "editor.background": "#ffffff",
+    "editor.foreground": "#4e5b61",
+    "editor.lineHighlightBackground": "#434f5410",
+    "editor.selectionBackground": "#7fcbcdb3",
+    "editorCursor.foreground": "#434f54",
+    "editorWhitespace.foreground": "#bfbfbf",
+    "editorWidget.background": "#f7f9f9",
+    "editorWidget.foreground": "#4e5b61",
+    "focusBorder": "#7fcbcd",
+    "menubar.selectionBackground": "#ffffff",
+    "menubar.selectionForeground": "#212121",
+    "menu.selectionBackground": "#dae3e3",
+    "menu.selectionForeground": "#212121",
+    "editorGroupHeader.tabsBackground": "#ecf1f1",
+    "button.background": "#008184",
+    "button.foreground": "#f7f9f9",
+    "button.hoverBackground": "#005C5F",
+    "titleBar.activeBackground": "#006d70",
+    "titleBar.activeForeground": "#f7f9f9",
+    "terminal.background": "#000000",
+    "terminal.foreground": "#ffffff",
+    "dropdown.border": "#dae3e3",
+    "dropdown.background": "#ffffff",
+    "dropdown.foreground": "#4e5b61",
+    "activityBar.background": "#ecf1f1",
+    "activityBar.foreground": "#4e5b61",
+    "activityBar.inactiveForeground": "#bdc7c7",
+    "activityBar.activeBorder": "#008184",
+    "statusBar.background": "#006d70",
+    "secondaryButton.background": "#ff000000",
+    "secondaryButton.foreground": "#008184",
+    "secondaryButton.hoverBackground": "#005c5f1a",
+    "arduino.branding.primary": "#008184",
+    "arduino.branding.secondary": "#b5c8c9",
+    "arduino.foreground": "#edf1f1",
+    "arduino.output.foreground": "#ffffff",
+    "arduino.output.background": "#000000",
+    "arduino.toolbar.button.hoverBackground": "#f7f9f9",
+    "arduino.toolbar.button.secondary.label": "#dae3e3",
+    "arduino.toolbar.button.secondary.hoverBackground": "#dae3e366",
+    "arduino.toolbar.button.background": "#7fcbcd",
+    "arduino.toolbar.dropdown.border": "#dae3e3",
+    "arduino.toolbar.dropdown.borderActive": "#7fcbcd",
+    "arduino.toolbar.dropdown.background": "#ffffff",
+    "arduino.toolbar.dropdown.label": "#4e5b61",
+    "arduino.toolbar.dropdown.iconSelected": "#1da086",
+    "arduino.toolbar.dropdown.option.backgroundHover": "#ecf1f1",
+    "arduino.toolbar.dropdown.option.backgroundSelected": "#dae3e3",
+    "arduino.toolbar.toggleBackground": "#f1c40f",
+    "sideBar.background": "#f7f9f9",
+    "sideBar.foreground": "#4e5b61",
+    "input.background": "#ffffff",
+    "foreground": "#4e5b61",
+    "settings.headerForeground": "#4e5b61",
+    "tree.indentGuidesStroke": "#dae3e3",
+    "tab.unfocusedActiveForeground": "#4e5b61",
+    "tab.inactiveBackground": "#ecf1f1",
+    "textLink.foreground": "#008184"
+  },
+  "tokenColors": [
+    {
+      "name": "",
+      "settings": {
+        "foreground": "#434f54"
+      }
+    },
+    {
+      "name": "Comments",
+      "scope": "comment",
+      "settings": {
+        "foreground": "#95a5a6cc"
+      }
+    },
+    {
+      "name": "Keywords Attributes",
+      "scope": [
+        "storage",
+        "support",
+        "string.quoted.single.c"
+      ],
+      "settings": {
+        "foreground": "#00979D"
+      }
+    },
+    {
+      "name": "literal",
+      "scope": [
+        "meta.function.c",
+        "entity.name.function",
+        "meta.function-call.c",
+        "variable.other"
+      ],
+      "settings": {
+        "foreground": "#D35400"
+      }
+    },
+    {
+      "name": "punctuation",
+      "scope": [
+        "punctuation.section",
+        "meta.function-call.c",
+        "meta.block.c",
+        "meta.function.c",
+        "variable",
+        "variable.name"
+      ],
+      "settings": {
+        "foreground": "#434f54"
+      }
+    },
+    {
+      "name": "function preprocessor",
+      "scope": [
+        "entity.name.function.preprocessor.c",
+        "meta.preprocessor.macro.c"
+      ],
+      "settings": {
+        "foreground": "#9e846d"
+      }
+    },
+    {
+      "name": "constants",
+      "scope": [
+        "string.quoted.double",
+        "string.quoted.other.lt-gt",
+        "constant"
+      ],
+      "settings": {
+        "foreground": "#005C5F"
+      }
+    },
+    {
+      "name": "meta keywords",
+      "scope": [
+        "keyword.control",
+        "meta.preprocessor.c"
+      ],
+      "settings": {
+        "foreground": "#728E00"
+      }
+    },
+    {
+      "name": "numeric preprocessor",
+      "scope": [
+        "meta.preprocessor.macro.c",
+        "constant.numeric.preprocessor.c",
+        "meta.preprocessor.c"
+      ],
+      "settings": {
+        "foreground": "#434f54"
+      }
+    }
+  ]
+}

arduino-ide-extension/src/browser/dialogs/certificate-uploader/certificate-add-new.tsx

@@ -1,5 +1,5 @@
 import { nls } from '@theia/core/lib/common';
-import * as React from 'react';
+import * as React from '@theia/core/shared/react';
 
 export const CertificateAddComponent = ({
   addCertificate,
@@ -8,9 +8,12 @@ export const CertificateAddComponent = ({
 }): React.ReactElement => {
   const [value, setValue] = React.useState('');
 
-  const handleChange = React.useCallback((event) => {
-    setValue(event.target.value);
-  }, []);
+  const handleChange = React.useCallback(
+    (event: React.ChangeEvent<HTMLInputElement>) => {
+      setValue(event.target.value);
+    },
+    []
+  );
 
   return (
     <form

arduino-ide-extension/src/browser/dialogs/certificate-uploader/certificate-list.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import * as React from '@theia/core/shared/react';
 
 export const CertificateListComponent = ({
   certificates,

arduino-ide-extension/src/browser/dialogs/certificate-uploader/certificate-uploader-component.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import * as React from '@theia/core/shared/react';
 import Tippy from '@tippyjs/react';
 import { AvailableBoard } from '../../boards/boards-service-provider';
 import { CertificateListComponent } from './certificate-list';
@@ -94,7 +94,7 @@ export const CertificateUploaderComponent = ({
           >
             <button
               type="button"
-              className="theia-button primary add-cert-btn"
+              className="theia-button secondary add-cert-btn"
               onClick={() => {
                 showAdd ? setShowAdd(false) : setShowAdd(true);
               }}

arduino-ide-extension/src/browser/dialogs/certificate-uploader/certificate-uploader-dialog.tsx

@@ -1,9 +1,9 @@
-import * as React from 'react';
-import { inject, injectable, postConstruct } from 'inversify';
+import * as React from '@theia/core/shared/react';
+import { inject, injectable, postConstruct } from '@theia/core/shared/inversify';
 import { DialogProps } from '@theia/core/lib/browser/dialogs';
 import { AbstractDialog } from '../../theia/dialogs/dialogs';
-import { Widget } from '@phosphor/widgets';
-import { Message } from '@phosphor/messaging';
+import { Widget } from '@theia/core/shared/@phosphor/widgets';
+import { Message } from '@theia/core/shared/@phosphor/messaging';
 import { ReactWidget } from '@theia/core/lib/browser/widgets/react-widget';
 import {
   AvailableBoard,
@@ -19,6 +19,7 @@ import { CommandRegistry } from '@theia/core/lib/common/command';
 import { certificateList, sanifyCertString } from './utils';
 import { ArduinoFirmwareUploader } from '../../../common/protocol/arduino-firmware-uploader';
 import { nls } from '@theia/core/lib/common';
+import { FrontendApplicationStateService } from '@theia/core/lib/browser/frontend-application-state';
 
 @injectable()
 export class UploadCertificateDialogWidget extends ReactWidget {
@@ -37,6 +38,9 @@ export class UploadCertificateDialogWidget extends ReactWidget {
   @inject(ArduinoFirmwareUploader)
   protected readonly arduinoFirmwareUploader: ArduinoFirmwareUploader;
 
+  @inject(FrontendApplicationStateService)
+  private readonly appStateService: FrontendApplicationStateService;
+
   protected certificates: string[] = [];
   protected updatableFqbns: string[] = [];
   protected availableBoards: AvailableBoard[] = [];
@@ -66,10 +70,12 @@ export class UploadCertificateDialogWidget extends ReactWidget {
       }
     });
 
-    this.arduinoFirmwareUploader.updatableBoards().then((fqbns) => {
-      this.updatableFqbns = fqbns;
-      this.update();
-    });
+    this.appStateService.reachedState('ready').then(() =>
+      this.arduinoFirmwareUploader.updatableBoards().then((fqbns) => {
+        this.updatableFqbns = fqbns;
+        this.update();
+      })
+    );
 
     this.boardsServiceClient.onAvailableBoardsChanged((availableBoards) => {
       this.availableBoards = availableBoards;
@@ -139,7 +145,7 @@ export class UploadCertificateDialog extends AbstractDialog<void> {
 
   constructor(
     @inject(UploadCertificateDialogProps)
-    protected readonly props: UploadCertificateDialogProps
+    protected override readonly props: UploadCertificateDialogProps
   ) {
     super({
       title: nls.localize(
@@ -155,7 +161,7 @@ export class UploadCertificateDialog extends AbstractDialog<void> {
     return;
   }
 
-  protected onAfterAttach(msg: Message): void {
+  protected override onAfterAttach(msg: Message): void {
     if (this.widget.isAttached) {
       Widget.detach(this.widget);
     }
@@ -165,21 +171,21 @@ export class UploadCertificateDialog extends AbstractDialog<void> {
     this.update();
   }
 
-  protected onUpdateRequest(msg: Message): void {
+  protected override onUpdateRequest(msg: Message): void {
     super.onUpdateRequest(msg);
     this.widget.update();
   }
 
-  protected onActivateRequest(msg: Message): void {
+  protected override onActivateRequest(msg: Message): void {
     super.onActivateRequest(msg);
     this.widget.activate();
   }
 
-  protected handleEnter(event: KeyboardEvent): boolean | void {
+  protected override handleEnter(event: KeyboardEvent): boolean | void {
     return false;
   }
 
-  close(): void {
+  override close(): void {
     if (this.busy) {
       return;
     }

arduino-ide-extension/src/browser/dialogs/certificate-uploader/select-board-components.tsx

@@ -1,5 +1,5 @@
 import { nls } from '@theia/core/lib/common';
-import * as React from 'react';
+import * as React from '@theia/core/shared/react';
 import { AvailableBoard } from '../../boards/boards-service-provider';
 import { ArduinoSelect } from '../../widgets/arduino-select';
 

arduino-ide-extension/src/browser/dialogs/cloud-share-sketch-dialog.tsx

@@ -1,7 +1,7 @@
-import * as React from 'react';
-import { inject, injectable } from 'inversify';
-import { Widget } from '@phosphor/widgets';
-import { Message } from '@phosphor/messaging';
+import * as React from '@theia/core/shared/react';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { Widget } from '@theia/core/shared/@phosphor/widgets';
+import { Message } from '@theia/core/shared/@phosphor/messaging';
 import { clipboard } from 'electron';
 import { ReactWidget, DialogProps } from '@theia/core/lib/browser';
 import { AbstractDialog } from '../theia/dialogs/dialogs';
@@ -149,7 +149,7 @@ export class ShareSketchDialog extends AbstractDialog<void> {
 
   constructor(
     @inject(ShareSketchDialogProps)
-    protected readonly props: ShareSketchDialogProps
+    protected override readonly props: ShareSketchDialogProps
   ) {
     super({ title: props.title });
     this.contentNode.classList.add('arduino-share-sketch-dialog');
@@ -159,7 +159,7 @@ export class ShareSketchDialog extends AbstractDialog<void> {
   get value(): void {
     return;
   }
-  protected onAfterAttach(msg: Message): void {
+  protected override onAfterAttach(msg: Message): void {
     if (this.widget.isAttached) {
       Widget.detach(this.widget);
     }
@@ -168,12 +168,12 @@ export class ShareSketchDialog extends AbstractDialog<void> {
     this.update();
   }
 
-  protected onUpdateRequest(msg: Message): void {
+  protected override onUpdateRequest(msg: Message): void {
     super.onUpdateRequest(msg);
     this.widget.update();
   }
 
-  protected onActivateRequest(msg: Message): void {
+  protected override onActivateRequest(msg: Message): void {
     super.onActivateRequest(msg);
     this.widget.activate();
   }

arduino-ide-extension/src/browser/dialogs/do-not-ask-again-dialog.ts

@@ -1,5 +1,5 @@
-import { inject, injectable } from 'inversify';
-import { Widget } from '@phosphor/widgets';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { Widget } from '@theia/core/shared/@phosphor/widgets';
 import { CancellationTokenSource } from '@theia/core/lib/common/cancellation';
 import {
   ConfirmDialog,
@@ -19,7 +19,7 @@ export class DoNotAskAgainConfirmDialog extends ConfirmDialog {
 
   constructor(
     @inject(DoNotAskAgainDialogProps)
-    protected readonly props: DoNotAskAgainDialogProps
+    protected override readonly props: DoNotAskAgainDialogProps
   ) {
     super(props);
     this.controlPanel.removeChild(this.errorMessageNode);
@@ -42,7 +42,7 @@ export class DoNotAskAgainConfirmDialog extends ConfirmDialog {
     this.doNotAskAgainCheckbox.type = 'checkbox';
   }
 
-  protected async accept(): Promise<void> {
+  protected override async accept(): Promise<void> {
     if (!this.resolve) {
       return;
     }
@@ -65,7 +65,7 @@ export class DoNotAskAgainConfirmDialog extends ConfirmDialog {
     }
   }
 
-  protected setErrorMessage(error: DialogError): void {
+  protected override setErrorMessage(error: DialogError): void {
     if (this.acceptButton) {
       this.acceptButton.disabled = !DialogError.getResult(error);
     }

arduino-ide-extension/src/browser/dialogs/firmware-uploader/firmware-uploader-component.tsx

@@ -1,5 +1,6 @@
 import { nls } from '@theia/core/lib/common';
-import * as React from 'react';
+import * as React from '@theia/core/shared/react';
+import { Port } from '../../../common/protocol';
 import {
   ArduinoFirmwareUploader,
   FirmwareInfo,
@@ -20,7 +21,7 @@ export const FirmwareUploaderComponent = ({
   availableBoards: AvailableBoard[];
   firmwareUploader: ArduinoFirmwareUploader;
   updatableFqbns: string[];
-  flashFirmware: (firmware: FirmwareInfo, port: string) => Promise<any>;
+  flashFirmware: (firmware: FirmwareInfo, port: Port) => Promise<any>;
   isOpen: any;
 }): React.ReactElement => {
   // boolean states for buttons
@@ -81,7 +82,7 @@ export const FirmwareUploaderComponent = ({
       const installStatus =
         !!firmwareToFlash &&
         !!selectedBoard?.port &&
-        (await flashFirmware(firmwareToFlash, selectedBoard?.port.address));
+        (await flashFirmware(firmwareToFlash, selectedBoard?.port));
 
       setInstallFeedback((installStatus && 'ok') || 'fail');
     } catch {

arduino-ide-extension/src/browser/dialogs/firmware-uploader/firmware-uploader-dialog.tsx

@@ -1,9 +1,13 @@
-import * as React from 'react';
-import { inject, injectable, postConstruct } from 'inversify';
+import * as React from '@theia/core/shared/react';
+import {
+  inject,
+  injectable,
+  postConstruct,
+} from '@theia/core/shared/inversify';
 import { DialogProps } from '@theia/core/lib/browser/dialogs';
 import { AbstractDialog } from '../../theia/dialogs/dialogs';
-import { Widget } from '@phosphor/widgets';
-import { Message } from '@phosphor/messaging';
+import { Widget } from '@theia/core/shared/@phosphor/widgets';
+import { Message } from '@theia/core/shared/@phosphor/messaging';
 import { ReactWidget } from '@theia/core/lib/browser/widgets/react-widget';
 import {
   AvailableBoard,
@@ -15,6 +19,8 @@ import {
 } from '../../../common/protocol/arduino-firmware-uploader';
 import { FirmwareUploaderComponent } from './firmware-uploader-component';
 import { UploadFirmware } from '../../contributions/upload-firmware';
+import { Port } from '../../../common/protocol';
+import { FrontendApplicationStateService } from '@theia/core/lib/browser/frontend-application-state';
 
 @injectable()
 export class UploadFirmwareDialogWidget extends ReactWidget {
@@ -24,6 +30,9 @@ export class UploadFirmwareDialogWidget extends ReactWidget {
   @inject(ArduinoFirmwareUploader)
   protected readonly arduinoFirmwareUploader: ArduinoFirmwareUploader;
 
+  @inject(FrontendApplicationStateService)
+  private readonly appStatusService: FrontendApplicationStateService;
+
   protected updatableFqbns: string[] = [];
   protected availableBoards: AvailableBoard[] = [];
   protected isOpen = new Object();
@@ -38,7 +47,8 @@ export class UploadFirmwareDialogWidget extends ReactWidget {
 
   @postConstruct()
   protected init(): void {
-    this.arduinoFirmwareUploader.updatableBoards().then((fqbns) => {
+    this.appStatusService.reachedState('ready').then(async () => {
+      const fqbns = await this.arduinoFirmwareUploader.updatableBoards();
       this.updatableFqbns = fqbns;
       this.update();
     });
@@ -49,14 +59,14 @@ export class UploadFirmwareDialogWidget extends ReactWidget {
     });
   }
 
-  protected flashFirmware(firmware: FirmwareInfo, port: string): Promise<any> {
+  protected flashFirmware(firmware: FirmwareInfo, port: Port): Promise<any> {
     this.busyCallback(true);
     return this.arduinoFirmwareUploader
       .flash(firmware, port)
       .finally(() => this.busyCallback(false));
   }
 
-  onCloseRequest(msg: Message): void {
+  protected override onCloseRequest(msg: Message): void {
     super.onCloseRequest(msg);
     this.isOpen = new Object();
   }
@@ -88,7 +98,7 @@ export class UploadFirmwareDialog extends AbstractDialog<void> {
 
   constructor(
     @inject(UploadFirmwareDialogProps)
-    protected readonly props: UploadFirmwareDialogProps
+    protected override readonly props: UploadFirmwareDialogProps
   ) {
     super({ title: UploadFirmware.Commands.OPEN.label || '' });
     this.contentNode.classList.add('firmware-uploader-dialog');
@@ -99,7 +109,7 @@ export class UploadFirmwareDialog extends AbstractDialog<void> {
     return;
   }
 
-  protected onAfterAttach(msg: Message): void {
+  protected override onAfterAttach(msg: Message): void {
     if (this.widget.isAttached) {
       Widget.detach(this.widget);
     }
@@ -109,21 +119,21 @@ export class UploadFirmwareDialog extends AbstractDialog<void> {
     this.update();
   }
 
-  protected onUpdateRequest(msg: Message): void {
+  protected override onUpdateRequest(msg: Message): void {
     super.onUpdateRequest(msg);
     this.widget.update();
   }
 
-  protected onActivateRequest(msg: Message): void {
+  protected override onActivateRequest(msg: Message): void {
     super.onActivateRequest(msg);
     this.widget.activate();
   }
 
-  protected handleEnter(event: KeyboardEvent): boolean | void {
+  protected override handleEnter(event: KeyboardEvent): boolean | void {
     return false;
   }
 
-  close(): void {
+  override close(): void {
     if (this.busy) {
       return;
     }

arduino-ide-extension/src/browser/dialogs/ide-updater/ide-updater-component.tsx

@@ -0,0 +1,210 @@
+import { WindowService } from '@theia/core/lib/browser/window/window-service';
+import { nls } from '@theia/core/lib/common';
+import { shell } from 'electron';
+import * as React from '@theia/core/shared/react';
+import * as ReactDOM from '@theia/core/shared/react-dom';
+import ReactMarkdown from 'react-markdown';
+import { ProgressInfo, UpdateInfo } from '../../../common/protocol/ide-updater';
+import ProgressBar from '../../components/ProgressBar';
+
+export type IDEUpdaterComponentProps = {
+  updateInfo: UpdateInfo;
+  windowService: WindowService;
+  downloadFinished?: boolean;
+  downloadStarted?: boolean;
+  progress?: ProgressInfo;
+  error?: Error;
+  onDownload: () => void;
+  onClose: () => void;
+  onSkipVersion: () => void;
+  onCloseAndInstall: () => void;
+};
+
+export const IDEUpdaterComponent = ({
+  updateInfo: { version, releaseNotes },
+  downloadStarted = false,
+  downloadFinished = false,
+  windowService,
+  progress,
+  error,
+  onDownload,
+  onClose,
+  onSkipVersion,
+  onCloseAndInstall,
+}: IDEUpdaterComponentProps): React.ReactElement => {
+  const changelogDivRef = React.useRef() as React.MutableRefObject<
+    HTMLDivElement
+  >;
+  React.useEffect(() => {
+    if (!!releaseNotes) {
+      let changelog: string;
+      if (typeof releaseNotes === 'string') changelog = releaseNotes;
+      else
+        changelog = releaseNotes.reduce((acc, item) => {
+          return item.note ? (acc += `${item.note}\n\n`) : acc;
+        }, '');
+      ReactDOM.render(
+        <ReactMarkdown
+          components={{
+            a: ({ href, children, ...props }) => (
+              <a onClick={() => href && shell.openExternal(href)} {...props}>
+                {children}
+              </a>
+            ),
+          }}
+        >
+          {changelog}
+        </ReactMarkdown>,
+        changelogDivRef.current
+      );
+    }
+  }, [releaseNotes]);
+  const closeButton = (
+    <button onClick={onClose} type="button" className="theia-button secondary">
+      {nls.localize('arduino/ide-updater/notNowButton', 'Not now')}
+    </button>
+  );
+
+  const DownloadCompleted: () => React.ReactElement = () => (
+    <div className="ide-updater-dialog--downloaded">
+      <div>
+        {nls.localize(
+          'arduino/ide-updater/versionDownloaded',
+          'Arduino IDE {0} has been downloaded.',
+          version
+        )}
+      </div>
+      <div>
+        {nls.localize(
+          'arduino/ide-updater/closeToInstallNotice',
+          'Close the software and install the update on your machine.'
+        )}
+      </div>
+      <div className="buttons-container">
+        {closeButton}
+        <button
+          onClick={onCloseAndInstall}
+          type="button"
+          className="theia-button close-and-install"
+        >
+          {nls.localize(
+            'arduino/ide-updater/closeAndInstallButton',
+            'Close and Install'
+          )}
+        </button>
+      </div>
+    </div>
+  );
+
+  const DownloadStarted: () => React.ReactElement = () => (
+    <div className="ide-updater-dialog--downloading">
+      <div>
+        {nls.localize(
+          'arduino/ide-updater/downloadingNotice',
+          'Downloading the latest version of the Arduino IDE.'
+        )}
+      </div>
+      <ProgressBar percent={progress?.percent} showPercentage />
+    </div>
+  );
+
+  const PreDownload: () => React.ReactElement = () => (
+    <div className="ide-updater-dialog--pre-download">
+      <div className="ide-updater-dialog--logo-container">
+        <div className="ide-updater-dialog--logo"></div>
+      </div>
+      <div className="ide-updater-dialog--new-version-text dialogSection">
+        <div className="dialogRow">
+          <div className="bold">
+            {nls.localize(
+              'arduino/ide-updater/updateAvailable',
+              'Update Available'
+            )}
+          </div>
+        </div>
+        <div className="dialogRow">
+          {nls.localize(
+            'arduino/ide-updater/newVersionAvailable',
+            'A new version of Arduino IDE ({0}) is available for download.',
+            version
+          )}
+        </div>
+        {releaseNotes && (
+          <div className="dialogRow">
+            <div className="changelog-container" ref={changelogDivRef} />
+          </div>
+        )}
+        <div className="buttons-container">
+          <button
+            onClick={onSkipVersion}
+            type="button"
+            className="theia-button secondary skip-version"
+          >
+            {nls.localize(
+              'arduino/ide-updater/skipVersionButton',
+              'Skip Version'
+            )}
+          </button>
+          <div className="push"></div>
+          {closeButton}
+          <button
+            onClick={onDownload}
+            type="button"
+            className="theia-button primary"
+          >
+            {nls.localize('arduino/ide-updater/downloadButton', 'Download')}
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+
+  const onGoToDownloadClick = (
+    event: React.SyntheticEvent<HTMLAnchorElement, Event>
+  ) => {
+    const { target } = event.nativeEvent;
+    if (target instanceof HTMLAnchorElement) {
+      event.nativeEvent.preventDefault();
+      windowService.openNewWindow(target.href, { external: true });
+      onClose();
+    }
+  };
+
+  const GoToDownloadPage: () => React.ReactElement = () => (
+    <div className="ide-updater-dialog--go-to-download-page">
+      <div>
+        {nls.localize(
+          'arduino/ide-updater/goToDownloadPage',
+          "An update for the Arduino IDE is available, but we're not able to download and install it automatically. Please go to the download page and download the latest version from there."
+        )}
+      </div>
+      <div className="buttons-container">
+        {closeButton}
+        <a
+          className="theia-button primary"
+          href="https://www.arduino.cc/en/software#experimental-software"
+          onClick={onGoToDownloadClick}
+        >
+          {nls.localize(
+            'arduino/ide-updater/goToDownloadButton',
+            'Go To Download'
+          )}
+        </a>
+      </div>
+    </div>
+  );
+
+  return (
+    <div className="ide-updater-dialog--content">
+      {!!error ? (
+        <GoToDownloadPage />
+      ) : downloadFinished ? (
+        <DownloadCompleted />
+      ) : downloadStarted ? (
+        <DownloadStarted />
+      ) : (
+        <PreDownload />
+      )}
+    </div>
+  );
+};

arduino-ide-extension/src/browser/dialogs/ide-updater/ide-updater-dialog.tsx

@@ -0,0 +1,173 @@
+import * as React from '@theia/core/shared/react';
+import { inject, injectable } from '@theia/core/shared/inversify';
+import { DialogProps } from '@theia/core/lib/browser/dialogs';
+import { AbstractDialog } from '../../theia/dialogs/dialogs';
+import { Widget } from '@theia/core/shared/@phosphor/widgets';
+import { Message } from '@theia/core/shared/@phosphor/messaging';
+import { ReactWidget } from '@theia/core/lib/browser/widgets/react-widget';
+import { nls } from '@theia/core';
+import { IDEUpdaterComponent } from './ide-updater-component';
+
+import {
+  IDEUpdater,
+  IDEUpdaterClient,
+  ProgressInfo,
+  SKIP_IDE_VERSION,
+  UpdateInfo,
+} from '../../../common/protocol/ide-updater';
+import { LocalStorageService } from '@theia/core/lib/browser';
+import { WindowService } from '@theia/core/lib/browser/window/window-service';
+
+@injectable()
+export class IDEUpdaterDialogWidget extends ReactWidget {
+  protected isOpen = new Object();
+  updateInfo: UpdateInfo;
+  progressInfo: ProgressInfo | undefined;
+  error: Error | undefined;
+  downloadFinished: boolean;
+  downloadStarted: boolean;
+  onClose: () => void;
+
+  @inject(IDEUpdater)
+  protected readonly updater: IDEUpdater;
+
+  @inject(IDEUpdaterClient)
+  protected readonly updaterClient: IDEUpdaterClient;
+
+  @inject(LocalStorageService)
+  protected readonly localStorageService: LocalStorageService;
+
+  @inject(WindowService)
+  protected windowService: WindowService;
+
+  init(updateInfo: UpdateInfo, onClose: () => void): void {
+    this.updateInfo = updateInfo;
+    this.progressInfo = undefined;
+    this.error = undefined;
+    this.downloadStarted = false;
+    this.downloadFinished = false;
+    this.onClose = onClose;
+
+    this.updaterClient.onError((e) => {
+      this.error = e;
+      this.update();
+    });
+    this.updaterClient.onDownloadProgressChanged((e) => {
+      this.progressInfo = e;
+      this.update();
+    });
+    this.updaterClient.onDownloadFinished((e) => {
+      this.downloadFinished = true;
+      this.update();
+    });
+  }
+
+  async onSkipVersion(): Promise<void> {
+    this.localStorageService.setData<string>(
+      SKIP_IDE_VERSION,
+      this.updateInfo.version
+    );
+    this.close();
+  }
+
+  override close(): void {
+    super.close();
+    this.onClose();
+  }
+
+  onDispose(): void {
+    if (this.downloadStarted && !this.downloadFinished)
+      this.updater.stopDownload();
+  }
+
+  async onDownload(): Promise<void> {
+    this.progressInfo = undefined;
+    this.downloadStarted = true;
+    this.error = undefined;
+    this.updater.downloadUpdate();
+    this.update();
+  }
+
+  onCloseAndInstall(): void {
+    this.updater.quitAndInstall();
+  }
+
+  protected render(): React.ReactNode {
+    return !!this.updateInfo ? (
+      <form>
+        <IDEUpdaterComponent
+          updateInfo={this.updateInfo}
+          windowService={this.windowService}
+          downloadStarted={this.downloadStarted}
+          downloadFinished={this.downloadFinished}
+          progress={this.progressInfo}
+          error={this.error}
+          onClose={this.close.bind(this)}
+          onSkipVersion={this.onSkipVersion.bind(this)}
+          onDownload={this.onDownload.bind(this)}
+          onCloseAndInstall={this.onCloseAndInstall.bind(this)}
+        />
+      </form>
+    ) : null;
+  }
+}
+
+@injectable()
+export class IDEUpdaterDialogProps extends DialogProps {}
+
+@injectable()
+export class IDEUpdaterDialog extends AbstractDialog<UpdateInfo> {
+  @inject(IDEUpdaterDialogWidget)
+  protected readonly widget: IDEUpdaterDialogWidget;
+
+  constructor(
+    @inject(IDEUpdaterDialogProps)
+    protected override readonly props: IDEUpdaterDialogProps
+  ) {
+    super({
+      title: nls.localize(
+        'arduino/ide-updater/ideUpdaterDialog',
+        'Software Update'
+      ),
+    });
+    this.contentNode.classList.add('ide-updater-dialog');
+    this.acceptButton = undefined;
+  }
+
+  get value(): UpdateInfo {
+    return this.widget.updateInfo;
+  }
+
+  protected override onAfterAttach(msg: Message): void {
+    if (this.widget.isAttached) {
+      Widget.detach(this.widget);
+    }
+    Widget.attach(this.widget, this.contentNode);
+    super.onAfterAttach(msg);
+    this.update();
+  }
+
+  override async open(
+    data: UpdateInfo | undefined = undefined
+  ): Promise<UpdateInfo | undefined> {
+    if (data && data.version) {
+      this.widget.init(data, this.close.bind(this));
+      return super.open();
+    }
+  }
+
+  protected override onUpdateRequest(msg: Message): void {
+    super.onUpdateRequest(msg);
+    this.widget.update();
+  }
+
+  protected override onActivateRequest(msg: Message): void {
+    super.onActivateRequest(msg);
+    this.widget.activate();
+  }
+
+  override close(): void {
+    this.widget.dispose();
+    super.close();
+  }
+}

arduino-ide-extension/src/browser/dialogs/settings/settings-component.tsx

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import * as React from '@theia/core/shared/react';
 import { Tab, Tabs, TabList, TabPanel } from 'react-tabs';
 import 'react-tabs/style/react-tabs.css';
 import { Disable } from 'react-disable';
@@ -9,6 +9,7 @@ import { WindowService } from '@theia/core/lib/browser/window/window-service';
 import { FileDialogService } from '@theia/filesystem/lib/browser/file-dialog/file-dialog-service';
 import { DisposableCollection } from '@theia/core/lib/common/disposable';
 import {
+  AdditionalUrls,
   CompilerWarningLiterals,
   Network,
   ProxySettings,
@@ -16,8 +17,19 @@ import {
 import { nls } from '@theia/core/lib/common';
 import { Settings, SettingsService } from './settings';
 import { AdditionalUrlsDialog } from './settings-dialog';
-import { AsyncLocalizationProvider } from '@theia/core/lib/common/i18n/localization';
+import {
+  AsyncLocalizationProvider,
+  LanguageInfo,
+} from '@theia/core/lib/common/i18n/localization';
+import SettingsStepInput from './settings-step-input';
 
+const maxScale = 200;
+const minScale = -100;
+const scaleStep = 20;
+
+const maxFontSize = 72;
+const minFontSize = 0;
+const fontSizeStep = 2;
 export class SettingsComponent extends React.Component<
   SettingsComponent.Props,
   SettingsComponent.State
@@ -28,35 +40,46 @@ export class SettingsComponent extends React.Component<
     super(props);
   }
 
-  componentDidUpdate(
+  override componentDidUpdate(
     _: SettingsComponent.Props,
     prevState: SettingsComponent.State
   ): void {
     if (
       this.state &&
       prevState &&
-      JSON.stringify(this.state) !== JSON.stringify(prevState)
+      JSON.stringify(SettingsComponent.State.toSettings(this.state)) !==
+        JSON.stringify(SettingsComponent.State.toSettings(prevState))
     ) {
-      this.props.settingsService.update(this.state, true);
+      this.props.settingsService.update(
+        SettingsComponent.State.toSettings(this.state),
+        true
+      );
     }
   }
 
-  componentDidMount(): void {
+  override componentDidMount(): void {
     this.props.settingsService
       .settings()
-      .then((settings) => this.setState(settings));
-    this.toDispose.push(
+      .then((settings) =>
+        this.setState(SettingsComponent.State.fromSettings(settings))
+      );
+    this.toDispose.pushAll([
       this.props.settingsService.onDidChange((settings) =>
-        this.setState(settings)
-      )
-    );
+        this.setState((prevState) => ({
+          ...SettingsComponent.State.merge(prevState, settings),
+        }))
+      ),
+      this.props.settingsService.onDidReset((settings) =>
+        this.setState(SettingsComponent.State.fromSettings(settings))
+      ),
+    ]);
   }
 
-  componentWillUnmount(): void {
+  override componentWillUnmount(): void {
     this.toDispose.dispose();
   }
 
-  render(): React.ReactNode {
+  override render(): React.ReactNode {
     if (!this.state) {
       return <div />;
     }
@@ -73,6 +96,8 @@ export class SettingsComponent extends React.Component<
   }
 
   protected renderSettings(): React.ReactNode {
+    const scalePercentage = 100 + this.state.interfaceScale * 20;
+
     return (
       <div className="content noselect">
         {nls.localize(
@@ -104,7 +129,7 @@ export class SettingsComponent extends React.Component<
             'Show files inside Sketches'
           )}
         </label>
-        <div className="flex-line">
+        <div className="column-container">
           <div className="column">
             <div className="flex-line">
               {nls.localize(
@@ -145,14 +170,13 @@ export class SettingsComponent extends React.Component<
           </div>
           <div className="column">
             <div className="flex-line">
-              <input
-                className="theia-input small"
-                type="number"
-                step={1}
-                pattern="[0-9]+"
-                onKeyDown={this.numbersOnlyKeyDown}
+              <SettingsStepInput
                 value={this.state.editorFontSize}
-                onChange={this.editorFontSizeDidChange}
+                setSettingsStateValue={this.setFontSize}
+                step={fontSizeStep}
+                maxValue={maxFontSize}
+                minValue={minFontSize}
+                classNames={{ input: 'theia-input small' }}
               />
             </div>
             <div className="flex-line">
@@ -164,26 +188,20 @@ export class SettingsComponent extends React.Component<
                 />
                 {nls.localize('arduino/preferences/automatic', 'Automatic')}
               </label>
-              <input
-                className="theia-input small with-margin"
-                type="number"
-                step={20}
-                pattern="[0-9]+"
-                onKeyDown={this.noopKeyDown}
-                value={100 + this.state.interfaceScale * 20}
-                onChange={this.interfaceScaleDidChange}
+              <SettingsStepInput
+                value={scalePercentage}
+                setSettingsStateValue={this.setInterfaceScale}
+                step={scaleStep}
+                maxValue={maxScale}
+                minValue={minScale}
+                classNames={{ input: 'theia-input small with-margin' }}
               />
               %
             </div>
             <div className="flex-line">
               <select
                 className="theia-select"
-                value={
-                  ThemeService.get()
-                    .getThemes()
-                    .find(({ id }) => id === this.state.themeId)?.label ||
-                  nls.localize('arduino/common/unknown', 'Unknown')
-                }
+                value={ThemeService.get().getCurrentTheme().label}
                 onChange={this.themeDidChange}
               >
                 {ThemeService.get()
@@ -201,11 +219,9 @@ export class SettingsComponent extends React.Component<
                 value={this.state.currentLanguage}
                 onChange={this.languageDidChange}
               >
-                {this.state.languages.map((label) => (
-                  <option key={label} value={label}>
-                    {label}
-                  </option>
-                ))}
+                {this.state.languages.map((label) =>
+                  this.toSelectOptions(label)
+                )}
               </select>
               <span style={{ marginLeft: '5px' }}>
                 (
@@ -263,19 +279,7 @@ export class SettingsComponent extends React.Component<
         <label className="flex-line">
           <input
             type="checkbox"
-            checked={this.state.checkForUpdates}
-            onChange={this.checkForUpdatesDidChange}
-            disabled={true}
-          />
-          {nls.localize(
-            'arduino/preferences/checkForUpdates',
-            'Check for updates on startup'
-          )}
-        </label>
-        <label className="flex-line">
-          <input
-            type="checkbox"
-            checked={this.state.autoSave === 'on'}
+            checked={this.state.autoSave !== 'off'}
             onChange={this.autoSaveDidChange}
           />
           {nls.localize(
@@ -302,8 +306,8 @@ export class SettingsComponent extends React.Component<
           <input
             className="theia-input stretch with-margin"
             type="text"
-            value={this.state.additionalUrls.join(',')}
-            onChange={this.additionalUrlsDidChange}
+            value={this.state.rawAdditionalUrlsValue}
+            onChange={this.rawAdditionalUrlsValueDidChange}
           />
           <i
             className="fa fa-window-restore theia-button shrink"
@@ -314,6 +318,24 @@ export class SettingsComponent extends React.Component<
     );
   }
 
+  private toSelectOptions(language: string | LanguageInfo): JSX.Element {
+    const plain = typeof language === 'string';
+    const key = plain ? language : language.languageId;
+    const value = plain ? language : language.languageId;
+    const label = plain
+      ? language === 'en'
+        ? 'English'
+        : language
+      : language.localizedLanguageName ||
+        language.languageName ||
+        language.languageId;
+    return (
+      <option key={key} value={value}>
+        {label}
+      </option>
+    );
+  }
+
   protected renderNetwork(): React.ReactNode {
     return (
       <div className="content noselect">
@@ -444,7 +466,9 @@ export class SettingsComponent extends React.Component<
     );
   }
 
-  protected noopKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
+  protected noopKeyDown = (
+    event: React.KeyboardEvent<HTMLInputElement>
+  ): void => {
     if (this.isControlKey(event)) {
       return;
     }
@@ -454,7 +478,7 @@ export class SettingsComponent extends React.Component<
 
   protected numbersOnlyKeyDown = (
     event: React.KeyboardEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     if (this.isControlKey(event)) {
       return;
     }
@@ -466,7 +490,7 @@ export class SettingsComponent extends React.Component<
     }
   };
 
-  protected browseSketchbookDidClick = async () => {
+  protected browseSketchbookDidClick = async (): Promise<void> => {
     const uri = await this.props.fileDialogService.showOpenDialog({
       title: nls.localize(
         'arduino/preferences/newSketchbookLocation',
@@ -483,80 +507,65 @@ export class SettingsComponent extends React.Component<
     }
   };
 
-  protected editAdditionalUrlDidClick = async () => {
+  protected editAdditionalUrlDidClick = async (): Promise<void> => {
     const additionalUrls = await new AdditionalUrlsDialog(
-      this.state.additionalUrls,
+      AdditionalUrls.parse(this.state.rawAdditionalUrlsValue, ','),
       this.props.windowService
     ).open();
     if (additionalUrls) {
-      this.setState({ additionalUrls });
+      this.setState({
+        rawAdditionalUrlsValue: AdditionalUrls.stringify(additionalUrls),
+      });
     }
   };
 
-  protected editorFontSizeDidChange = (
-    event: React.ChangeEvent<HTMLInputElement>
-  ) => {
-    const { value } = event.target;
-    if (value) {
-      this.setState({ editorFontSize: parseInt(value, 10) });
-    }
+  private setFontSize = (editorFontSize: number) => {
+    this.setState({ editorFontSize });
   };
 
-  protected additionalUrlsDidChange = (
+  protected rawAdditionalUrlsValueDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     this.setState({
-      additionalUrls: event.target.value.split(',').map((url) => url.trim()),
+      rawAdditionalUrlsValue: event.target.value,
     });
   };
 
   protected autoScaleInterfaceDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     this.setState({ autoScaleInterface: event.target.checked });
   };
 
-  protected interfaceScaleDidChange = (
-    event: React.ChangeEvent<HTMLInputElement>
-  ) => {
-    const { value } = event.target;
-    const percentage = parseInt(value, 10);
-    if (isNaN(percentage)) {
-      return;
-    }
+  private setInterfaceScale = (percentage: number) => {
     const interfaceScale = (percentage - 100) / 20;
-    if (!isNaN(interfaceScale)) {
-      this.setState({ interfaceScale });
-    }
+
+    this.setState({ interfaceScale });
   };
 
   protected verifyAfterUploadDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     this.setState({ verifyAfterUpload: event.target.checked });
   };
 
-  protected checkForUpdatesDidChange = (
-    event: React.ChangeEvent<HTMLInputElement>
-  ) => {
-    this.setState({ checkForUpdates: event.target.checked });
-  };
-
   protected sketchbookShowAllFilesDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     this.setState({ sketchbookShowAllFiles: event.target.checked });
   };
 
   protected autoSaveDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
-    this.setState({ autoSave: event.target.checked ? 'on' : 'off' });
+  ): void => {
+    this.setState({
+      autoSave: event.target.checked ? Settings.AutoSave.DEFAULT_ON : 'off',
+    });
   };
 
   protected quickSuggestionsOtherDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     // need to persist react events through lifecycle https://reactjs.org/docs/events.html#event-pooling
     const newVal = event.target.checked ? true : false;
 
@@ -570,24 +579,29 @@ export class SettingsComponent extends React.Component<
     });
   };
 
-  protected themeDidChange = (event: React.ChangeEvent<HTMLSelectElement>) => {
+  protected themeDidChange = (
+    event: React.ChangeEvent<HTMLSelectElement>
+  ): void => {
     const { selectedIndex } = event.target.options;
     const theme = ThemeService.get().getThemes()[selectedIndex];
     if (theme) {
       this.setState({ themeId: theme.id });
+      if (ThemeService.get().getCurrentTheme().id !== theme.id) {
+        ThemeService.get().setCurrentTheme(theme.id);
+      }
     }
   };
 
   protected languageDidChange = (
     event: React.ChangeEvent<HTMLSelectElement>
-  ) => {
+  ): void => {
     const selectedLanguage = event.target.value;
     this.setState({ currentLanguage: selectedLanguage });
   };
 
   protected compilerWarningsDidChange = (
     event: React.ChangeEvent<HTMLSelectElement>
-  ) => {
+  ): void => {
     const { selectedIndex } = event.target.options;
     const compilerWarnings = CompilerWarningLiterals[selectedIndex];
     if (compilerWarnings) {
@@ -597,26 +611,28 @@ export class SettingsComponent extends React.Component<
 
   protected verboseOnCompileDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     this.setState({ verboseOnCompile: event.target.checked });
   };
 
   protected verboseOnUploadDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     this.setState({ verboseOnUpload: event.target.checked });
   };
 
   protected sketchpathDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     const sketchbookPath = event.target.value;
     if (sketchbookPath) {
       this.setState({ sketchbookPath });
     }
   };
 
-  protected noProxyDidChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+  protected noProxyDidChange = (
+    event: React.ChangeEvent<HTMLInputElement>
+  ): void => {
     if (event.target.checked) {
       this.setState({ network: 'none' });
     } else {
@@ -626,7 +642,7 @@ export class SettingsComponent extends React.Component<
 
   protected manualProxyDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     if (event.target.checked) {
       this.setState({ network: Network.Default() });
     } else {
@@ -636,7 +652,7 @@ export class SettingsComponent extends React.Component<
 
   protected httpProtocolDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     if (this.state.network !== 'none') {
       const network = this.cloneProxySettings;
       network.protocol = event.target.checked ? 'http' : 'socks';
@@ -646,7 +662,7 @@ export class SettingsComponent extends React.Component<
 
   protected socksProtocolDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     if (this.state.network !== 'none') {
       const network = this.cloneProxySettings;
       network.protocol = event.target.checked ? 'socks' : 'http';
@@ -656,7 +672,7 @@ export class SettingsComponent extends React.Component<
 
   protected hostnameDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     if (this.state.network !== 'none') {
       const network = this.cloneProxySettings;
       network.hostname = event.target.value;
@@ -664,7 +680,9 @@ export class SettingsComponent extends React.Component<
     }
   };
 
-  protected portDidChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+  protected portDidChange = (
+    event: React.ChangeEvent<HTMLInputElement>
+  ): void => {
     if (this.state.network !== 'none') {
       const network = this.cloneProxySettings;
       network.port = event.target.value;
@@ -674,7 +692,7 @@ export class SettingsComponent extends React.Component<
 
   protected usernameDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     if (this.state.network !== 'none') {
       const network = this.cloneProxySettings;
       network.username = event.target.value;
@@ -684,7 +702,7 @@ export class SettingsComponent extends React.Component<
 
   protected passwordDidChange = (
     event: React.ChangeEvent<HTMLInputElement>
-  ) => {
+  ): void => {
     if (this.state.network !== 'none') {
       const network = this.cloneProxySettings;
       network.password = event.target.value;
@@ -709,5 +727,48 @@ export namespace SettingsComponent {
     readonly windowService: WindowService;
     readonly localizationProvider: AsyncLocalizationProvider;
   }
-  export type State = Settings & { languages: string[] };
+  export type State = Settings & {
+    rawAdditionalUrlsValue: string;
+  };
+  export namespace State {
+    export function fromSettings(settings: Settings): State {
+      return {
+        ...settings,
+        rawAdditionalUrlsValue: AdditionalUrls.stringify(
+          settings.additionalUrls
+        ),
+      };
+    }
+    export function toSettings(state: State): Settings {
+      const parsedAdditionalUrls = AdditionalUrls.parse(
+        state.rawAdditionalUrlsValue,
+        ','
+      );
+      return {
+        ...state,
+        additionalUrls: AdditionalUrls.sameAs(
+          state.additionalUrls,
+          parsedAdditionalUrls
+        )
+          ? state.additionalUrls
+          : parsedAdditionalUrls,
+      };
+    }
+    export function merge(prevState: State, settings: Settings): State {
+      const prevAdditionalUrls = AdditionalUrls.parse(
+        prevState.rawAdditionalUrlsValue,
+        ','
+      );
+      return {
+        ...settings,
+        rawAdditionalUrlsValue: prevState.rawAdditionalUrlsValue,
+        additionalUrls: AdditionalUrls.sameAs(
+          prevAdditionalUrls,
+          settings.additionalUrls
+        )
+          ? prevAdditionalUrls
+          : settings.additionalUrls,
+      };
+    }
+  }
 }

arduino-ide-extension/src/browser/dialogs/settings/settings-dialog.tsx

@@ -1,9 +1,12 @@
-import * as React from 'react';
-import { injectable, inject, postConstruct } from 'inversify';
-import { Widget } from '@phosphor/widgets';
-import { Message } from '@phosphor/messaging';
-import { DialogError, ReactWidget } from '@theia/core/lib/browser';
-import { AbstractDialog, DialogProps } from '@theia/core/lib/browser';
+import * as React from '@theia/core/shared/react';
+import {
+  injectable,
+  inject,
+  postConstruct,
+} from '@theia/core/shared/inversify';
+import { Widget } from '@theia/core/shared/@phosphor/widgets';
+import { Message } from '@theia/core/shared/@phosphor/messaging';
+import { DialogError, DialogProps, ReactWidget } from '@theia/core/lib/browser';
 import { Settings, SettingsService } from './settings';
 import { FileService } from '@theia/filesystem/lib/browser/file-service';
 import { WindowService } from '@theia/core/lib/browser/window/window-service';
@@ -11,6 +14,9 @@ import { FileDialogService } from '@theia/filesystem/lib/browser/file-dialog/fil
 import { nls } from '@theia/core/lib/common';
 import { SettingsComponent } from './settings-component';
 import { AsyncLocalizationProvider } from '@theia/core/lib/common/i18n/localization';
+import { AdditionalUrls } from '../../../common/protocol';
+import { AbstractDialog } from '../../theia/dialogs/dialogs';
+import { ThemeService } from '@theia/core/lib/browser/theming';
 
 @injectable()
 export class SettingsWidget extends ReactWidget {
@@ -55,9 +61,10 @@ export class SettingsDialog extends AbstractDialog<Promise<Settings>> {
 
   constructor(
     @inject(SettingsDialogProps)
-    protected readonly props: SettingsDialogProps
+    protected override readonly props: SettingsDialogProps
   ) {
     super(props);
+    this.node.id = 'arduino-settings-dialog-container';
     this.contentNode.classList.add('arduino-settings-dialog');
     this.appendCloseButton(
       nls.localize('vscode/issueMainService/cancel', 'Cancel')
@@ -72,7 +79,9 @@ export class SettingsDialog extends AbstractDialog<Promise<Settings>> {
     );
   }
 
-  protected async isValid(settings: Promise<Settings>): Promise<DialogError> {
+  protected override async isValid(
+    settings: Promise<Settings>
+  ): Promise<DialogError> {
     const result = await this.settingsService.validate(settings);
     if (typeof result === 'string') {
       return result;
@@ -84,7 +93,7 @@ export class SettingsDialog extends AbstractDialog<Promise<Settings>> {
     return this.settingsService.settings();
   }
 
-  protected onAfterAttach(msg: Message): void {
+  protected override onAfterAttach(msg: Message): void {
     if (this.widget.isAttached) {
       Widget.detach(this.widget);
     }
@@ -96,20 +105,31 @@ export class SettingsDialog extends AbstractDialog<Promise<Settings>> {
     this.update();
   }
 
-  protected onUpdateRequest(msg: Message) {
+  protected override onUpdateRequest(msg: Message): void {
     super.onUpdateRequest(msg);
     this.widget.update();
   }
 
-  protected onActivateRequest(msg: Message): void {
+  protected override onActivateRequest(msg: Message): void {
     super.onActivateRequest(msg);
 
     // calling settingsService.reset() in order to reload the settings from the preferenceService
-    // and update the UI including changes triggerd from the command palette
+    // and update the UI including changes triggered from the command palette
     this.settingsService.reset();
 
     this.widget.activate();
   }
+
+  override async open(): Promise<Promise<Settings> | undefined> {
+    const themeIdBeforeOpen = ThemeService.get().getCurrentTheme().id;
+    const result = await super.open();
+    if (!result) {
+      if (ThemeService.get().getCurrentTheme().id !== themeIdBeforeOpen) {
+        ThemeService.get().setCurrentTheme(themeIdBeforeOpen);
+      }
+    }
+    return result;
+  }
 }
 
 export class AdditionalUrlsDialog extends AbstractDialog<string[]> {
@@ -168,23 +188,20 @@ export class AdditionalUrlsDialog extends AbstractDialog<string[]> {
   }
 
   get value(): string[] {
-    return this.textArea.value
-      .split('\n')
-      .map((url) => url.trim())
-      .filter((url) => !!url);
+    return AdditionalUrls.parse(this.textArea.value, 'newline');
   }
 
-  protected onAfterAttach(message: Message): void {
+  protected override onAfterAttach(message: Message): void {
     super.onAfterAttach(message);
     this.addUpdateListener(this.textArea, 'input');
   }
 
-  protected onActivateRequest(message: Message): void {
+  protected override onActivateRequest(message: Message): void {
     super.onActivateRequest(message);
     this.textArea.focus();
   }
 
-  protected handleEnter(event: KeyboardEvent): boolean | void {
+  protected override handleEnter(event: KeyboardEvent): boolean | void {
     if (event.target instanceof HTMLInputElement) {
       return super.handleEnter(event);
     }