feat: add patch merge strategy in deployment template

package.json

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

src/Common/CodeEditor/CodeEditor.tsx

@@ -42,7 +42,7 @@ import {
     InformationBarProps,
 } from './types'
 import { CodeEditorReducer, initialState } from './CodeEditor.reducer'
-import { MODES } from '../Constants'
+import { DEFAULT_JSON_SCHEMA_URI, MODES } from '../Constants'
 
 const CodeEditorContext = React.createContext(null)
 
@@ -76,7 +76,7 @@ const CodeEditor: React.FC<CodeEditorInterface> & CodeEditorComposition = React.
         customLoader,
         focus,
         validatorSchema,
-        chartVersion,
+        schemaURI = DEFAULT_JSON_SCHEMA_URI,
         isKubernetes = true,
         cleanData = false,
         onBlur,
@@ -230,7 +230,7 @@ const CodeEditor: React.FC<CodeEditorInterface> & CodeEditorComposition = React.
                 isKubernetes,
                 schemas: [
                     {
-                        uri: `https://github.com/devtron-labs/devtron/tree/main/scripts/devtron-reference-helm-charts/reference-chart_${chartVersion}/schema.json`, // id of the first schema
+                        uri: schemaURI,
                         fileMatch: ['*'], // associate with our model
                         schema: validatorSchema,
                     },
@@ -240,7 +240,7 @@ const CodeEditor: React.FC<CodeEditorInterface> & CodeEditorComposition = React.
                 config.dispose()
             }
             // eslint-disable-next-line react-hooks/exhaustive-deps
