Skip to content

Commit 219ac6e

Browse files
committed
feat: refactor trigger view component
1 parent b515400 commit 219ac6e

File tree

15 files changed

+479
-590
lines changed

15 files changed

+479
-590
lines changed

.eslintignore

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,6 @@ src/components/app/details/testViewer/TestRunDetails.tsx
101101
src/components/app/details/testViewer/TestRunList.tsx
102102
src/components/app/details/triggerView/EmptyStateCIMaterial.tsx
103103
src/components/app/details/triggerView/MaterialSource.tsx
104-
src/components/app/details/triggerView/TriggerView.tsx
105104
src/components/app/details/triggerView/__tests__/triggerview.test.tsx
106105
src/components/app/details/triggerView/cdMaterial.tsx
107106
src/components/app/details/triggerView/ciMaterial.tsx

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

Lines changed: 7 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -54,7 +54,6 @@ import { ReactComponent as Pencil } from '../../../../assets/icons/ic-pencil.svg
5454
import { URLS, ViewType } from '../../../../config'
5555
import { LinkedCIDetail } from '../../../../Pages/Shared/LinkedCIDetailsModal'
5656
import { AppNotConfigured } from '../../../app/details/appDetails/AppDetails'
57-
import { TriggerViewContext } from '../../../app/details/triggerView/config'
5857
import { TRIGGER_VIEW_PARAMS } from '../../../app/details/triggerView/Constants'
5958
import { CIMaterialRouterProps, MATERIAL_TYPE } from '../../../app/details/triggerView/types'
6059
import { Workflow } from '../../../app/details/triggerView/workflow/Workflow'
@@ -600,8 +599,8 @@ const EnvTriggerView = ({ filteredAppIds, isVirtualEnv }: AppGroupDetailDefaultT
600599
configurePluginURL={configurePluginURL}
601600
isTriggerBlockedDueToPlugin={node?.showPluginWarning && node?.isTriggerBlocked}
602601
triggerType={node?.triggerType}
603-
isRedirectedFromAppDetails={false}
604602
parentEnvironmentName={node?.parentEnvironmentName}
603+
onClickApprovalNode={onClickApprovalNode}
605604
/>
606605
)
607606
}
@@ -824,6 +823,10 @@ const EnvTriggerView = ({ filteredAppIds, isVirtualEnv }: AppGroupDetailDefaultT
824823
index={index}
825824
handleWebhookAddImageClick={handleWebhookAddImageClick(workflow.appId)}
826825
openCIMaterialModal={openCIMaterialModal}
826+
onClickApprovalNode={onClickApprovalNode}
827+
onClickCDMaterial={onClickCDMaterial}
828+
onClickRollbackMaterial={onClickRollbackMaterial}
829+
reloadTriggerView={reloadTriggerView}
827830
/>
828831
))}
829832
<LinkedCIDetail workflows={filteredWorkflows} handleClose={revertToPreviousURL} />
@@ -848,14 +851,7 @@ const EnvTriggerView = ({ filteredAppIds, isVirtualEnv }: AppGroupDetailDefaultT
848851

849852
<Prompt when={enableRoutePrompt} message={DEFAULT_ROUTE_PROMPT_MESSAGE} />
850853

851-
<TriggerViewContext.Provider
852-
value={{
853-
onClickCDMaterial,
854-
onClickRollbackMaterial,
855-
reloadTriggerView,
856-
onClickApprovalNode,
857-
}}
858-
>
854+
<>
859855
{renderWorkflow()}
860856

861857
<Switch>
@@ -876,7 +872,7 @@ const EnvTriggerView = ({ filteredAppIds, isVirtualEnv }: AppGroupDetailDefaultT
876872
{renderBulkCIMaterial()}
877873
{renderApprovalMaterial()}
878874
{renderBulkSourceChange()}
879-
</TriggerViewContext.Provider>
875+
</>
880876
<div />
881877
</div>
882878
{!!selectedAppList.length && (

src/components/app/details/triggerView/BuildImageModal/BulkBuildImageModal.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -164,7 +164,7 @@ const BulkBuildImageModal = ({
164164
const handleReloadSelectedMaterialWithWorkflows = async () => {
165165
try {
166166
const newWorkflows = await reloadWorkflows()
167-
await reloadSelectedAppMaterialList(newWorkflows)
167+
await reloadSelectedAppMaterialList(newWorkflows as WorkflowType[])
168168
} catch (error) {
169169
showError(error)
170170
}

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,10 @@ import {
1919
BuildImageModalProps,
2020
CIPipelineMaterialDTO,
2121
FilteredCIPipelineMapType,
22+
FilteredCIPipelinesType,
2223
HandleRuntimeParamChange,
2324
MaterialSourceProps,
2425
RuntimeParamsErrorState,
25-
TriggerViewState,
2626
} from '../types'
2727

2828
export interface TriggerBuildSidebarProps {
@@ -55,7 +55,7 @@ export type GitInfoMaterialProps = Pick<BuildImageModalProps, 'isJobView'> & {
5555
handleRuntimeParamError: (errorState: RuntimeParamsErrorState) => void
5656
runtimeParams: RuntimePluginVariables[]
5757
handleDisplayWebhookModal: () => void
58-
selectedCIPipeline: TriggerViewState['filteredCIPipelines'][number]
58+
selectedCIPipeline: FilteredCIPipelinesType
5959
handleReloadWithWorkflows: () => Promise<void>
6060
appId: number
6161
/**

src/components/app/details/triggerView/DeployImageModal/BulkDeployModal.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -594,7 +594,6 @@ const BulkDeployModal = ({ handleClose, stageType, workflows, isVirtualEnvironme
594594
deploymentWindowMetadata={deploymentWindowMetadata}
595595
pipelineId={pipelineId}
596596
handleClose={handleClose}
597-
isRedirectedFromAppDetails={false}
598597
onSearchApply={reloadOrSearchSelectedApp}
599598
stageType={stageType}
600599
uploadRuntimeParamsFile={uploadRuntimeParamsFile}

src/components/app/details/triggerView/DeployImageModal/DeployImageContent.tsx

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { useContext } from 'react'
21
import { useHistory } from 'react-router-dom'
32

43
import {
@@ -31,9 +30,8 @@ import {
3130

3231
import { importComponentFromFELibrary } from '@Components/common'
3332

34-
import { TriggerViewContext } from '../config'
3533
import { TRIGGER_VIEW_PARAMS } from '../Constants'
36-
import { FilterConditionViews, HandleRuntimeParamChange, TriggerViewContextType } from '../types'
34+
import { FilterConditionViews, HandleRuntimeParamChange } from '../types'
3735
import BulkDeployEmptyState from './BulkDeployEmptyState'
3836
import BulkTriggerSidebar from './BulkTriggerSidebar'
3937
import ImageSelectionCTA from './ImageSelectionCTA'
@@ -92,11 +90,11 @@ const DeployImageContent = ({
9290
selectedTagName,
9391
handleTagChange,
9492
changeApp,
93+
onClickApprovalNode,
9594
}: DeployImageContentProps) => {
9695
// WARNING: Pls try not to create a useState in this component, it is supposed to be a dumb component.
9796
const history = useHistory()
9897
const { isSuperAdmin } = useMainContext()
99-
const { onClickApprovalNode } = useContext<TriggerViewContextType>(TriggerViewContext)
10098

10199
// Assumption: isExceptionUser is a global trait
102100
const isExceptionUser = getIsExceptionUser(materialResponse)

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

Lines changed: 20 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -43,23 +43,32 @@ export type DeployImageModalProps = {
4343
/**
4444
* If opening pre/post cd make sure BE sends plugin details as well, otherwise those props will be undefined
4545
*/
46-
isRedirectedFromAppDetails: boolean
4746
parentEnvironmentName: string
4847
triggerType: CommonNodeAttr['triggerType']
4948
} & (
5049
| {
51-
showPluginWarningBeforeTrigger: boolean
52-
consequence: ConsequenceType
53-
configurePluginURL: string
54-
isTriggerBlockedDueToPlugin: boolean
50+
isRedirectedFromAppDetails: true
51+
onClickApprovalNode?: never
5552
}
5653
| {
57-
showPluginWarningBeforeTrigger?: never
58-
consequence?: never
59-
configurePluginURL?: never
60-
isTriggerBlockedDueToPlugin?: never
54+
isRedirectedFromAppDetails?: never
55+
onClickApprovalNode: (cdNodeId: number) => void
6156
}
62-
)
57+
) &
58+
(
59+
| {
60+
showPluginWarningBeforeTrigger: boolean
61+
consequence: ConsequenceType
62+
configurePluginURL: string
63+
isTriggerBlockedDueToPlugin: boolean
64+
}
65+
| {
66+
showPluginWarningBeforeTrigger?: never
67+
consequence?: never
68+
configurePluginURL?: never
69+
isTriggerBlockedDueToPlugin?: never
70+
}
71+
)
6372

6473
export type DeployImageHeaderProps = Pick<
6574
DeployImageModalProps,
@@ -141,6 +150,7 @@ export type DeployImageContentProps = Pick<
141150
| 'isTriggerBlockedDueToPlugin'
142151
| 'configurePluginURL'
143152
| 'triggerType'
153+
| 'onClickApprovalNode'
144154
> &
145155
Pick<RuntimeParamsSidebarProps, 'appName'> & {
146156
materialResponse: CDMaterialResponseType | null
Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
import { useRef } from 'react'
2+
3+
import { DEFAULT_ENV, getEnvironmentListMinPublic, useQuery, useQueryClient } from '@devtron-labs/devtron-fe-common-lib'
4+
5+
import { getWorkflowStatus } from '@Components/app/service'
6+
import { processWorkflowStatuses } from '@Components/ApplicationGroup/AppGroup.utils'
7+
import { sortObjectArrayAlphabetically } from '@Components/common'
8+
import { getHostURLConfiguration } from '@Services/service'
9+
10+
import { UseTriggerViewServicesParams } from './types'
11+
import { getTriggerWorkflows } from './workflow.service'
12+
13+
export const useTriggerViewServices = ({ appId, isJobView, filteredEnvIds }: UseTriggerViewServicesParams) => {
14+
const queryClient = useQueryClient()
15+
const refetchIntervalRef = useRef<number>(30000)
16+
17+
const { data: hostUrlConfig } = useQuery({
18+
queryKey: ['hostUrlConfig'],
19+
queryFn: () => getHostURLConfiguration(),
20+
select: (response) => response.result,
21+
})
22+
23+
const { isFetching: isEnvListLoading, data: environmentList } = useQuery({
24+
queryKey: ['triggerViewEnvList'],
25+
queryFn: ({ signal }) => getEnvironmentListMinPublic(false, { signal }),
26+
select: (response) => {
27+
const list = []
28+
list.push({
29+
id: 0,
30+
clusterName: '',
31+
name: DEFAULT_ENV,
32+
active: false,
33+
isClusterActive: false,
34+
description: 'System default',
35+
})
36+
response.result?.forEach((env) => {
37+
if (env.cluster_name !== 'default_cluster' && env.isClusterCdActive) {
38+
list.push({
39+
id: env.id,
40+
clusterName: env.cluster_name,
41+
name: env.environment_name,
42+
active: false,
43+
isClusterActive: env.isClusterActive,
44+
description: env.description,
45+
})
46+
}
47+
})
48+
sortObjectArrayAlphabetically(list, 'name')
49+
return list
50+
},
51+
})
52+
53+
const {
54+
isFetching: isWorkflowsLoading,
55+
data: wfData,
56+
error: workflowsError,
57+
} = useQuery({
58+
queryKey: [appId, isJobView, filteredEnvIds, 'triggerViewWorkflowList'],
59+
queryFn: async () => {
60+
const result = await getTriggerWorkflows(appId, !isJobView, isJobView, filteredEnvIds)
61+
return {
62+
code: 200,
63+
status: 'OK',
64+
result,
65+
}
66+
},
67+
select: (response) => ({
68+
appName: response.result?.appName || '',
69+
workflows: response.result?.workflows || [],
70+
filteredCIPipelines: response.result?.filteredCIPipelines || [],
71+
}),
72+
})
73+
74+
const { workflows, filteredCIPipelines } = wfData ?? { workflows: [], filteredCIPipelines: [] }
75+
76+
const { data: updatedWfWithStatus } = useQuery({
77+
queryKey: [appId, 'triggerViewWorkflowStatus'],
78+
queryFn: ({ signal }) => getWorkflowStatus(+appId, { signal }),
79+
select: (response) => {
80+
const processedWorkflowsData = processWorkflowStatuses(
81+
response.result?.ciWorkflowStatus ?? [],
82+
response.result?.cdWorkflowStatus ?? [],
83+
workflows,
84+
)
85+
refetchIntervalRef.current = processedWorkflowsData.cicdInProgress ? 10000 : 30000
86+
return processedWorkflowsData.workflows || []
87+
},
88+
refetchInterval: refetchIntervalRef.current,
89+
enabled: !!appId && !!workflows.length,
90+
})
91+
92+
const isLoading = isEnvListLoading || isWorkflowsLoading
93+
94+
const reloadWorkflowStatus = async () => {
95+
await queryClient.invalidateQueries({ queryKey: [appId, 'triggerViewWorkflowStatus'] })
96+
}
97+
98+
const reloadWorkflows = async () => {
99+
await queryClient.invalidateQueries({ queryKey: [appId, isJobView, filteredEnvIds, 'triggerViewWorkflowList'] })
100+
// Invalidate status query to refetch workflow status
101+
await reloadWorkflowStatus()
102+
}
103+
104+
return {
105+
isLoading,
106+
hostUrlConfig,
107+
environmentList,
108+
workflows: updatedWfWithStatus ?? workflows,
109+
filteredCIPipelines,
110+
workflowsError,
111+
reloadWorkflows,
112+
reloadWorkflowStatus,
113+
}
114+
}

0 commit comments

Comments
 (0)