Skip to content

Commit 6d135b5

Browse files
AbhishekA1509AbhishekA1509
authored
Merge pull request #2665 from devtron-labs/fix-ng-changes-develop
feat: add enhancements related to add image through webhook, remove https validation on git repo and support for anonymous registry.
2 parents 301d009 + b46ea9f commit 6d135b5

File tree

17 files changed

+252
-91
lines changed

17 files changed

+252
-91
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
"private": true,
55
"homepage": "/dashboard",
66
"dependencies": {
7-
"@devtron-labs/devtron-fe-common-lib": "1.11.0-pre-5",
7+
"@devtron-labs/devtron-fe-common-lib": "1.11.0-pre-6",
88
"@esbuild-plugins/node-globals-polyfill": "0.2.3",
99
"@rjsf/core": "^5.13.3",
1010
"@rjsf/utils": "^5.13.3",

‎src/components/ApplicationGroup/Details/TriggerView/EnvTriggerView.tsx

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -126,6 +126,8 @@ import { LinkedCIDetail } from '../../../../Pages/Shared/LinkedCIDetailsModal'
126126
import CIMaterialModal from '../../../app/details/triggerView/CIMaterialModal'
127127
import { RenderCDMaterialContentProps } from './types'
128128
import { WebhookReceivedPayloadModal } from '@Components/app/details/triggerView/WebhookReceivedPayloadModal'
129+
import { getExternalCIConfig } from '@Components/ciPipeline/Webhook/webhook.service'
130+
import { shouldRenderWebhookAddImageModal } from '@Components/app/details/triggerView/TriggerView.utils'
129131

130132
const ApprovalMaterialModal = importComponentFromFELibrary('ApprovalMaterialModal')
131133
const getCIBlockState: (...props) => Promise<BlockedStateData> = importComponentFromFELibrary(
@@ -146,6 +148,7 @@ const validateRuntimeParameters = importComponentFromFELibrary(
146148
'function',
147149
)
148150
const ChangeImageSource = importComponentFromFELibrary('ChangeImageSource', null, 'function')
151+
const WebhookAddImageModal = importComponentFromFELibrary('WebhookAddImageModal', null, 'function')
149152

150153
// FIXME: IN CIMaterials we are sending isCDLoading while in CD materials we are sending isCILoading
151154
let inprogressStatusTimer
@@ -193,6 +196,7 @@ export default function EnvTriggerView({ filteredAppIds, isVirtualEnv }: AppGrou
193196
const [runtimeParams, setRuntimeParams] = useState<Record<string, RuntimePluginVariables[]>>({})
194197
const [runtimeParamsErrorState, setRuntimeParamsErrorState] = useState<Record<string, RuntimeParamsErrorState>>({})
195198
const [isBulkTriggerLoading, setIsBulkTriggerLoading] = useState<boolean>(false)
199+
const [selectedWebhookNode, setSelectedWebhookNode] = useState<{ appId: number; id: number }>(null)
196200

197201
const selectedWorkflows = filteredWorkflows.filter((wf) => wf.isSelected)
198202

@@ -2383,6 +2387,31 @@ export default function EnvTriggerView({ filteredAppIds, isVirtualEnv }: AppGrou
23832387
history.push(match.url)
23842388
}
23852389

2390+
const getWebhookDetails = () => getExternalCIConfig(selectedWebhookNode.appId, selectedWebhookNode.id, false)
2391+
2392+
const handleWebhookAddImageClick = (appId: number) => (id: number) => {
2393+
setSelectedWebhookNode({ appId, id })
2394+
}
2395+
2396+
const handleWebhookAddImageModalClose = () => {
2397+
setSelectedWebhookNode(null)
2398+
}
2399+
2400+
const renderWebhookAddImageModal = () => {
2401+
if (
2402+
WebhookAddImageModal &&
2403+
shouldRenderWebhookAddImageModal(location) &&
2404+
!location.pathname.includes('bulk-deploy/request') &&
2405+
selectedWebhookNode
2406+
) {
2407+
return (
2408+
<WebhookAddImageModal getWebhookDetails={getWebhookDetails} onClose={handleWebhookAddImageModalClose} />
2409+
)
2410+
}
2411+
2412+
return null
2413+
}
2414+
23862415
const renderWorkflow = (): JSX.Element => {
23872416
return (
23882417
<>
@@ -2405,10 +2434,12 @@ export default function EnvTriggerView({ filteredAppIds, isVirtualEnv }: AppGrou
24052434
location={location}
24062435
match={match}
24072436
index={index}
2437+
handleWebhookAddImageClick={handleWebhookAddImageClick(workflow.appId)}
24082438
/>
24092439
)
24102440
})}
24112441
<LinkedCIDetail workflows={filteredWorkflows} handleClose={handleModalClose} />
2442+
{renderWebhookAddImageModal()}
24122443
</>
24132444
)
24142445
}

