Merge pull request #575 from devtron-labs/feat/app-template-v2

feat: application template v2

Author: eshankvaish

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.6.0-patch-2-beta-2",
+    "version": "1.6.0-patch-2-beta-3",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -89,7 +89,7 @@ export const URLS = {
     GLOBAL_CONFIG_TEMPLATES_DEVTRON_APP_CREATE: `${GLOBAL_CONFIG_TEMPLATES_DEVTRON_APP}/create`,
     // NOTE: using appId since we are re-using AppConfig component
     GLOBAL_CONFIG_TEMPLATES_DEVTRON_APP_DETAIL: `${GLOBAL_CONFIG_TEMPLATES_DEVTRON_APP}/detail/:appId`,
-}
+} as const
 
 export const ROUTES = {
     APP: 'app',
@@ -148,7 +148,8 @@ export const ROUTES = {
     CD_TRIGGER_POST: 'app/cd-pipeline/trigger',
     DELETE_RESOURCE: 'k8s/resource/delete',
     NODE_CAPACITY: 'k8s/capacity/node',
-}
+    RESOURCE_TEMPLATE: 'resource/template',
+} as const
 
 export enum KEY_VALUE {
     KEY = 'key',

src/Common/Constants.ts

@@ -70,6 +70,7 @@ export enum GetTemplateAPIRouteType {
     CD_DEPLOY_CONFIG = 'cd-deploy-config',
     CD_ENV_LIST = 'cd-env-list',
     CONFIG_DEPLOYMENT_TEMPLATE = 'config/deployment-template',
+    CONFIG_DATA = 'config-data',
     CONFIG_CM = 'config/config-map',
     CONFIG_CS = 'config/secret',
     WORKFLOW_LIST = 'workflow/list',

src/Pages/Applications/DevtronApps/Details/AppConfigurations/types.ts

@@ -96,7 +96,10 @@ export const DeploymentHistoryConfigDiff = ({
 
             const [secretsData, ...configDatas] = await Promise.allSettled([
                 !isSuperAdmin ? getCompareSecretsData([...payloads]) : null,
-                ...payloads.map((payload) => payload && getAppEnvDeploymentConfig({ params: payload })),
+                ...payloads.map(
+                    (payload) =>
+                        payload && getAppEnvDeploymentConfig({ params: payload, appId: null, isTemplateView: false }),
+                ),
             ])
 
             if (secretsData.status !== 'fulfilled' || !secretsData.value) {

src/Shared/Components/CICDHistory/DeploymentHistoryConfigDiff/DeploymentHistoryConfigDiff.tsx

@@ -46,7 +46,6 @@ const WorkflowOptionsModal = ({
     resetChangeCIPayload,
     linkedCDSourceVariant,
     isAppGroup = false,
-    getTemplateAPIRoute,
     isTemplateView,
 }: Readonly<WorkflowOptionsModalProps>) => {
     const [currentCIPipelineType, setCurrentCIPipelineType] = useState<CIPipelineNodeType | WorkflowNodeType.WEBHOOK>(
@@ -115,7 +114,6 @@ const WorkflowOptionsModal = ({
                 // Only need to disable it in case of error
                 setLoadingWebhook(true)
                 saveCDPipeline(getSwitchToWebhookPayload(changeCIPayload), {
-                    getTemplateAPIRoute,
                     isTemplateView,
                 })
                     .then((response) => {

src/Shared/Components/WorkflowOptionsModal/WorkflowOptionsModal.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { AppConfigProps, GetTemplateAPIRouteProps } from '@Pages/index'
+import { AppConfigProps } from '@Pages/index'
 import { ChangeCIPayloadType, CIPipelineNodeType, WorkflowType } from '@Shared/types'
 
 interface LinkedCDSourceVariant {
@@ -45,5 +45,4 @@ export interface WorkflowOptionsModalProps extends Required<Pick<AppConfigProps,
     getWorkflows?: () => void
     linkedCDSourceVariant?: LinkedCDSourceVariant
     isAppGroup?: boolean
-    getTemplateAPIRoute: (props: GetTemplateAPIRouteProps) => string
 }

src/Shared/Components/WorkflowOptionsModal/types.tsx

@@ -14,6 +14,7 @@
  * limitations under the License.
  */
 
+import { AppConfigProps, GetTemplateAPIRouteType } from '@Pages/index'
 import { ROUTES, ResponseType, get, getUrlWithSearchParams, showError } from '../../Common'
 import {
     CIMaterialInfoDTO,
@@ -23,6 +24,7 @@ import {
     AppEnvDeploymentConfigPayloadType,
 } from './app.types'
 import { getParsedCIMaterialInfo } from './utils'
+import { getTemplateAPIRoute } from '..'
 
 export const getCITriggerInfo = async (params: GetCITriggerInfoParamsType): Promise<CIMaterialInfoType> => {
     try {
@@ -58,11 +60,26 @@ export const getArtifactInfo = async (
 export const getAppEnvDeploymentConfig = ({
     params,
     signal,
+    isTemplateView,
+    appId,
 }: {
     params: AppEnvDeploymentConfigPayloadType
     signal?: AbortSignal
-}): Promise<ResponseType<AppEnvDeploymentConfigDTO>> =>
-    get(getUrlWithSearchParams(ROUTES.CONFIG_DATA, params), { signal })
+    isTemplateView: AppConfigProps['isTemplateView']
+    appId: string | number | null
+}): Promise<ResponseType<AppEnvDeploymentConfigDTO>> => {
+    const url = isTemplateView
+        ? getTemplateAPIRoute({
+              type: GetTemplateAPIRouteType.CONFIG_DATA,
+              queryParams: {
+                  id: appId,
+                  ...params,
+              },
+          })
+        : getUrlWithSearchParams(ROUTES.CONFIG_DATA, params)
+
+    return get(url, { signal })
+}
 
 export const getCompareSecretsData = async (
     params: AppEnvDeploymentConfigPayloadType[],

src/Shared/Services/app.service.ts

@@ -15,23 +15,17 @@
  */
 
 import { AppConfigProps, GetTemplateAPIRouteType } from '@Pages/index'
-import { WorkflowOptionsModalProps } from '@Shared/Components/WorkflowOptionsModal/types'
 import { getUrlWithSearchParams, post, ROUTES } from '../../Common'
 import { GetPolicyApiUrlProps, GetResourceApiUrlProps } from './types'
+import { getTemplateAPIRoute } from '..'
 
 export const getResourceApiUrl = <T>({ baseUrl, kind, version, suffix, queryParams }: GetResourceApiUrlProps<T>) =>
     getUrlWithSearchParams(`${baseUrl}/${kind}/${version}${suffix ? `/${suffix}` : ''}`, queryParams)
 
 export const getPolicyApiUrl = <T>({ kind, version, queryParams, suffix }: GetPolicyApiUrlProps<T>) =>
     getUrlWithSearchParams(`global/policy/${kind}/${version}${suffix ? `/${suffix}` : ''}`, queryParams)
 
-export const saveCDPipeline = (
-    request,
-    {
-        getTemplateAPIRoute,
-        isTemplateView,
-    }: Pick<WorkflowOptionsModalProps, 'getTemplateAPIRoute'> & Required<Pick<AppConfigProps, 'isTemplateView'>>,
-) => {
+export const saveCDPipeline = (request, { isTemplateView }: Required<Pick<AppConfigProps, 'isTemplateView'>>) => {
     const url = isTemplateView
         ? getTemplateAPIRoute({
               type: GetTemplateAPIRouteType.CD_PIPELINE,

src/Shared/Services/common.service.ts

@@ -20,3 +20,4 @@ export * from './app.service'
 export * from './common.service'
 export * from './ToastManager'
 export * from './utils'
+export * from './template.service'