Refactor of webview code

[rudyflores]

Proposed changes

Refactor of existing Webview code to be easily extensible, this also integrates a watcher that will hot reload your changes on your webview to the debugger so you can see your changes just by saving!

To add new views in the future just:

1. add new folder with webview name to zowe-explorer/src/webviews/src.
2. add the following components: index.html, app.tsx, index.tsx, types.ts (optional)

And that's it!

Release Notes

Milestone: 2.12.0

Changelog: Added new method of creating webviews on Zowe Explorer

Types of changes

What types of changes does your code introduce to Zowe Explorer?
Put an x in the boxes that apply

• Bugfix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• Updates to Documentation or Tests (if none of the other choices apply)

Checklist

Put an x in the boxes that apply. You can also fill these out after creating the PR. If you're unsure about any of them, don't hesitate to ask. We're here to help! This checklist will be used as reference for both the contributor and the reviewer

• I have read the CONTRIBUTOR GUIDANCE wiki
• PR title follows Conventional Commits Guidelines
• PR Description is included
• gif or screenshot is included if visual changes are made
• yarn workspace vscode-extension-for-zowe vscode:prepublish has been executed
• All checks have passed (DCO, Jenkins and Code Coverage)
• I have added unit test and it is passing
• I have added integration test and it is passing
• There is coverage for the code that I have added
• I have tested it manually and there are no regressions found
• I have added necessary documentation (if appropriate)
• Any PR dependencies have been merged and published (if appropriate)

Further comments

[codecov]

Codecov Report

All modified lines are covered by tests ✅

Files	Coverage Δ
...ackages/zowe-explorer-api/src/vscode/ui/WebView.ts	96.55% <100.00%> (+0.12%)	⬆️

📢 Thoughts on this report? Let us know!.

[rudyflores]

FYI: the code smell is from existing App.tsx work from @traeok 's work on editing attributes, this can be perhaps be addressed in a separate PR since the code in that file could be restructured into components in the future.

[traeok]

LGTM, thanks @rudyflores!

[traeok]

Sorry for the sudden change in review @rudyflores. I was under the impression that the dev host was showing the latest changes, but the watch script seems to be failing for me:

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
1 Code Smell

No Coverage information
0.0% Duplication

[rudyflores]

All fixed now @traeok good catch on the windows end of things for concurrently!