diff --git a/src/components/organisms/ActionsPane/ActionsPaneHeader.tsx b/src/components/organisms/ActionsPane/ActionsPaneHeader.tsx index f46348e636..191d61e7ce 100644 --- a/src/components/organisms/ActionsPane/ActionsPaneHeader.tsx +++ b/src/components/organisms/ActionsPane/ActionsPaneHeader.tsx @@ -1,6 +1,6 @@ -import {useCallback, useMemo} from 'react'; +import {useCallback, useMemo, useState} from 'react'; -import {Button, Dropdown, Modal, Tooltip} from 'antd'; +import {Button, Dropdown, Tooltip} from 'antd'; import {LeftOutlined, RightOutlined} from '@ant-design/icons'; @@ -21,6 +21,7 @@ import {runPreviewConfiguration} from '@redux/thunks/runPreviewConfiguration'; import {selectFromHistory} from '@redux/thunks/selectFromHistory'; import {TitleBarWrapper} from '@components/atoms'; +import {HelmChartModalConfirmWithNamespaceSelect} from '@components/molecules'; import {useRefSelector} from '@utils/hooks'; @@ -50,6 +51,8 @@ const ActionsPaneHeader: React.FC = props => { const selectedHelmConfig = useAppSelector(selectedHelmConfigSelector); const selectedImage = useAppSelector(selectedImageSelector); + const [isHelmChartApplyModalVisible, setIsHelmChartApplyModalVisible] = useState(false); + const onClickEditPreviewConfiguration = useCallback(() => { if (!selectedHelmConfig) { return; @@ -74,18 +77,23 @@ const ActionsPaneHeader: React.FC = props => { dispatch(startPreview({type: 'helm-config', configId: selectedHelmConfig.id})); }, [dispatch, selectedHelmConfig]); - const onClickInstallPreviewConfiguration = useCallback(() => { - Modal.confirm({ - title: 'Install Helm Chart', - content: `Are you sure you want to install the ${selectedHelmConfig?.name} configuration to the cluster?`, - onOk: () => { - if (!selectedHelmConfig) { - return; - } - dispatch(runPreviewConfiguration({helmConfigId: selectedHelmConfig.id, performDeploy: true})); - }, - }); - }, [dispatch, selectedHelmConfig]); + const onConfirmInstallPreviewConfiguration = useCallback( + (selectedNamespace?: string, shouldCreateNamespace?: boolean) => { + if (!selectedHelmConfig) { + return; + } + dispatch( + runPreviewConfiguration({ + helmConfigId: selectedHelmConfig.id, + performDeploy: true, + selectedNamespace, + shouldCreateNamespace, + }) + ); + setIsHelmChartApplyModalVisible(false); + }, + [dispatch, selectedHelmConfig] + ); const onClickLeftArrow = useCallback(() => { dispatch(selectFromHistory('left')); @@ -135,6 +143,14 @@ const ActionsPaneHeader: React.FC = props => { if (selectedHelmConfig) { return ( + { + setIsHelmChartApplyModalVisible(false); + }} + /> = props => { title={InstallPreviewConfigurationTooltip} placement="bottomLeft" > - diff --git a/src/redux/thunks/runPreviewConfiguration.ts b/src/redux/thunks/runPreviewConfiguration.ts index 9a7590dbcf..0f06354b98 100644 --- a/src/redux/thunks/runPreviewConfiguration.ts +++ b/src/redux/thunks/runPreviewConfiguration.ts @@ -36,12 +36,15 @@ export const runPreviewConfiguration = createAsyncThunk< { helmConfigId: string; performDeploy?: boolean; + selectedNamespace?: string; + shouldCreateNamespace?: boolean; }, { dispatch: AppDispatch; state: RootState; } ->('main/runPreviewConfiguration', async ({helmConfigId, performDeploy}, thunkAPI) => { +>('main/runPreviewConfiguration', async (props, thunkAPI) => { + const {helmConfigId, performDeploy, selectedNamespace, shouldCreateNamespace} = props; const startTime = new Date().getTime(); const configState = thunkAPI.getState().config; const mainState = thunkAPI.getState().main; @@ -133,6 +136,16 @@ export const runPreviewConfiguration = createAsyncThunk< env: {KUBECONFIG: kubeconfig.path}, }; + if (selectedNamespace) { + if (!commandOptions.args.some(arg => arg.includes('--namespace'))) { + commandOptions.args.push(...['--namespace', selectedNamespace]); + } + + if (shouldCreateNamespace && !commandOptions.args.some(arg => arg.includes('--create-namespace'))) { + commandOptions.args.push('--create-namespace'); + } + } + const result = await runCommandInMainThread(commandOptions); if (result.error || result.stderr) {