Add Editor Selector panel #1055

akurinnoy · 2024-02-20T07:22:49Z

What does this PR do?

This PR adds the Editor Selector panel to the Getting Started page. With the Editor Selector users can choose to use one of the provided editors, or define their editor by specifying the editor ID and/or editor container image.

movie-2.mp4

movie-1.mp4

What issues does this PR fix or reference?

resolves eclipse-che/che#22766

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

che-bot · 2024-02-20T07:23:03Z

Click here to review and test in web IDE:

github-actions · 2024-02-20T08:44:38Z

Docker image build succeeded: quay.io/eclipse/che-dashboard:pr-1055

kubectl patch command

kubectl patch -n eclipse-che "checluster/eclipse-che" --type=json -p="[{"op": "replace", "path": "/spec/components/dashboard/deployment", "value": {containers: [{image: "quay.io/eclipse/che-dashboard:pr-1055", name: che-dashboard}]}}]"

codecov · 2024-02-20T09:30:15Z

Codecov Report

Attention: Patch coverage is 97.92531% with 30 lines in your changes are missing coverage. Please review.

Project coverage is 88.86%. Comparing base (7ff8f04) to head (75f8b56).
Report is 2 commits behind head on main.

Files	Patch %	Lines
...ard-frontend/src/store/Plugins/chePlugins/index.ts	40.62%	19 Missing ⚠️
...src/pages/GetStarted/SamplesList/Gallery/index.tsx	94.69%	7 Missing ⚠️
...dashboard-frontend/src/Layout/Navigation/index.tsx	0.00%	1 Missing ⚠️
...d-frontend/src/components/EditorSelector/index.tsx	99.50%	1 Missing ⚠️
...es/GetStarted/SamplesList/Gallery/filterEditors.ts	98.11%	1 Missing ⚠️
...hboard-frontend/src/pages/WorkspacesList/index.tsx	0.00%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1055      +/-   ##
==========================================
+ Coverage   88.41%   88.86%   +0.45%     
==========================================
  Files         390      396       +6     
  Lines       40080    40484     +404     
  Branches     2707     2732      +25     
==========================================
+ Hits        35437    35978     +541     
+ Misses       4617     4480     -137     
  Partials       26       26

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

ibuziuk

Really nice improvement, but let's merge it after 7.82.0 release (might be too risky to merge it for 3.12)

ibuziuk · 2024-02-21T13:19:37Z

@artaleks9 @dmytro-ndp folks, will need your approval before merge

olexii4 · 2024-02-21T15:09:15Z

packages/dashboard-frontend/src/components/EditorSelector/Definition/index.tsx

