CreateImageWizard: move name image step to end

The Details step is renamed to Name Image and moved to the last step
before Review. Also, the validation is removed since all utf-8
characters are supported for image names.

src/Components/CreateImageWizard/CreateImageWizard.js

@@ -19,7 +19,7 @@ import {
     packages,
     imageOutput,
     fileSystemConfiguration,
-    details
+    imageName
 } from './steps';
 
 import {
@@ -364,7 +364,6 @@ const formStepHistory = (composeRequest) => {
         const imageRequest = composeRequest.image_requests[0];
         const uploadRequest = imageRequest.upload_request;
         let steps = [
-            'details',
             'image-output'
         ];
 
@@ -383,6 +382,7 @@ const formStepHistory = (composeRequest) => {
         steps = steps.concat([
             'File system configuration',
             'packages',
+            'image-name'
         ]);
 
         return steps;
@@ -454,7 +454,6 @@ const CreateImageWizard = () => {
                     // order in this array does not reflect order in wizard nav, this order is managed inside
                     // of each step by `nextStep` property!
                     fields: [
-                        details,
                         imageOutput,
                         awsTarget,
                         googleCloudTarger,
@@ -462,10 +461,11 @@ const CreateImageWizard = () => {
                         registration,
                         packages,
                         fileSystemConfiguration,
+                        imageName,
                         review,
                     ],
                     initialState: {
-                        activeStep: location?.state?.initialStep || 'details', // name of the active step
+                        activeStep: location?.state?.initialStep || 'image-output', // name of the active step
                         activeStepIndex: stepHistory.length, // active index
                         maxStepIndex: stepHistory.length, // max achieved index
                         prevSteps: stepHistory, // array with names of previously visited steps

src/Components/CreateImageWizard/steps/details.js

@@ -1,35 +0,0 @@
-import React from 'react';
-import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
-import validatorTypes from '@data-driven-forms/react-form-renderer/validator-types';
-import StepTemplate from './stepTemplate';
-
-export default {
-    StepTemplate,
-    id: 'wizard-details',
-    name: 'details',
-    title: 'Details',
-    nextStep: 'image-output',
-    fields: [
-        {
-            component: componentTypes.PLAIN_TEXT,
-            name: 'plain-text-component',
-            label: <p>
-                Enter a name to easily identify your image later. If left empty, the image&apos;s UUID will be displayed.
-            </p>
-        },
-        {
-            component: componentTypes.TEXT_FIELD,
-            name: 'image-name',
-            type: 'text',
-            label: 'Image name',
-            autoFocus: true,
-            validate: [
-                {
-                    type: validatorTypes.PATTERN,
-                    pattern: /^[\w-]+$/i,
-                    message: 'Can only contain letters, numbers, hyphens (-), and underscores (_)',
-                }
-            ]
-        }
-    ]
-};

src/Components/CreateImageWizard/steps/imageName.js

@@ -0,0 +1,25 @@
+import React from 'react';
+import componentTypes from '@data-driven-forms/react-form-renderer/component-types';
+import StepTemplate from './stepTemplate';
+
+export default {
+    StepTemplate,
+    id: 'wizard-details',
+    name: 'image-name',
+    title: 'Name image',
+    nextStep: 'review',
+    fields: [
+        {
+            component: componentTypes.PLAIN_TEXT,
+            name: 'plain-text-component',
+            label: <p>Optionally enter a name for your image. All images will have a UUID.</p>
+        },
+        {
+            component: componentTypes.TEXT_FIELD,
+            name: 'image-name',
+            type: 'text',
+            label: 'Image name',
+            autoFocus: true,
+        }
+    ]
+};

src/Components/CreateImageWizard/steps/index.js

@@ -7,4 +7,4 @@ export { default as review } from './review';
 export { default as imageOutput } from './imageOutput';
 export { default as nextStepMapper } from './imageOutputStepMapper';
 export { default as fileSystemConfiguration } from './fileSystemConfiguration';
-export { default as details } from './details';
+export { default as imageName } from './imageName';

src/Components/CreateImageWizard/steps/packages.js

@@ -9,7 +9,7 @@ export default {
     title: 'Packages',
     name: 'packages',
     substepOf: 'System Configuration',
-    nextStep: 'review',
+    nextStep: 'image-name',
     fields: [
         {
             component: componentTypes.PLAIN_TEXT,