diff --git a/src/Components/CreateImageWizard/steps/Review/ReviewStep.tsx b/src/Components/CreateImageWizard/steps/Review/ReviewStep.tsx
index 1c23de0cf..6651a24d6 100644
--- a/src/Components/CreateImageWizard/steps/Review/ReviewStep.tsx
+++ b/src/Components/CreateImageWizard/steps/Review/ReviewStep.tsx
@@ -33,6 +33,7 @@ import {
LocaleList,
HostnameList,
KernelList,
+ FirewallList,
} from './ReviewStepTextLists';
import isRhel from '../../../../../src/Utilities/isRhel';
@@ -52,6 +53,7 @@ import {
selectKeyboard,
selectTimezone,
selectNtpServers,
+ selectFirewall,
} from '../../../../store/wizardSlice';
import { useFlag } from '../../../../Utilities/useGetEnvironment';
@@ -71,6 +73,7 @@ const Review = ({ snapshottingEnabled }: { snapshottingEnabled: boolean }) => {
const keyboard = useAppSelector(selectKeyboard);
const timezone = useAppSelector(selectTimezone);
const ntpServers = useAppSelector(selectNtpServers);
+ const firewall = useAppSelector(selectFirewall);
const [isExpandedImageOutput, setIsExpandedImageOutput] = useState(true);
const [isExpandedTargetEnvs, setIsExpandedTargetEnvs] = useState(true);
@@ -85,6 +88,7 @@ const Review = ({ snapshottingEnabled }: { snapshottingEnabled: boolean }) => {
const [isExpandedLocale, setIsExpandedLocale] = useState(true);
const [isExpandedHostname, setIsExpandedHostname] = useState(true);
const [isExpandedKernel, setIsExpandedKernel] = useState(true);
+ const [isExpandedFirewall, setIsExpandedFirewall] = useState(true);
const [isExpandableFirstBoot, setIsExpandedFirstBoot] = useState(true);
const [isExpandedUsers, setIsExpandedUsers] = useState(true);
@@ -92,6 +96,7 @@ const Review = ({ snapshottingEnabled }: { snapshottingEnabled: boolean }) => {
const isLocaleEnabled = useFlag('image-builder.locale.enabled');
const isHostnameEnabled = useFlag('image-builder.hostname.enabled');
const isKernelEnabled = useFlag('image-builder.kernel.enabled');
+ const isFirewallEnabled = useFlag('image-builder.firewall.enabled');
const onToggleImageOutput = (isExpandedImageOutput: boolean) =>
setIsExpandedImageOutput(isExpandedImageOutput);
@@ -117,6 +122,8 @@ const Review = ({ snapshottingEnabled }: { snapshottingEnabled: boolean }) => {
setIsExpandedHostname(isExpandedHostname);
const onToggleKernel = (isExpandedKernel: boolean) =>
setIsExpandedKernel(isExpandedKernel);
+ const onToggleFirewall = (isExpandedFirewall: boolean) =>
+ setIsExpandedFirewall(isExpandedFirewall);
const onToggleFirstBoot = (isExpandableFirstBoot: boolean) =>
setIsExpandedFirstBoot(isExpandableFirstBoot);
const onToggleUsers = (isExpandedUsers: boolean) =>
@@ -420,6 +427,26 @@ const Review = ({ snapshottingEnabled }: { snapshottingEnabled: boolean }) => {
)}
+ {isFirewallEnabled &&
+ (firewall.ports.length > 0 ||
+ firewall.services.disabled.length > 0 ||
+ firewall.services.enabled.length > 0) && (
+
+ onToggleFirewall(isExpandedFirewall)
+ }
+ isExpanded={isExpandedFirewall}
+ isIndented
+ data-testid="firewall-expandable"
+ >
+
+
+ )}
{isFirstBootEnabled && (
{
);
};
+export const FirewallList = () => {
+ const firewall = useAppSelector(selectFirewall);
+
+ return (
+
+
+
+ Ports
+
+
+ {firewall.ports ? firewall.ports : 'None'}
+
+
+ Disabled services
+
+
+ {firewall.services.disabled.length > 0
+ ? firewall.services.disabled
+ : 'None'}
+
+
+ Enabled services
+
+
+ {firewall.services.enabled.length > 0
+ ? firewall.services.enabled
+ : 'None'}
+
+
+
+ );
+};
+
export const FirstBootList = () => {
const isFirstbootEnabled = !!useAppSelector(selectFirstBootScript);
diff --git a/src/test/Components/CreateImageWizard/steps/Firewall/Firewall.test.tsx b/src/test/Components/CreateImageWizard/steps/Firewall/Firewall.test.tsx
index 2b8731e70..cba11737f 100644
--- a/src/test/Components/CreateImageWizard/steps/Firewall/Firewall.test.tsx
+++ b/src/test/Components/CreateImageWizard/steps/Firewall/Firewall.test.tsx
@@ -1,5 +1,5 @@
import type { Router as RemixRouter } from '@remix-run/router';
-import { screen, waitFor } from '@testing-library/react';
+import { screen, waitFor, within } from '@testing-library/react';
import { userEvent } from '@testing-library/user-event';
import { CREATE_BLUEPRINT } from '../../../../../constants';
@@ -67,6 +67,15 @@ const addDisabledFirewallService = async (service: string) => {
await waitFor(() => user.type(disabledServiceInput, service.concat(' ')));
};
+const clickRevisitButton = async () => {
+ const user = userEvent.setup();
+ const expandable = await screen.findByTestId('firewall-expandable');
+ const revisitButton = await within(expandable).findByTestId(
+ 'revisit-firewall'
+ );
+ await waitFor(() => user.click(revisitButton));
+};
+
describe('Step Firewall', () => {
beforeEach(() => {
vi.clearAllMocks();
@@ -119,6 +128,15 @@ describe('Step Firewall', () => {
await addPort('wrong--service');
await screen.findByText('Invalid format.');
});
+
+ test('revisit step button on Review works', async () => {
+ await renderCreateMode();
+ await goToFirewallStep();
+ await addPort('22:tcp');
+ await goToReviewStep();
+ await clickRevisitButton();
+ await screen.findByRole('heading', { name: /Firewall/ });
+ });
});
describe('Firewall request generated correctly', () => {
@@ -205,5 +223,4 @@ describe('Firewall request generated correctly', () => {
});
});
-// TO DO Step Firewall -> revisit step button on Review works
// TO DO Firewall edit mode