+};
+
+export type State = {
+  editorId?: string;


It is not just the editor ID. It could be the link to a container editor definition, URL, or editor ID.

I propose to change:

editorId -> editorDefinition

WDYT?

olexii4 · 2024-02-22T13:46:38Z

packages/dashboard-frontend/src/pages/GetStarted/index.tsx

 type State = {
-  activeTabKey: CreateWorkspaceTab;
+  editorId: string;


Suggested change

editorId: string;

editorDefinition: string;

artaleks9 · 2024-02-23T10:04:17Z

A verification of PR is still in progress, but I couldn't run python-django sample with che-idea/next and che-pycharm/next editor. It the same time this sample runs with default editor
Any ideas, why it happening ?

devworkspace-python-django.yaml.zip

artaleks9 · 2024-02-23T14:42:51Z

Also, I can't run Go sample with any editor and Python sample with che-idea/next and che-pycharm/next.
(may be there is a some restriction, which I don't know?)

olexii4 · 2024-02-23T16:43:56Z

We had the next mockup In the main issue eclipse-che/che#22784:

I can see the link to the che-docs How to specify and use a custom editor. We already have this part in the che-docs.

olexii4 · 2024-02-23T17:12:25Z

@akurinnoy I found a bug:

Try to create a new workspace with the Import from Git widget from the Git repo which includes the custom editor in the /.che/che-editor.yaml file.

For example web-java-spring-boot.

And default editor will be applied. So, we can't create a new workspace with the custom editor from the /.che/che-editor.yaml file at all.

olexii4 · 2024-02-23T17:19:47Z

packages/dashboard-frontend/src/pages/GetStarted/ImportFromGit/index.tsx

+    if (
+      factory.searchParams.has(EDITOR_ATTR) === false &&
+      factory.searchParams.has(EDITOR_IMAGE_ATTR) === false
+    ) {
+      factory.searchParams.set(EDITOR_ATTR, editorId);


We can't create a new workspace with the custom editor from the /.che/che-editor.yaml file with these changes at all.

With these changes, you are still able to create new workspaces with a custom editor. On any dashboard page, paste your repo link into the browser address bar to create a location like this and hit Enter: https://<che_fqdn>#https://github.com/olexii4/web-java-spring-boot.git. A new workspace with custom editor will be created within a few minutes.

However, I'm not sure if a .che/ file in a repository should have precedence over an explicitly defined editor, rather than vice versa.

cc @ibuziuk

@akurinnoy /.che/che-editor.yaml should define the default editor for a Git repo. Am I right or am I wrong?

akurinnoy · 2024-02-26T09:59:10Z

@artaleks9 thanks for trying to test the pull request. About the workspace start failures you observed - that is something not related to this pull request. This issue is reproducible on the dogfooding cluster with Devfile.io samples and an Intellij IDE.

As a workaround, I can suggest testing the Editor Selector with the Empty Workspace sample or using any repo of your choice with the Import from Git panel.

akurinnoy · 2024-02-26T10:16:51Z

@olexii4 thanks for the review!

We had the next mockup In the main issue eclipse-che/che#22784
I can see the link to the che-docs How to specify and use a custom editor. We already have this part in the che-docs.

I'll update the PR to add this link

So, we can't create a new workspace with the custom editor from the /.che/che-editor.yaml file at all.

I believe this statement is not true... You're still able to create workspaces with custom editors defined in a che-editor.yaml by utilizing the factory link to the repository.

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

akurinnoy · 2024-02-26T12:19:16Z

@olexii4
The che-docs page you posted describes how to define editor by setting up che-editor.yaml, which seems to be irrelevant to the Editor Selector. Because the editor definition field is the same as the che-editor URL parameter, I would use the link to URL parameter for the IDE page instead, do you mind?

olexii4 · 2024-02-26T12:47:16Z

@olexii4 The che-docs page you posted describes how to define editor by setting up che-editor.yaml, which seems to be irrelevant to the Editor Selector. Because the editor definition field is the same as the che-editor URL parameter, I would use the link to URL parameter for the IDE page instead, do you mind?

From the user perspective, specifying the custom editor in the che-editor.yaml would be interesting. It is relevant to the Editor Selector because it helps to change the editor by default for each Git repo.

dmytro-ndp · 2024-02-26T15:00:26Z

It's interesting to know:

Is creation of workspace from editor going to have fail-safe mode with an ability to start workspace using default editor after workspace failed to start?
Will Editor selection override editor definition in factory repo which workspace created from?
Will Workspaces page show used custom editor information like the Editor definition URL and Editor? Will there be another way to find the information about used custom editor?
Does the task include disabling tile of Editor which particular devfile sample doesn't support, like che-idea for ansible devfile sample?

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

dkwon17 · 2024-02-27T16:51:50Z

I don't know if this was mentioned yet but I have a small UI suggestion,

When an editor is selected, it would be nice if the editor title was black instead of grey:

Screenshot

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

github-actions · 2024-02-28T15:01:11Z

Docker image build succeeded: quay.io/eclipse/che-dashboard:pr-1055

kubectl patch command

kubectl patch -n eclipse-che "checluster/eclipse-che" --type=json -p="[{"op": "replace", "path": "/spec/components/dashboard/deployment", "value": {containers: [{image: "quay.io/eclipse/che-dashboard:pr-1055", name: che-dashboard}]}}]"

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

github-actions · 2024-02-28T15:41:19Z

Docker image build succeeded: quay.io/eclipse/che-dashboard:pr-1055

kubectl patch command

kubectl patch -n eclipse-che "checluster/eclipse-che" --type=json -p="[{"op": "replace", "path": "/spec/components/dashboard/deployment", "value": {containers: [{image: "quay.io/eclipse/che-dashboard:pr-1055", name: che-dashboard}]}}]"

akurinnoy · 2024-02-29T08:11:33Z

@dmytro-ndp, thanks for these questions

Is creation of workspace from editor going to have fail-safe mode with an ability to start workspace using default editor after workspace failed to start?

There is no such mode implemented in the dashboard, but this can be a really good improvement. Can you please open an issue?

Will Editor selection override editor definition in factory repo which workspace created from?

I discussed this question with @ibuziuk and @olexii4 and we decided to implement it as follows:

when the editor selector panel (title Choose an Editor) is opened, the selected editor will override the editor definition in the factory repo;
when the editor definition panel (title Use an Editor Definition) is opened and the fields are empty the editor definition in the factory repo will be applied.

Will Workspaces page show used custom editor information like the Editor definition URL and Editor? Will there be another way to find the information about used custom editor?

This info is not available on the workspaces page, but it is stored in the DevWorkspace object as an annotation. The che.eclipse.org/che-editor annotation contains the editor definition, and the che.eclipse.org/devfile annotation contains among other things all the query parameters provided by the editor selector component or by the user.

Does the task include disabling tile of Editor which particular devfile sample doesn't support, like che-idea for ansible devfile sample?

Disabling editor tiles is not part of this issue, and I believe it's not possible in the current implementation. Sample cards are not selectable but clicking on any immediately starts the new workspace creation, so there is no chance to choose an editor after.

akurinnoy · 2024-02-29T08:14:02Z

@ibuziuk @artaleks9 @olexii4 @dkwon17 folks, I hope I fixed all the feedback, please review the pull request.

akurinnoy · 2024-02-29T09:07:13Z

/retest

olexii4

These changes work as expected.
Good job!

artaleks9 · 2024-03-05T17:34:47Z

Verified on Eclipse Che with quay.io/eclipse/che-dashboard:pr-1055 - the functionality works properly.

openshift-ci · 2024-03-05T17:35:07Z

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: akurinnoy, artaleks9, ibuziuk, olexii4

The full list of commands accepted by this bot can be found here.

Needs approval from an approver in each of these files:

OWNERS

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

akurinnoy added 4 commits February 20, 2024 08:39

chore: refactor the Get Started page

797d3ce

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

feat: added Editor Selector component

b34e573

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

chore: integrate Editor Selector with other components

3cd64b0

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

feat: add editor definition form

b8cfff3

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

akurinnoy requested review from olexii4 and ibuziuk as code owners February 20, 2024 07:22

akurinnoy self-assigned this Feb 20, 2024

fixup! feat: add editor definition form

f36c8b9

ibuziuk reviewed Feb 20, 2024

View reviewed changes

ibuziuk requested review from dmytro-ndp and artaleks9 February 21, 2024 13:18

ibuziuk removed the request for review from dmytro-ndp February 21, 2024 14:16

olexii4 reviewed Feb 21, 2024

View reviewed changes

olexii4 reviewed Feb 22, 2024

View reviewed changes

olexii4 requested changes Feb 23, 2024

View reviewed changes

openshift-ci bot assigned olexii4 Feb 23, 2024

chore: rename editorId -> editorDefinition

2c98423

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

artaleks9 mentioned this pull request Feb 26, 2024

Not able to start some devfile.io samples with the Intellij IDEA Community eclipse-che/che#22847

Closed

eclipse-che deleted a comment from ibuziuk Feb 26, 2024

feat: add doc link

e925f43

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

fix: default editor and repo editor precedence

f274e02

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

akurinnoy added 2 commits February 28, 2024 17:18

feat: selected card title is black

b1af878

Signed-off-by: Oleksii Kurinnyi <okurinny@redhat.com>

fixup! feat: selected card title is black

75f8b56

olexii4 approved these changes Feb 29, 2024

View reviewed changes

openshift-ci bot added the lgtm label Feb 29, 2024

ibuziuk approved these changes Mar 5, 2024

View reviewed changes

openshift-ci bot assigned ibuziuk Mar 5, 2024

artaleks9 approved these changes Mar 5, 2024

View reviewed changes

openshift-ci bot assigned artaleks9 Mar 5, 2024

akurinnoy merged commit 49efdad into main Mar 6, 2024
18 checks passed

akurinnoy deleted the editor-selector branch March 6, 2024 10:34

akurinnoy mentioned this pull request Mar 15, 2024

Definition of the Che-Code editor in the ./che/che-editor.yaml file is ignored eclipse-che/che#22879

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Add Editor Selector panel #1055

Add Editor Selector panel #1055

akurinnoy commented Feb 20, 2024 •

edited

Loading

che-bot commented Feb 20, 2024

github-actions bot commented Feb 20, 2024

codecov bot commented Feb 20, 2024 •

edited

Loading

ibuziuk left a comment •

edited

Loading

ibuziuk commented Feb 21, 2024

olexii4 Feb 21, 2024

olexii4 Feb 22, 2024

artaleks9 commented Feb 23, 2024 •

edited

Loading

artaleks9 commented Feb 23, 2024

olexii4 commented Feb 23, 2024 •

edited

Loading

olexii4 commented Feb 23, 2024

olexii4 Feb 23, 2024 •

edited

Loading

akurinnoy Feb 26, 2024

olexii4 Feb 26, 2024

akurinnoy commented Feb 26, 2024

akurinnoy commented Feb 26, 2024

akurinnoy commented Feb 26, 2024

olexii4 commented Feb 26, 2024 •

edited

Loading

dmytro-ndp commented Feb 26, 2024

dkwon17 commented Feb 27, 2024

github-actions bot commented Feb 28, 2024

github-actions bot commented Feb 28, 2024

akurinnoy commented Feb 29, 2024

akurinnoy commented Feb 29, 2024

akurinnoy commented Feb 29, 2024

olexii4 left a comment

artaleks9 commented Mar 5, 2024

openshift-ci bot commented Mar 5, 2024

Add Editor Selector panel #1055

Add Editor Selector panel #1055

Conversation

akurinnoy commented Feb 20, 2024 • edited Loading

What does this PR do?

What issues does this PR fix or reference?

che-bot commented Feb 20, 2024

github-actions bot commented Feb 20, 2024

codecov bot commented Feb 20, 2024 • edited Loading

Codecov Report

ibuziuk left a comment • edited Loading

Choose a reason for hiding this comment

ibuziuk commented Feb 21, 2024

olexii4 Feb 21, 2024

Choose a reason for hiding this comment

olexii4 Feb 22, 2024

Choose a reason for hiding this comment

artaleks9 commented Feb 23, 2024 • edited Loading

artaleks9 commented Feb 23, 2024

olexii4 commented Feb 23, 2024 • edited Loading

olexii4 commented Feb 23, 2024

olexii4 Feb 23, 2024 • edited Loading

Choose a reason for hiding this comment

akurinnoy Feb 26, 2024

Choose a reason for hiding this comment

olexii4 Feb 26, 2024

Choose a reason for hiding this comment

akurinnoy commented Feb 26, 2024

akurinnoy commented Feb 26, 2024

akurinnoy commented Feb 26, 2024

olexii4 commented Feb 26, 2024 • edited Loading

dmytro-ndp commented Feb 26, 2024

dkwon17 commented Feb 27, 2024

github-actions bot commented Feb 28, 2024

github-actions bot commented Feb 28, 2024

akurinnoy commented Feb 29, 2024

akurinnoy commented Feb 29, 2024

akurinnoy commented Feb 29, 2024

olexii4 left a comment

Choose a reason for hiding this comment

artaleks9 commented Mar 5, 2024

openshift-ci bot commented Mar 5, 2024

akurinnoy commented Feb 20, 2024 •

edited

Loading

codecov bot commented Feb 20, 2024 •

edited

Loading

ibuziuk left a comment •

edited

Loading

artaleks9 commented Feb 23, 2024 •

edited

Loading

olexii4 commented Feb 23, 2024 •

edited

Loading

olexii4 Feb 23, 2024 •

edited

Loading

olexii4 commented Feb 26, 2024 •

edited

Loading