LandingPage/ImagesTable/Wizard: Remove all insights global calls
This commit replaces all calls to the insights.chrome global with calls to the useChrome() hook (or the useGetEnvironment() custom hook that wraps useChrome()).
This commit is contained in:
parent
ef1d077c2e
commit
7bca4c7438
10 changed files with 55 additions and 98 deletions
|
|
@ -1,6 +1,6 @@
|
||||||
import React, { useEffect } from 'react';
|
import React, { useEffect } from 'react';
|
||||||
|
|
||||||
import useChrome from '@redhat-cloud-services/frontend-components/useChrome';
|
import { useChrome } from '@redhat-cloud-services/frontend-components/useChrome';
|
||||||
import NotificationsPortal from '@redhat-cloud-services/frontend-components-notifications/NotificationPortal';
|
import NotificationsPortal from '@redhat-cloud-services/frontend-components-notifications/NotificationPortal';
|
||||||
import { useStore } from 'react-redux';
|
import { useStore } from 'react-redux';
|
||||||
import { useNavigate } from 'react-router-dom';
|
import { useNavigate } from 'react-router-dom';
|
||||||
|
|
|
||||||
|
|
@ -302,7 +302,7 @@ const getPackageDescription = async (
|
||||||
};
|
};
|
||||||
|
|
||||||
// map the compose request object to the expected form state
|
// map the compose request object to the expected form state
|
||||||
const requestToState = (composeRequest, distroInfo, isBeta) => {
|
const requestToState = (composeRequest, distroInfo, isBeta, isProd) => {
|
||||||
if (composeRequest) {
|
if (composeRequest) {
|
||||||
const imageRequest = composeRequest.image_requests[0];
|
const imageRequest = composeRequest.image_requests[0];
|
||||||
const uploadRequest = imageRequest.upload_request;
|
const uploadRequest = imageRequest.upload_request;
|
||||||
|
|
@ -461,7 +461,7 @@ const requestToState = (composeRequest, distroInfo, isBeta) => {
|
||||||
formState['subscription-activation-key'] = subscription['activation-key'];
|
formState['subscription-activation-key'] = subscription['activation-key'];
|
||||||
formState['subscription-organization-id'] = subscription.organization;
|
formState['subscription-organization-id'] = subscription.organization;
|
||||||
|
|
||||||
if (insights.chrome.isProd()) {
|
if (isProd) {
|
||||||
formState['subscription-server-url'] = 'subscription.rhsm.redhat.com';
|
formState['subscription-server-url'] = 'subscription.rhsm.redhat.com';
|
||||||
formState['subscription-base-url'] = 'https://cdn.redhat.com/';
|
formState['subscription-base-url'] = 'https://cdn.redhat.com/';
|
||||||
} else {
|
} else {
|
||||||
|
|
@ -544,11 +544,16 @@ const CreateImageWizard = () => {
|
||||||
// This will occur if 'Recreate image' is clicked
|
// This will occur if 'Recreate image' is clicked
|
||||||
const initialStep = compose?.request ? 'review' : undefined;
|
const initialStep = compose?.request ? 'review' : undefined;
|
||||||
|
|
||||||
const { isBeta } = useGetEnvironment();
|
const { isBeta, isProd } = useGetEnvironment();
|
||||||
|
|
||||||
const awsTarget = isBeta() ? awsTargetBeta : awsTargetStable;
|
const awsTarget = isBeta() ? awsTargetBeta : awsTargetStable;
|
||||||
const msAzureTarget = isBeta() ? msAzureTargetBeta : msAzureTargetStable;
|
const msAzureTarget = isBeta() ? msAzureTargetBeta : msAzureTargetStable;
|
||||||
let initialState = requestToState(composeRequest, distroInfo, isBeta());
|
let initialState = requestToState(
|
||||||
|
composeRequest,
|
||||||
|
distroInfo,
|
||||||
|
isBeta(),
|
||||||
|
isProd()
|
||||||
|
);
|
||||||
const stepHistory = formStepHistory(composeRequest, isBeta());
|
const stepHistory = formStepHistory(composeRequest, isBeta());
|
||||||
|
|
||||||
initialState
|
initialState
|
||||||
|
|
|
||||||
|
|
@ -13,8 +13,10 @@ import {
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import { useGetActivationKeysQuery } from '../../../store/apiSlice';
|
import { useGetActivationKeysQuery } from '../../../store/apiSlice';
|
||||||
|
import { useGetEnvironment } from '../../../Utilities/useGetEnvironment';
|
||||||
|
|
||||||
const ActivationKeys = ({ label, isRequired, ...props }) => {
|
const ActivationKeys = ({ label, isRequired, ...props }) => {
|
||||||
|
const { isProd } = useGetEnvironment();
|
||||||
const { change, getState } = useFormApi();
|
const { change, getState } = useFormApi();
|
||||||
const { input } = useFieldApi(props);
|
const { input } = useFieldApi(props);
|
||||||
const [isOpen, setIsOpen] = useState(false);
|
const [isOpen, setIsOpen] = useState(false);
|
||||||
|
|
@ -31,7 +33,7 @@ const ActivationKeys = ({ label, isRequired, ...props }) => {
|
||||||
} = useGetActivationKeysQuery();
|
} = useGetActivationKeysQuery();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (insights.chrome.isProd()) {
|
if (isProd()) {
|
||||||
change('subscription-server-url', 'subscription.rhsm.redhat.com');
|
change('subscription-server-url', 'subscription.rhsm.redhat.com');
|
||||||
change('subscription-base-url', 'https://cdn.redhat.com/');
|
change('subscription-base-url', 'https://cdn.redhat.com/');
|
||||||
} else {
|
} else {
|
||||||
|
|
|
||||||
|
|
@ -7,6 +7,7 @@ import {
|
||||||
TextContent,
|
TextContent,
|
||||||
TextVariants,
|
TextVariants,
|
||||||
} from '@patternfly/react-core';
|
} from '@patternfly/react-core';
|
||||||
|
import { useChrome } from '@redhat-cloud-services/frontend-components/useChrome';
|
||||||
|
|
||||||
import {
|
import {
|
||||||
ContentList,
|
ContentList,
|
||||||
|
|
@ -24,6 +25,7 @@ import {
|
||||||
import isRhel from '../../../Utilities/isRhel';
|
import isRhel from '../../../Utilities/isRhel';
|
||||||
|
|
||||||
const ReviewStep = () => {
|
const ReviewStep = () => {
|
||||||
|
const { auth } = useChrome();
|
||||||
const [isExpandedImageOutput, setIsExpandedImageOutput] = useState(false);
|
const [isExpandedImageOutput, setIsExpandedImageOutput] = useState(false);
|
||||||
const [isExpandedTargetEnvs, setIsExpandedTargetEnvs] = useState(false);
|
const [isExpandedTargetEnvs, setIsExpandedTargetEnvs] = useState(false);
|
||||||
const [isExpandedFSC, setIsExpandedFSC] = useState(false);
|
const [isExpandedFSC, setIsExpandedFSC] = useState(false);
|
||||||
|
|
@ -36,7 +38,7 @@ const ReviewStep = () => {
|
||||||
const registerSystem = getState()?.values?.['register-system'];
|
const registerSystem = getState()?.values?.['register-system'];
|
||||||
if (registerSystem?.startsWith('register-now')) {
|
if (registerSystem?.startsWith('register-now')) {
|
||||||
(async () => {
|
(async () => {
|
||||||
const userData = await insights?.chrome?.auth?.getUser();
|
const userData = await auth?.getUser();
|
||||||
const id = userData?.identity?.internal?.org_id;
|
const id = userData?.identity?.internal?.org_id;
|
||||||
change('subscription-organization-id', id);
|
change('subscription-organization-id', id);
|
||||||
})();
|
})();
|
||||||
|
|
|
||||||
|
|
@ -11,6 +11,7 @@ import {
|
||||||
Title,
|
Title,
|
||||||
} from '@patternfly/react-core';
|
} from '@patternfly/react-core';
|
||||||
import { ExternalLinkAltIcon, HelpIcon } from '@patternfly/react-icons';
|
import { ExternalLinkAltIcon, HelpIcon } from '@patternfly/react-icons';
|
||||||
|
import { useChrome } from '@redhat-cloud-services/frontend-components/useChrome';
|
||||||
|
|
||||||
import StepTemplate from './stepTemplate';
|
import StepTemplate from './stepTemplate';
|
||||||
|
|
||||||
|
|
@ -18,10 +19,11 @@ import CustomButtons from '../formComponents/CustomButtons';
|
||||||
|
|
||||||
const PopoverActivation = () => {
|
const PopoverActivation = () => {
|
||||||
const [orgId, setOrgId] = useState(null);
|
const [orgId, setOrgId] = useState(null);
|
||||||
|
const { auth } = useChrome();
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
(async () => {
|
(async () => {
|
||||||
const userData = await insights?.chrome?.auth?.getUser();
|
const userData = await auth?.getUser();
|
||||||
const id = userData?.identity?.internal?.org_id;
|
const id = userData?.identity?.internal?.org_id;
|
||||||
setOrgId(id);
|
setOrgId(id);
|
||||||
})();
|
})();
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,10 @@
|
||||||
import { useChrome } from '@redhat-cloud-services/frontend-components/useChrome';
|
import { useChrome } from '@redhat-cloud-services/frontend-components/useChrome';
|
||||||
|
|
||||||
export const useGetEnvironment = () => {
|
export const useGetEnvironment = () => {
|
||||||
const { isBeta, getEnvironment } = useChrome();
|
const { isBeta, isProd, getEnvironment } = useChrome();
|
||||||
// Expose beta features in the ephemeral environment
|
// Expose beta features in the ephemeral environment
|
||||||
if (isBeta() || getEnvironment() === 'qa') {
|
if (isBeta() || getEnvironment() === 'qa') {
|
||||||
return { isBeta: () => true };
|
return { isBeta: () => true, isProd: isProd };
|
||||||
}
|
}
|
||||||
return { isBeta: () => false };
|
return { isBeta: () => false, isProd: isProd };
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -12,6 +12,17 @@ import { renderWithReduxRouter } from '../../testUtils';
|
||||||
|
|
||||||
jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({
|
jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({
|
||||||
useChrome: () => ({
|
useChrome: () => ({
|
||||||
|
auth: {
|
||||||
|
getUser: () => {
|
||||||
|
return {
|
||||||
|
identity: {
|
||||||
|
internal: {
|
||||||
|
org_id: 5,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
isBeta: () => true,
|
isBeta: () => true,
|
||||||
isProd: () => true,
|
isProd: () => true,
|
||||||
getEnvironment: () => 'prod',
|
getEnvironment: () => 'prod',
|
||||||
|
|
@ -41,33 +52,12 @@ describe('Step Upload to Azure', () => {
|
||||||
jest
|
jest
|
||||||
.spyOn(api, 'getRepositories')
|
.spyOn(api, 'getRepositories')
|
||||||
.mockImplementation(() => Promise.resolve(mockRepositoryResults));
|
.mockImplementation(() => Promise.resolve(mockRepositoryResults));
|
||||||
|
|
||||||
global.insights = {
|
|
||||||
chrome: {
|
|
||||||
auth: {
|
|
||||||
getUser: () => {
|
|
||||||
return {
|
|
||||||
identity: {
|
|
||||||
internal: {
|
|
||||||
org_id: 5,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
});
|
});
|
||||||
|
|
||||||
afterEach(() => {
|
afterEach(() => {
|
||||||
jest.clearAllMocks();
|
jest.clearAllMocks();
|
||||||
});
|
});
|
||||||
|
|
||||||
// restore global mock
|
|
||||||
afterAll(() => {
|
|
||||||
global.insights = undefined;
|
|
||||||
});
|
|
||||||
|
|
||||||
const user = userEvent.setup();
|
const user = userEvent.setup();
|
||||||
const setUp = async () => {
|
const setUp = async () => {
|
||||||
renderWithReduxRouter('imagewizard', {});
|
renderWithReduxRouter('imagewizard', {});
|
||||||
|
|
|
||||||
|
|
@ -32,6 +32,17 @@ const mockComposes = {
|
||||||
|
|
||||||
jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({
|
jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({
|
||||||
useChrome: () => ({
|
useChrome: () => ({
|
||||||
|
auth: {
|
||||||
|
getUser: () => {
|
||||||
|
return {
|
||||||
|
identity: {
|
||||||
|
internal: {
|
||||||
|
org_id: 5,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
isBeta: () => true,
|
isBeta: () => true,
|
||||||
isProd: () => true,
|
isProd: () => true,
|
||||||
getEnvironment: () => 'prod',
|
getEnvironment: () => 'prod',
|
||||||
|
|
@ -159,29 +170,9 @@ const searchForChosenPackages = async (searchbox, searchTerm) => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// mock the insights dependency
|
|
||||||
beforeAll(() => {
|
beforeAll(() => {
|
||||||
// scrollTo is not defined in jsdom
|
// scrollTo is not defined in jsdom
|
||||||
window.HTMLElement.prototype.scrollTo = function () {};
|
window.HTMLElement.prototype.scrollTo = function () {};
|
||||||
|
|
||||||
global.insights = {
|
|
||||||
chrome: {
|
|
||||||
auth: {
|
|
||||||
getUser: () => {
|
|
||||||
return {
|
|
||||||
identity: {
|
|
||||||
internal: {
|
|
||||||
org_id: 5,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
},
|
|
||||||
},
|
|
||||||
isProd: () => {
|
|
||||||
return true;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
});
|
});
|
||||||
|
|
||||||
afterEach(() => {
|
afterEach(() => {
|
||||||
|
|
@ -189,11 +180,6 @@ afterEach(() => {
|
||||||
router = undefined;
|
router = undefined;
|
||||||
});
|
});
|
||||||
|
|
||||||
// restore global mock
|
|
||||||
afterAll(() => {
|
|
||||||
global.insights = undefined;
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('Create Image Wizard', () => {
|
describe('Create Image Wizard', () => {
|
||||||
test('renders component', () => {
|
test('renders component', () => {
|
||||||
renderWithReduxRouter('imagewizard', {});
|
renderWithReduxRouter('imagewizard', {});
|
||||||
|
|
|
||||||
|
|
@ -33,6 +33,17 @@ jest
|
||||||
|
|
||||||
jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({
|
jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({
|
||||||
useChrome: () => ({
|
useChrome: () => ({
|
||||||
|
auth: {
|
||||||
|
getUser: () => {
|
||||||
|
return {
|
||||||
|
identity: {
|
||||||
|
internal: {
|
||||||
|
org_id: 5,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
isBeta: () => false,
|
isBeta: () => false,
|
||||||
isProd: () => true,
|
isProd: () => true,
|
||||||
getEnvironment: () => 'prod',
|
getEnvironment: () => 'prod',
|
||||||
|
|
@ -124,35 +135,9 @@ const searchForChosenPackages = async (searchbox, searchTerm) => {
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// mock the insights dependency
|
|
||||||
beforeAll(() => {
|
beforeAll(() => {
|
||||||
// scrollTo is not defined in jsdom
|
// scrollTo is not defined in jsdom
|
||||||
window.HTMLElement.prototype.scrollTo = function () {};
|
window.HTMLElement.prototype.scrollTo = function () {};
|
||||||
|
|
||||||
global.insights = {
|
|
||||||
chrome: {
|
|
||||||
auth: {
|
|
||||||
getUser: () => {
|
|
||||||
return {
|
|
||||||
identity: {
|
|
||||||
internal: {
|
|
||||||
org_id: 5,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
},
|
|
||||||
},
|
|
||||||
isBeta: () => {
|
|
||||||
return false;
|
|
||||||
},
|
|
||||||
isProd: () => {
|
|
||||||
return true;
|
|
||||||
},
|
|
||||||
getEnvironment: () => {
|
|
||||||
return 'prod';
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
});
|
});
|
||||||
|
|
||||||
afterEach(() => {
|
afterEach(() => {
|
||||||
|
|
@ -160,11 +145,6 @@ afterEach(() => {
|
||||||
router = undefined;
|
router = undefined;
|
||||||
});
|
});
|
||||||
|
|
||||||
// restore global mock
|
|
||||||
afterAll(() => {
|
|
||||||
global.insights = undefined;
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('Create Image Wizard', () => {
|
describe('Create Image Wizard', () => {
|
||||||
test('renders component', () => {
|
test('renders component', () => {
|
||||||
renderWithReduxRouter('imagewizard', {});
|
renderWithReduxRouter('imagewizard', {});
|
||||||
|
|
|
||||||
|
|
@ -18,16 +18,6 @@ jest.mock('@redhat-cloud-services/frontend-components/useChrome', () => ({
|
||||||
}),
|
}),
|
||||||
}));
|
}));
|
||||||
|
|
||||||
beforeAll(() => {
|
|
||||||
global.insights = {
|
|
||||||
chrome: {
|
|
||||||
isProd: () => {
|
|
||||||
return true;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
describe('Landing Page', () => {
|
describe('Landing Page', () => {
|
||||||
test('renders page heading', async () => {
|
test('renders page heading', async () => {
|
||||||
renderWithReduxRouter('', {});
|
renderWithReduxRouter('', {});
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue