Validation is not enforced on the image output step
when selecting and then deselecting an image type. This
is because the only validation which is set is `Required`.
However, after deselecting an image type the input becomes
a key-value object with all the values set to false. This
commit adds a custom validator to check that at least one
value in the object is set to true. Fixes#575
Rely on the index matching instead. During a drag, if onDragOver is
fired the index the item will be dragged to (the target index) will be
set. If the target index doesn't match the source index, the new
tempItemOrder is made and the new target index is set.
Initially this index is null, so even if the target index is the
same as the current index, the tempItemOrder and target index will be
set once.
By not shorting this event based on the visual layout, the drag state
gets initialized correctly every time.
Fixes#679
Adds all valid prefixes defined in composer, removes invalid ones, and
disables the TextInput for the root partition. This makes customized
filesystems less error prone.
https://bugzilla.redhat.com/show_bug.cgi?id=2070761
Resolves#466. The default behavior for the DDF Wizard is to either advance to
the next step or submit the form when the ENTER is pressed.
This is inappropriate for complex forms that contain many different
types of elements that are typically interacted with using ENTER. For
instance, the default behavior when a link is focused and ENTER is pressed
is not to open the link in a browser but to advance or submit the form.
This commit overrides the default behavior by passing an onKeyDown prop
to the wizard which calls a custom onKeyDown function. The new custom
function does not define any behavior for when ENTER is pressed,
but does recreate DDF's default ESCAPE behavior, which is to close the
modal.
The default behavior of Data Driven Forms when moving to the previous or
next step is to maintain focus on the previous or next button,
respectively.
This commit makes the UI more friendly to keyboard users by focusing
on the first input element of a given step when it is rendered.
Whenever possible, autofocus is achieved by passing components the
autoFocus prop. When this is not possible, then useRef and useEffect hooks
are used to set focus.
At the moment, it is not possible to autofocus the image output step's
release selector or the file system configuration step's toggle using the
above methods. This is because these PatternFly components do not
currently pass props to the appropriate child component and do not
support ref forwarding. The best option for autofocus in these cases is
currently being investigated.
The margin on the `ul` list inside the gcp
information popover was causing the popover
to look unevenly spaced. Removing the left
margin resolves this. This commit fixes#630
When recreating an image navigate to the review step instead of the
initial step. This requires forming the step history to enable a
functional sidebar.
Changes the Wizard's description (defined in the schema) to `Image
builder allows you to create a custom image and push it to target
environments` as indicated in the UI design prototype. The previous
description (`Create a RHEL image and push it to cloud providers`)
is no longer accurate since CentOS images are also currently supported.
Resolves#596. Adds the text `Image builder allows you to create a
custom image and push it to target environments.` and a link to the
documentation to the image output step.
Optional chaining can return undefined. So, we should not use `of` on
getState()?.values?.['file-system-configuration']. But, since we already
check for the existance of this variable we do not need to optionally
chain.
Add a details step where the user can enter a descriptive image name.
This name is displayed in the review step above the Release. Both these
fields are now horizontal to save vertical space.
Azure form fields only need to take in 36 characters for the ID so they
don't need to take up the full width of the wizard. These fields are
now 50% width. The resource group doesn't have the same character limit
but is set to the same 50% for visual consistency.
When searching for a package, all matching packages are now returned. First an
attempt is made using the api's default limit and if there are more
matching packages than the default limit a second request is made with
an increased limit. To facilitate this, api.getPackages() now accepts an
optional limit parameter. Retrieving all matching packages is necessary
because of the sorting logic.
The registration step now provides users with a type ahead input so they
can select from all activation keys associated with their accounts.
The testing for this requires that we wait for the mocked api response.
When we load the organization id but do not use or display it we can
have an act warning because we unmount the component without handling
the response.
Update the registration options to include registering without insights.
Also, improve the text info in the step.
The org id is also removed from the registration step since we no
longer display the id in this step.
At the final review step, only render the Registration tab
if the user has selected RHEL 8 as the release. Add a test to
ensure that if the user selects CentOS as the release, there
are only two tabs at the review step.
The image types 'vsphere', 'guest-image', and 'image-installer' are now
supported by the CreateImageWizard. They require no additional
customizations and support the current registration and packages
customizations.
Loading the organization ID is now done in the registration step. This
prevents the entire wizard from waiting on the org id and prevents the
wizard from remounting when the async getUser() completes.
This also mitigates the issue where clicking the image-builder nav link
would redirect you to `image-builder/image-builder` if image-builder was
already opened. And `/` didn't catch that path.
When a user searches for available packages, already chosen packages are
filtered from the available packages list. This prevents the user from
adding duplicate packages.
When the user filters the chosen packages list they may find no packages
containing the entered string. In this case we display a message that no
packages are found. There are now tests for both the available and
chosen packages lists for when packages are not found.