Initial implementation of the Devfile GUI Wizard #1

ibuziuk · 2026-01-22T11:10:46Z

Related issue - devfile/api#1765
Original repository - https://github.com/ibuziuk/devfile-gui-wizard
Preview - https://devfile-gui-wizard-devfile-gui-wizard.apps.che-dev.x6e0.p1.openshiftapps.com/

Developer Sandbox

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

Build a complete single-page application that guides users through creating devfile 2.3.0 YAML files via an interactive 7-step wizard interface. Features: - Step-by-step wizard covering all devfile 2.3.0 sections (metadata, projects, components, commands, events, variables) - Real-time YAML preview with syntax highlighting - Built-in validation for devfile compliance - One-click download and copy-to-clipboard functionality - Responsive design with Tailwind CSS - Client-side state management using React useReducer + Context API Technical Stack: - React 18.3.1 with modern hooks - Tailwind CSS 3.4.0 with forms plugin - Vite 5.4.0 for fast development and builds - js-yaml for YAML generation Documentation: - Comprehensive README.md with setup and usage instructions - Working devfile.yaml for developing this project itself - Updated CLAUDE.md with project guidance Resolves: devfile/api#1765 Signed-off-by: Ilya Buziuk <ibuziuk@users.noreply.github.com> Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com> Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

Added badges for contribution and Che server. Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

michael-valdron

Good work on this @ibuziuk!

I left a few comments to address to best match the Devfile v2.3.0 schema and a bit of UX. Few more comments I have:

We should change from the image built under your registry, seeing your private conversation we can address separately this after this PR
To deploy, you'll need to fill in the commands to build and export to a static website here, start.devfile.io should already be pointing here so once the deploy workflow is completed you'll start seeing it there.

src/components/steps/ComponentsStep.jsx

src/components/steps/CommandsStep.jsx

src/components/steps/ReviewStep.jsx

src/components/steps/ComponentsStep.jsx

src/components/steps/CommandsStep.jsx

src/components/steps/ProjectsStep.jsx

src/App.jsx

README.md

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

…tial PR. The workflow Will be implemented for https://quay.io/ in the future Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

ibuziuk · 2026-01-23T12:10:02Z

@michael-valdron thank you for the review:

We should change from the image built under your registry, seeing your private conversation we can address separately this after this PR

sounds good, I have removed the image build action from the initial PR

To deploy, you'll need to fill in the commands to build and export to a static website here, start.devfile.io should already be pointing here so once the deploy workflow is completed you'll start seeing it there.

done

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

michael-valdron

@ibuziuk Some follow ups to the recent revisions, I'll approve the current state given the current size of the PR.

michael-valdron · 2026-01-29T20:08:08Z

src/components/steps/ProjectsStep.jsx

