diff --git a/.eslintrc b/.eslintrc
index 73fe28b8..aa5d0a34 100644
--- a/.eslintrc
+++ b/.eslintrc
@@ -34,7 +34,8 @@
   "plugins": [
     "@typescript-eslint",
     "react-hooks",
-    "eslint-plugin-react-hooks"
+    "eslint-plugin-react-hooks",
+    "sort-imports-es6-autofix"
   ],
   "rules": {
     "@typescript-eslint/explicit-function-return-type": "off",
@@ -46,7 +47,11 @@
     "import/extensions": "off",
     "react/prop-types": "off",
     "@typescript-eslint/no-empty-function": "off",
-    "sort-imports": "warn"
+    "sort-imports-es6-autofix/sort-imports-es6": [2, {
+      "ignoreCase": false,
+      "ignoreMemberSort": false,
+      "memberSyntaxSortOrder": ["none", "all", "multiple", "single"]
+    }]
   },
   "env": {
     "browser": true,
diff --git a/package.json b/package.json
index e092b6eb..a892b13d 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "@types/jest": "^26.0.14",
     "concurrently": "^5.3.0",
     "enzyme-adapter-react-16": "^1.15.6",
+    "eslint-plugin-sort-imports-es6-autofix": "^0.6.0",
     "jest": "21.x",
     "jest-resolve": "^26.4.0",
     "jsdom": "^16.6.0",
diff --git a/packages/dev/package.json b/packages/dev/package.json
index 5947db64..cbd55104 100644
--- a/packages/dev/package.json
+++ b/packages/dev/package.json
@@ -9,7 +9,7 @@
     "serve": "serve public"
   },
   "dependencies": {
-    "@patternfly/quickstarts": "1.0.0-rc.18",
+    "@patternfly/quickstarts": "1.0.0-rc.19",
     "@patternfly/react-core": "^4.101.3",
     "asciidoctor": "^2.2.1",
     "react": "^16.14.0",
diff --git a/packages/dev/src/App.tsx b/packages/dev/src/App.tsx
index 98509146..7a0a720d 100755
--- a/packages/dev/src/App.tsx
+++ b/packages/dev/src/App.tsx
@@ -1,4 +1,4 @@
-import React from "react";
+import "./App.css";
 import {
   Avatar,
   Brand,
@@ -10,22 +10,22 @@ import {
   PageHeaderTools,
   PageSidebar,
 } from "@patternfly/react-core";
-import imgBrand from "./assets/images/imgBrand.svg";
-import imgAvatar from "./assets/images/imgAvatar.svg";
 import { Link, useHistory } from "react-router-dom";
-import Demos from "./Demos";
-import "./App.css";
 import {
   LoadingBox,
+  QuickStart,
   QuickStartContextProvider,
   QuickStartContextValues,
   QuickStartDrawer,
-  useLocalStorage,
-  QuickStart
+  useLocalStorage
 } from "@patternfly/quickstarts";
-import { allQuickStarts as yamlQuickStarts } from "./quickstarts-data/quick-start-test-data";
 import { loadJSONQuickStarts } from "./quickstarts-data/mas-guides/quickstartLoader";
+import { allQuickStarts as yamlQuickStarts } from "./quickstarts-data/quick-start-test-data";
+import Demos from "./Demos";
+import React from "react";
 import i18n from './i18n/i18n';
+import imgAvatar from "./assets/images/imgAvatar.svg";
+import imgBrand from "./assets/images/imgBrand.svg";
 
 type AppProps = {
   children?: React.ReactNode;
@@ -102,7 +102,8 @@ const App: React.FC<AppProps> = ({ children, showCardFooters }) => {
   const { pathname: currentPath } = window.location;
   const quickStartPath = "/quickstarts";
 
-  const resourceBundle = i18n.getResourceBundle(localStorage.getItem('bridge/language') || 'en', 'quickstart');
+  const language = localStorage.getItem('bridge/language') || 'en';
+  const resourceBundle = i18n.getResourceBundle(language, 'quickstart');
 
   const valuesForQuickstartContext: QuickStartContextValues = {
     allQuickStarts,
@@ -115,7 +116,7 @@ const App: React.FC<AppProps> = ({ children, showCardFooters }) => {
       showAllLink: currentPath !== quickStartPath,
       onShowAllLinkClick: () => history.push(quickStartPath),
     },
-    lng: localStorage.getItem('bridge/language'),
+    language,
     resourceBundle: {
       ...resourceBundle,
       "Start": "Let's go!",
diff --git a/packages/dev/src/Home.tsx b/packages/dev/src/Home.tsx
index 04e906d7..571014e2 100644
--- a/packages/dev/src/Home.tsx
+++ b/packages/dev/src/Home.tsx
@@ -7,7 +7,7 @@ import i18n from './i18n/i18n';
 
 export const Home: React.FunctionComponent = () => {
   // const [inputValue, setInputValue] = React.useState("");
-  const { setLng, setResourceBundle } = React.useContext(QuickStartContext);
+  const { setResourceBundle } = React.useContext(QuickStartContext);
 
   // console.log(getQuickStartStatus(qsContext.allQuickStartStates, 'managing-business-central-data-sources-proc'));
   // console.log(getQuickStartStatusCount(qsContext.allQuickStartStates, qsContext.allQuickStarts));
@@ -43,8 +43,7 @@ export const Home: React.FunctionComponent = () => {
     i18n.changeLanguage(lng);
     localStorage.setItem('bridge/language', lng);
     const resourceBundle = i18n.getResourceBundle(lng, 'quickstart');
-    setLng(lng);
-    setResourceBundle(resourceBundle);
+    setResourceBundle(resourceBundle, lng);
   }
 
   return (
diff --git a/packages/module/package.json b/packages/module/package.json
index 637aa4de..0725784d 100644
--- a/packages/module/package.json
+++ b/packages/module/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/quickstarts",
-  "version": "1.0.0-rc.18",
+  "version": "1.0.0-rc.19",
   "description": "PatternFly quick starts",
   "files": [
     "dist"
@@ -42,7 +42,6 @@
     "showdown": ">=1.8.6"
   },
   "dependencies": {
-    "@fortawesome/fontawesome-free": "^5.9.0",
     "@patternfly/patternfly": "^4.90.5",
     "@patternfly/react-catalog-view-extension": "^4.10.13",
     "@patternfly/react-core": "^4.101.3",
@@ -51,7 +50,6 @@
     "dompurify": "^2.2.6",
     "history": "^5.0.0",
     "lodash-es": "^4.17.20",
-    "sass": "^1.30.0",
     "showdown": "1.8.6"
   },
   "devDependencies": {
@@ -66,7 +64,6 @@
     "@types/node": "^14.14.35",
     "@types/react": "^16.8.0",
     "@types/react-dom": "^16.8.0",
-    "@types/victory": "^33.1.4",
     "@typescript-eslint/eslint-plugin": "^4.4.1",
     "@typescript-eslint/parser": "^4.4.1",
     "clean-css-cli": "^4.3.0",
@@ -76,11 +73,9 @@
     "eslint": "^7.11.0",
     "eslint-plugin-react": "^7.21.4",
     "eslint-plugin-react-hooks": "^4.1.2",
-    "express": "^4.17.1",
-    "imagemin": "^7.0.0",
+    "sass": "^1.30.0",
     "node-sass": "^5.0.0",
     "prettier": "^2.1.2",
-    "prop-types": "^15.6.1",
     "purgecss": "^4.0.0",
     "react": "^16.8.0",
     "react-axe": "^3.5.4",
diff --git a/packages/module/src/ConsoleInternal/components/markdown-view.tsx b/packages/module/src/ConsoleInternal/components/markdown-view.tsx
index 080d4715..6f18ca00 100644
--- a/packages/module/src/ConsoleInternal/components/markdown-view.tsx
+++ b/packages/module/src/ConsoleInternal/components/markdown-view.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
-import cx from 'classnames';
-import _truncate from 'lodash-es/truncate.js';
-import _uniqueId from 'lodash-es/uniqueId.js';
 import { Converter } from 'showdown';
 import { QuickStartContext, QuickStartContextValues } from '../../utils/quick-start-context';
+import _truncate from 'lodash-es/truncate.js';
+import _uniqueId from 'lodash-es/uniqueId.js';
+import cx from 'classnames';
 
 import './_markdown-view.scss';
 
diff --git a/packages/module/src/ConsoleInternal/components/utils/status-box.tsx b/packages/module/src/ConsoleInternal/components/utils/status-box.tsx
index 4fdd8fa5..dab433d5 100644
--- a/packages/module/src/ConsoleInternal/components/utils/status-box.tsx
+++ b/packages/module/src/ConsoleInternal/components/utils/status-box.tsx
@@ -1,6 +1,6 @@
 import * as React from 'react';
-import classNames from 'classnames';
 import { QuickStartContext, QuickStartContextValues } from '../../../utils/quick-start-context';
+import classNames from 'classnames';
 
 // import * as restrictedSignImg from '../../imgs/restricted-sign.svg';
 // import { TimeoutError } from '../../co-fetch';
diff --git a/packages/module/src/ConsoleInternal/vendor.scss b/packages/module/src/ConsoleInternal/vendor.scss
index ca94f6b5..19e90646 100644
--- a/packages/module/src/ConsoleInternal/vendor.scss
+++ b/packages/module/src/ConsoleInternal/vendor.scss
@@ -8,6 +8,12 @@
 
 @import "~bootstrap-sass/assets/stylesheets/bootstrap/normalize";
 @import "~bootstrap-sass/assets/stylesheets/bootstrap/scaffolding";
-
 @import "~bootstrap-sass/assets/stylesheets/bootstrap/type";
 @import "~bootstrap-sass/assets/stylesheets/bootstrap/code";
+
+// .co-quick-start-panel-content,
+// .ocs-page-layout__content {
+//     @import "~bootstrap-sass/assets/stylesheets/bootstrap/scaffolding";
+//     @import "~bootstrap-sass/assets/stylesheets/bootstrap/type";
+//     @import "~bootstrap-sass/assets/stylesheets/bootstrap/code";
+// }
diff --git a/packages/module/src/ConsoleShared/src/components/modal/Modal.tsx b/packages/module/src/ConsoleShared/src/components/modal/Modal.tsx
index 50f21fe2..26910191 100644
--- a/packages/module/src/ConsoleShared/src/components/modal/Modal.tsx
+++ b/packages/module/src/ConsoleShared/src/components/modal/Modal.tsx
@@ -1,7 +1,7 @@
+import './Modal.scss';
 import * as React from 'react';
-import cx from 'classnames';
 import { Modal as PfModal, ModalProps as PfModalProps } from '@patternfly/react-core';
-import './Modal.scss';
+import cx from 'classnames';
 
 type ModalProps = {
   isFullScreen?: boolean;
diff --git a/packages/module/src/ConsoleShared/src/components/popper/Popper.tsx b/packages/module/src/ConsoleShared/src/components/popper/Popper.tsx
deleted file mode 100644
index 1b1cf78e..00000000
--- a/packages/module/src/ConsoleShared/src/components/popper/Popper.tsx
+++ /dev/null
@@ -1,232 +0,0 @@
-import * as React from 'react';
-// popper.js/dist/esm/popper.min.js for smaller bundle? but jest won't like it
-import PopperJS, { PopperOptions } from 'popper.js';
-import { useCombineRefs } from '../../utils/useCombineRefs';
-import Portal from './Portal';
-
-// alignment with PopperJS reference API
-type PopperJSReference = {
-  getBoundingClientRect: PopperJS['reference']['getBoundingClientRect'];
-  clientWidth: number;
-  clientHeight: number;
-};
-
-type ClientRectProp = { x: number; y: number; width?: number; height?: number };
-
-type Reference = Element | PopperJSReference | ClientRectProp;
-
-class VirtualReference implements PopperJSReference {
-  private rect: ClientRect;
-
-  constructor({ height = 0, width = 0, x, y }: ClientRectProp) {
-    this.rect = {
-      bottom: y + height,
-      height,
-      left: x,
-      right: x + width,
-      top: y,
-      width,
-    };
-  }
-
-  getBoundingClientRect(): ClientRect {
-    return this.rect;
-  }
-
-  get clientWidth(): number {
-    return this.rect.width || 0;
-  }
-
-  get clientHeight(): number {
-    return this.rect.height || 0;
-  }
-}
-
-const getReference = (reference: Reference): PopperJSReference =>
-  'getBoundingClientRect' in reference ? reference : new VirtualReference(reference);
-
-type PopperProps = {
-  closeOnEsc?: boolean;
-  closeOnOutsideClick?: boolean;
-  container?: React.ComponentProps<typeof Portal>['container'];
-  className?: string;
-  open?: boolean;
-  onRequestClose?: (e?: MouseEvent) => void;
-  placement?:
-    | 'bottom-end'
-    | 'bottom-start'
-    | 'bottom'
-    | 'left-end'
-    | 'left-start'
-    | 'left'
-    | 'right-end'
-    | 'right-start'
-    | 'right'
-    | 'top-end'
-    | 'top-start'
-    | 'top';
-  popperOptions?: PopperOptions;
-  popperRef?: React.Ref<PopperJS>;
-  reference: Reference | (() => Reference);
-  zIndex?: number;
-  returnFocus?: boolean;
-};
-
-const DEFAULT_POPPER_OPTIONS: PopperOptions = {};
-
-const Popper: React.FC<PopperProps> = ({
-  children,
-  container,
-  className,
-  open,
-  placement = 'bottom-start',
-  reference,
-  popperOptions = DEFAULT_POPPER_OPTIONS,
-  closeOnEsc,
-  closeOnOutsideClick,
-  onRequestClose,
-  popperRef: popperRefIn,
-  zIndex = 9999,
-  returnFocus,
-}) => {
-  const controlled = typeof open === 'boolean';
-  const openProp = controlled ? open || false : true;
-  const nodeRef = React.useRef<Element>();
-  const popperRef = React.useRef<PopperJS>(null);
-  const popperRefs = useCombineRefs<PopperJS>(popperRef, popperRefIn);
-  const [isOpen, setOpenState] = React.useState(openProp);
-  const focusRef = React.useRef<Element | null>();
-  const onRequestCloseRef = React.useRef(onRequestClose);
-  onRequestCloseRef.current = onRequestClose;
-
-  const setOpen = React.useCallback(
-    (newOpen: boolean) => {
-      if (returnFocus && newOpen !== isOpen) {
-        if (newOpen) {
-          if (document.activeElement) {
-            focusRef.current = document.activeElement;
-          }
-        } else if (focusRef.current instanceof HTMLElement && focusRef.current.ownerDocument) {
-          focusRef.current.focus();
-        }
-      }
-      setOpenState(newOpen);
-    },
-    [returnFocus, isOpen],
-  );
-
-  React.useEffect(() => {
-    setOpen(openProp);
-  }, [openProp, setOpen]);
-
-  const onKeyDown = React.useCallback(
-    (e: KeyboardEvent) => {
-      if (e.keyCode === 27) {
-        controlled ? onRequestCloseRef.current && onRequestCloseRef.current() : setOpen(false);
-      }
-    },
-    [controlled, setOpen],
-  );
-
-  const onClickOutside = React.useCallback(
-    (e: MouseEvent) => {
-      if (!nodeRef.current || (e.target instanceof Node && !nodeRef.current.contains(e.target))) {
-        controlled ? onRequestCloseRef.current && onRequestCloseRef.current(e) : setOpen(false);
-      }
-    },
-    [controlled, setOpen],
-  );
-
-  const destroy = React.useCallback(() => {
-    if (popperRef.current) {
-      popperRef.current.destroy();
-      popperRefs(null);
-      document.removeEventListener('keydown', onKeyDown, true);
-      document.removeEventListener('mousedown', onClickOutside, true);
-      document.removeEventListener('touchstart', onClickOutside, true);
-    }
-  }, [onClickOutside, onKeyDown, popperRefs]);
-
-  const initialize = React.useCallback(() => {
-    if (!nodeRef.current || !reference || !isOpen) {
-      return;
-    }
-
-    destroy();
-
-    popperRefs(
-      new PopperJS(
-        getReference(typeof reference === 'function' ? reference() : reference),
-        nodeRef.current,
-        {
-          placement,
-          ...popperOptions,
-          modifiers: {
-            preventOverflow: {
-              boundariesElement: 'window',
-            },
-            ...popperOptions.modifiers,
-          },
-        },
-      ),
-    );
-
-    // init document listenerrs
-    if (closeOnEsc) {
-      document.addEventListener('keydown', onKeyDown, true);
-    }
-    if (closeOnOutsideClick) {
-      document.addEventListener('mousedown', onClickOutside, true);
-      document.addEventListener('touchstart', onClickOutside, true);
-    }
-  }, [
-    popperRefs,
-    reference,
-    isOpen,
-    destroy,
-    placement,
-    popperOptions,
-    closeOnEsc,
-    closeOnOutsideClick,
-    onKeyDown,
-    onClickOutside,
-  ]);
-
-  const nodeRefCallback = React.useCallback(
-    (node) => {
-      nodeRef.current = node;
-      initialize();
-    },
-    [initialize],
-  );
-
-  React.useEffect(() => {
-    initialize();
-  }, [initialize]);
-
-  React.useEffect(() => {
-    return () => {
-      destroy();
-    };
-  }, [destroy]);
-
-  React.useEffect(() => {
-    if (!isOpen) {
-      destroy();
-    }
-  }, [destroy, isOpen]);
-
-  return isOpen ? (
-    <Portal container={container}>
-      <div
-        ref={nodeRefCallback}
-        className={className}
-        style={{ zIndex, position: 'absolute', top: 0, left: 0 }}
-      >
-        {children}
-      </div>
-    </Portal>
-  ) : null;
-};
-
-export default Popper;
diff --git a/packages/module/src/ConsoleShared/src/components/popper/SimplePopper.tsx b/packages/module/src/ConsoleShared/src/components/popper/SimplePopper.tsx
new file mode 100644
index 00000000..c2e0f8c3
--- /dev/null
+++ b/packages/module/src/ConsoleShared/src/components/popper/SimplePopper.tsx
@@ -0,0 +1,95 @@
+import * as React from 'react';
+import Portal from './Portal';
+
+const SimplePopper: React.FC = ({ children }) => {
+  const openProp = true;
+  const nodeRef = React.useRef<Element>();
+  const popperRef = React.useRef(null);
+  const [isOpen, setOpenState] = React.useState(openProp);
+
+  const setOpen = React.useCallback(
+    (newOpen: boolean) => {
+      setOpenState(newOpen);
+    },
+    [],
+  );
+
+  React.useEffect(() => {
+    setOpen(openProp);
+  }, [openProp, setOpen]);
+
+  const onKeyDown = React.useCallback(
+    (e: KeyboardEvent) => {
+      if (e.keyCode === 27) {
+        setOpen(false);
+      }
+    },
+    [setOpen],
+  );
+
+  const onClickOutside = React.useCallback(
+    (e: MouseEvent) => {
+      if (!nodeRef.current || (e.target instanceof Node && !nodeRef.current.contains(e.target))) {
+        setOpen(false);
+      }
+    },
+    [setOpen],
+  );
+
+  const destroy = React.useCallback(() => {
+    if (popperRef.current) {
+      popperRef.current.destroy();
+      document.removeEventListener('keydown', onKeyDown, true);
+      document.removeEventListener('mousedown', onClickOutside, true);
+      document.removeEventListener('touchstart', onClickOutside, true);
+    }
+  }, [onClickOutside, onKeyDown]);
+
+  const initialize = React.useCallback(() => {
+    if (!nodeRef.current || !isOpen) {
+      return;
+    }
+
+    destroy();
+  }, [
+    isOpen,
+    destroy,
+  ]);
+
+  const nodeRefCallback = React.useCallback(
+    (node) => {
+      nodeRef.current = node;
+      initialize();
+    },
+    [initialize],
+  );
+
+  React.useEffect(() => {
+    initialize();
+  }, [initialize]);
+
+  React.useEffect(() => {
+    return () => {
+      destroy();
+    };
+  }, [destroy]);
+
+  React.useEffect(() => {
+    if (!isOpen) {
+      destroy();
+    }
+  }, [destroy, isOpen]);
+
+  return isOpen ? (
+    <Portal>
+      <div
+        ref={nodeRefCallback}
+        style={{ zIndex: 9999, position: 'absolute', top: 0, left: 0 }}
+      >
+        {children}
+      </div>
+    </Portal>
+  ) : null;
+};
+
+export default SimplePopper;
diff --git a/packages/module/src/ConsoleShared/src/components/popper/index.ts b/packages/module/src/ConsoleShared/src/components/popper/index.ts
index 74150c02..c6e478d5 100644
--- a/packages/module/src/ConsoleShared/src/components/popper/index.ts
+++ b/packages/module/src/ConsoleShared/src/components/popper/index.ts
@@ -1 +1,2 @@
-export { default as Popper } from './Popper';
+export { default as SimplePopper } from './SimplePopper';
+export { default as Portal } from './Portal';
diff --git a/packages/module/src/ConsoleShared/src/components/spotlight/InteractiveSpotlight.tsx b/packages/module/src/ConsoleShared/src/components/spotlight/InteractiveSpotlight.tsx
index 391f3931..a300540e 100644
--- a/packages/module/src/ConsoleShared/src/components/spotlight/InteractiveSpotlight.tsx
+++ b/packages/module/src/ConsoleShared/src/components/spotlight/InteractiveSpotlight.tsx
@@ -1,7 +1,6 @@
-import * as React from 'react';
-import { PopperOptions } from 'popper.js';
-import { Popper } from '../popper';
 import './spotlight.scss';
+import * as React from 'react';
+import { Portal, SimplePopper } from '../popper';
 
 type InteractiveSpotlightProps = {
   element: Element;
@@ -17,22 +16,15 @@ const isInViewport = (elementToCheck: Element) => {
   );
 };
 
-const popperOptions: PopperOptions = {
-  modifiers: {
-    preventOverflow: {
-      enabled: false,
-    },
-    flip: {
-      enabled: false,
-    },
-  },
-};
-
 const InteractiveSpotlight: React.FC<InteractiveSpotlightProps> = ({ element }) => {
-  const { height, width } = element.getBoundingClientRect();
+  const { top, bottom, left, right, height, width } = element.getBoundingClientRect();
   const style: React.CSSProperties = {
     height,
     width,
+    top,
+    left,
+    bottom,
+    right,
   };
   const [clicked, setClicked] = React.useState(false);
 
@@ -53,9 +45,11 @@ const InteractiveSpotlight: React.FC<InteractiveSpotlightProps> = ({ element })
   if (clicked) return null;
 
   return (
-    <Popper reference={element} placement="top-start" popperOptions={popperOptions}>
-      <div className="ocs-spotlight ocs-spotlight__element-highlight-animate" style={style} />
-    </Popper>
+    <Portal>
+      <SimplePopper>
+        <div className="ocs-spotlight ocs-spotlight__element-highlight-animate" style={style} />
+      </SimplePopper>
+    </Portal>
   );
 };
 
diff --git a/packages/module/src/ConsoleShared/src/components/spotlight/StaticSpotlight.tsx b/packages/module/src/ConsoleShared/src/components/spotlight/StaticSpotlight.tsx
index f5417ea2..0a33dace 100644
--- a/packages/module/src/ConsoleShared/src/components/spotlight/StaticSpotlight.tsx
+++ b/packages/module/src/ConsoleShared/src/components/spotlight/StaticSpotlight.tsx
@@ -1,7 +1,7 @@
+import './spotlight.scss';
 import * as React from 'react';
 import { useBoundingClientRect } from '../../hooks';
 import Portal from '../popper/Portal';
-import './spotlight.scss';
 
 type StaticSpotlightProps = {
   element: Element;
diff --git a/packages/module/src/ConsoleShared/src/components/status/Status.tsx b/packages/module/src/ConsoleShared/src/components/status/Status.tsx
index 86e720aa..f89eb152 100644
--- a/packages/module/src/ConsoleShared/src/components/status/Status.tsx
+++ b/packages/module/src/ConsoleShared/src/components/status/Status.tsx
@@ -9,11 +9,11 @@ import {
   UnknownIcon,
 } from '@patternfly/react-icons';
 import { DASH } from '../../constants';
+import { ErrorStatus, InfoStatus, ProgressStatus, SuccessStatus } from './statuses';
+import { StatusComponentProps } from './types';
 import { YellowExclamationTriangleIcon } from './icons';
 import NotStartedIcon from './NotStartedIcon';
 import StatusIconAndText from './StatusIconAndText';
-import { ErrorStatus, InfoStatus, ProgressStatus, SuccessStatus } from './statuses';
-import { StatusComponentProps } from './types';
 
 export const Status: React.FC<StatusProps> = ({
   status,
diff --git a/packages/module/src/ConsoleShared/src/components/status/StatusIconAndText.tsx b/packages/module/src/ConsoleShared/src/components/status/StatusIconAndText.tsx
index 973a94b0..2ec5add3 100644
--- a/packages/module/src/ConsoleShared/src/components/status/StatusIconAndText.tsx
+++ b/packages/module/src/ConsoleShared/src/components/status/StatusIconAndText.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
-import classNames from 'classnames';
 import { CamelCaseWrap } from '@console/internal/components/utils';
 import { DASH } from '../../constants';
 import { StatusComponentProps } from './types';
+import classNames from 'classnames';
 
 type StatusIconAndTextProps = StatusComponentProps & {
   icon?: React.ReactElement;
diff --git a/packages/module/src/ConsoleShared/src/components/status/icons.tsx b/packages/module/src/ConsoleShared/src/components/status/icons.tsx
index c927dd79..2c1bef31 100644
--- a/packages/module/src/ConsoleShared/src/components/status/icons.tsx
+++ b/packages/module/src/ConsoleShared/src/components/status/icons.tsx
@@ -10,11 +10,11 @@ import * as React from 'react';
 //   ResourcesAlmostFullIcon,
 //   ResourcesFullIcon,
 // } from '@patternfly/react-icons';
+import { global_danger_color_100 as dangerColor } from '@patternfly/react-tokens/dist/js/global_danger_color_100';
 import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
 import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
 import ExclamationTriangleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-triangle-icon';
 import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
-import { global_danger_color_100 as dangerColor } from '@patternfly/react-tokens/dist/js/global_danger_color_100';
 // import { global_default_color_200 as blueDefaultColor } from '@patternfly/react-tokens/dist/js/global_default_color_200';
 // import { global_disabled_color_100 as disabledColor } from '@patternfly/react-tokens/dist/js/global_disabled_color_100';
 import { global_palette_blue_300 as blueInfoColor } from '@patternfly/react-tokens/dist/js/global_palette_blue_300';
diff --git a/packages/module/src/ConsoleShared/src/components/status/statuses.tsx b/packages/module/src/ConsoleShared/src/components/status/statuses.tsx
index e555df12..7732d1cf 100644
--- a/packages/module/src/ConsoleShared/src/components/status/statuses.tsx
+++ b/packages/module/src/ConsoleShared/src/components/status/statuses.tsx
@@ -1,13 +1,13 @@
 import * as React from 'react';
-import { HourglassHalfIcon, InProgressIcon } from '@patternfly/react-icons';
 import {
   BlueInfoCircleIcon,
   GreenCheckCircleIcon,
   RedExclamationCircleIcon,
   YellowExclamationTriangleIcon,
 } from './icons';
-import GenericStatus from './GenericStatus';
+import { HourglassHalfIcon, InProgressIcon } from '@patternfly/react-icons';
 import { StatusComponentProps } from './types';
+import GenericStatus from './GenericStatus';
 
 export const ErrorStatus: React.FC<StatusComponentProps> = (props) => (
   <GenericStatus {...props} Icon={RedExclamationCircleIcon} title={props.title || 'Error'} />
diff --git a/packages/module/src/QuickStartCatalogPage.tsx b/packages/module/src/QuickStartCatalogPage.tsx
index 7247b8c8..472aa7b9 100644
--- a/packages/module/src/QuickStartCatalogPage.tsx
+++ b/packages/module/src/QuickStartCatalogPage.tsx
@@ -1,8 +1,4 @@
 import * as React from 'react';
-import QuickStartCatalog from './catalog/QuickStartCatalog';
-import { QuickStart } from './utils/quick-start-types';
-import { filterQuickStarts } from './utils/quick-start-utils';
-import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
 import {
   Button,
   Divider,
@@ -13,9 +9,13 @@ import {
   Text,
   Title,
 } from '@patternfly/react-core';
-import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
 import { EmptyBox, LoadingBox, clearFilterParams } from '@console/internal/components/utils';
+import { QuickStart } from './utils/quick-start-types';
+import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
+import { filterQuickStarts } from './utils/quick-start-utils';
+import QuickStartCatalog from './catalog/QuickStartCatalog';
 import QuickStartCatalogFilter from './catalog/Toolbar/QuickStartCatalogFilter';
+import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
 
 type QuickStartCatalogPageProps = {
   quickStarts?: QuickStart[];
diff --git a/packages/module/src/QuickStartCloseModal.tsx b/packages/module/src/QuickStartCloseModal.tsx
index 237dbd70..f4bcb728 100644
--- a/packages/module/src/QuickStartCloseModal.tsx
+++ b/packages/module/src/QuickStartCloseModal.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
-import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
-import { Modal } from '@console/shared';
 import { Button, Flex, FlexItem, ModalVariant } from '@patternfly/react-core';
+import { Modal } from '@console/shared';
+import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
 
 type QuickStartCloseModalProps = {
   isOpen: boolean;
diff --git a/packages/module/src/QuickStartController.tsx b/packages/module/src/QuickStartController.tsx
index e3ef85dc..2aee7f4a 100644
--- a/packages/module/src/QuickStartController.tsx
+++ b/packages/module/src/QuickStartController.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { QuickStart, QuickStartStatus, QuickStartTaskStatus } from './utils/quick-start-types';
+import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
 import QuickStartContent from './controller/QuickStartContent';
 import QuickStartFooter from './controller/QuickStartFooter';
-import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
 
 type QuickStartControllerProps = {
   quickStart: QuickStart;
diff --git a/packages/module/src/QuickStartDrawer.tsx b/packages/module/src/QuickStartDrawer.tsx
index fa40a12a..59f23b69 100644
--- a/packages/module/src/QuickStartDrawer.tsx
+++ b/packages/module/src/QuickStartDrawer.tsx
@@ -1,13 +1,13 @@
+import './QuickStartDrawer.scss';
 import * as React from 'react';
 import { Drawer, DrawerContent, DrawerContentBody } from '@patternfly/react-core';
+import { QUICKSTART_ID_FILTER_KEY } from './utils/const';
+import { QuickStart } from './utils/quick-start-types';
 import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
 import { QuickStartStatus } from './utils/quick-start-types';
-import QuickStartPanelContent from './QuickStartPanelContent';
-import QuickStartCloseModal from './QuickStartCloseModal';
-import { QUICKSTART_ID_FILTER_KEY } from './utils/const';
 import { getQuickStartByName } from './utils/quick-start-utils';
-import { QuickStart } from './utils/quick-start-types';
-import './QuickStartDrawer.scss';
+import QuickStartCloseModal from './QuickStartCloseModal';
+import QuickStartPanelContent from './QuickStartPanelContent';
 
 export interface QuickStartDrawerProps extends React.HTMLProps<HTMLDivElement> {
   quickStarts?: QuickStart[];
@@ -35,7 +35,7 @@ export const QuickStartDrawer: React.FC<QuickStartDrawerProps> = ({
     const quickStartId = params.get(QUICKSTART_ID_FILTER_KEY) || '';
     if (quickStartId && activeQuickStartID !== quickStartId) {
       const activeQuickStart = getQuickStartByName(quickStartId, allQuickStarts);
-      if (activeQuickStart && !activeQuickStart.spec.link) {
+      if (!allQuickStarts || allQuickStarts.length === 0 || (activeQuickStart && !activeQuickStart.spec.link)) {
         // don't try to load a quick start that is actually just an external resource
         setActiveQuickStart(quickStartId);
       }
diff --git a/packages/module/src/QuickStartMarkdownView.tsx b/packages/module/src/QuickStartMarkdownView.tsx
index ba775589..ab1e19d3 100644
--- a/packages/module/src/QuickStartMarkdownView.tsx
+++ b/packages/module/src/QuickStartMarkdownView.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
-import { SyncMarkdownView } from '@console/internal/components/markdown-view';
-import { MarkdownHighlightExtension } from '@console/shared';
 import { HIGHLIGHT_REGEXP } from '@console/shared/src/components/markdown-highlight-extension/highlight-consts';
+import { MarkdownHighlightExtension } from '@console/shared';
 import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
+import { SyncMarkdownView } from '@console/internal/components/markdown-view';
 
 export const removeParagraphWrap = (markdown: string) => markdown.replace(/^<p>|<\/p>$/g, '');
 
diff --git a/packages/module/src/QuickStartPanelContent.tsx b/packages/module/src/QuickStartPanelContent.tsx
index 172dbfb4..89c27421 100644
--- a/packages/module/src/QuickStartPanelContent.tsx
+++ b/packages/module/src/QuickStartPanelContent.tsx
@@ -1,6 +1,5 @@
+import './QuickStartPanelContent.scss';
 import * as React from 'react';
-import ReactDOM from 'react-dom';
-import classNames from 'classnames';
 import {
   DrawerActions,
   DrawerCloseButton,
@@ -9,12 +8,13 @@ import {
   DrawerPanelContent,
   Title,
 } from '@patternfly/react-core';
-import { Shadows, useScrollShadows } from '@console/shared';
 import { QuickStart } from './utils/quick-start-types';
-import './QuickStartPanelContent.scss';
-import QuickStartController from './QuickStartController';
 import { QuickStartContext, QuickStartContextValues } from './utils/quick-start-context';
+import { Shadows, useScrollShadows } from '@console/shared';
 import { camelize } from './utils/quick-start-utils';
+import QuickStartController from './QuickStartController';
+import ReactDOM from 'react-dom';
+import classNames from 'classnames';
 
 type HandleClose = () => void;
 
diff --git a/packages/module/src/catalog/QuickStartCatalog.tsx b/packages/module/src/catalog/QuickStartCatalog.tsx
index 44588562..7007df0e 100644
--- a/packages/module/src/catalog/QuickStartCatalog.tsx
+++ b/packages/module/src/catalog/QuickStartCatalog.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { Gallery, GalleryItem } from '@patternfly/react-core';
 import { QuickStart } from '../utils/quick-start-types';
+import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 import { getQuickStartStatus } from '../utils/quick-start-utils';
 import QuickStartTile from './QuickStartTile';
-import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 
 import './QuickStartCatalog.scss';
 
diff --git a/packages/module/src/catalog/QuickStartTile.tsx b/packages/module/src/catalog/QuickStartTile.tsx
index 0993e027..257195e6 100644
--- a/packages/module/src/catalog/QuickStartTile.tsx
+++ b/packages/module/src/catalog/QuickStartTile.tsx
@@ -1,14 +1,14 @@
 import * as React from 'react';
 import { CatalogTile } from '@patternfly/react-catalog-view-extension';
-import RocketIcon from '@patternfly/react-icons/dist/esm/icons/rocket-icon';
 import { FallbackImg } from '@console/shared';
 import { QuickStart, QuickStartStatus } from '../utils/quick-start-types';
-import QuickStartTileHeader from './QuickStartTileHeader';
+import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
+import { camelize } from '../utils/quick-start-utils';
 import QuickStartTileDescription from './QuickStartTileDescription';
 import QuickStartTileFooter from './QuickStartTileFooter';
 import QuickStartTileFooterExternal from './QuickStartTileFooterExternal';
-import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
-import { camelize } from '../utils/quick-start-utils';
+import QuickStartTileHeader from './QuickStartTileHeader';
+import RocketIcon from '@patternfly/react-icons/dist/esm/icons/rocket-icon';
 
 import './QuickStartTile.scss';
 
diff --git a/packages/module/src/catalog/QuickStartTileDescription.tsx b/packages/module/src/catalog/QuickStartTileDescription.tsx
index 3b2649d0..8616b9b8 100644
--- a/packages/module/src/catalog/QuickStartTileDescription.tsx
+++ b/packages/module/src/catalog/QuickStartTileDescription.tsx
@@ -1,5 +1,4 @@
 import * as React from 'react';
-import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 import {
   Button,
   Popover,
@@ -8,6 +7,7 @@ import {
   TextListItem,
   TextVariants
 } from '@patternfly/react-core';
+import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 import InfoCircleIcon from '@patternfly/react-icons/dist/esm/icons/info-circle-icon';
 import QuickStartMarkdownView from '../QuickStartMarkdownView';
 
diff --git a/packages/module/src/catalog/QuickStartTileFooter.tsx b/packages/module/src/catalog/QuickStartTileFooter.tsx
index 35f419ae..b7bdacec 100644
--- a/packages/module/src/catalog/QuickStartTileFooter.tsx
+++ b/packages/module/src/catalog/QuickStartTileFooter.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Button, Flex, FlexItem } from '@patternfly/react-core';
-import { QuickStartStatus } from '../utils/quick-start-types';
 import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
+import { QuickStartStatus } from '../utils/quick-start-types';
 
 type QuickStartTileFooterProps = {
   quickStartId: string;
diff --git a/packages/module/src/catalog/QuickStartTileFooterExternal.tsx b/packages/module/src/catalog/QuickStartTileFooterExternal.tsx
index 8ee48ed0..def0497c 100644
--- a/packages/module/src/catalog/QuickStartTileFooterExternal.tsx
+++ b/packages/module/src/catalog/QuickStartTileFooterExternal.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Button, Flex, FlexItem } from '@patternfly/react-core';
-import ExternalLinkAltIcon from '@patternfly/react-icons/dist/esm/icons/external-link-alt-icon';
 import { QuickStartExternal } from '../utils/quick-start-types';
+import ExternalLinkAltIcon from '@patternfly/react-icons/dist/esm/icons/external-link-alt-icon';
 
 type QuickStartTileFooterProps = {
   link: QuickStartExternal;
diff --git a/packages/module/src/catalog/QuickStartTileHeader.tsx b/packages/module/src/catalog/QuickStartTileHeader.tsx
index da1ef546..0654ace1 100644
--- a/packages/module/src/catalog/QuickStartTileHeader.tsx
+++ b/packages/module/src/catalog/QuickStartTileHeader.tsx
@@ -1,10 +1,10 @@
+import './QuickStartTileHeader.scss';
 import * as React from 'react';
+import { Label, Title } from '@patternfly/react-core';
 import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
+import { QuickStartStatus, QuickStartType } from '../utils/quick-start-types';
 import { StatusIcon } from '@console/shared';
-import { Label, Title } from '@patternfly/react-core';
 import OutlinedClockIcon from '@patternfly/react-icons/dist/esm/icons/outlined-clock-icon';
-import { QuickStartStatus, QuickStartType } from '../utils/quick-start-types';
-import './QuickStartTileHeader.scss';
 
 type QuickStartTileHeaderProps = {
   status: string;
diff --git a/packages/module/src/catalog/Toolbar/QuickStartCatalogFilter.tsx b/packages/module/src/catalog/Toolbar/QuickStartCatalogFilter.tsx
index 981ae322..1555dde3 100644
--- a/packages/module/src/catalog/Toolbar/QuickStartCatalogFilter.tsx
+++ b/packages/module/src/catalog/Toolbar/QuickStartCatalogFilter.tsx
@@ -1,10 +1,10 @@
 import * as React from 'react';
-import { Toolbar, ToolbarContent, ToolbarProps } from '@patternfly/react-core';
 import {
   QuickStartCatalogFilterCountWrapper,
   QuickStartCatalogFilterSearchWrapper,
   QuickStartCatalogFilterStatusWrapper,
 } from './QuickStartCatalogFilterItems';
+import { Toolbar, ToolbarContent, ToolbarProps } from '@patternfly/react-core';
 
 import './QuickStartCatalogFilter.scss';
 
diff --git a/packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx b/packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx
index 50460b3e..627889e8 100644
--- a/packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx
+++ b/packages/module/src/catalog/Toolbar/QuickStartCatalogFilterItems.tsx
@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { QUICKSTART_SEARCH_FILTER_KEY, QUICKSTART_STATUS_FILTER_KEY } from '../../utils/const';
 import { QuickStartContext, QuickStartContextValues } from '../../utils/quick-start-context';
 import {
   SearchInput,
@@ -7,9 +8,8 @@ import {
   SelectVariant,
   ToolbarItem,
 } from '@patternfly/react-core';
-import { QUICKSTART_SEARCH_FILTER_KEY, QUICKSTART_STATUS_FILTER_KEY } from '../../utils/const';
-import { removeQueryArgument, setQueryArgument } from '@console/internal/components/utils';
 import { history } from '../../ConsoleInternal/components/utils/router';
+import { removeQueryArgument, setQueryArgument } from '@console/internal/components/utils';
 
 export const QuickStartCatalogFilterSearch = ({ searchInputText, handleTextChange, ...props }) => {
   const { getResource } = React.useContext<QuickStartContextValues>(QuickStartContext);
diff --git a/packages/module/src/controller/QuickStartConclusion.tsx b/packages/module/src/controller/QuickStartConclusion.tsx
index 2862f7fc..ae1bebcf 100644
--- a/packages/module/src/controller/QuickStartConclusion.tsx
+++ b/packages/module/src/controller/QuickStartConclusion.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 import { Button } from '@patternfly/react-core';
+import { QuickStart, QuickStartTask, QuickStartTaskStatus } from '../utils/quick-start-types';
+import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 import ArrowRightIcon from '@patternfly/react-icons/dist/esm/icons/arrow-right-icon';
 import QuickStartMarkdownView from '../QuickStartMarkdownView';
-import { QuickStart, QuickStartTask, QuickStartTaskStatus } from '../utils/quick-start-types';
 import TaskHeader from './QuickStartTaskHeader';
 
 type QuickStartConclusionProps = {
diff --git a/packages/module/src/controller/QuickStartContent.tsx b/packages/module/src/controller/QuickStartContent.tsx
index 16ae2691..67d6d7c8 100644
--- a/packages/module/src/controller/QuickStartContent.tsx
+++ b/packages/module/src/controller/QuickStartContent.tsx
@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { QuickStart, QuickStartTaskStatus } from '../utils/quick-start-types';
+import QuickStartConclusion from './QuickStartConclusion';
 import QuickStartIntroduction from './QuickStartIntroduction';
 import QuickStartTasks from './QuickStartTasks';
-import QuickStartConclusion from './QuickStartConclusion';
 
 import './QuickStartContent.scss';
 
diff --git a/packages/module/src/controller/QuickStartFooter.tsx b/packages/module/src/controller/QuickStartFooter.tsx
index 54486fba..02eae903 100644
--- a/packages/module/src/controller/QuickStartFooter.tsx
+++ b/packages/module/src/controller/QuickStartFooter.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Button } from '@patternfly/react-core';
-import { QuickStartStatus } from '../utils/quick-start-types';
 import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
+import { QuickStartStatus } from '../utils/quick-start-types';
 import { camelize } from '../utils/quick-start-utils';
 
 import './QuickStartFooter.scss';
diff --git a/packages/module/src/controller/QuickStartIntroduction.tsx b/packages/module/src/controller/QuickStartIntroduction.tsx
index 8683bc83..bde75ad2 100644
--- a/packages/module/src/controller/QuickStartIntroduction.tsx
+++ b/packages/module/src/controller/QuickStartIntroduction.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
-import QuickStartMarkdownView from '../QuickStartMarkdownView';
 import { QuickStartTask, QuickStartTaskStatus } from '../utils/quick-start-types';
+import QuickStartMarkdownView from '../QuickStartMarkdownView';
 import TaskHeader from './QuickStartTaskHeader';
 
 type QuickStartIntroductionProps = {
diff --git a/packages/module/src/controller/QuickStartTaskHeader.tsx b/packages/module/src/controller/QuickStartTaskHeader.tsx
index b182b736..9cccf719 100644
--- a/packages/module/src/controller/QuickStartTaskHeader.tsx
+++ b/packages/module/src/controller/QuickStartTaskHeader.tsx
@@ -1,12 +1,12 @@
 import * as React from 'react';
-import cx from 'classnames';
 import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
-import { Title, WizardNavItem } from '@patternfly/react-core';
-import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
-import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
 import { QuickStartTaskStatus } from '../utils/quick-start-types';
+import { Title, WizardNavItem } from '@patternfly/react-core';
 import { markdownConvert } from '../ConsoleInternal/components/markdown-view';
 import { removeParagraphWrap } from '../QuickStartMarkdownView';
+import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
+import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
+import cx from 'classnames';
 
 import './QuickStartTaskHeader.scss';
 
diff --git a/packages/module/src/controller/QuickStartTaskReview.tsx b/packages/module/src/controller/QuickStartTaskReview.tsx
index 94133559..b0955640 100644
--- a/packages/module/src/controller/QuickStartTaskReview.tsx
+++ b/packages/module/src/controller/QuickStartTaskReview.tsx
@@ -1,9 +1,9 @@
 import * as React from 'react';
-import cx from 'classnames';
-import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 import { Alert, Radio } from '@patternfly/react-core';
-import QuickStartMarkdownView from '../QuickStartMarkdownView';
+import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 import { QuickStartTaskReview, QuickStartTaskStatus } from '../utils/quick-start-types';
+import QuickStartMarkdownView from '../QuickStartMarkdownView';
+import cx from 'classnames';
 
 import './QuickStartTaskReview.scss';
 
diff --git a/packages/module/src/controller/QuickStartTasks.tsx b/packages/module/src/controller/QuickStartTasks.tsx
index 6a9e1bc1..feb543c8 100644
--- a/packages/module/src/controller/QuickStartTasks.tsx
+++ b/packages/module/src/controller/QuickStartTasks.tsx
@@ -1,10 +1,10 @@
 import * as React from 'react';
-import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
-import QuickStartMarkdownView from '../QuickStartMarkdownView';
 import { QUICKSTART_TASKS_INITIAL_STATES } from '../utils/const';
+import { QuickStartContext, QuickStartContextValues } from '../utils/quick-start-context';
 import { QuickStartTask, QuickStartTaskStatus } from '../utils/quick-start-types';
-import TaskHeader from './QuickStartTaskHeader';
+import QuickStartMarkdownView from '../QuickStartMarkdownView';
 import QuickStartTaskReview from './QuickStartTaskReview';
+import TaskHeader from './QuickStartTaskHeader';
 
 type QuickStartTaskProps = {
   tasks: QuickStartTask[];
diff --git a/packages/module/src/data/quick-start-test-data.ts b/packages/module/src/data/quick-start-test-data.ts
index 4cec0b2b..73085943 100644
--- a/packages/module/src/data/quick-start-test-data.ts
+++ b/packages/module/src/data/quick-start-test-data.ts
@@ -1,7 +1,7 @@
+import { QuickStart } from '@patternfly/quickstarts';
 import { explorePipelinesQuickStart } from './mocks/json/explore-pipeline-quickstart';
 import { exploreServerlessQuickStart } from './mocks/json/explore-serverless-quickstart';
 import { monitorSampleAppQuickStart } from './mocks/json/monitor-sampleapp-quickstart';
-import { QuickStart } from '@patternfly/quickstarts';
 
 export const allQuickStarts: QuickStart[] = [
   explorePipelinesQuickStart,
diff --git a/packages/module/src/utils/quick-start-context.tsx b/packages/module/src/utils/quick-start-context.tsx
index b7a063d2..3bb54761 100644
--- a/packages/module/src/utils/quick-start-context.tsx
+++ b/packages/module/src/utils/quick-start-context.tsx
@@ -1,4 +1,3 @@
-import React, { createContext, useCallback } from 'react';
 import {
   AllQuickStartStates,
   QuickStart,
@@ -6,15 +5,16 @@ import {
   QuickStartStatus,
   QuickStartTaskStatus,
 } from './quick-start-types';
-import { removeQueryArgument, setQueryArgument } from '../ConsoleInternal/components/utils/router';
 import {
   QUICKSTART_ID_FILTER_KEY,
-  QUICKSTART_TASKS_INITIAL_STATES,
   QUICKSTART_SEARCH_FILTER_KEY,
   QUICKSTART_STATUS_FILTER_KEY,
+  QUICKSTART_TASKS_INITIAL_STATES,
 } from './const';
-import { getTaskStatusKey, getQuickStartStatusCount } from './quick-start-utils';
+import { getQuickStartStatusCount, getTaskStatusKey } from './quick-start-utils';
+import { removeQueryArgument, setQueryArgument } from '../ConsoleInternal/components/utils/router';
 import PluralResolver from './PluralResolver';
+import React, { createContext, useCallback } from 'react';
 import en from '../locales/en/quickstart.json';
 
 const pluralResolver = new PluralResolver({ simplifyPluralSuffix: true });
@@ -50,8 +50,8 @@ export type QuickStartContextValues = {
   resourceBundle?: any;
   setResourceBundle?: any;
   getResource?: any;
-  lng?: string;
-  setLng?: any;
+  language?: string;
+  setLanguage?: any;
   filter?: {
     keyword?: string;
     status?: {
@@ -73,7 +73,7 @@ export const QuickStartContextDefaults = {
   restartQuickStart: () => {},
   resourceBundle: en,
   getResource: () => '',
-  lng: 'en',
+  language: 'en',
   useQueryParams: true,
   setFilter: () => {},
 };
@@ -82,7 +82,7 @@ export const QuickStartContext = createContext<QuickStartContextValues>(QuickSta
 export const getResource = (resource: string, options: any, resourceBundle: any, lng: string) => {
   if (options && options.count) {
     const suffix = pluralResolver.getSuffix(lng, options.count);
-    if (suffix) {
+    if (suffix && resourceBundle[`${resource}_${suffix}`]) {
       // needs plural
       return resourceBundle[`${resource}_${suffix}`];
     }
@@ -110,18 +110,16 @@ export const useValuesForQuickStartContext = (
     ...en,
     ...combinedValue.resourceBundle,
   });
-  const [lng, setLng] = React.useState(combinedValue.lng || 'en');
-  const changeResourceBundle = (resourceBundle: any) => {
+  const [language, setLanguage] = React.useState(combinedValue.language || 'en');
+  const changeResourceBundle = (resourceBundle: any, language?: string) => {
+    language && setLanguage(language);
     setResourceBundle({
       ...en,
       ...resourceBundle,
     });
   };
-  const changeLng = (lng: string) => {
-    setLng(lng);
-  };
   const findResource = (resource: string, count?: number) => {
-    return getResource(resource, count !== undefined ? { count } : null, resourceBundle, lng);
+    return getResource(resource, count !== undefined ? { count } : null, resourceBundle, language);
   };
 
   const initialSearchParams = new URLSearchParams(window.location.search);
@@ -381,8 +379,8 @@ export const useValuesForQuickStartContext = (
     setAllQuickStarts: updateAllQuickStarts,
     resourceBundle,
     setResourceBundle: changeResourceBundle,
-    lng,
-    setLng: changeLng,
+    language,
+    setLanguage,
     getResource: findResource,
     filter: {
       keyword: filterKeyword,
diff --git a/yarn.lock b/yarn.lock
index cf5ed2ee..e3c986f0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -752,13 +752,6 @@
   dependencies:
     source-map "^0.6.1"
 
-"@types/victory@^33.1.4":
-  version "33.1.4"
-  resolved "https://registry.yarnpkg.com/@types/victory/-/victory-33.1.4.tgz#b843b7cee8ed1ab846d4dd03eb048a178e197b4c"
-  integrity sha512-y0uROW9/p2ltaZW+VcH1llrtu6Uwp1lSJ8zZbVjcXJJgddU3Is2aUvU6PxFQhbjBMtjaqNdw1tH/44c5bn/Zsw==
-  dependencies:
-    "@types/react" "*"
-
 "@types/webpack-sources@*":
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/@types/webpack-sources/-/webpack-sources-2.1.0.tgz#8882b0bd62d1e0ce62f183d0d01b72e6e82e8c10"
@@ -4165,6 +4158,11 @@ eslint-plugin-react@^7.21.4:
     resolve "^2.0.0-next.3"
     string.prototype.matchall "^4.0.5"
 
+eslint-plugin-sort-imports-es6-autofix@^0.6.0:
+  version "0.6.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-sort-imports-es6-autofix/-/eslint-plugin-sort-imports-es6-autofix-0.6.0.tgz#b8cd8639d7a54cefce6b17898b102fd5ec31e52b"
+  integrity sha512-2NVaBGF9NN+727Fyq+jJYihdIeegjXeUUrZED9Q8FVB8MsV3YQEyXG96GVnXqWt0pmn7xfCZOZf3uKnIhBrfeQ==
+
 eslint-scope@5.1.1, eslint-scope@^5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-5.1.1.tgz#e786e59a66cb92b3f6c1fb0d508aab174848f48c"
@@ -4554,7 +4552,7 @@ fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
   resolved "https://registry.yarnpkg.com/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
   integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==
 
-fast-glob@^3.0.3, fast-glob@^3.1.1, fast-glob@^3.2.4:
+fast-glob@^3.1.1, fast-glob@^3.2.4:
   version "3.2.5"
   resolved "https://registry.yarnpkg.com/fast-glob/-/fast-glob-3.2.5.tgz#7939af2a656de79a4f1901903ee8adcaa7cb9661"
   integrity sha512-2DtFcgT68wiTTiwZ2hNdJfcHNke9XOfnwmBRWXhmeKM8rF0TGwmC/Qto3S7RoZKp5cilZbxzO5iTNTQsJ+EeDg==
@@ -4636,11 +4634,6 @@ file-selector@^0.1.8:
   dependencies:
     tslib "^2.0.1"
 
-file-type@^12.0.0:
-  version "12.4.2"
-  resolved "https://registry.yarnpkg.com/file-type/-/file-type-12.4.2.tgz#a344ea5664a1d01447ee7fb1b635f72feb6169d9"
-  integrity sha512-UssQP5ZgIOKelfsaB5CuGAL+Y+q7EmONuiwF3N5HAH0t27rvrttgi6Ra9k/+DVaY9UF6+ybxu5pOXLUdA8N7Vg==
-
 file-uri-to-path@1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/file-uri-to-path/-/file-uri-to-path-1.0.0.tgz#553a7b8446ff6f684359c445f1e37a05dacc33dd"
@@ -5224,20 +5217,6 @@ globals@^9.18.0:
   resolved "https://registry.yarnpkg.com/globals/-/globals-9.18.0.tgz#aa3896b3e69b487f17e31ed2143d69a8e30c2d8a"
   integrity sha512-S0nG3CLEQiY/ILxqtztTWH/3iRRdyBLw6KMDxnKMchrtbj2OFmehVh0WUCfW3DUrIgx/qFrJPICrq4Z4sTR9UQ==
 
-globby@^10.0.0:
-  version "10.0.2"
-  resolved "https://registry.yarnpkg.com/globby/-/globby-10.0.2.tgz#277593e745acaa4646c3ab411289ec47a0392543"
-  integrity sha512-7dUi7RvCoT/xast/o/dLN53oqND4yk0nsHkhRgn9w65C4PofCLOoJ39iSOg+qVDdWQPIEj+eszMHQ+aLVwwQSg==
-  dependencies:
-    "@types/glob" "^7.1.1"
-    array-union "^2.1.0"
-    dir-glob "^3.0.1"
-    fast-glob "^3.0.3"
-    glob "^7.1.3"
-    ignore "^5.1.1"
-    merge2 "^1.2.3"
-    slash "^3.0.0"
-
 globby@^11.0.1, globby@^11.0.3:
   version "11.0.3"
   resolved "https://registry.yarnpkg.com/globby/-/globby-11.0.3.tgz#9b1f0cb523e171dd1ad8c7b2a9fb4b644b9593cb"
@@ -5275,7 +5254,7 @@ google-code-prettify@~1.0.5:
   resolved "https://registry.yarnpkg.com/google-code-prettify/-/google-code-prettify-1.0.5.tgz#9f477f224dbfa62372e5ef803a7e157410400084"
   integrity sha1-n0d/Ik2/piNy5e+AOn4VdBBAAIQ=
 
-graceful-fs@^4.0.0, graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.2, graceful-fs@^4.2.3, graceful-fs@^4.2.4:
+graceful-fs@^4.0.0, graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.3, graceful-fs@^4.2.4:
   version "4.2.6"
   resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.6.tgz#ff040b2b0853b23c3d31027523706f1885d76bee"
   integrity sha512-nTnJ528pbqxYanhpDYsi4Rd8MAeaBA67+RZ10CM1m3bTAVFEDcd5AuA4a6W5YkGZ1iNXHzZz8T6TBKLeBuNriQ==
@@ -5798,24 +5777,11 @@ ignore@^4.0.6:
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc"
   integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg==
 
-ignore@^5.1.1, ignore@^5.1.4:
+ignore@^5.1.4:
   version "5.1.8"
   resolved "https://registry.yarnpkg.com/ignore/-/ignore-5.1.8.tgz#f150a8b50a34289b33e22f5889abd4d8016f0e57"
   integrity sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw==
 
-imagemin@^7.0.0:
-  version "7.0.1"
-  resolved "https://registry.yarnpkg.com/imagemin/-/imagemin-7.0.1.tgz#f6441ca647197632e23db7d971fffbd530c87dbf"
-  integrity sha512-33AmZ+xjZhg2JMCe+vDf6a9mzWukE7l+wAtesjE7KyteqqKjzxv7aVQeWnul1Ve26mWvEQqyPwl0OctNBfSR9w==
-  dependencies:
-    file-type "^12.0.0"
-    globby "^10.0.0"
-    graceful-fs "^4.2.2"
-    junk "^3.1.0"
-    make-dir "^3.0.0"
-    p-pipe "^3.0.0"
-    replace-ext "^1.0.0"
-
 import-fresh@^3.0.0, import-fresh@^3.2.1:
   version "3.3.0"
   resolved "https://registry.yarnpkg.com/import-fresh/-/import-fresh-3.3.0.tgz#37162c25fcb9ebaa2e6e53d5b4d88ce17d9e0c2b"
@@ -7004,11 +6970,6 @@ jsprim@^1.2.2:
     array-includes "^3.1.2"
     object.assign "^4.1.2"
 
-junk@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/junk/-/junk-3.1.0.tgz#31499098d902b7e98c5d9b9c80f43457a88abfa1"
-  integrity sha512-pBxcB3LFc8QVgdggvZWyeys+hnrNWg4OcZIU/1X59k5jQdLBlCsYGRQaz234SqoRLTCgMH00fY0xRJH+F9METQ==
-
 keygrip@~1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/keygrip/-/keygrip-1.1.0.tgz#871b1681d5e159c62a445b0c74b615e0917e7226"
@@ -7648,7 +7609,7 @@ make-dir@^2.0.0:
     pify "^4.0.1"
     semver "^5.6.0"
 
-make-dir@^3.0.0, make-dir@^3.0.2:
+make-dir@^3.0.2:
   version "3.1.0"
   resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-3.1.0.tgz#415e967046b3a7f1d185277d84aa58203726a13f"
   integrity sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==
@@ -7760,7 +7721,7 @@ merge-stream@^2.0.0:
   resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"
   integrity sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==
 
-merge2@^1.2.3, merge2@^1.3.0:
+merge2@^1.3.0:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
   integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==
@@ -8724,11 +8685,6 @@ p-map@^4.0.0:
   dependencies:
     aggregate-error "^3.0.0"
 
-p-pipe@^3.0.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/p-pipe/-/p-pipe-3.1.0.tgz#48b57c922aa2e1af6a6404cb7c6bf0eb9cc8e60e"
-  integrity sha512-08pj8ATpzMR0Y80x50yJHn37NF6vjrqHutASaX5LiH5npS9XPvrUmscd9MF5R4fuYRHOxQR1FfMIlF7AzwoPqw==
-
 p-retry@^3.0.1:
   version "3.0.1"
   resolved "https://registry.yarnpkg.com/p-retry/-/p-retry-3.0.1.tgz#316b4c8893e2c8dc1cfa891f406c4b422bebf328"
@@ -9256,7 +9212,7 @@ prop-types-extra@^1.1.0:
     react-is "^16.3.2"
     warning "^4.0.0"
 
-prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
+prop-types@^15.6.2, prop-types@^15.7.2:
   version "15.7.2"
   resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
   integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==