wizard: add oscap to the review step

The review step now list the OpenSCAP policy chosen by the user.

src/Components/CreateImageWizard/formComponents/ReviewStep.js

@@ -15,6 +15,7 @@ import {
   FSCList,
   ImageDetailsList,
   ImageOutputList,
+  OscapList,
   RegisterLaterList,
   RegisterNowList,
   TargetEnvAWSList,
@@ -33,6 +34,7 @@ const ReviewStep = () => {
   const [isExpandedContent, setIsExpandedContent] = useState(false);
   const [isExpandedRegistration, setIsExpandedRegistration] = useState(false);
   const [isExpandedImageDetail, setIsExpandedImageDetail] = useState(false);
+  const [isExpandedOscapDetail, setIsExpandedOscapDetail] = useState(false);
   const { change, getState } = useFormApi();
 
   useEffect(() => {
@@ -57,6 +59,8 @@ const ReviewStep = () => {
     setIsExpandedRegistration(isExpandedRegistration);
   const onToggleImageDetail = (isExpandedImageDetail) =>
     setIsExpandedImageDetail(isExpandedImageDetail);
+  const onToggleOscapDetails = (isExpandedOscapDetail) =>
+    setIsExpandedOscapDetail(isExpandedOscapDetail);
 
   return (
     <>
@@ -169,6 +173,17 @@ const ReviewStep = () => {
           <ImageDetailsList />
         </ExpandableSection>
       )}
+      {getState()?.values?.['oscap-policy'] && (
+        <ExpandableSection
+          toggleContent={'OpenSCAP Compliance'}
+          onToggle={onToggleOscapDetails}
+          isExpanded={isExpandedOscapDetail}
+          isIndented
+          data-testid="oscap-detail-expandable"
+        >
+          <OscapList />
+        </ExpandableSection>
+      )}
     </>
   );
 };

src/Components/CreateImageWizard/formComponents/ReviewStepTextLists.js

@@ -589,3 +589,24 @@ export const ImageDetailsList = () => {
     </TextContent>
   );
 };
+
+export const OscapList = () => {
+  const { getState } = useFormApi();
+  const oscapPolicy = getState()?.values?.['oscap-policy'];
+  return (
+    <TextContent>
+      <TextList component={TextListVariants.dl}>
+        <TextListItem
+          component={TextListItemVariants.dt}
+          className="pf-u-min-width"
+        >
+          Policy
+        </TextListItem>
+        <TextListItem component={TextListItemVariants.dd}>
+          {oscapPolicy}
+        </TextListItem>
+      </TextList>
+      <br />
+    </TextContent>
+  );
+};