feat: infrastructure management icon moved to common

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.20.0-alpha-4",
+    "version": "1.20.1-pre-1",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

src/Pages-Devtron-2.0/InfrastructureManagement/Shared/ApplicationManagementIcon/ApplicationManagementIcon.tsx

@@ -0,0 +1,18 @@
+import { URLS } from '@Common/Constants'
+import { Button, ButtonComponentType, ButtonVariantType, Icon } from '@Shared/Components'
+import { ComponentSizeType } from '@Shared/constants'
+
+export const ApplicationManagementIcon = () => (
+    <Button
+        dataTestId="redirect-to-devtron-apps"
+        component={ButtonComponentType.link}
+        size={ComponentSizeType.xs}
+        variant={ButtonVariantType.borderLess}
+        linkProps={{
+            to: URLS.APPLICATION_MANAGEMENT_APP,
+        }}
+        ariaLabel="Redirect to Devtron Apps"
+        showAriaLabelInTippy={false}
+        icon={<Icon name="ic-grid-view" color={null} />}
+    />
+)

src/Pages-Devtron-2.0/InfrastructureManagement/Shared/ApplicationManagementIcon/index.ts

@@ -0,0 +1,2 @@
+export * from './ApplicationManagementIcon'
+export { getApplicationManagementBreadcrumb } from './utils'

src/Pages-Devtron-2.0/InfrastructureManagement/Shared/ApplicationManagementIcon/utils.tsx

@@ -0,0 +1,8 @@
+import { ApplicationManagementIcon } from './ApplicationManagementIcon'
+
+export const getApplicationManagementBreadcrumb = () => ({
+    'application-management': {
+        component: <ApplicationManagementIcon />,
+        linked: true,
+    },
+})

src/Pages-Devtron-2.0/InfrastructureManagement/Shared/InfrastructureManagementIcon/InfrastructureManagementIcon.tsx

@@ -0,0 +1,18 @@
+import { URLS } from '@Common/Constants'
+import { Button, ButtonComponentType, ButtonVariantType, Icon } from '@Shared/Components'
+import { ComponentSizeType } from '@Shared/constants'
+
+export const InfrastructureManagementIcon = () => (
+    <Button
+        dataTestId="redirect-to-overview-btn"
+        component={ButtonComponentType.link}
+        size={ComponentSizeType.xs}
+        variant={ButtonVariantType.borderLess}
+        linkProps={{
+            to: URLS.INFRASTRUCTURE_MANAGEMENT_RESOURCE_BROWSER,
+        }}
+        ariaLabel="Redirect to Infrastructure Management Overview"
+        showAriaLabelInTippy={false}
+        icon={<Icon name="ic-cloud" color={null} />}
+    />
+)

src/Pages-Devtron-2.0/InfrastructureManagement/Shared/InfrastructureManagementIcon/index.ts

@@ -0,0 +1,2 @@
+export * from './InfrastructureManagementIcon'
+export { getInfrastructureManagementBreadcrumb } from './utils'

src/Pages-Devtron-2.0/InfrastructureManagement/Shared/InfrastructureManagementIcon/utils.tsx

@@ -0,0 +1,8 @@
+import { InfrastructureManagementIcon } from './InfrastructureManagementIcon'
+
+export const getInfrastructureManagementBreadcrumb = () => ({
+    'infrastructure-management': {
+        component: <InfrastructureManagementIcon />,
+        linked: true,
+    },
+})

src/Pages-Devtron-2.0/InfrastructureManagement/Shared/index.ts

@@ -0,0 +1,2 @@
+export * from './ApplicationManagementIcon'
+export * from './InfrastructureManagementIcon'

src/Pages-Devtron-2.0/InfrastructureManagement/index.ts

@@ -1 +1,2 @@
 export * from './Overview'
+export * from './Shared'

src/Pages-Devtron-2.0/index.ts

@@ -1 +1,2 @@
 export * from './CostVisibility'
+export * from './InfrastructureManagement'

src/Shared/Components/DocLink/constants.ts

@@ -116,7 +116,7 @@ export const DOCUMENTATION = {
     GLOBAL_CONFIG_PULL_IMAGE_DIGEST: 'global-configurations/pull-image-digest',
     GLOBAL_CONFIG_TAGS: 'getting-started/global-configurations/tags-policy',
 
-    // Software distribution hub
+    // Software Release Management
     SOFTWARE_DISTRIBUTION_HUB: 'usage/software-distribution-hub',
     RELEASE_TRACKS: 'usage/software-distribution-hub/release-hub#creating-release-tracks-and-versions',
     RELEASES: 'usage/software-distribution-hub/release-hub#creating-release-tracks-and-versions',

src/Shared/Components/FeatureDescription/types.ts

@@ -51,7 +51,7 @@ type FeatureDescriptionModalWithTabsConfig = {
 }
 
 export type FeatureDescriptionModalProps = {
-    title: string
+    title: React.ReactNode
     closeModalText?: string
     closeModal?: () => void
 } & (

src/Shared/Components/Header/PageHeader.tsx

@@ -55,8 +55,15 @@ const PageHeader = ({
         useMainContext()
     const { showSwitchThemeLocationTippy, handleShowSwitchThemeLocationTippyChange } = useTheme()
 
-    const { isTippyCustomized, tippyRedirectLink, TippyIcon, tippyMessage, onClickTippyButton, additionalContent } =
-        tippyProps || {}
+    const {
+        isTippyCustomized,
+        tippyRedirectLink,
+        TippyIcon,
+        tippyMessage,
+        onClickTippyButton,
+        additionalContent,
+        tippyHeader,
+    } = tippyProps || {}
     const { email } = useUserEmail()
     const [currentServerInfo, setCurrentServerInfo] = useState<{ serverInfo: ServerInfo; fetchingServerInfo: boolean }>(
         {
@@ -230,7 +237,7 @@ const PageHeader = ({
                         (isTippyCustomized ? (
                             <InfoIconTippy
                                 infoText={tippyMessage}
-                                heading={headerName}
+                                heading={headerName || tippyHeader}
                                 iconClassName="icon-dim-20 ml-8 fcn-5"
                                 documentationLink={tippyRedirectLink}
                                 documentationLinkText="View Documentation"

src/Shared/Components/Header/types.ts

@@ -35,6 +35,7 @@ export interface PageHeaderType {
         TippyIcon?: React.FunctionComponent<any>
         tippyMessage?: string
         onClickTippyButton?: () => void
+        tippyHeader?: string
     }
     onClose?: () => void
     closeIcon?: JSX.Element