diff --git a/src/components/GeneralInfo/GeneralInformation/ConversionAlert.js b/src/components/GeneralInfo/GeneralInformation/ConversionAlert.js
new file mode 100644
index 000000000..82c6e4591
--- /dev/null
+++ b/src/components/GeneralInfo/GeneralInformation/ConversionAlert.js
@@ -0,0 +1,45 @@
+import { Alert, Text, TextContent, TextVariants } from '@patternfly/react-core';
+import useInsightsNavigate from '@redhat-cloud-services/frontend-components-utilities/useInsightsNavigate';
+import React from 'react';
+
+const ConversionAlert = (props) => {
+ const navigate = useInsightsNavigate('tasks');
+
+ return (
+
+
+
+ On June 30, 2024, CentOS Linux 7 will reach End of Life (EOL). Convert
+ your system to RHEL using the Convert2RHEL tool to migrate your system
+ to a fully supported production-grade operating system while
+ maintaining existing OS customizations, configurations, and
+ preferences.
+
+
+ Red Hat can help migrate CentOS Linux 7 users to maintain continuity
+ in their environment after the EOL date, whether they’re on premise or
+ in the cloud.{' '}
+
+ Learn more about CentOS Migration here.
+
+
+
+ navigate('/available#pre-conversion-analysis')}>
+ Run a Pre-conversion analysis of this system
+
+
+
+
+ );
+};
+
+export { ConversionAlert };
diff --git a/src/components/GeneralInfo/GeneralInformation/GeneralInformation.js b/src/components/GeneralInfo/GeneralInformation/GeneralInformation.js
index d7ce13cee..b7c2cd47a 100644
--- a/src/components/GeneralInfo/GeneralInformation/GeneralInformation.js
+++ b/src/components/GeneralInfo/GeneralInformation/GeneralInformation.js
@@ -19,6 +19,7 @@ import { Provider } from 'react-redux';
import useInsightsNavigate from '@redhat-cloud-services/frontend-components-utilities/useInsightsNavigate/useInsightsNavigate';
import './general-information.scss';
+import { ConversionAlert } from './ConversionAlert';
class GeneralInformation extends Component {
state = {
@@ -97,10 +98,17 @@ class GeneralInformation extends Component {
DataCollectorsCardWrapper,
CollectionCardWrapper,
children,
+ entity,
} = this.props;
const Wrapper = store ? Provider : Fragment;
+
return (
+ {entity?.system_profile?.operating_system?.name === 'CentOS Linux' && (
+
+ )}
@@ -172,9 +180,7 @@ class GeneralInformation extends Component {
)}
@@ -207,6 +213,11 @@ class GeneralInformation extends Component {
GeneralInformation.propTypes = {
entity: PropTypes.shape({
id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+ system_profile: PropTypes.shape({
+ operating_system: PropTypes.shape({
+ name: PropTypes.string,
+ }),
+ }),
}),
openedModal: PropTypes.string,
loadSystemDetail: PropTypes.func,
diff --git a/src/components/GeneralInfo/GeneralInformation/GeneralInformation.test.js b/src/components/GeneralInfo/GeneralInformation/GeneralInformation.test.js
index 2ddd4d96c..d0c89d962 100644
--- a/src/components/GeneralInfo/GeneralInformation/GeneralInformation.test.js
+++ b/src/components/GeneralInfo/GeneralInformation/GeneralInformation.test.js
@@ -19,6 +19,9 @@ import userEvent from '@testing-library/user-event';
import MockAdapter from 'axios-mock-adapter';
import mockedData from '../../../__mocks__/mockedData.json';
import { hosts } from '../../../api/api';
+import { cloneDeep } from 'lodash';
+import { TestWrapper } from '../../../Utilities/TestingUtilities';
+import useInsightsNavigate from '@redhat-cloud-services/frontend-components-utilities/useInsightsNavigate';
const mock = new MockAdapter(hosts.axios, { onNoMatch: 'throwException' });
@@ -29,6 +32,9 @@ jest.mock(
usePermissionsWithContext: () => ({ hasAccess: true }),
})
);
+jest.mock(
+ '@redhat-cloud-services/frontend-components-utilities/useInsightsNavigate'
+);
const expectCardsToExist = (
titles = [
@@ -238,4 +244,74 @@ describe('GeneralInformation', () => {
});
});
});
+
+ describe('conversion alert', () => {
+ let state = {};
+
+ beforeEach(() => {
+ state = cloneDeep(initialState);
+ state.entityDetails.entity.system_profile = {
+ operating_system: {
+ name: 'CentOS Linux',
+ major: '7',
+ minor: '9',
+ },
+ };
+ });
+
+ it('shows alert for CentOS system', () => {
+ render(
+
+
+
+ );
+
+ expect(
+ screen.getByRole('heading', {
+ name: /convert this centos system to rhel/i,
+ })
+ ).toBeVisible();
+ expect(
+ screen.getByRole('link', {
+ name: /learn more about centos migration here\./i,
+ })
+ ).toHaveAttribute(
+ 'href',
+ 'https://www.redhat.com/en/technologies/linux-platforms/enterprise-linux/centos-migration'
+ );
+ });
+
+ it('redirect to pre-conversion task', async () => {
+ const navigate = jest.fn();
+ useInsightsNavigate.mockReturnValue(navigate);
+ render(
+
+
+
+ );
+
+ await userEvent.click(
+ screen.getByText(/run a pre-conversion analysis of this system/i)
+ );
+
+ await waitFor(() => {
+ expect(navigate).toBeCalledWith('/available#pre-conversion-analysis');
+ });
+ });
+
+ it('not shown for RHEL systems', () => {
+ const store = mockStore(initialState);
+ render(
+
+
+
+ );
+
+ expect(
+ screen.queryByRole('heading', {
+ name: /convert this centos system to rhel/i,
+ })
+ ).not.toBeInTheDocument();
+ });
+ });
});