‎src/components/app/details/triggerView/TriggerView.tsx

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,8 @@ import { CIPipelineBuildType } from '../../../ciPipeline/types'
9595
import { LinkedCIDetail } from '../../../../Pages/Shared/LinkedCIDetailsModal'
9696
import { CIMaterialModal } from './CIMaterialModal'
9797
import { WebhookReceivedPayloadModal } from './WebhookReceivedPayloadModal'
98+
import { getExternalCIConfig } from '@Components/ciPipeline/Webhook/webhook.service'
99+
import { shouldRenderWebhookAddImageModal } from './TriggerView.utils'
98100

99101
const ApprovalMaterialModal = importComponentFromFELibrary('ApprovalMaterialModal')
100102
const getCIBlockState: (...props) => Promise<BlockedStateData> = importComponentFromFELibrary(
@@ -103,6 +105,7 @@ const getCIBlockState: (...props) => Promise<BlockedStateData> = importComponent
103105
'function',
104106
)
105107
const WorkflowActionRouter = importComponentFromFELibrary('WorkflowActionRouter', null, 'function')
108+
const WebhookAddImageModal = importComponentFromFELibrary('WebhookAddImageModal', null, 'function')
106109
const getRuntimeParams = importComponentFromFELibrary('getRuntimeParams', null, 'function')
107110
const getRuntimeParamsPayload = importComponentFromFELibrary('getRuntimeParamsPayload', null, 'function')
108111

@@ -146,6 +149,7 @@ class TriggerView extends Component<TriggerViewProps, TriggerViewState> {
146149
searchImageTag: '',
147150
resourceFilters: [],
148151
runtimeParams: [],
152+
selectedWebhookNodeId: null,
149153
}
150154
this.refreshMaterial = this.refreshMaterial.bind(this)
151155
this.onClickCIMaterial = this.onClickCIMaterial.bind(this)
@@ -1141,6 +1145,17 @@ class TriggerView extends Component<TriggerViewProps, TriggerViewState> {
11411145
this.setState({ selectedEnv: _selectedEnv })
11421146
}
11431147

