-
+
{groupedVersions.map((group) => {
return ;
})}
diff --git a/app/scripts/modules/core/src/presentation/hooks/index.ts b/app/scripts/modules/core/src/presentation/hooks/index.ts
index 05b748b19f5..b6b686031ba 100644
--- a/app/scripts/modules/core/src/presentation/hooks/index.ts
+++ b/app/scripts/modules/core/src/presentation/hooks/index.ts
@@ -17,3 +17,4 @@ export * from './useObservable.hook';
export * from './useObservableValue.hook';
export * from './usePollingData.hook';
export * from './usePrevious.hook';
+export * from './useShowModal.hook';
diff --git a/app/scripts/modules/core/src/presentation/hooks/useShowModal.hook.ts b/app/scripts/modules/core/src/presentation/hooks/useShowModal.hook.ts
new file mode 100644
index 00000000000..03059e4b11b
--- /dev/null
+++ b/app/scripts/modules/core/src/presentation/hooks/useShowModal.hook.ts
@@ -0,0 +1,19 @@
+import React from 'react';
+import { IModalProps, showModal } from '../modal';
+import { IModalComponentProps } from '../modal/showModal';
+import { useApplicationContext } from './useApplicationContext.hook';
+
+export const useShowModal = () => {
+ const app = useApplicationContext();
+ const showModalWithApp = React.useCallback(
+ (
+ ModalComponent: React.ComponentType
>,
+ componentProps?: P,
+ modalProps?: Omit,
+ ) => {
+ showModal(ModalComponent, componentProps, modalProps, app);
+ },
+ [showModal, app],
+ );
+ return showModalWithApp;
+};
diff --git a/app/scripts/modules/core/src/presentation/modal/showModal.tsx b/app/scripts/modules/core/src/presentation/modal/showModal.tsx
index d2a5c48ccc9..c62747b0cc5 100644
--- a/app/scripts/modules/core/src/presentation/modal/showModal.tsx
+++ b/app/scripts/modules/core/src/presentation/modal/showModal.tsx
@@ -2,6 +2,8 @@ import { UIRouterContextComponent } from '@uirouter/react-hybrid';
import React from 'react';
import ReactDOM from 'react-dom';
+import { Application, ApplicationContextProvider } from 'core/application';
+
import { IModalProps, Modal } from './Modal';
/** The Modal content Component will be passed these two props */
@@ -51,6 +53,7 @@ export const showModal = (
ModalComponent: React.ComponentType
>,
componentProps?: P,
modalProps?: Omit,
+ application?: Application,
): Promise> =>
new Promise>((resolve) => {
let mountNode = document.createElement('div');
@@ -81,11 +84,14 @@ export const showModal = (
const handleRequestClose = () => handleDismiss(null);
function render() {
+ const content = (
+
+
+
+ );
ReactDOM.render(
-
-
-
+ {application ? {content} : content}
,
mountNode,
);