Skip to content

Commit

Permalink
Merge pull request #2634 from Hyperkid123/azure-flow-ms
Browse files Browse the repository at this point in the history 
[Stable] Azure flow ms
  • Loading branch information
@Hyperkid123
Hyperkid123 authored Sep 7, 2023
2 parents 3c5ccd0 + 1d6e2c6 commit 30caeea
Show file tree
Hide file tree
Showing 5 changed files with 121 additions and 91 deletions.
5 changes: 3 additions & 2 deletions .travis.yml
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
language: node_js
sudo: required
dist: jammy
notifications:
email: false
slack:
secure: 'd3g5oKl5kfzi2L96QTrj2g77lzLWzjnM6Ct2OTXRrk90GxxhwHS8RH4Q1IgBqkQjw68nkq7CNE9oAs+pt3si8kT4GQ164YLoTMVkDPBGOoOoMACPyanxQOEluUfdLEDIzChy/7EdlY3l1J2IM+lOK4e95jUwsT9BSXBsSladP++1EUiZfon9JcQSiSZa0e1/cVxLpEDuBB2cruUSTZ9sUATe/XZ0uH1EGzrooQJMkRgdty5UyNSsMxkvAY0Haivq8u9/gWAsLar0bA/90M5CVK7yohh9fY9UfTUbXVqwR3dFAXuW+SURrFVnPAX4FLZt/D09cg/CVCvoasiZdNi9RAeKOCfN+FoxB2ZJNnuM+4KDJX3dxnatd/stmEH1bcd75i4mh9zOWE1HX5d23HuZ4sKdDPpvhG3l7SpZfhLv0/EKL10ld9RdIaiTO2uPI3rsoyDeArzeV+09+dbB1iPKnS/3/Iw5KLhbew3mdJXKVfRk6KYcJySjT8EltrNy5Y7mty7/JzWssSpIpkMCnu6RGAtXO2v/jUfFm1WvsKK5BeH5efbLi1sjMNbVTeA3Bp8pvRPuw+50l94uDfeQ1HUTrq5zKXMUaG9dTdaYZX4fEDMmrbM1TLudjb9Xj4elaA5ioBH0gRFxAnSVTmrKFtFoCRVaqfmj3ceqxttCLUpkfvI='
node_js:
- '16'
- '18'
before_install:
- npm install -g npm@latest
install:
Expand Down Expand Up @@ -38,4 +39,4 @@ env:
cache:
directories:
- "$HOME/.npm"
- ".cache"
- ".cache"
138 changes: 73 additions & 65 deletions src/components/Stratosphere/ProductSelection.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,74 +7,82 @@ import ProductCard from './ProductCard';
import { Header } from '../Header/Header';
import ChromeLink from '../ChromeLink/ChromeLink';
import Footer from './Footer';
import useMarketplacePartner from '../../hooks/useMarketplacePartner';

import './product-selection.scss';

const ProductSelection = () => (
<div id="chrome-app-render-root">
<Page
header={
<Masthead className="chr-c-masthead">
<Header />
</Masthead>
}
>
<div className="chr-c-product-selection pf-u-pt-lg pf-u-pb-lg">
<Stack hasGutter>
<StackItem>
<Bullseye>
<CheckCircleIcon size="xl" color="var(--pf-global--success-color--100)" />
</Bullseye>
</StackItem>
<StackItem>
<Stack>
<StackItem>
<Bullseye>
<Title size="3xl" headingLevel="h1">
Congratulations,
const ProductSelection = () => {
const { partner, partnerId } = useMarketplacePartner();
return (
<div id="chrome-app-render-root">
<Page
header={
<Masthead className="chr-c-masthead">
<Header />
</Masthead>
}
>
<div className="chr-c-product-selection pf-u-pt-lg pf-u-pb-lg">
<Stack hasGutter>
<StackItem>
<Bullseye>
<CheckCircleIcon size="xl" color="var(--pf-global--success-color--100)" />
</Bullseye>
</StackItem>
<StackItem>
<Stack>
<StackItem>
<Bullseye>
<Title size="3xl" headingLevel="h1">
Congratulations,
</Title>
</Bullseye>
</StackItem>
<StackItem>
<Title className="chr-c-product-selection__description" size="3xl" headingLevel="h1">
your Red Hat and {partner} accounts are connected and you can now access Red Hat support resources
</Title>
</Bullseye>
</StackItem>
<StackItem>
<Title className="chr-c-product-selection__description" size="3xl" headingLevel="h1">
your Red Hat and AWS accounts are connected and you can now access Red Hat support resources
</Title>
</StackItem>
</Stack>
</StackItem>
<StackItem>
<Bullseye>
<TextContent>
<Text>To get started using your Red Hat products, follow the links below</Text>
</TextContent>
</Bullseye>
</StackItem>
<StackItem>
<Flex>
<div className="chr-c-product-selection__layout">
{productsList.map((item, i) => (
<ProductCard key={i} {...item} order={i} />
))}
</div>
</Flex>
</StackItem>
<StackItem>
<Bullseye>
<TextContent>
<Text>
To manage or learn more about your Red Hat subscriptions, visit{' '}
<ChromeLink href="/insights/subscriptions/rhel" appId="subscriptions">
subscriptions.
</ChromeLink>
</Text>
</TextContent>
</Bullseye>
</StackItem>
</Stack>
</div>
<Footer />
</Page>
</div>
);
</StackItem>
</Stack>
</StackItem>
{partnerId !== 'from-azure' && (
<>
<StackItem>
<Bullseye>
<TextContent>
<Text>To get started using your Red Hat products, follow the links below</Text>
</TextContent>
</Bullseye>
</StackItem>
<StackItem>
<Flex>
<div className="chr-c-product-selection__layout">
{productsList.map((item, i) => (
<ProductCard key={i} {...item} order={i} />
))}
</div>
</Flex>
</StackItem>
</>
)}
<StackItem>
<Bullseye>
<TextContent>
<Text>
To manage or learn more about your Red Hat subscriptions, visit{' '}
<ChromeLink href="/insights/subscriptions/rhel" appId="subscriptions">
subscriptions.
</ChromeLink>
</Text>
</TextContent>
</Bullseye>
</StackItem>
</Stack>
</div>
<Footer />
</Page>
</div>
);
};

