Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 | 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 12x 2x 2x 2x 2x 3x 2x 2x 1x 1x 2x 2x 2x 2x 12x | /*
* Copyright 2022 Harness Inc. All rights reserved.
* Use of this source code is governed by the PolyForm Shield 1.0.0 license
* that can be found in the licenses directory at the root of this repository, also available at
* https://polyformproject.org/wp-content/uploads/2020/06/PolyForm-Shield-1.0.0.txt.
*/
import React from 'react'
import { useParams } from 'react-router-dom'
import { omit, set } from 'lodash-es'
import { TemplateContext } from '@templates-library/components/TemplateStudio/TemplateContext/TemplateContext'
import type { GitQueryParams, ProjectPathProps } from '@common/interfaces/RouteInterfaces'
import { useGlobalEventListener, useQueryParams } from '@common/hooks'
import { TemplatePipelineProvider } from '@pipeline/components/TemplatePipelineContext'
import { sanitize } from '@common/utils/JSONUtils'
import type { PipelineInfoConfig } from 'services/cd-ng'
import { PipelineContextType } from '@pipeline/components/PipelineStudio/PipelineContext/PipelineContext'
import { DrawerTypes } from '@templates-library/components/TemplateStudio/TemplateContext/TemplateActions'
import { RightDrawer } from '@templates-library/components/TemplateStudio/RightDrawer/RightDrawer'
import StageBuilder from '@pipeline/components/PipelineStudio/StageBuilder/StageBuilder'
import { RightBar as PipelineStudioRightBar } from '@pipeline/components/PipelineStudio/RightBar/RightBar'
import { TemplateDrawer } from '@templates-library/components/TemplateDrawer/TemplateDrawer'
export const DefaultNewPipelineName = 'Pipeline Name'
export const DefaultNewPipelineId = 'pipeline_name'
const PipelineTemplateCanvas = () => {
const {
state: {
templateView: { isDrawerOpened }
}
} = React.useContext(TemplateContext)
const {
state: { template, isLoading, isUpdated, templateView },
updateTemplate,
updateTemplateView,
isReadonly
} = React.useContext(TemplateContext)
const { accountId, projectIdentifier, orgIdentifier } = useParams<ProjectPathProps>()
const { branch, repoIdentifier } = useQueryParams<GitQueryParams>()
const createPipelineFromTemplate = () => ({
...template.spec,
name: DefaultNewPipelineName,
identifier: DefaultNewPipelineId
})
const [pipeline, setPipeline] = React.useState<PipelineInfoConfig>(createPipelineFromTemplate())
React.useEffect(() => {
Eif (!isLoading && !isUpdated) {
setPipeline(createPipelineFromTemplate())
}
}, [isLoading, isUpdated])
const onUpdatePipeline = async (pipelineConfig: PipelineInfoConfig) => {
const processNode = omit(pipelineConfig, 'name', 'identifier', 'description', 'tags')
sanitize(processNode, { removeEmptyArray: false, removeEmptyObject: false, removeEmptyString: false })
set(template, 'spec', processNode)
await updateTemplate(template)
}
useGlobalEventListener('OPEN_PIPELINE_TEMPLATE_VARIABLES', () => {
updateTemplateView({
...templateView,
isDrawerOpened: true,
drawerData: { type: DrawerTypes.TemplateVariables }
})
})
Eif (pipeline) {
return (
<TemplatePipelineProvider
queryParams={{ accountIdentifier: accountId, orgIdentifier, projectIdentifier, repoIdentifier, branch }}
initialValue={pipeline as PipelineInfoConfig}
onUpdatePipeline={onUpdatePipeline}
contextType={PipelineContextType.PipelineTemplate}
isReadOnly={isReadonly}
>
{!isDrawerOpened && <StageBuilder />}
<PipelineStudioRightBar />
<TemplateDrawer />
<RightDrawer />
</TemplatePipelineProvider>
)
} else {
return <></>
}
}
export const PipelineTemplateCanvasWithRef = React.forwardRef(PipelineTemplateCanvas)
|