refactor: rename wizard pages

Rename the wizard pages to avoid the name is related with the order into
the wizard.

Signed-off-by: Alejandro Visiedo <[email protected]>

src/Routes/WizardPage/Components/Page4/Page4.test.tsx → src/Routes/WizardPage/Components/PagePreparation/PagePreparation.test.tsx

@@ -1,10 +1,10 @@
 // import React from 'react';
 // import { render } from '@testing-library/react';
-// import Page1 from './Page1';
+// import PagePreparation from './PagePreparation';
 import '@testing-library/jest-dom';
 
-test('expect Page4 to render children', () => {
-  // render(<Page4></Page4>);
+test('expect PagePreparation to render children', () => {
+  // render(<PagePreparation></PagePreparation>);
   // expect(screen.getByRole('heading')).toHaveTextContent('Hello');
   return;
 });

src/Routes/WizardPage/Components/Page1/Page1.tsx → src/Routes/WizardPage/Components/PagePreparation/PagePreparation.tsx

@@ -3,9 +3,9 @@ import ExternalLinkAltIcon from '@patternfly/react-icons/dist/esm/icons/external
 import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
 import { Button, ClipboardCopy, Form, FormGroup, Icon, Select, SelectOption, Stack, TextContent } from '@patternfly/react-core';
 
-import './Page1.scss';
+import './PagePreparation.scss';
 
-const Page1: React.FC = () => {
+const PagePreparation: React.FC = () => {
   // TODO Update links
   const firewallConfigurationLink =
     'https://access.redhat.com/documentation/en-us/red_hat_enterprise_linux/8/html/configuring_and_managing_networking/using-and-configuring-firewalld_configuring-and-managing-networking';
@@ -147,4 +147,4 @@ const Page1: React.FC = () => {
   );
 };
 
-export default Page1;
+export default PagePreparation;

src/Routes/WizardPage/Components/Page1/Page1.test.tsx → src/Routes/WizardPage/Components/PageReview/PageReview.test.tsx

@@ -3,8 +3,8 @@
 // import Page1 from './Page1';
 import '@testing-library/jest-dom';
 
-test('expect Page1 to render children', () => {
-  // render(<Page1></Page1>);
+test('expect PageReview to render children', () => {
+  // render(<PageReview></PageReview>);
   // expect(screen.getByRole('heading')).toHaveTextContent('Hello');
   return;
 });

src/Routes/WizardPage/Components/Page4/Page4.tsx → src/Routes/WizardPage/Components/PageReview/PageReview.tsx

@@ -2,11 +2,11 @@ import React, { useState } from 'react';
 
 import { DescriptionList, DescriptionListDescription, DescriptionListGroup, DescriptionListTerm, Switch } from '@patternfly/react-core';
 
-import './Page4.scss';
+import './PageReview.scss';
 import { Domain } from '../../../../Api/api';
 import DomainOverview from '../../Components/DomainOverview/DomainOverview';
 
-const Page4: React.FC<{ data: Domain }> = (props) => {
+const PageReview: React.FC<{ data: Domain }> = (props) => {
   const [isHostJoinEnabled, setIsHostJoinEnabled] = React.useState(true);
   const [domain] = useState<Domain>(props.data);
 
@@ -63,4 +63,4 @@ const Page4: React.FC<{ data: Domain }> = (props) => {
   );
 };
 
-export default Page4;
+export default PageReview;

src/Routes/WizardPage/Components/Page3/Page3.test.tsx → src/Routes/WizardPage/Components/PageServiceDetails/PageServiceDetails.test.tsx

@@ -3,8 +3,8 @@
 // import Page1 from './Page1';
 import '@testing-library/jest-dom';
 
-test('expect Page3 to render children', () => {
-  // render(<Page3></Page3>);
+test('expect PageServiceDetails to render children', () => {
+  // render(<PageServiceDetails></PageServiceDetails>);
   // expect(screen.getByRole('heading')).toHaveTextContent('Hello');
   return;
 });

src/Routes/WizardPage/Components/Page2/Page2.tsx → src/Routes/WizardPage/Components/PageServiceDetails/PageServiceDetails.tsx

@@ -3,9 +3,9 @@ import { Form, FormGroup, TextArea } from '@patternfly/react-core';
 import { TextInput } from '@patternfly/react-core';
 import { Domain } from '../../../../Api/api';
 
-import './Page2.scss';
+import './PageServiceDetails.scss';
 
-const Page2: React.FC<{ data: Domain }> = (props) => {
+const PageServiceDetails: React.FC<{ data: Domain }> = (props) => {
   const [data, setData] = useState<Domain>(props.data);
 
   return (
@@ -34,4 +34,4 @@ const Page2: React.FC<{ data: Domain }> = (props) => {
   );
 };
 
-export default Page2;
+export default PageServiceDetails;

src/Routes/WizardPage/Components/Page2/Page2.test.tsx → src/Routes/WizardPage/Components/PageServiceRegistration/PageServiceRegistration.test.tsx

@@ -3,8 +3,8 @@
 // import Page1 from './Page1';
 import '@testing-library/jest-dom';
 
-test('expect Page2 to render children', () => {
-  // render(<Page2></Page2>);
+test('expect PageServiceRegistration to render children', () => {
+  // render(<PageServiceRegistration></PageServiceRegistration>);
   // expect(screen.getByRole('heading')).toHaveTextContent('Hello');
   return;
 });

src/Routes/WizardPage/Components/Page3/Page3.tsx → src/Routes/WizardPage/Components/PageServiceRegistration/PageServiceRegistration.tsx

@@ -3,15 +3,15 @@ import React from 'react';
 import { ExternalLinkAltIcon } from '@patternfly/react-icons/dist/esm/icons/external-link-alt-icon';
 import { Button, ClipboardCopy, Form, FormGroup, TextContent } from '@patternfly/react-core';
 
-import './Page3.scss';
+import './PageServiceRegistration.scss';
 import { Domain } from '../../../../Api/api';
 
-interface Page3Prop {
-  data: Domain;
-  token: string;
+interface PageServiceRegistrationProp {
+  data?: Domain;
+  token?: string;
 }
 
-const Page3: React.FC<Page3Prop> = (props) => {
+const PageServiceRegistration: React.FC<PageServiceRegistrationProp> = (props) => {
   // TODO Update links
   const installServerPackagesLink = 'https://freeipa.org/page/Quick_Start_Guide';
 
@@ -23,7 +23,7 @@ const Page3: React.FC<Page3Prop> = (props) => {
     openInNewWindow(installServerPackagesLink);
   };
 
-  const ipa_hcc_register_cmd = 'ipa-hcc register ' + props.data.domain_id + ' ' + props.token;
+  const ipa_hcc_register_cmd = 'ipa-hcc register ' + props.data?.domain_id + ' ' + props.token;
   const ipa_hcc_status_cmd = 'ipa-hcc status';
 
   return (
@@ -69,4 +69,4 @@ const Page3: React.FC<Page3Prop> = (props) => {
   );
 };
 
-export default Page3;
+export default PageServiceRegistration;

src/Routes/WizardPage/WizardPage.tsx

@@ -10,10 +10,10 @@ import { useNavigate } from 'react-router-dom';
 import { Domain } from '../../Api/api';
 
 // Lazy load for the wizard pages
-const Page1 = React.lazy(() => import('./Components/Page1/Page1'));
-const Page2 = React.lazy(() => import('./Components/Page2/Page2'));
-const Page3 = React.lazy(() => import('./Components/Page3/Page3'));
-const Page4 = React.lazy(() => import('./Components/Page4/Page4'));
+const PagePreparation = React.lazy(() => import('./Components/PagePreparation/PagePreparation'));
+const PageServiceRegistration = React.lazy(() => import('./Components/PageServiceRegistration/PageServiceRegistration'));
+const PageServiceDetails = React.lazy(() => import('./Components/PageServiceDetails/PageServiceDetails'));
+const PageReview = React.lazy(() => import('./Components/PageReview/PageReview'));
 
 const initialDomain: Domain = {
   domain_id: '14f3a7a4-32c5-11ee-b40f-482ae3863d30',
@@ -61,24 +61,24 @@ const WizardPage: React.FC = () => {
   const steps = [
     {
       // This page only display the pre-requisites
-      name: 'Prerequisites',
-      component: <Page1 />,
+      name: 'Preparation',
+      component: <PagePreparation />,
     },
     {
-      name: 'Basic information',
+      name: 'Service Registration',
       // FIXME Pass here the 'registering.domain' field from the context
-      component: <Page2 data={data} />,
+      // FIXME Pass here the 'registering.token' field from the context
+      component: <PageServiceRegistration data={data} />,
     },
     {
-      name: 'Registration',
+      name: 'Service Information',
       // FIXME Pass here the 'registering.domain' field from the context
-      // FIXME Pass here the 'registering.token' field from the context
-      component: <Page3 data={data} token={demoToken} />,
+      component: <PageServiceDetails data={data} />,
     },
     {
       name: 'Review',
       // FIXME Pass here the 'registering.domain' field from the context
-      component: <Page4 data={data} />,
+      component: <PageReview data={data} />,
     },
   ];