CreateImageWizard: Implement user-friendly error messages

Puts the error messages in one place - LabelInput.tsx

src/test/Components/CreateImageWizard/steps/Firewall/Firewall.test.tsx

@@ -120,17 +120,27 @@ describe('Step Firewall', () => {
   test('port in an invalid format cannot be added', async () => {
     await renderCreateMode();
     await goToFirewallStep();
-    expect(screen.queryByText('Invalid format.')).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(
+        'Expected format: <port/port-name>:<protocol>. Example: 8080:tcp, ssh:tcp'
+      )
+    ).not.toBeInTheDocument();
     await addPort('00:wrongFormat');
-    await screen.findByText('Invalid format.');
+    await screen.findByText(
+      'Expected format: <port/port-name>:<protocol>. Example: 8080:tcp, ssh:tcp'
+    );
   });
 
   test('service in an invalid format cannot be added', async () => {
     await renderCreateMode();
     await goToFirewallStep();
-    expect(screen.queryByText('Invalid format.')).not.toBeInTheDocument();
+    expect(
+      screen.queryByText('Expected format: <service-name>. Example: sshd')
+    ).not.toBeInTheDocument();
     await addPort('wrong--service');
-    await screen.findByText('Invalid format.');
+    await screen.findByText(
+      'Expected format: <port/port-name>:<protocol>. Example: 8080:tcp, ssh:tcp'
+    );
   });
 
   test('revisit step button on Review works', async () => {

src/test/Components/CreateImageWizard/steps/Registration/Registration.test.tsx

@@ -438,7 +438,7 @@ describe('Registration request generated correctly', () => {
     );
 
     const expiredTokenHelper = await screen.findByText(
-      /The token is expired./i
+      /The token is already expired or will expire by next day./i
     );
     await waitFor(() => expect(expiredTokenHelper).toBeInTheDocument());
 

src/test/Components/CreateImageWizard/steps/Services/Services.test.tsx

@@ -179,20 +179,34 @@ describe('Step Services', () => {
     // Enabled services input
     expect(screen.queryByText('Invalid format.')).not.toBeInTheDocument();
     await addEnabledService('-------');
-    expect(await screen.findByText('Invalid format.')).toBeInTheDocument();
+    expect(
+      await screen.findByText('Expected format: <service-name>. Example: sshd')
+    ).toBeInTheDocument();
     await waitFor(() => user.click(clearInputButtons[0]));
 
     // Disabled services input
     expect(screen.queryByText('Invalid format.')).not.toBeInTheDocument();
     await addDisabledService('-------');
-    expect(await screen.findByText('Invalid format.')).toBeInTheDocument();
+    expect(
+      await screen.findByText('Expected format: <service-name>. Example: sshd')
+    ).toBeInTheDocument();
     await waitFor(() => user.click(clearInputButtons[1]));
 
     // Masked services input
     expect(screen.queryByText('Invalid format.')).not.toBeInTheDocument();
     await addMaskedService('-------');
-    expect(await screen.findByText('Invalid format.')).toBeInTheDocument();
+    expect(
+      await screen.findByText('Expected format: <service-name>. Example: sshd')
+    ).toBeInTheDocument();
     await waitFor(() => user.click(clearInputButtons[2]));
+
+    // Enabled services input
+    expect(screen.queryByText('Invalid format.')).not.toBeInTheDocument();
+    await addEnabledService('-------');
+    expect(
+      await screen.findByText('Expected format: <service-name>. Example: sshd')
+    ).toBeInTheDocument();
+    await waitFor(() => user.click(clearInputButtons[0]));
   });
 
   test('services from OpenSCAP get added correctly and cannot be removed', async () => {

src/test/Components/CreateImageWizard/steps/Timezone/Timezone.test.tsx

@@ -162,9 +162,15 @@ describe('Step Timezone', () => {
   test('NTP server in an invalid format cannot be added', async () => {
     await renderCreateMode();
     await goToTimezoneStep();
-    expect(screen.queryByText('Invalid format.')).not.toBeInTheDocument();
+    expect(
+      screen.queryByText(
+        'Expected format: <ntp-server>. Example: time.redhat.com'
+      )
+    ).not.toBeInTheDocument();
     await addNtpServerViaKeyDown('this is not NTP server');
-    await screen.findByText('Invalid format.');
+    await screen.findByText(
+      'Expected format: <ntp-server>. Example: time.redhat.com'
+    );
   });
 
   test('revisit step button on Review works', async () => {