export default ProductSelection;
3 changes: 2 additions & 1 deletion src/components/Stratosphere/RedirectBanner.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,8 @@ import configureStore from 'redux-mock-store';
import { InitialEntry } from 'history';
import { Store } from 'redux';

import RedirectBanner, { AWS_BANNER_NAME, AZURE_BANNER_NAME } from './RedirectBanner';
import RedirectBanner from './RedirectBanner';
import { AWS_BANNER_NAME, AZURE_BANNER_NAME } from '../../hooks/useMarketplacePartner';

const LocationSpy: React.VoidFunctionComponent<{ changeSpy: jest.Mock }> = ({ changeSpy }) => {
const { search, pathname, hash, state } = useLocation();
Expand Down
29 changes: 6 additions & 23 deletions src/components/Stratosphere/RedirectBanner.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,39 +3,22 @@ import { Alert, AlertActionCloseButton, Text, TextContent } from '@patternfly/re
import { useSelector } from 'react-redux';
import { useLocation, useNavigate } from 'react-router-dom';
import { ReduxState } from '../../redux/store';

// TODO: Figure out what param chrome should expect
export const AWS_BANNER_NAME = 'from-aws';
export const AZURE_BANNER_NAME = 'from-azure';
export const GCP_BANNER_NAME = 'from-gcp';

const partnerMapper: { [partner: string]: string } = {
[AWS_BANNER_NAME]: 'AWS',
[AZURE_BANNER_NAME]: 'Microsoft Azure',
[GCP_BANNER_NAME]: 'Google Cloud',
};
const possibleParams = [AWS_BANNER_NAME, AZURE_BANNER_NAME, GCP_BANNER_NAME];

const hasPartner = (params: URLSearchParams) => possibleParams.find((param) => params.has(param));
import useMarketplacePartner from '../../hooks/useMarketplacePartner';

const RedirectBanner = () => {
const { pathname, search, hash, state } = useLocation();
const { pathname, hash, state } = useLocation();
const { partnerId, partner, removePartnerParam } = useMarketplacePartner();
const navigate = useNavigate();
const params = new URLSearchParams(search);
const isVisible = hasPartner(params);
const partner = isVisible ? partnerMapper[isVisible] : null;
const product = useSelector<ReduxState, string | undefined>((state) => state.chrome.activeProduct);

const handleClose = () => {
// remove only the flag search param
params.delete(AWS_BANNER_NAME);
params.delete(AZURE_BANNER_NAME);
params.delete(GCP_BANNER_NAME);
const clearedParams = removePartnerParam();
// only change the search params
navigate(
{
pathname,
search: params.toString(),
search: clearedParams.toString(),
hash,
},
{
Expand All @@ -45,7 +28,7 @@ const RedirectBanner = () => {
);
};
// show the banner only if correct search param exists
return isVisible ? (
return partnerId ? (
<Alert
actionClose={<AlertActionCloseButton data-testid="stratosphere-banner-close" onClose={handleClose} />}
isInline
Expand Down
37 changes: 37 additions & 0 deletions src/hooks/useMarketplacePartner.ts
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
import { useLocation } from 'react-router-dom';

// TODO: Figure out what param chrome should expect
export const AWS_BANNER_NAME = 'from-aws';
export const AZURE_BANNER_NAME = 'from-azure';
export const GCP_BANNER_NAME = 'from-gcp';

const partnerMapper: { [partner: string]: string } = {
[AWS_BANNER_NAME]: 'AWS',
[AZURE_BANNER_NAME]: 'Microsoft Azure',
[GCP_BANNER_NAME]: 'Google Cloud',
};
const possibleParams = [AWS_BANNER_NAME, AZURE_BANNER_NAME, GCP_BANNER_NAME];

const hasPartner = (params: URLSearchParams) => possibleParams.find((param) => params.has(param));

const removePartnerParam = (params: URLSearchParams) => {
params.delete(AWS_BANNER_NAME);
params.delete(AZURE_BANNER_NAME);
params.delete(GCP_BANNER_NAME);
return params;
};

const useMarketplacePartner = () => {
const { search } = useLocation();

const params = new URLSearchParams(search);
const partnerId = hasPartner(params);
const partner = partnerId ? partnerMapper[partnerId] : null;
return {
partner,
partnerId,
removePartnerParam: () => removePartnerParam(params),
};
};

export default useMarketplacePartner;

0 comments on commit 30caeea

Please sign in to comment.