1148+
getWebhookDetails = () =>
1149+
getExternalCIConfig(this.props.match.params.appId, this.state.selectedWebhookNodeId, false)
1150+
1151+
handleWebhookAddImageClick = (webhookId: number) => {
1152+
this.setState({ selectedWebhookNodeId: webhookId })
1153+
}
1154+
1155+
handleWebhookAddImageModalClose = () => {
1156+
this.setState({ selectedWebhookNodeId: null })
1157+
}
1158+
11441159
getCINode = (): CommonNodeAttr => {
11451160
let nd: CommonNodeAttr
11461161
if (this.state.ciNodeId) {
@@ -1314,7 +1329,7 @@ class TriggerView extends Component<TriggerViewProps, TriggerViewState> {
13141329
<CloseIcon />
13151330
</button>
13161331
</div>
1317-
<div className='flex-grow-1'>
1332+
<div className="flex-grow-1">
13181333
<Progressing pageLoader size={32} />
13191334
</div>
13201335
</>
@@ -1351,6 +1366,23 @@ class TriggerView extends Component<TriggerViewProps, TriggerViewState> {
13511366
return null
13521367
}
13531368

1369+
renderWebhookAddImageModal() {
1370+
if (
1371+
WebhookAddImageModal &&
1372+
shouldRenderWebhookAddImageModal(this.props.location) &&
1373+
this.state.selectedWebhookNodeId
1374+
) {
1375+
return (
1376+
<WebhookAddImageModal
1377+
getWebhookDetails={this.getWebhookDetails}
1378+
onClose={this.handleWebhookAddImageModalClose}
1379+
/>
1380+
)
1381+
}
1382+
1383+
return null
1384+
}
1385+
13541386
handleModalClose = () => {
13551387
this.props.history.push(this.props.match.url)
13561388
}
@@ -1378,10 +1410,12 @@ class TriggerView extends Component<TriggerViewProps, TriggerViewState> {
13781410
filteredCIPipelines={this.state.filteredCIPipelines}
13791411
environmentLists={this.state.environmentLists}
13801412
appId={+this.props.match.params.appId}
1413+
handleWebhookAddImageClick={this.handleWebhookAddImageClick}
13811414
/>
13821415
)
13831416
})}
13841417
<LinkedCIDetail workflows={this.state.workflows} handleClose={this.handleModalClose} />
1418+
{this.renderWebhookAddImageModal()}
13851419
</>
13861420
)
13871421
}
@@ -1425,7 +1459,7 @@ class TriggerView extends Component<TriggerViewProps, TriggerViewState> {
14251459
}
14261460
if (!this.state.workflows.length) {
14271461
return (
1428-
<div className='flex-grow-1'>
1462+
<div className="flex-grow-1">
14291463
{this.props.isJobView ? (
14301464
<AppNotConfigured
14311465
title={APP_DETAILS.JOB_FULLY_NOT_CONFIGURED.title}

‎src/components/app/details/triggerView/TriggerView.utils.tsx

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,15 @@
1414
* limitations under the License.
1515
*/
1616

17+
import { useLocation } from 'react-router-dom'
18+
1719
import { DeploymentWithConfigType } from '@devtron-labs/devtron-fe-common-lib'
1820

21+
import { URLS } from '@Config/routes'
22+
1923
import { deepEqual } from '../../../common'
2024
import { DeploymentHistoryDetail } from '../cdDetails/cd.type'
25+
import { TRIGGER_VIEW_PARAMS } from './Constants'
2126
import { TriggerViewDeploymentConfigType } from './types'
2227

2328
export const DEPLOYMENT_CONFIGURATION_NAV_MAP = {
@@ -163,3 +168,26 @@ export const checkForDiff = (configA: TriggerViewDeploymentConfigType, configB:
163168

164169
return diffForOptions
165170
}
171+
172+
/**
173+
* Determines whether the "Webhook Add Image" modal should be rendered based on the current location.
174+
*
175+
* This function checks the `location` object to ensure that the modal is not displayed
176+
* when certain other modals or views are active. Specifically, the modal will not be shown
177+
* if any of the following conditions are met:
178+
* - The URL query string contains 'cd-node' or 'rollback-node'.
179+
* - The URL path includes the `BUILD` route.
180+
* - The URL path includes the `LINKED_CI_DETAILS` route.
181+
* - The URL query string contains the `APPROVAL_NODE` parameter.
182+
*
183+
* @param location - The current location object, typically obtained from the `useLocation` hook.
184+
* @returns A boolean indicating whether the "Webhook Add Image" modal should be rendered.
185+
*/
186+
export const shouldRenderWebhookAddImageModal = (location: ReturnType<typeof useLocation>) =>
187+
!(
188+
location.search.includes('cd-node') ||
189+
location.search.includes('rollback-node') ||
190+
location.search.includes(TRIGGER_VIEW_PARAMS.APPROVAL_NODE) ||
191+
location.pathname.includes(URLS.BUILD) ||
192+
location.pathname.includes(URLS.LINKED_CI_DETAILS)
193+
)

‎src/components/app/details/triggerView/config.ts

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,9 @@
1717
import { createContext } from 'react'
1818
import { DeploymentNodeType } from '@devtron-labs/devtron-fe-common-lib'
1919
import { TriggerViewContextType } from './types'
20+
import { importComponentFromFELibrary } from '@Components/common'
21+
22+
const WebhookAddImageButton = importComponentFromFELibrary('WebhookAddImageButton', null, 'function')
2023

2124
export const TriggerViewContext = createContext<TriggerViewContextType>({
2225
invalidateCache: false,
@@ -100,6 +103,16 @@ export const WorkflowTrigger = {
100103
distanceX: 60,
101104
distanceY: 25,
102105
} as NodeDimension,
106+
...(WebhookAddImageButton
107+
? {
108+
webhookNodeSize: {
109+
nodeHeight: 94,
110+
nodeWidth: 200,
111+
distanceX: 60,
112+
distanceY: 20,
113+
} as NodeDimension,
114+
}
115+
: {}),
103116
workflow: {
104117
distanceY: 16,
105118
distanceX: 0,
@@ -129,6 +142,7 @@ export interface WorkflowDimensions {
129142
externalCINodeSizes?: NodeDimension
130143
linkedCINodeSizes?: NodeDimension
131144
cDNodeSizes: NodeDimension
145+
webhookNodeSize?: NodeDimension
132146
workflow: Offset
133147
}
134148

‎src/components/app/details/triggerView/types.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -341,6 +341,7 @@ export interface WorkflowProps
341341
index?: number
342342
environmentLists?: any[]
343343
filteredCIPipelines?: any[]
344+
handleWebhookAddImageClick?: (webhookId: number) => void
344345
}
345346

346347
export interface TriggerViewContextType {
@@ -406,6 +407,7 @@ export interface TriggerViewState {
406407
searchImageTag?: string
407408
resourceFilters?: FilterConditionsListType[]
408409
runtimeParams?: RuntimePluginVariables[]
410+
selectedWebhookNodeId: number
409411
}
410412

411413
export interface CIMaterialProps

‎src/components/app/details/triggerView/workflow.service.ts

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -147,18 +147,16 @@ export const getInitialWorkflows = ({
147147
})
148148
}
149149
if (isJobView) {
150-
return Promise.all([getWorkflowList(id, null, false), getCIConfig(id, false)]).then(
151-
([workflow, ciConfig]) => {
152-
return processWorkflow(
153-
workflow.result as WorkflowResult,
154-
ciConfig.result as CiPipelineResult,
155-
null,
156-
null,
157-
dimensions,
158-
workflowOffset,
159-
)
160-
},
161-
)
150+
return Promise.all([getWorkflowList(id, null, false), getCIConfig(id, false)]).then(([workflow, ciConfig]) => {
151+
return processWorkflow(
152+
workflow.result as WorkflowResult,
153+
ciConfig.result as CiPipelineResult,
154+
null,
155+
null,
156+
dimensions,
157+
workflowOffset,
158+
)
159+
})
162160
}
163161
return Promise.all([
164162
getWorkflowList(id, filteredEnvIds, isTemplateView),
@@ -644,8 +642,10 @@ function webhookToNode(webhookDetails: WebhookDetailsType, dimensions: WorkflowD
644642
id: String(webhookDetails.id),
645643
x: 0,
646644
y: 0,
647-
height: dimensions.staticNodeSizes.nodeHeight,
648-
width: dimensions.staticNodeSizes.nodeWidth,
645+
height: dimensions.webhookNodeSize
646+
? dimensions.webhookNodeSize.nodeHeight
647+
: dimensions.staticNodeSizes.nodeHeight,
648+
width: dimensions.webhookNodeSize ? dimensions.webhookNodeSize.nodeWidth : dimensions.staticNodeSizes.nodeWidth,
649649
title: 'Webhook',
650650
status: DEFAULT_STATUS,
651651
type: WorkflowNodeType.WEBHOOK,

‎src/components/app/details/triggerView/workflow/Workflow.tsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -124,6 +124,7 @@ export class Workflow extends Component<WorkflowProps> {
124124
key={`webhook-${node.id}`}
125125
id={node.id}
126126
isTemplateView={false}
127+
addImageButtonClick={this.props.handleWebhookAddImageClick}
127128
/>
128129
)
129130
}
@@ -386,11 +387,7 @@ export class Workflow extends Component<WorkflowProps> {
386387
</span>
387388

388389
<div className="dc__separated-flexbox">
389-
{BulkDeployLink && numberOfCDNodes > 1 && (
390-
<BulkDeployLink
391-
workflowId={this.props.id}
392-
/>
393-
)}
390+
{BulkDeployLink && numberOfCDNodes > 1 && <BulkDeployLink workflowId={this.props.id} />}
394391

395392
{ImagePromotionLink && (
396393
<ImagePromotionLink
@@ -402,7 +399,6 @@ export class Workflow extends Component<WorkflowProps> {
402399
/>
403400
)}
404401
</div>
405-
406402
</>
407403
)}
408404
</div>

0 commit comments

Comments
 (0)