Skip to content

Commit 3fc2269

Browse files
committed
chore: fix review comments
1 parent 591a513 commit 3fc2269

File tree

14 files changed

+130
-127
lines changed

14 files changed

+130
-127
lines changed

.env

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,3 +73,4 @@ FEATURE_MANAGE_TRAFFIC_ENABLE=false
7373
FEATURE_REDFISH_NODE_ENABLE=false
7474
FEATURE_INFRA_PROVISION_INFO_BLOCK_HIDE=false
7575
FEATURE_FLUX_DEPLOYMENTS_ENABLE=false
76+
FEATURE_LINK_EXTERNAL_FLUX_ENABLE=false

config.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,5 +51,6 @@
5151
| SENTRY_RELEASE_VERSION | | Sentry release Version |
5252
| LOGIN_PAGE_IMAGE | | Login page image url |
5353
| FEATURE_FLUX_DEPLOYMENTS_ENABLE | false | Enables flux cd deployment type for devtron apps and devtron charts |
54+
| FEATURE_LINK_EXTERNAL_FLUX_ENABLE | false | Enables external flux cd migration |
5455

5556
# DASHBOARD CONFIG SECRET

src/components/app/list-new/AppListService.ts

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ import { Moment12HourFormat, Routes } from '../../../config'
3030
import {
3131
AppListFilterConfig,
3232
AppListPayloadType,
33+
FluxCDTemplateType,
3334
GenericAppListResponse,
3435
GenericAppType,
3536
GetDevtronHelmAppListParamsType,
@@ -123,7 +124,18 @@ export const getDevtronAppListDataToExport = (
123124
})
124125
}
125126