+    const project = projects[index]
+    let updates = {}
+
+    if (field === 'sourceType') {


Similar story with commands and components, source type value for projects is the field name of the object that stores the source type specific fields, see: https://devfile.io/docs/2.3.0/devfile-schema#projects-git and https://devfile.io/docs/2.3.0/devfile-schema#projects-zip

to be improved, once the initial PR is merged

michael-valdron · 2026-01-29T20:12:46Z

src/components/steps/ComponentsStep.jsx

+          options={COMPONENT_TYPES}
+        />
+
+        {componentType === 'container' && (


I noticed since the revision, container component type is the only one that works, other component type options don't work (either blanks the section of the devfile or prevent the option from being chosen).

Reviewing the source below I guess this is intentional as the other are not implemented yet, correct?

yup, to be improved going forward. Contributions are most welcome ;-)

src/components/steps/ReviewStep.jsx

src/components/steps/CommandsStep.jsx

src/components/steps/ProjectsStep.jsx

michael-valdron

/lgtm

Deploys as expected and confirmed can use the static website from public/ using python -m http.server -d public after running npm run build.

openshift-ci · 2026-01-29T20:31:32Z

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: dmytro-ndp, ibuziuk, michael-valdron, rohanKanojia, svor

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

Details

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

ibuziuk requested a review from a team as a code owner January 22, 2026 11:10

ibuziuk changed the title ~~1765~~ Initial implementation of the Devfile GUI Wizard Jan 22, 2026

ibuziuk and others added 28 commits January 22, 2026 12:20

chore: initial commit with Claude.md and .mcp.json

712e21d

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: udpate Claude.md

e87f69c

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

docs: Update README.md with badges

e86d924

Added badges for contribution and Che server. Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: update devfile

1c50e3b

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

feat: allow all hosts

f9385d7

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: update devfile with ephemeral attribute

23f7e76

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: Use'generateName' in devfile.yaml

53a34a1

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: containerizing the app

0505616

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: adding build / push image GH action

3d883ba

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: updating .gitignore

e2507a6

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: add kustomize setup for deploying on OpenShift

dd87ab7

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: update gh action

9c47d5c

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: Add deploy command to devfile.yaml

43626dc

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: fix gh action

5c3ec54

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: fix gh action

88b8291

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

feat: update OpenShift deployment instructions

85d9950

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: openshift deployment

598663c

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: fixing OpenShift deployment

821edda

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: Improving the project selection step

2fa59ec

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: udpate wording for project definition step

93cd135

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: udpate download name

905059d

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: progress bar

de4740e

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: line UI for steps

a63085c

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: wizard line step UI

09797f9

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

feat: devfile cleanup command

9851958

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: UI fixup

39c8de2

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

feat: Adding schema coverage

ed16d19

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

ibuziuk requested review from michael-valdron and tolusha January 22, 2026 11:43

michael-valdron requested changes Jan 22, 2026

View reviewed changes

openshift-ci bot assigned michael-valdron Jan 22, 2026

michael-valdron reviewed Jan 22, 2026

View reviewed changes

src/App.jsx Show resolved Hide resolved

michael-valdron reviewed Jan 22, 2026

View reviewed changes

README.md Outdated Show resolved Hide resolved

ibuziuk added 4 commits January 23, 2026 10:51

chore: License Apache 2.0

a85a23f

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

feat: Adding LF Projects, LLC footer

1612256

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

feat: Implementing the 'Build and Deploy' GH action

b718e92

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

chore: temporarily removing GH action for building image from the ini…

eb0307a

…tial PR. The workflow Will be implemented for https://quay.io/ in the future Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

ibuziuk added 5 commits January 27, 2026 11:11

fix: devfile component type

f971dbe

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: devfile command type

cbf6d45

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

test: initial playwright coverage

bac0f25

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

fix: using in devfile

585d730

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

docs: Community Support / issue tracker

b76eca6

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

dmytro-ndp approved these changes Jan 29, 2026

View reviewed changes

openshift-ci bot assigned dmytro-ndp Jan 29, 2026

openshift-ci bot added the lgtm label Jan 29, 2026

feat: add GitHub repo link

8ed46d9

Signed-off-by: Ilya Buziuk <ibuziuk@redhat.com>

openshift-ci bot removed the lgtm label Jan 29, 2026

svor approved these changes Jan 29, 2026

View reviewed changes

openshift-ci bot assigned svor Jan 29, 2026

openshift-ci bot added the lgtm label Jan 29, 2026

rohanKanojia approved these changes Jan 29, 2026

View reviewed changes

openshift-ci bot assigned rohanKanojia Jan 29, 2026

michael-valdron reviewed Jan 29, 2026

View reviewed changes

michael-valdron approved these changes Jan 29, 2026

View reviewed changes

ibuziuk merged commit 030347a into main Jan 30, 2026
1 check passed

Initial implementation of the Devfile GUI Wizard #1

Initial implementation of the Devfile GUI Wizard #1

Uh oh!

Conversation

ibuziuk commented Jan 22, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

michael-valdron left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

ibuziuk commented Jan 23, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

michael-valdron left a comment

Choose a reason for hiding this comment

Uh oh!

michael-valdron Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

ibuziuk Jan 30, 2026

Choose a reason for hiding this comment

Uh oh!

michael-valdron Jan 29, 2026

Choose a reason for hiding this comment

Uh oh!

ibuziuk Jan 30, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

michael-valdron left a comment

Choose a reason for hiding this comment

Uh oh!

openshift-ci bot commented Jan 29, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

6 participants

ibuziuk commented Jan 22, 2026 •

edited

Loading

ibuziuk commented Jan 23, 2026 •

edited

Loading