Skip to content

Commit

Permalink
Merge branch 'qa-stable' into prod-stable
Browse files Browse the repository at this point in the history
  • Loading branch information
Douglas Curtis committed Mar 31, 2021
2 parents 9a8dedf + 1cced51 commit d111a5e
Show file tree
Hide file tree
Showing 44 changed files with 672 additions and 1,014 deletions.
115 changes: 39 additions & 76 deletions koku-ui-manifest
View file

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@
"tsconfig-paths-webpack-plugin": "^3.3.0",
"webpack": "^5.24.3",
"webpack-cli": "^4.5.0",
"webpack-dev-server": "^3.11.2",
"webpack-dev-server": "^4.0.0-beta.0",
"webpack-log": "^3.0.1"
},
"insights": {
Expand Down
2 changes: 1 addition & 1 deletion src/api/providers.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,7 +57,7 @@ export const enum ProviderType {
aws = 'aws',
azure = 'azure',
gcp = 'gcp',
ibm = 'gcp', // Todo: update to use ibm backend apis when they become available
ibm = 'ibm',
ocp = 'ocp',
}

Expand Down
2 changes: 1 addition & 1 deletion src/api/userAccess.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export const enum UserAccessType {
cost_model = 'cost_model',
explorer = 'explorer',
gcp = 'gcp',
ibm = 'gcp',
ibm = 'ibm',
ocp = 'ocp',
}

Expand Down
37 changes: 4 additions & 33 deletions src/components/async/permissionsComponent/permissions.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,7 @@ import { connect } from 'react-redux';
import { RouteComponentProps, withRouter } from 'react-router-dom';
import { paths, routes } from 'routes';
import { createMapStateToProps, FetchStatus } from 'store/common';
import {
allUserAccessQuery,
gcpUserAccessQuery,
ibmUserAccessQuery,
userAccessActions,
userAccessSelectors,
} from 'store/userAccess';
import { allUserAccessQuery, ibmUserAccessQuery, userAccessActions, userAccessSelectors } from 'store/userAccess';
import {
hasAwsAccess,
hasAzureAccess,
Expand All @@ -30,10 +24,6 @@ interface PermissionsOwnProps extends RouteComponentProps<void> {
}

interface PermissionsStateProps {
gcpUserAccess: UserAccess;
gcpUserAccessError: AxiosError;
gcpUserAccessFetchStatus: FetchStatus;
gcpUserAccessQueryString: string;
ibmUserAccess: UserAccess;
ibmUserAccessError: AxiosError;
ibmUserAccessFetchStatus: FetchStatus;
Expand Down Expand Up @@ -61,15 +51,14 @@ class PermissionsBase extends React.Component<PermissionsProps> {
public state: PermissionsState = { ...this.defaultState };

public componentDidMount() {
const { gcpUserAccessQueryString, ibmUserAccessQueryString, userAccessQueryString, fetchUserAccess } = this.props;
const { ibmUserAccessQueryString, userAccessQueryString, fetchUserAccess } = this.props;

fetchUserAccess(UserAccessType.all, userAccessQueryString);
fetchUserAccess(UserAccessType.gcp, gcpUserAccessQueryString);
fetchUserAccess(UserAccessType.ibm, ibmUserAccessQueryString);
}

private hasPermissions() {
const { location, gcpUserAccess, ibmUserAccess, userAccess }: any = this.props;
const { location, ibmUserAccess, userAccess }: any = this.props;

if (!userAccess) {
return false;
Expand All @@ -78,7 +67,7 @@ class PermissionsBase extends React.Component<PermissionsProps> {
const aws = hasAwsAccess(userAccess);
const azure = hasAzureAccess(userAccess);
const costModel = hasCostModelAccess(userAccess);
const gcp = hasGcpAccess(gcpUserAccess);
const gcp = hasGcpAccess(userAccess);
const ibm = hasIbmAccess(ibmUserAccess);
const ocp = hasOcpAccess(userAccess);

Expand Down Expand Up @@ -139,20 +128,6 @@ const mapStateToProps = createMapStateToProps<PermissionsOwnProps, PermissionsSt
userAccessQueryString
);

// Todo: temporarily request GCP separately with beta flag.
const gcpUserAccessQueryString = getUserAccessQuery(gcpUserAccessQuery);
const gcpUserAccess = userAccessSelectors.selectUserAccess(state, UserAccessType.gcp, gcpUserAccessQueryString);
const gcpUserAccessError = userAccessSelectors.selectUserAccessError(
state,
UserAccessType.gcp,
gcpUserAccessQueryString
);
const gcpUserAccessFetchStatus = userAccessSelectors.selectUserAccessFetchStatus(
state,
UserAccessType.gcp,
gcpUserAccessQueryString
);

// Todo: temporarily request IBM separately with beta flag.
const ibmUserAccessQueryString = getUserAccessQuery(ibmUserAccessQuery);
const ibmUserAccess = userAccessSelectors.selectUserAccess(state, UserAccessType.ibm, ibmUserAccessQueryString);
Expand All @@ -168,10 +143,6 @@ const mapStateToProps = createMapStateToProps<PermissionsOwnProps, PermissionsSt
);

return {
gcpUserAccess,
gcpUserAccessError,
gcpUserAccessFetchStatus,
gcpUserAccessQueryString,
ibmUserAccess,
ibmUserAccessError,
ibmUserAccessFetchStatus,
Expand Down
35 changes: 35 additions & 0 deletions src/components/charts/common/chartUtils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,41 @@ export const getTooltipLabel = (datum: any, formatDatumValue: ValueFormatter, fo
return dy !== undefined ? dy : i18next.t('chart.no_data');
};

export const getResizeObserver = (containerRef: HTMLDivElement, handleResize: () => void) => {
const containerElement = containerRef;
const { ResizeObserver } = window as any;
let _navToggle;
let _resizeObserver;

if (containerElement && ResizeObserver) {
const resizeObserver = new ResizeObserver(entries => {
// We wrap it in requestAnimationFrame to avoid this error - ResizeObserver loop limit exceeded
window.requestAnimationFrame(() => {
if (!Array.isArray(entries) || !entries.length) {
return;
}
handleResize();
});
});
resizeObserver.observe(containerElement);
_resizeObserver = () => resizeObserver.unobserve(containerElement);
} else {
handleResize();
window.addEventListener('resize', handleResize);
_resizeObserver = () => window.removeEventListener('resize', handleResize);
_navToggle = insights.chrome.on('NAVIGATION_TOGGLE', setTimeout(handleResize, 500));
}

return () => {
if (_resizeObserver) {
_resizeObserver();
}
if (_navToggle) {
_navToggle();
}
};
};

export const initHiddenSeries = (series: ChartSeries[], hiddenSeries: Set<number>, index: number) => {
const result = new Set(hiddenSeries);
if (!result.delete(index)) {
Expand Down
35 changes: 6 additions & 29 deletions src/components/charts/costChart/costChart.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
getChartNames,
getDomain,
getLegendData,
getResizeObserver,
getTooltipLabel,
initHiddenSeries,
isDataAvailable,
Expand Down Expand Up @@ -59,16 +60,16 @@ interface State {

class CostChart extends React.Component<CostChartProps, State> {
private containerRef = React.createRef<HTMLDivElement>();
private resizeObserver: any = noop;
private navToggle: any = noop;
private observer: any = noop;

public state: State = {
hiddenSeries: new Set(),
width: 0,
};

public componentDidMount() {
this.initDatum();
this.initResizeObserve();
this.observer = getResizeObserver(this.containerRef.current, this.handleResize);
}

public componentDidUpdate(prevProps: CostChartProps) {
Expand All @@ -87,11 +88,8 @@ class CostChart extends React.Component<CostChartProps, State> {
}

public componentWillUnmount() {
if (this.resizeObserver) {
this.resizeObserver();
}
if (this.navToggle) {
this.navToggle();
if (this.observer) {
this.observer();
}
}

Expand Down Expand Up @@ -288,23 +286,6 @@ class CostChart extends React.Component<CostChartProps, State> {
this.setState({ cursorVoronoiContainer, series });
};

private initResizeObserve = () => {
const containerElement = this.containerRef.current;

const { ResizeObserver } = window as any;

if (containerElement && ResizeObserver) {
const resizeObserver = new ResizeObserver(this.handleResize);
resizeObserver.observe(containerElement);
this.resizeObserver = () => resizeObserver.unobserve(containerElement);
} else {
this.handleResize();
window.addEventListener('resize', this.handleResize);
this.resizeObserver = () => window.removeEventListener('resize', this.handleResize);
this.navToggle = insights.chrome.on('NAVIGATION_TOGGLE', this.handleNavToggle);
}
};

private getAdjustedContainerHeight = () => {
const { adjustContainerHeight, height, containerHeight = height, showForecast } = this.props;
const { width } = this.state;
Expand Down Expand Up @@ -432,10 +413,6 @@ class CostChart extends React.Component<CostChartProps, State> {
this.setState({ hiddenSeries });
};

private handleNavToggle = () => {
setTimeout(this.handleResize, 500);
};

private handleResize = () => {
const { width } = this.state;
const { clientWidth = 0 } = this.containerRef.current || {};
Expand Down
35 changes: 6 additions & 29 deletions src/components/charts/costExplorerChart/costExplorerChart.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
ChartSeries,
getChartNames,
getLegendData,
getResizeObserver,
getTooltipLabel,
initHiddenSeries,
isDataAvailable,
Expand Down Expand Up @@ -56,16 +57,16 @@ interface State {

class CostExplorerChart extends React.Component<CostExplorerChartProps, State> {
private containerRef = React.createRef<HTMLDivElement>();
private resizeObserver: any = noop;
private navToggle: any = noop;
private observer: any = noop;

public state: State = {
hiddenSeries: new Set(),
width: 0,
};

public componentDidMount() {
this.initDatum();
this.initResizeObserve();
this.observer = getResizeObserver(this.containerRef.current, this.handleResize);
}

public componentDidUpdate(prevProps: CostExplorerChartProps) {
Expand All @@ -82,11 +83,8 @@ class CostExplorerChart extends React.Component<CostExplorerChartProps, State> {
}

public componentWillUnmount() {
if (this.resizeObserver) {
this.resizeObserver();
}
if (this.navToggle) {
this.navToggle();
if (this.observer) {
this.observer();
}
}

Expand Down Expand Up @@ -219,23 +217,6 @@ class CostExplorerChart extends React.Component<CostExplorerChartProps, State> {
return data;
};

private initResizeObserve = () => {
const containerElement = this.containerRef.current;

const { ResizeObserver } = window as any;

if (containerElement && ResizeObserver) {
const resizeObserver = new ResizeObserver(this.handleResize);
resizeObserver.observe(containerElement);
this.resizeObserver = () => resizeObserver.unobserve(containerElement);
} else {
this.handleResize();
window.addEventListener('resize', this.handleResize);
this.resizeObserver = () => window.removeEventListener('resize', this.handleResize);
this.navToggle = insights.chrome.on('NAVIGATION_TOGGLE', this.handleNavToggle);
}
};

private getAdjustedContainerHeight = () => {
const { adjustContainerHeight, height, containerHeight = height } = this.props;
const { width } = this.state;
Expand Down Expand Up @@ -402,10 +383,6 @@ class CostExplorerChart extends React.Component<CostExplorerChartProps, State> {
this.setState({ hiddenSeries });
};

private handleNavToggle = () => {
setTimeout(this.handleResize, 500);
};

private handleResize = () => {
const { width } = this.state;
const { clientWidth = 0 } = this.containerRef.current || {};
Expand Down
35 changes: 6 additions & 29 deletions src/components/charts/dailyCostChart/dailyCostChart.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ import {
getChartNames,
getDomain,
getLegendData,
getResizeObserver,
getTooltipLabel,
initHiddenSeries,
isDataAvailable,
Expand Down Expand Up @@ -62,16 +63,16 @@ interface State {

class DailyCostChart extends React.Component<DailyCostChartProps, State> {
private containerRef = React.createRef<HTMLDivElement>();
private resizeObserver: any = noop;
private navToggle: any = noop;
private observer: any = noop;

public state: State = {
hiddenSeries: new Set(),
width: 0,
};

public componentDidMount() {
this.initDatum();
this.initResizeObserve();
this.observer = getResizeObserver(this.containerRef.current, this.handleResize);
}

public componentDidUpdate(prevProps: DailyCostChartProps) {
Expand All @@ -90,11 +91,8 @@ class DailyCostChart extends React.Component<DailyCostChartProps, State> {
}

public componentWillUnmount() {
if (this.resizeObserver) {
this.resizeObserver();
}
if (this.navToggle) {
this.navToggle();
if (this.observer) {
this.observer();
}
}

Expand Down Expand Up @@ -301,23 +299,6 @@ class DailyCostChart extends React.Component<DailyCostChartProps, State> {
return data;
};

private initResizeObserve = () => {
const containerElement = this.containerRef.current;

const { ResizeObserver } = window as any;

if (containerElement && ResizeObserver) {
const resizeObserver = new ResizeObserver(this.handleResize);
resizeObserver.observe(containerElement);
this.resizeObserver = () => resizeObserver.unobserve(containerElement);
} else {
this.handleResize();
window.addEventListener('resize', this.handleResize);
this.resizeObserver = () => window.removeEventListener('resize', this.handleResize);
this.navToggle = insights.chrome.on('NAVIGATION_TOGGLE', this.handleNavToggle);
}
};

private getAdjustedContainerHeight = () => {
const { adjustContainerHeight, height, containerHeight = height, showForecast } = this.props;
const { width } = this.state;
Expand Down Expand Up @@ -488,10 +469,6 @@ class DailyCostChart extends React.Component<DailyCostChartProps, State> {
this.setState({ hiddenSeries });
};

private handleNavToggle = () => {
setTimeout(this.handleResize, 500);
};

private handleResize = () => {
const { width } = this.state;
const { clientWidth = 0 } = this.containerRef.current || {};
Expand Down
Loading

0 comments on commit d111a5e

Please sign in to comment.