126-
export const getFluxInstalledExternalApps = (clusterIdsCsv: string, options?: APIOptions) => {
127+
export const getFluxInstalledExternalApps = async (
128+
clusterIdsCsv: string,
129+
options?: APIOptions,
130+
templateType?: FluxCDTemplateType,
131+
): Promise<ResponseType<GenericAppType[]>> => {
127132
const url = getUrlWithSearchParams(Routes.FLUX_APPS, { clusterIds: clusterIdsCsv, noStream: true })
128-
return get<GenericAppListResponse>(url, options)
133+
const response = await get<GenericAppListResponse>(url, options)
134+
const appList = response.result?.fluxApplication ?? []
135+
return {
136+
...response,
137+
result: templateType
138+
? appList.filter(({ fluxAppDeploymentType }) => fluxAppDeploymentType === templateType)
139+
: appList,
140+
}
129141
}

src/components/cdPipeline/BuildCD.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ import { EnvironmentWithSelectPickerType } from '@Components/CIPipelineN/types'
6363
import { BuildCDProps } from './types'
6464
import { MigrateToDevtron } from './MigrateToDevtron'
6565
import TriggerTypeRadio from './TriggerTypeRadio'
66-
import { getDeploymentAppTypeLabel } from './MigrateToDevtron/utils'
66+
import { DEPLOYMENT_APP_TYPE_LABEL } from './MigrateToDevtron/constants'
6767

6868
const VirtualEnvSelectionInfoText = importComponentFromFELibrary('VirtualEnvSelectionInfoText')
6969
const HelmManifestPush = importComponentFromFELibrary('HelmManifestPush')
@@ -776,7 +776,7 @@ export default function BuildCD({
776776
<ICInfo className="dc__no-shrink icon-dim-20 dc__no-shrink" />
777777
<span className="fs-13 fw-4 lh-20 cn-9 dc__word-break">
778778
This deployment pipeline was linked to&nbsp;
779-
{getDeploymentAppTypeLabel(formData.deploymentAppType as DeploymentAppTypes)}
779+
{DEPLOYMENT_APP_TYPE_LABEL[formData.deploymentAppType as DeploymentAppTypes]}
780780
&nbsp;: {formData.deploymentAppName}
781781
</span>
782782
</div>

src/components/cdPipeline/CDPipeline.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -90,6 +90,7 @@ import {
9090
import {
9191
calculateLastStepDetailsLogic,
9292
checkUniqueness,
93+
getIsExternalAppLinkable,
9394
getMigrateToDevtronRequiredPayload,
9495
handleDeleteCDNodePipeline,
9596
validateTask,
@@ -109,7 +110,6 @@ import {
109110
import { BuildCDProps, CDPipelineProps, DeleteDialogType, ForceDeleteMessageType } from './types'
110111
import { MIGRATE_TO_DEVTRON_FORM_STATE } from './constants'
111112
import { getConfigureGitOpsCredentialsButtonProps } from '@Components/workflowEditor/ConfigureGitopsInfoBlock'
112-
import { getIsExternalAppLinkable } from './MigrateToDevtron/utils'
113113

114114
const DeploymentWindowConfirmationDialog = importComponentFromFELibrary('DeploymentWindowConfirmationDialog')
115115
const processPluginData: (params: ProcessPluginDataParamsType) => Promise<ProcessPluginDataReturnType> =
@@ -1219,7 +1219,7 @@ export default function CDPipeline({
12191219
>
12201220
Advanced options
12211221
{mandatoryPluginData && (!mandatoryPluginData.isValidPre || !mandatoryPluginData.isValidPost) && (
1222-
<Icon name='ic-warning' color='Y700' />
1222+
<Icon name="ic-warning" color="Y700" />
12231223
)}
12241224
</button>
12251225
)

src/components/cdPipeline/MigrateToDevtron/MigrateToDevtron.component.tsx

Lines changed: 37 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -42,19 +42,16 @@ import {
4242
import TriggerTypeRadio from '../TriggerTypeRadio'
4343
import ClusterSelect from './ClusterSelect'
4444
import {
45+
DEPLOYMENT_APP_TYPE_LABEL,
4546
GENERIC_SECTION_ERROR_STATE_COMMON_PROPS,
4647
MIGRATE_FROM_CLUSTER_APP_SELECT_CONFIG,
4748
MIGRATE_FROM_RADIO_GROUP_CONFIG,
49+
SELECTED_FORM_STATE_KEY,
4850
} from './constants'
4951
import MigrateToDevtronValidationFactory from './MigrateToDevtronValidationFactory'
5052
import { getMigrateAppOptions, validateMigrationSource } from './service'
5153
import { ClusterSelectProps, MigrateToDevtronProps, SelectMigrateAppOptionType } from './types'
52-
import {
53-
generateMigrateAppOption,
54-
getDeploymentAppTypeLabel,
55-
getSelectedFormState,
56-
sanitizeValidateMigrationSourceResponse,
57-
} from './utils'
54+
import { generateMigrateAppOption, sanitizeValidateMigrationSourceResponse } from './utils'
5855

5956
const SelectMigrateFromRadio = ({ deploymentAppType }: Pick<MigrateToDevtronFormState, 'deploymentAppType'>) => {
6057
const { title, tooltipContent } = MIGRATE_FROM_RADIO_GROUP_CONFIG[deploymentAppType]
@@ -83,6 +80,7 @@ const MigrateToDevtron = ({ migrateToDevtronFormState, setMigrateToDevtronFormSt
8380
isSuperAdmin,
8481
featureGitOpsFlags: { isFeatureArgoCdMigrationEnabled },
8582
} = useMainContext()
83+
const isFeatureFluxCdMigrationEnabled = window._env_.FEATURE_LINK_EXTERNAL_FLUX_ENABLE
8684
const migrateAppOptionsControllerRef = useRef<AbortController>(new AbortController())
8785
const validateMigrationSourceControllerRef = useRef<AbortController>(new AbortController())
8886

@@ -92,7 +90,7 @@ const MigrateToDevtron = ({ migrateToDevtronFormState, setMigrateToDevtronFormSt
9290
const isMigratingFromArgo = deploymentAppType === DeploymentAppTypes.ARGO
9391
const isMigratingFromFlux = deploymentAppType === DeploymentAppTypes.FLUX
9492

95-
const selectedFormState = getSelectedFormState(migrateToDevtronFormState)
93+
const selectedFormState = migrateToDevtronFormState[SELECTED_FORM_STATE_KEY[deploymentAppType]]
9694

9795
const { clusterId, clusterName, appName, namespace, validationResponse, appIcon } = selectedFormState
9896
const { isLinkable } = validationResponse || {}
@@ -233,37 +231,25 @@ const MigrateToDevtron = ({ migrateToDevtronFormState, setMigrateToDevtronFormSt
233231
return
234232
}
235233

234+
const appInfo = {
235+
appName: appOption.value.appName,
236+
namespace: appOption.value.namespace,
237+
appIcon: appOption.startIcon,
238+
}
239+
236240
setMigrateToDevtronFormState((prevState) => ({
237241
...prevState,
238242
migrateFromArgoFormState: {
239243
...prevState.migrateFromArgoFormState,
240-
...(isMigratingFromArgo
241-
? {
242-
appName: appOption.value.appName,
243-
namespace: appOption.value.namespace,
244-
appIcon: appOption.startIcon,
245-
}
246-
: {}),
244+
...(isMigratingFromArgo ? appInfo : {}),
247245
},
248246
migrateFromHelmFormState: {
249247
...prevState.migrateFromHelmFormState,
250-
...(isMigratingFromHelm
251-
? {
252-
appName: appOption.value.appName,
253-
namespace: appOption.value.namespace,
254-
appIcon: appOption.startIcon,
255-
}
256-
: {}),
248+
...(isMigratingFromHelm ? appInfo : {}),
257249
},
258250
migrateFromFluxFormState: {
259251
...prevState.migrateFromFluxFormState,
260-
...(isMigratingFromFlux
261-
? {
262-
appName: appOption.value.appName,
263-
namespace: appOption.value.namespace,
264-
appIcon: appOption.startIcon,
265-
}
266-
: {}),
252+
...(isMigratingFromFlux ? appInfo : {}),
267253
},
268254
}))
269255
}
@@ -298,22 +284,26 @@ const MigrateToDevtron = ({ migrateToDevtronFormState, setMigrateToDevtronFormSt
298284

299285
return (
300286
<div className="flexbox-col dc__gap-20">
301-
<div className="flexbox-col dc__gap-8">
302-
<span className="cn-7 fs-13 fw-4 lh-20">Select type of application to migrate</span>
303-
304-
<RadioGroup
305-
className="radio-group-no-border migrate-to-devtron__deployment-app-type-radio-group"
306-
value={deploymentAppType}
307-
name="migrate-from-app-type"
308-
onChange={handleMigrateFromAppTypeChange}
309-
>
310-
<SelectMigrateFromRadio deploymentAppType={DeploymentAppTypes.HELM} />
311-
{isFeatureArgoCdMigrationEnabled && (
312-
<SelectMigrateFromRadio deploymentAppType={DeploymentAppTypes.ARGO} />
313-
)}
314-
<SelectMigrateFromRadio deploymentAppType={DeploymentAppTypes.FLUX} />
315-
</RadioGroup>
316-
</div>
287+
{(isFeatureArgoCdMigrationEnabled || isFeatureFluxCdMigrationEnabled) && (
288+
<div className="flexbox-col dc__gap-8">
289+
<span className="cn-7 fs-13 fw-4 lh-20">Select type of application to migrate</span>
290+
291+
<RadioGroup
292+
className="radio-group-no-border migrate-to-devtron__deployment-app-type-radio-group"
293+
value={deploymentAppType}
294+
name="migrate-from-app-type"
295+
onChange={handleMigrateFromAppTypeChange}
296+
>
297+
<SelectMigrateFromRadio deploymentAppType={DeploymentAppTypes.HELM} />
298+
{isFeatureArgoCdMigrationEnabled && (
299+
<SelectMigrateFromRadio deploymentAppType={DeploymentAppTypes.ARGO} />
300+
)}
301+
{isFeatureFluxCdMigrationEnabled && (
302+
<SelectMigrateFromRadio deploymentAppType={DeploymentAppTypes.FLUX} />
303+
)}
304+
</RadioGroup>
305+
</div>
306+
)}
317307

318308
<div className="flexbox dc__gap-8 dc__align-end">
319309
<ClusterSelect
@@ -331,7 +321,7 @@ const MigrateToDevtron = ({ migrateToDevtronFormState, setMigrateToDevtronFormSt
331321
classNamePrefix="migrate-from-source-app-select"
332322
label={appSelectLabel}
333323
placeholder={appSelectPlaceholder}
334-
disabledTippyContent={`Select a cluster to view and select ${getDeploymentAppTypeLabel(deploymentAppType)} in that cluster`}
324+
disabledTippyContent={`Select a cluster to view and select ${DEPLOYMENT_APP_TYPE_LABEL[deploymentAppType]} in that cluster`}
335325
icon={icon}
336326
isDisabled={!clusterId}
337327
isLoading={isLoadingAppListOptions}
@@ -368,13 +358,13 @@ const MigrateToDevtron = ({ migrateToDevtronFormState, setMigrateToDevtronFormSt
368358
color: 'N700',
369359
}}
370360
title="Checking compatibility"
371-
subTitle={`Checking if ${getDeploymentAppTypeLabel(deploymentAppType)} and its configurations are compatible for migration to deployment pipeline`}
361+
subTitle={`Checking if ${DEPLOYMENT_APP_TYPE_LABEL[deploymentAppType]} and its configurations are compatible for migration to deployment pipeline`}
372362
{...GENERIC_SECTION_ERROR_STATE_COMMON_PROPS}
373363
/>
374364
}
375365
genericSectionErrorProps={{
376366
title: 'Error checking compatibility',
377-
subTitle: `An error occurred while checking if ${getDeploymentAppTypeLabel(deploymentAppType)} and its configurations are compatible for migration to deployment pipeline`,
367+
subTitle: `An error occurred while checking if ${DEPLOYMENT_APP_TYPE_LABEL[deploymentAppType]} and its configurations are compatible for migration to deployment pipeline`,
378368
reload: reloadValidationResponse,
379369
...GENERIC_SECTION_ERROR_STATE_COMMON_PROPS,
380370
}}

src/components/cdPipeline/MigrateToDevtron/MigrateToDevtronValidationFactory.tsx

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -45,10 +45,13 @@ import { URLS } from '@Config/routes'
4545
import { CreateClusterTypeEnum } from '@Pages/GlobalConfigurations/ClustersAndEnvironments/CreateCluster/types'
4646

4747
import { MigrationSourceValidationReasonType } from '../cdPipeline.types'
48-
import { GENERIC_SECTION_ERROR_STATE_COMMON_PROPS, TARGET_ENVIRONMENT_INFO_LIST } from './constants'
48+
import {
49+
DEPLOYMENT_APP_TYPE_LABEL,
50+
GENERIC_SECTION_ERROR_STATE_COMMON_PROPS,
51+
TARGET_ENVIRONMENT_INFO_LIST,
52+
} from './constants'
4953
import { MigrateToDevtronValidationFactoryProps, ValidationResponseContentRowProps } from './types'
5054
import {
51-
getDeploymentAppTypeLabel,
5255
getTargetClusterTooltipInfo,
5356
getTargetNamespaceTooltipInfo,
5457
renderGitOpsNotConfiguredDescription,
@@ -97,9 +100,11 @@ const MigratingFromIcon = ({
97100
deploymentAppType: DeploymentAppTypes
98101
chartIcon: string
99102
}) => {
103+
const iconClass = 'icon-dim-36 dc__no-shrink'
104+
100105
switch (deploymentAppType) {
101106
case DeploymentAppTypes.ARGO:
102-
return <ICArgoCDApp className="icon-dim-36 dc__no-shrink" />
107+
return <ICArgoCDApp className={iconClass} />
103108
case DeploymentAppTypes.HELM:
104109
return (
105110
<ImageWithFallback
@@ -109,13 +114,13 @@ const MigratingFromIcon = ({
109114
src: chartIcon,
110115
alt: 'Helm Release',
111116
}}
112-
fallbackImage={<ICDefaultChart className="icon-dim-36 dc__no-shrink" />}
117+
fallbackImage={<ICDefaultChart className={iconClass} />}
113118
/>
114119
)
115120
case DeploymentAppTypes.FLUX:
116-
return <ICFluxCDApp className="icon-dim-36 dc__no-shrink" />
121+
return <ICFluxCDApp className={iconClass} />
117122
default:
118-
return <ICDefaultChart className="icon-dim-36 dc__no-shrink" />
123+
return <ICDefaultChart className={iconClass} />
119124
}
120125
}
121126

@@ -141,7 +146,7 @@ const MigrateToDevtronValidationFactory = ({
141146
} = validationResponse
142147
const { validationFailedReason, validationFailedMessage } = errorDetail || {}
143148

144-
const deploymentAppTypeLabel = getDeploymentAppTypeLabel(deploymentAppType)
149+
const deploymentAppTypeLabel = DEPLOYMENT_APP_TYPE_LABEL[deploymentAppType]
145150

146151
const targetClusterTooltipInfo = getTargetClusterTooltipInfo(deploymentAppType)
147152
const targetNamespaceTooltipInfo = getTargetNamespaceTooltipInfo(deploymentAppType)

src/components/cdPipeline/MigrateToDevtron/constants.tsx

Lines changed: 30 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,12 +14,16 @@
1414
* limitations under the License.
1515
*/
1616

17+
import { ReactElement } from 'react'
18+
1719
import { DeploymentAppTypes, GenericSectionErrorStateProps } from '@devtron-labs/devtron-fe-common-lib'
1820

1921
import { ReactComponent as ICArgoCDApp } from '@Icons/ic-argocd-app.svg'
2022
import { ReactComponent as ICDefaultChart } from '@Icons/ic-default-chart.svg'
2123
import { ReactComponent as ICFluxCDApp } from '@Icons/ic-fluxcd-app.svg'
2224

25+
import { MigrateToDevtronFormState } from '../cdPipeline.types'
26+
2327
export const GENERIC_SECTION_ERROR_STATE_COMMON_PROPS: Readonly<
2428
Pick<GenericSectionErrorStateProps, 'rootClassName' | 'description'>
2529
> = {
@@ -35,34 +39,43 @@ export const TARGET_ENVIRONMENT_INFO_LIST = {
3539
],
3640
}
3741

42+
export const DEPLOYMENT_APP_TYPE_LABEL: Record<MigrateToDevtronFormState['deploymentAppType'], string> = {
43+
[DeploymentAppTypes.HELM]: 'Helm Release',
44+
[DeploymentAppTypes.ARGO]: 'Argo CD Application',
45+
[DeploymentAppTypes.FLUX]: 'Flux CD Application',
46+
}
47+
3848
export const MIGRATE_FROM_RADIO_GROUP_CONFIG: Record<
39-
Extract<DeploymentAppTypes, DeploymentAppTypes.HELM | DeploymentAppTypes.ARGO | DeploymentAppTypes.FLUX>,
49+
MigrateToDevtronFormState['deploymentAppType'],
4050
{ title: string; tooltipContent: { title: string; subtitle: string } }
4151
> = {
4252
[DeploymentAppTypes.HELM]: {
43-
title: 'Helm Release',
53+
title: DEPLOYMENT_APP_TYPE_LABEL[DeploymentAppTypes.HELM],
4454
tooltipContent: {
4555
title: 'Migrate helm release',
4656
subtitle: 'Migrate an existing Helm Release to manage deployments via CD pipeline',
4757
},
4858
},
4959
[DeploymentAppTypes.ARGO]: {
50-
title: 'Argo CD Application',
60+
title: DEPLOYMENT_APP_TYPE_LABEL[DeploymentAppTypes.ARGO],
5161
tooltipContent: {
5262
title: 'Migrate Argo CD Application',
5363
subtitle: 'Migrate an existing Argo CD Application to manage deployments via CD pipeline',
5464
},
5565
},
5666
[DeploymentAppTypes.FLUX]: {
57-
title: 'Flux CD Application',
67+
title: DEPLOYMENT_APP_TYPE_LABEL[DeploymentAppTypes.FLUX],
5868
tooltipContent: {
5969
title: 'Migrate Flux CD Application',
6070
subtitle: 'Migrate an existing Flux CD Application to manage deployments via CD pipeline',
6171
},
6272
},
6373
}
6474

65-
export const MIGRATE_FROM_CLUSTER_APP_SELECT_CONFIG = {
75+
export const MIGRATE_FROM_CLUSTER_APP_SELECT_CONFIG: Record<
76+
MigrateToDevtronFormState['deploymentAppType'],
77+
{ clusterSelectLabel: string; appSelectLabel: string; appSelectPlaceholder: string; icon: ReactElement }
78+
> = {
6679
[DeploymentAppTypes.HELM]: {
6780
clusterSelectLabel: 'Cluster containing Helm Release',
6881
appSelectLabel: 'Release name',
@@ -82,3 +95,15 @@ export const MIGRATE_FROM_CLUSTER_APP_SELECT_CONFIG = {
8295
icon: <ICFluxCDApp />,
8396
},
8497
}
98+
99+
export const SELECTED_FORM_STATE_KEY: Record<
100+
MigrateToDevtronFormState['deploymentAppType'],
101+
keyof Pick<
102+
MigrateToDevtronFormState,
103+
'migrateFromArgoFormState' | 'migrateFromFluxFormState' | 'migrateFromHelmFormState'
104+
>
105+
> = {
106+
[DeploymentAppTypes.HELM]: 'migrateFromHelmFormState',
107+
[DeploymentAppTypes.ARGO]: 'migrateFromArgoFormState',
108+
[DeploymentAppTypes.FLUX]: 'migrateFromFluxFormState',
109+
}

src/components/cdPipeline/MigrateToDevtron/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,4 +14,5 @@
1414
* limitations under the License.
1515
*/
1616

17+
export { SELECTED_FORM_STATE_KEY } from './constants'
1718
export { default as MigrateToDevtron } from './MigrateToDevtron.component'

0 commit comments

Comments
 (0)