diff --git a/package-lock.json b/package-lock.json
index 38d0c9855..8c200b401 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.20.3-pre-12",
+    "version": "1.20.5-pre-5",
     "lockfileVersion": 3,
     "requires": true,
     "packages": {
         "": {
             "name": "@devtron-labs/devtron-fe-common-lib",
-            "version": "1.20.3-pre-12",
+            "version": "1.20.5-pre-5",
             "hasInstallScript": true,
             "license": "ISC",
             "dependencies": {
diff --git a/package.json b/package.json
index 037f913d7..839353b8c 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.20.3-pre-12",
+    "version": "1.20.5-pre-5",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",
diff --git a/src/Common/BreadCrumb/BreadCrumb.tsx b/src/Common/BreadCrumb/BreadCrumb.tsx
index 55077a9b5..5121d4dd8 100644
--- a/src/Common/BreadCrumb/BreadCrumb.tsx
+++ b/src/Common/BreadCrumb/BreadCrumb.tsx
@@ -16,7 +16,7 @@
 
 import React, { useMemo, useEffect } from 'react'
 import { Link, useRouteMatch, useParams } from 'react-router-dom'
-import { useBreadcrumbContext } from './BreadcrumbStore'
+import { useBreadcrumbContext, getBreadCrumbSeparator } from './BreadcrumbStore'
 import { ConditionalWrap } from '../Helper'
 import { Breadcrumb, Breadcrumbs, UseBreadcrumbOptionalProps, UseBreadcrumbState } from './Types'
 
@@ -115,7 +115,7 @@ export const BreadCrumb: React.FC<Breadcrumbs> = ({
                     </ConditionalWrap>
 
                     {idx + 1 !== filteredCrumbs.length && breadcrumb.name && (
-                        <span className="dc__devtron-breadcrumb__item__separator">{sep}</span>
+                       getBreadCrumbSeparator(sep)
                     )}
                 </React.Fragment>
             ))}
diff --git a/src/Common/BreadCrumb/BreadcrumbStore.tsx b/src/Common/BreadCrumb/BreadcrumbStore.tsx
index 14b3ad4da..62f45428c 100644
--- a/src/Common/BreadCrumb/BreadcrumbStore.tsx
+++ b/src/Common/BreadCrumb/BreadcrumbStore.tsx
@@ -25,6 +25,10 @@ export const BreadcrumbText = ({ heading, isActive, shouldTruncate = false }: Br
     <span className={`dc__breadcrumb-text cb-5 fs-16 lh-1-5 ${shouldTruncate ? 'dc__truncate' : ''} ${isActive ? 'cn-9 fw-6' : 'cb-5 fw-4 dc__mxw-155 dc__ellipsis-right'}`}>{heading}</span>
 )
 
+export const getBreadCrumbSeparator = (sep: string = '/') => (
+    <span className="dc__devtron-breadcrumb__item__separator">{sep}</span>
+)
+
 const Store = ({ children }) => {
     const [state, setState] = useState(initialState)
     return <BreadcrumbContext.Provider value={{ state, setState }}>{children}</BreadcrumbContext.Provider>
diff --git a/src/Common/BreadCrumb/NestedBreadCrumb.tsx b/src/Common/BreadCrumb/NestedBreadCrumb.tsx
new file mode 100644
index 000000000..62cd77e1f
--- /dev/null
+++ b/src/Common/BreadCrumb/NestedBreadCrumb.tsx
@@ -0,0 +1,44 @@
+import React from 'react'
+import { Link } from 'react-router-dom'
+
+import { BreadcrumbText, getBreadCrumbSeparator } from './BreadcrumbStore'
+import { NestedBreadCrumbProps } from './Types'
+
+export const NestedBreadCrumb = ({ redirectUrl, linkText, profileName }: NestedBreadCrumbProps) => {
+    const breadcrumbLinkClass = 'active dc__devtron-breadcrumb__item fs-16 fw-4 lh-1-5 dc__ellipsis-right dc__mxw-155'
+
+    const breadcrumbs = [
+        { type: 'link', label: linkText, to: redirectUrl },
+        ...(profileName
+            ? [
+                  { type: 'link', label: 'Profiles', to: redirectUrl },
+                  {
+                      type: 'text',
+                      label: profileName,
+                  },
+              ]
+            : [
+                  {
+                      type: 'text',
+                      label: 'Create Profile',
+                  },
+              ]),
+    ]
+
+    return (
+        <div className="flex left flex-grow-1 dc__gap-4">
+            {breadcrumbs.map((crumb, index) => (
+                <React.Fragment key={crumb.label}>
+                    {crumb.type === 'link' ? (
+                        <Link to={crumb.to!} className={breadcrumbLinkClass}>
+                            {crumb.label}
+                        </Link>
+                    ) : (
+                        <BreadcrumbText heading={crumb.label} isActive />
+                    )}
+                    {index < breadcrumbs.length - 1 && getBreadCrumbSeparator()}
+                </React.Fragment>
+            ))}
+        </div>
+    )
+}
diff --git a/src/Common/BreadCrumb/Types.ts b/src/Common/BreadCrumb/Types.ts
index 8ad1f4f9d..2be48a998 100644
--- a/src/Common/BreadCrumb/Types.ts
+++ b/src/Common/BreadCrumb/Types.ts
@@ -52,3 +52,19 @@ export interface BreadcrumbTextProps {
      */
     shouldTruncate?: boolean
 }
+
+export interface NestedBreadCrumbProps {
+    /**
+     * It is the url to which the link should redirect
+     */
+    redirectUrl: string
+    /**
+     * It is the text of the link
+     */
+    linkText: string
+    /**
+     * It is the name of the profile
+     * If not given, would show "Create Profile"
+     */
+    profileName: string
+}
diff --git a/src/Common/Constants.ts b/src/Common/Constants.ts
index a5075a0fc..b8e51096a 100644
--- a/src/Common/Constants.ts
+++ b/src/Common/Constants.ts
@@ -100,6 +100,7 @@ export const URLS = {
     APPLICATION_MANAGEMENT_CONFIGURATIONS_DEPLOYMENT_CHARTS: `${APPLICATION_MANAGEMENT_CONFIGURATIONS}/deployment-charts`,
     APPLICATION_MANAGEMENT_CONFIGURATIONS_SCOPED_VARIABLES: `${APPLICATION_MANAGEMENT_CONFIGURATIONS}/scoped-variables`,
     APPLICATION_MANAGEMENT_CONFIGURATIONS_BUILD_INFRA: `${APPLICATION_MANAGEMENT_CONFIGURATIONS}/build-infra`,
+    APPLICATION_MANAGEMENT_CONFIGURATIONS_BUILD_INFRA_PROFILES: `${APPLICATION_MANAGEMENT_CONFIGURATIONS}/build-infra/profiles`,
     APPLICATION_MANAGEMENT_CONFIGURATIONS_NOTIFICATIONS: `${APPLICATION_MANAGEMENT_CONFIGURATIONS}/notifications`,
     // INFRASTRUCTURE MANAGEMENT
     INFRASTRUCTURE_MANAGEMENT: INFRASTRUCTURE_MANAGEMENT_ROOT,
diff --git a/src/Common/index.ts b/src/Common/index.ts
index 44b595cc9..7295df8fb 100644
--- a/src/Common/index.ts
+++ b/src/Common/index.ts
@@ -18,6 +18,7 @@ export * from './AddCDButton'
 export * from './API'
 export { BreadCrumb, useBreadcrumb } from './BreadCrumb/BreadCrumb'
 export { default as BreadcrumbStore, BreadcrumbText } from './BreadCrumb/BreadcrumbStore'
+export { NestedBreadCrumb } from './BreadCrumb/NestedBreadCrumb'
 export { default as ChartVersionAndTypeSelector } from './ChartVersionAndTypeSelector'
 export * from './Checkbox'
 export * from './CIPipeline.Types'
diff --git a/src/Pages/GlobalConfigurations/BuildInfra/Descriptor.tsx b/src/Pages/GlobalConfigurations/BuildInfra/Descriptor.tsx
index 37853c59f..033cbe14a 100644
--- a/src/Pages/GlobalConfigurations/BuildInfra/Descriptor.tsx
+++ b/src/Pages/GlobalConfigurations/BuildInfra/Descriptor.tsx
@@ -14,26 +14,30 @@
  * limitations under the License.
  */
 
+import { NestedBreadCrumb, URLS } from '@Common/index'
 import { InfoIconTippy } from '@Shared/Components/InfoIconTippy'
 
-import { BreadCrumb } from '../../../Common'
 import { BUILD_INFRA_TEXT } from './constants'
 import { BuildInfraDescriptorProps } from './types'
 
 const Descriptor = ({
     additionalContainerClasses,
-    breadCrumbs,
     children,
+    tooltipNode,
     tippyInfoText,
     tippyAdditionalContent,
-    tooltipNode,
     tooltipHeading,
+    profileName,
 }: BuildInfraDescriptorProps) => (
     <div className={`flexbox dc__content-space dc__align-items-center w-100 ${additionalContainerClasses ?? ''}`}>
         <div className="flexbox dc__align-items-center dc__gap-4">
             {tooltipNode || (
                 <>
-                    <BreadCrumb breadcrumbs={breadCrumbs} />
+                    <NestedBreadCrumb
+                        redirectUrl={URLS.APPLICATION_MANAGEMENT_CONFIGURATIONS_BUILD_INFRA_PROFILES}
+                        linkText={BUILD_INFRA_TEXT.HEADING}
+                        profileName={profileName}
+                    />
                     <InfoIconTippy
                         infoText={tippyInfoText ?? BUILD_INFRA_TEXT.EDIT_DEFAULT_TOOLTIP}
                         additionalContent={tippyAdditionalContent}
diff --git a/src/Pages/GlobalConfigurations/BuildInfra/constants.tsx b/src/Pages/GlobalConfigurations/BuildInfra/constants.tsx
index 13fc6bf2f..24ee5e93a 100644
--- a/src/Pages/GlobalConfigurations/BuildInfra/constants.tsx
+++ b/src/Pages/GlobalConfigurations/BuildInfra/constants.tsx
@@ -19,7 +19,6 @@ import { ReactComponent as ICTag } from '@Icons/ic-tag.svg'
 import { ReactComponent as ICTimer } from '@Icons/ic-timer.svg'
 import { ReactComponent as ICCpu } from '@IconsV2/ic-cpu.svg'
 import { ReactComponent as ICMemory } from '@IconsV2/ic-memory.svg'
-import { UseBreadcrumbProps } from '@Common/BreadCrumb/Types'
 import { CMSecretComponentType } from '@Shared/Services'
 
 import {
@@ -82,17 +81,6 @@ export const BUILD_INFRA_TEXT = {
     INVALID_FORM_MESSAGE: 'Valid input is required for all mandatory fields.',
 } as const
 
-export const BUILD_INFRA_BREADCRUMB: UseBreadcrumbProps = {
-    alias: {
-        'application-management': null,
-        configurations: null,
-        'build-infra': {
-            component: <h2 className="m-0 cn-9 fs-16 fw-6 lh-32">{BUILD_INFRA_TEXT.HEADING}</h2>,
-            linked: false,
-        },
-    },
-}
-
 export const BUILD_INFRA_LOCATOR_MARKER_MAP: Readonly<Record<BuildInfraLocators, BuildInfraFormFieldType['marker']>> = {
     [BuildInfraLocators.CPU]: ICCpu,
     [BuildInfraLocators.MEMORY]: ICMemory,
diff --git a/src/Pages/GlobalConfigurations/BuildInfra/types.tsx b/src/Pages/GlobalConfigurations/BuildInfra/types.tsx
index f0abdba0a..53e8dfa1f 100644
--- a/src/Pages/GlobalConfigurations/BuildInfra/types.tsx
+++ b/src/Pages/GlobalConfigurations/BuildInfra/types.tsx
@@ -19,7 +19,6 @@ import { FormEvent, FunctionComponent, ReactNode, SyntheticEvent } from 'react'
 import { BUILD_INFRA_INHERIT_ACTIONS, useBuildInfraForm } from '@Pages/index'
 
 import { ServerErrors } from '../../../Common'
-import { Breadcrumb } from '../../../Common/BreadCrumb/Types'
 import {
     CMSecretComponentType,
     CMSecretConfigData,
@@ -76,21 +75,31 @@ export enum BuildInfraProfileVariants {
     CUSTOM = 'CUSTOM',
 }
 
-export interface BuildInfraDescriptorProps {
+export type BuildInfraDescriptorProps = {
     /**
      * In case we want to restrict the max-width
      */
     additionalContainerClasses?: string
-    breadCrumbs: Breadcrumb[]
     /**
      * Would stick at right of div
      */
     children?: ReactNode
-    tippyInfoText?: string
-    tippyAdditionalContent?: ReactNode
-    tooltipNode?: ReactNode
-    tooltipHeading?: string
-}
+} & (
+    | {
+          tooltipNode: ReactNode
+          tippyInfoText?: never
+          tooltipHeading?: never
+          tippyAdditionalContent?: never
+          profileName?: never
+      }
+    | {
+          tooltipNode?: never
+          tippyInfoText: string
+          tooltipHeading?: string
+          tippyAdditionalContent?: ReactNode
+          profileName?: string
+      }
+)
 
 export type NumericBuildInfraConfigTypes = Extract<
     BuildInfraConfigTypes,