Enhance/migrate vue3

[brianignacio5]

Description

Update web views from Vue 2 and vuex to Vue 3 and Pinia because vue 2 support will be dropped the end of this year.

Fix #1051 Added search for ESP-IDF: Show Examples command

Type of change

• Breaking change (fix or feature that would cause existing functionality to not work as expected)

Steps to test this pull request

This PR is very big and many features need to be tested. Basically all web views under src/views

1. Right click a CMakeLists.txt file and select ESP-IDF: CMakeLists.txt editor command. If the file is root directory choose Project Project CMakeLists.txt otherwise choose Component CMakeLists.txt. Use UI to modify values and see changes on CMakeLists.txt. Run Developer: Open web view Developer tools and see if there is any error in the console.
2. Execute ESP-IDF: Show examples projects. Choose example, check rendered markdown view, create project. Run Developer: Open web view Developer tools and see if there is any error in the console.
3. Execute ESP-IDF: SDK Configuration editor (menuconfig) command. Modify different kind of values like number, string, hex, checkbox, select dropdown. Check the ESP-IDF output for any error. Run Developer: Open web view Developer tools and see if there is any error in the console.
4. Execute ESP-IDF: New Project command. Modify all options, Try to add a local component, choose template and create a project. Run Developer: Open web view Developer tools and see if there is any error in the console.
5. Open an example with NVS data like Protocols -> http_server -> file_serving. Right click nvs_data.csv and select ESP-IDF: Open NVS Partition editor. add, Modify or remove values and types and click the different action buttons. Run Developer: Open web view Developer tools and see if there is any error in the console.
6. Open an example with Partition table data like Protocols -> http_server -> file_serving. Right click partitions_example.csv and select ESP-IDF: Open Partition table editor UI. add, Modify or remove values and types and click the different action buttons. Run Developer: Open web view Developer tools and see if there is any error in the console.
7. Open an example with multiple configuration like Build system -> CMake -> multi_config and follow the multiple config tutorial Run Developer: Open web view Developer tools and see if there is any error in the console.
8. Run the ESP-IDF: Configure ESP-IDF extension command and run the 3 kinds of setup from UI: Express Advanced and use existing setup. Run Developer: Open web view Developer tools and see if there is any error in the console.
9. Follow the app tracing tutorial to test the Application tracing. Run Developer: Open web view Developer tools and see if there is any error in the console.
10. Follow the heap tracing tutorial to test the Heap Tracing. Run Developer: Open web view Developer tools and see if there is any error in the console.
11. Run the ESP-IDF: Welcome to open the extension welcome page and test all links and buttons. Run Developer: Open web view Developer tools and see if there is any error in the console.

• Expected behaviour:

• Expected output:

How has this been tested?

Manual testing of each view

Test Configuration:

• ESP-IDF Version: 5.0
• OS (Windows,Linux and macOS): macOS

Dependent components impacted by this PR:

• Component 1
• Component 2

Checklist

• PR Self Reviewed
• Applied Code formatting
• Added Documentation
• Added Unit Test
• Verified on all platforms - Windows,Linux and macOS

[github-actions]

Download the artifacts for this pull request:

• esp-idf-extension.vsix.zip
• esp-idf-extension-open.vsix.zip

[radurentea]

Left comments for small left overs. Also, the things found by code scanner should be addressed before merging

[github-actions]

Pull request has been marked as stale since there are no activities, and this will be closed in 5 days if there are no further activities

[AndriiFilippov]

@brianignacio5 hi!

1. I think we should add default (namespace) nvs row, like this:
   

because it is fully empty now.
we have it in IDE:

2. For Type : namespace - lets delete drop-down window because it is empty field(confusing):
   

[kolipakakondal]

@brianignacio5 hi! Tested: OS - Windows 10

Shouldn't this text be active link ? caz when I put cursor on this text - it reacts, but I can't click it

Please show all hyper links text in the blue color. Example -

[brianignacio5]

Fixed all commented issues @AndriiFilippov PTAL when you can

[AndriiFilippov]

@brianignacio5 hi !

Tested under:
OS - Windows 10
ESP-IDF: v5.1.2

LGTM 👍