-        }, [validatorSchema, chartVersion])
+        }, [validatorSchema, schemaURI])
         useEffect(() => {
             if (!editorRef.current) {
                 return

src/Common/CodeEditor/types.ts

@@ -46,7 +46,7 @@ interface CodeEditorBaseInterface {
     validatorSchema?: any
     isKubernetes?: boolean
     cleanData?: boolean
-    chartVersion?: any
+    schemaURI?: string
     /**
      * If true, disable the in-built search of monaco editor
      * @default false

src/Common/Constants.ts

@@ -23,6 +23,7 @@ export const Host = window?.__ORCHESTRATOR_ROOT__ ?? '/orchestrator'
 export const DOCUMENTATION_HOME_PAGE = 'https://docs.devtron.ai'
 export const DOCUMENTATION_VERSION = '/v/v0.7'
 export const DISCORD_LINK = 'https://discord.devtron.ai/'
+export const DEFAULT_JSON_SCHEMA_URI = 'https://json-schema.org/draft/2020-12/schema'
 export const DOCUMENTATION = {
     APP_METRICS: `${DOCUMENTATION_HOME_PAGE}${DOCUMENTATION_VERSION}/usage/applications/app-details/app-metrics`,
     APP_TAGS: `${DOCUMENTATION_HOME_PAGE}${DOCUMENTATION_VERSION}/usage/applications/create-application#tags`,
@@ -513,6 +514,7 @@ export const API_STATUS_CODES = {
     NOT_FOUND: 404,
     EXPECTATION_FAILED: 417,
     LOCKED: 423,
+    UNPROCESSABLE_CONTENT: 422,
 }
 
 export enum SERVER_MODE {

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

@@ -127,7 +127,7 @@ interface BaseDeploymentTemplateConfigState {
     mergeStrategy?: never
 }
 
-interface EnvironmentOverrideDeploymentTemplateConfigState {
+type EnvironmentOverrideDeploymentTemplateConfigState = {
     chartConfig?: never
     isOverridden: boolean
     environmentConfig: EnvironmentConfigType
@@ -136,7 +136,7 @@ interface EnvironmentOverrideDeploymentTemplateConfigState {
 
 export interface DeploymentTemplateConfigCommonState extends SelectedChartDetailsType {
     /**
-     * The first ever state of the deployment template
+     * The first ever state of the deployment template on editor
      */
     originalTemplate: Record<string, string>
     isAppMetricsEnabled: boolean
@@ -146,6 +146,22 @@ export interface DeploymentTemplateConfigCommonState extends SelectedChartDetail
     latestDraft?: DraftMetadataDTO
     editorTemplate: string
     editorTemplateWithoutLockedKeys: string
+    // Have added the mergedTemplate states in base as well so as to have a single source of truth to get the final template
+    /**
+     * This final template to be applied on the deployment in string format
+     * In current editor, this may be null initially
+     */
+    mergedTemplate: string | null
+    /**
+     * This final template to be applied on the deployment without locked keys in string format
+     * In current editor, this may be null initially
+     */
+    mergedTemplateWithoutLockedKeys: string | null
+    /**
+     * This final template to be applied on the deployment in object format
+     * In current editor, this may be null initially
+     */
+    mergedTemplateObject: Record<string, string> | null
 }
 
 export type DeploymentTemplateConfigState = DeploymentTemplateConfigCommonState &

src/Pages/Applications/DevtronApps/Details/AppConfigurations/OverrideStrategyTippyContent.tsx

@@ -1,11 +1,15 @@
-const OverrideStrategyTippyContent = () => (
+import { OverrideStrategyTippyContentProps } from './types'
+
+const OverrideStrategyTippyContent = ({ children }: OverrideStrategyTippyContentProps) => (
     <div className="p-12 flexbox-col dc__gap-20">
         <p className="m-0 fs-13 lh-20 cn-9 fw-4">
             Merge strategy determines how environment configurations are combined with inherited configurations
             configurations. Choose the strategy that best suits your needs:
         </p>
 
         <ul className="pl-12 m-0-imp">
+            {children}
+
             <li className="m-0 fs-13 lh-20 cn-9 fw-4">
                 <strong className="m-0 fw-6">Replace:</strong>&nbsp;Overwrites inherited values with
                 environment-specific ones. Use when you want to completely change inherited settings.

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

@@ -30,3 +30,10 @@ export enum ConfigToolbarPopupNodeType {
     DISCARD_DRAFT = 'discardDraft',
     EDIT_HISTORY = 'editHistory',
 }
+
+export interface OverrideStrategyTippyContentProps {
+    /**
+     * Would be rendered as li conveying the information about the merge strategy
+     */
+    children?: ReactNode
+}

src/Shared/Components/DeploymentConfigDiff/DeploymentConfigDiff.utils.tsx

@@ -442,7 +442,7 @@ const getDiffHeading = <DeploymentTemplate extends boolean>(
     if (isApprovalPending) {
         return (
             <div className="flexbox dc__align-items-center dc__gap-8 ">
-                <ICStamp className="icon-dim-16" />
+                <ICStamp className="icon-dim-16 scv-5 dc__no-shrink" />
                 <span className="fs-12 fw-6 cv-5">Approval pending</span>
             </div>
         )

src/Shared/Components/EnterpriseTag/EnterpriseTag.component.tsx

@@ -0,0 +1,10 @@
+import { ReactComponent as ICMedal } from '@Icons/ic-medal.svg'
+
+const EnterpriseTag = () => (
+    <div className="px-4 py-2 flex dc__gap-2 br-4 ey-2 bcy-1 dc__no-shrink">
+        <ICMedal className="icon-dim-12 dc__no-shrink scy-7" />
+        <span className="cy-7 fs-11 fw-6 lh-16">Enterprise</span>
+    </div>
+)
+
+export default EnterpriseTag

src/Shared/Components/EnterpriseTag/index.ts

@@ -0,0 +1 @@
+export { default as EnterpriseTag } from './EnterpriseTag.component'

src/Shared/Components/index.ts

@@ -57,3 +57,4 @@ export * from './Collapse'
 export * from './Security'
 export * from './Button'
 export * from './InvalidYAMLTippy'
+export * from './EnterpriseTag'

src/index.ts

@@ -14,6 +14,8 @@
  * limitations under the License.
  */
 
+import { OverrideMergeStrategyType } from '@Pages/Applications'
+
 export interface customEnv {
     SENTRY_ENV?: string
     SENTRY_ERROR_ENABLED?: boolean
@@ -88,6 +90,7 @@ export interface customEnv {
     FEATURE_PROMO_EMBEDDED_MODAL_TITLE?: string
     FEATURE_PROMO_EMBEDDED_IFRAME_URL?: string
     FEATURE_BULK_RESTART_WORKLOADS_FROM_RB: string
+    FEATURE_DEFAULT_MERGE_STRATEGY?: OverrideMergeStrategyType
 }
 declare global {
     interface Window {