diff --git a/package-lock.json b/package-lock.json index 35c03b3bc..de97d1a0e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@devtron-labs/devtron-fe-common-lib", - "version": "1.21.0-pre-2", + "version": "1.22.0-pre-0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@devtron-labs/devtron-fe-common-lib", - "version": "1.21.0-pre-2", + "version": "1.22.0-pre-0", "hasInstallScript": true, "license": "ISC", "dependencies": { diff --git a/package.json b/package.json index 64a08f45d..c18a3d755 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@devtron-labs/devtron-fe-common-lib", - "version": "1.21.0-pre-2", + "version": "1.22.0-pre-0", "description": "Supporting common component library", "type": "module", "main": "dist/index.js", diff --git a/src/Assets/IconV2/ic-chart-repo.svg b/src/Assets/IconV2/ic-chart-repo.svg new file mode 100644 index 000000000..8d0dff3f9 --- /dev/null +++ b/src/Assets/IconV2/ic-chart-repo.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/Assets/IconV2/ic-external-link.svg b/src/Assets/IconV2/ic-external-link.svg new file mode 100644 index 000000000..ddcdbcf6f --- /dev/null +++ b/src/Assets/IconV2/ic-external-link.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/Common/Constants.ts b/src/Common/Constants.ts index 8e1485e53..9d8c58914 100644 --- a/src/Common/Constants.ts +++ b/src/Common/Constants.ts @@ -223,6 +223,7 @@ export const ROUTES = { LICENSE_DATA: 'license/data', ENV: 'env', APP_METADATA: 'app-metadata', + RESOURCE_CONFLICTS_LIST: 'app/:appId/cd-pipeline/:pipelineId/history/:wfrId/helm-ownership-conflicts', } as const export enum KEY_VALUE { diff --git a/src/Pages-Devtron-2.0/Navigation/index.ts b/src/Pages-Devtron-2.0/Navigation/index.ts new file mode 100644 index 000000000..c9f6f047d --- /dev/null +++ b/src/Pages-Devtron-2.0/Navigation/index.ts @@ -0,0 +1 @@ +export * from './types' diff --git a/src/Pages-Devtron-2.0/Navigation/types.ts b/src/Pages-Devtron-2.0/Navigation/types.ts new file mode 100644 index 000000000..fb8fb1f65 --- /dev/null +++ b/src/Pages-Devtron-2.0/Navigation/types.ts @@ -0,0 +1,116 @@ +import { customEnv, Never } from 'src' + +import { IconsProps } from '@Shared/Components' + +export type NavigationItemID = + | 'application-management-overview' + | 'application-management-devtron-applications' + | 'application-management-application-groups' + | 'application-management-bulk-edit' + | 'application-management-application-templates' + | 'application-management-projects' + | 'application-management-configurations' + | 'application-management-policies' + | 'infrastructure-management-overview' + | 'infrastructure-management-applications' + | 'infrastructure-management-chart-store' + | 'infrastructure-management-resource-browser' + | 'infrastructure-management-resource-watcher' + | 'infrastructure-management-catalog-framework' + | 'software-release-management-overview' + | 'software-release-management-release-hub' + | 'software-release-management-tenants' + | 'cost-visibility-overview' + | 'cost-visibility-cost-breakdown' + | 'cost-visibility-configurations' + | 'security-center-overview' + | 'security-center-security-vulnerabilities' + | 'security-center-security-enablement' + | 'security-center-security-policy' + | 'automation-and-enablement-jobs' + | 'automation-and-enablement-alerting' + | 'automation-and-enablement-incident-response' + | 'automation-and-enablement-api-portal' + | 'automation-and-enablement-runbook-automation' + | 'global-configuration-sso-login-services' + | 'global-configuration-host-urls' + | 'global-configuration-external-links' + | 'global-configuration-chart-repository' + | 'global-configuration-cluster-and-environments' + | 'global-configuration-container-oci-registry' + | 'global-configuration-authorization' + | 'data-protection-overview' + | 'data-protection-backup-and-schedule' + | 'data-protection-restores' + | 'data-protection-backup-repositories' + | 'data-protection-backup-locations' + | 'data-protection-history-and-logs' + +export type NavigationSubMenuItemID = + | 'application-management-configurations-gitops' + | 'application-management-configurations-git-accounts' + | 'application-management-configurations-deployment-charts' + | 'application-management-configurations-notifications' + | 'application-management-configurations-catalog-frameworks' + | 'application-management-configurations-scoped-variables' + | 'application-management-configurations-build-infra' + | 'application-management-policies-deployment-window' + | 'application-management-policies-approval-policy' + | 'application-management-policies-plugin-policy' + | 'application-management-policies-pull-image-digest' + | 'application-management-policies-tag-policy' + | 'application-management-policies-filter-conditions' + | 'application-management-policies-image-promotion' + | 'application-management-policies-lock-deployment-configuration' + | 'cost-visibility-cost-breakdown-clusters' + | 'cost-visibility-cost-breakdown-environments' + | 'cost-visibility-cost-breakdown-projects' + | 'cost-visibility-cost-breakdown-applications' + | 'global-configuration-authorization-user-permissions' + | 'global-configuration-authorization-permission-groups' + | 'global-configuration-authorization-api-tokens' + +export type NavigationRootItemID = + | 'application-management' + | 'infrastructure-management' + | 'software-release-management' + | 'cost-visibility' + | 'security-center' + | 'automation-and-enablement' + | 'data-protection-management' + | 'global-configuration' + +export type CommonNavigationItemType = { + title: string + dataTestId: string + icon: IconsProps['name'] + href: string + disabled?: boolean + keywords?: string[] + forceHideEnvKey?: keyof customEnv + hideNav?: boolean + isAvailableInEA?: boolean +} + +export type NavigationItemType = Pick< + CommonNavigationItemType, + 'dataTestId' | 'title' | 'disabled' | 'keywords' | 'hideNav' | 'forceHideEnvKey' | 'isAvailableInEA' +> & { + id: NavigationItemID +} & ( + | (Pick & { + hasSubMenu?: false + subItems?: never + }) + | (Never> & { + hasSubMenu: true + subItems: (Omit & { id: NavigationSubMenuItemID })[] + }) + ) + +export interface NavigationGroupType + extends Pick { + id: NavigationRootItemID + items: NavigationItemType[] + disabled?: boolean +} diff --git a/src/Pages-Devtron-2.0/Shared/Overview/components.tsx b/src/Pages-Devtron-2.0/Shared/Overview/components.tsx new file mode 100644 index 000000000..82e343284 --- /dev/null +++ b/src/Pages-Devtron-2.0/Shared/Overview/components.tsx @@ -0,0 +1,128 @@ +import { ReactNode, useState } from 'react' +import { NavLink } from 'react-router-dom' +import { motion } from 'framer-motion' + +import { ConditionalWrap } from '@Common/Helper' +import { Tooltip } from '@Common/Tooltip' +import { Button, ButtonStyleType, ButtonVariantType, Icon } from '@Shared/Components' + +import { MetricsInfoCardProps, SectionEmptyStateProps } from './types' + +export const SectionEmptyState = ({ + iconName = 'ic-priority-medium-fill', + iconColor, + title, + subtitle, + buttonConfig, +}: SectionEmptyStateProps) => ( +
+ +
+ {title} + {subtitle && {subtitle}} +
+ {buttonConfig &&
+) + +const navLinkWrap = (redirectionLink: string) => (children: ReactNode) => ( + {children} +) + +export const MetricsInfoLoadingCard = ({ withSubtitle }: { withSubtitle?: boolean }) => ( +
+
+
+ + +
+
+
+ {withSubtitle && ( +
+ +
+ )} +
+) + +export const MetricsInfoCard = ({ + dataTestId, + metricTitle, + metricValue, + metricUnit, + valueOutOf, + iconName, + subtitle, + redirectionLink, + tooltipContent, + subtitleRedirection, +}: MetricsInfoCardProps) => { + const [isHovering, setIsHovering] = useState(false) + + const handleHoverStart = () => setIsHovering(true) + const handleHoverEnd = () => setIsHovering(false) + + return ( + + +
+
+ + + {metricTitle} + + +
+ {metricValue} + {valueOutOf && ( + / {valueOutOf} + )} + {metricUnit && ( + {metricUnit} + )} +
+
+
+ {redirectionLink && isHovering ? ( +
+
+ {subtitle && ( +
+ + + {subtitle} + + +
+ )} + + + ) +} + +export const LoadingDonutChart = () => ( +
+
+
+ + +
+
+) diff --git a/src/Pages-Devtron-2.0/Shared/Overview/constants.ts b/src/Pages-Devtron-2.0/Shared/Overview/constants.ts new file mode 100644 index 000000000..c83e60d16 --- /dev/null +++ b/src/Pages-Devtron-2.0/Shared/Overview/constants.ts @@ -0,0 +1,27 @@ +const OVERVIEW_DEFAULT_PAGE_SIZE = { + SMALL: 5, + MEDIUM: 10, + LARGE: 20, +} + +export const OVERVIEW_PAGE_SIZE_OPTIONS = [ + { + value: OVERVIEW_DEFAULT_PAGE_SIZE.MEDIUM, + selected: true, + }, + { + value: OVERVIEW_DEFAULT_PAGE_SIZE.LARGE, + selected: false, + }, +] + +export const OVERVIEW_PAGE_SIZE_OPTIONS_SMALL = [ + { + value: OVERVIEW_DEFAULT_PAGE_SIZE.SMALL, + selected: true, + }, + { + value: OVERVIEW_DEFAULT_PAGE_SIZE.MEDIUM, + selected: false, + }, +] diff --git a/src/Pages-Devtron-2.0/Shared/Overview/index.ts b/src/Pages-Devtron-2.0/Shared/Overview/index.ts new file mode 100644 index 000000000..d3f2deaa4 --- /dev/null +++ b/src/Pages-Devtron-2.0/Shared/Overview/index.ts @@ -0,0 +1,3 @@ +export * from './components' +export * from './constants' +export { type MetricsInfoCardProps, ProdNonProdSelectValueTypes } from './types' diff --git a/src/Pages-Devtron-2.0/Shared/Overview/types.ts b/src/Pages-Devtron-2.0/Shared/Overview/types.ts new file mode 100644 index 000000000..bf8556b87 --- /dev/null +++ b/src/Pages-Devtron-2.0/Shared/Overview/types.ts @@ -0,0 +1,29 @@ +import { ButtonComponentType, ButtonProps, IconName } from '@Shared/Components' +import { IconBaseColorType } from '@Shared/types' + +export interface SectionEmptyStateProps { + iconColor?: IconBaseColorType + iconName?: IconName + title: string + subtitle?: string + buttonConfig?: ButtonProps +} + +export interface MetricsInfoCardProps { + dataTestId: string + metricTitle: string + metricValue: string + metricUnit?: string + valueOutOf?: string + iconName: IconName + subtitle?: string + tooltipContent: string + redirectionLink?: string + subtitleRedirection?: string +} + +export enum ProdNonProdSelectValueTypes { + ALL = 'All', + PRODUCTION = 'Prod', + NON_PRODUCTION = 'Non-Prod', +} diff --git a/src/Pages-Devtron-2.0/Shared/index.ts b/src/Pages-Devtron-2.0/Shared/index.ts new file mode 100644 index 000000000..bb81fdde1 --- /dev/null +++ b/src/Pages-Devtron-2.0/Shared/index.ts @@ -0,0 +1 @@ +export * from './Overview' diff --git a/src/Pages-Devtron-2.0/index.ts b/src/Pages-Devtron-2.0/index.ts index 12ea29ca5..df634e1ce 100644 --- a/src/Pages-Devtron-2.0/index.ts +++ b/src/Pages-Devtron-2.0/index.ts @@ -2,4 +2,6 @@ export * from './ApplicationManagement' export * from './CostVisibility' export * from './DataProtectionManagement' export * from './InfrastructureManagement' +export * from './Navigation' export * from './SecurityCenter' +export * from './Shared' diff --git a/src/Shared/Components/CICDHistory/ConflictedResourcesTable.scss b/src/Shared/Components/CICDHistory/ConflictedResourcesTable.scss new file mode 100644 index 000000000..73ac26c03 --- /dev/null +++ b/src/Shared/Components/CICDHistory/ConflictedResourcesTable.scss @@ -0,0 +1,9 @@ +[id*="table__resource-conflict-details"] { + .generic-table__row { + .generic-table__cell { + display: flex; + align-items: center; + padding: 10px 0; + } + } +} \ No newline at end of file diff --git a/src/Shared/Components/CICDHistory/ConflictedResourcesTable.tsx b/src/Shared/Components/CICDHistory/ConflictedResourcesTable.tsx new file mode 100644 index 000000000..238293eae --- /dev/null +++ b/src/Shared/Components/CICDHistory/ConflictedResourcesTable.tsx @@ -0,0 +1,50 @@ +import { useMemo } from 'react' + +import { FiltersTypeEnum, PaginationEnum, Table, TableViewWrapperProps } from '../Table' +import { RowsType } from '../Table/types' +import { CONFLICTED_RESOURCES_COLUMNS } from './constants' +import { ConflictedResourcesTableProps, ResourceConflictItemType } from './types' + +import './ConflictedResourcesTable.scss' + +const Wrapper = ({ children }: TableViewWrapperProps) => ( +
{children}
+) +const filter = () => true + +const ConflictedResourcesTable = ({ resourceConflictDetails }: ConflictedResourcesTableProps) => { + const rows: RowsType = useMemo( + () => + (resourceConflictDetails || []).map[number]>((resource) => ({ + data: resource, + id: resource.id, + })), + [resourceConflictDetails], + ) + + return ( + + id="table__resource-conflict-details" + columns={CONFLICTED_RESOURCES_COLUMNS} + rows={rows} + emptyStateConfig={{ + noRowsConfig: { + title: 'No resource found', + }, + noRowsForFilterConfig: { + title: 'No results', + subTitle: "We couldn't find any matching results", + }, + }} + paginationVariant={PaginationEnum.NOT_PAGINATED} + additionalFilterProps={{ + initialSortKey: 'name' satisfies keyof ResourceConflictItemType, + }} + filtersVariant={FiltersTypeEnum.STATE} + ViewWrapper={Wrapper} + filter={filter} + /> + ) +} + +export default ConflictedResourcesTable diff --git a/src/Shared/Components/CICDHistory/ResourceConflictDeployDialog.tsx b/src/Shared/Components/CICDHistory/ResourceConflictDeployDialog.tsx new file mode 100644 index 000000000..b102547cf --- /dev/null +++ b/src/Shared/Components/CICDHistory/ResourceConflictDeployDialog.tsx @@ -0,0 +1,57 @@ +import { useState } from 'react' +import { useHistory, useParams } from 'react-router-dom' + +import { URLS } from '@Common/Constants' +import { showError } from '@Common/Helper' + +import { ButtonStyleType } from '../Button' +import { ConfirmationModal, ConfirmationModalVariantType } from '../ConfirmationModal' +import { Icon } from '../Icon' +import { resourceConflictRedeploy } from './service' +import { ResourceConflictDeployDialogProps, ResourceConflictDeployDialogURLParamsType } from './types' + +const ResourceConflictDeployDialog = ({ appName, environmentName, handleClose }: ResourceConflictDeployDialogProps) => { + const history = useHistory() + const { appId, envId, pipelineId, triggerId } = useParams() + const [isLoading, setIsLoading] = useState(false) + + const handleDeploy = async () => { + setIsLoading(true) + try { + await resourceConflictRedeploy({ + pipelineId, + triggerId, + appId, + }) + setIsLoading(false) + history.push(`${URLS.APPLICATION_MANAGEMENT_APP}/${appId}/details/${envId}`) + } catch (error) { + showError(error) + setIsLoading(false) + } + } + + return ( + } + title="Take resource ownership and redeploy" + subtitle={`Ensure the resources belong to the '${appName}' application and the '${environmentName}' environment to avoid destructive changes.`} + handleClose={handleClose} + buttonConfig={{ + secondaryButtonConfig: { + text: 'Cancel', + onClick: handleClose, + }, + primaryButtonConfig: { + isLoading, + text: 'Re-deploy', + onClick: handleDeploy, + style: ButtonStyleType.warning, + }, + }} + /> + ) +} + +export default ResourceConflictDeployDialog diff --git a/src/Shared/Components/CICDHistory/ResourceConflictDetailsModal.tsx b/src/Shared/Components/CICDHistory/ResourceConflictDetailsModal.tsx new file mode 100644 index 000000000..3b9e49982 --- /dev/null +++ b/src/Shared/Components/CICDHistory/ResourceConflictDetailsModal.tsx @@ -0,0 +1,125 @@ +import { useState } from 'react' +import { useHistory, useParams } from 'react-router-dom' + +import { useQuery } from '@Common/API' +import { URLS } from '@Common/Constants' +import { Drawer } from '@Common/Drawer' +import { showError, stopPropagation } from '@Common/Helper' +import { ComponentSizeType } from '@Shared/constants' + +import { APIResponseHandler } from '../APIResponseHandler' +import { Button, ButtonStyleType, ButtonVariantType } from '../Button' +import { Icon } from '../Icon' +import ConflictedResourcesTable from './ConflictedResourcesTable' +import { getResourceConflictDetails, resourceConflictRedeploy } from './service' +import { + ResourceConflictDeployDialogURLParamsType, + ResourceConflictDetailsModalProps, + ResourceConflictItemType, +} from './types' + +const ResourceConflictDetailsModal = ({ appName, environmentName, handleClose }: ResourceConflictDetailsModalProps) => { + const { appId, envId, pipelineId, triggerId } = useParams() + const history = useHistory() + + const { + isFetching: isLoadingResourceData, + data: resourceConflictDetails, + refetch: refetchResourceConflictDetails, + error: resourceConflictDetailsError, + } = useQuery({ + queryKey: ['getResourceConflictDetails', pipelineId, triggerId, appId], + queryFn: ({ signal }) => getResourceConflictDetails({ pipelineId, triggerId, appId, signal }), + }) + + const [isDeploying, setIsDeploying] = useState(false) + + const handleDeploy = async () => { + setIsDeploying(true) + try { + await resourceConflictRedeploy({ + pipelineId, + triggerId, + appId, + }) + setIsDeploying(false) + history.push(`${URLS.APPLICATION_MANAGEMENT_APP}/${appId}/details/${envId}`) + } catch (error) { + showError(error) + setIsDeploying(false) + } + } + + return ( + +
+
+
+

Resources with conflict

+ +
+ +
+ + + +
+
+ +
+
+ +
+ Take resource ownership and redeploy + + Ensure all resources strictly belong to the {appName} application and the  + {environmentName} + environment. Any resource outside this Helm release may cause incorrect associations and + potentially destructive changes. + +
+
+
+
+
+
+ + ) +} + +export default ResourceConflictDetailsModal diff --git a/src/Shared/Components/CICDHistory/Sidebar.tsx b/src/Shared/Components/CICDHistory/Sidebar.tsx index 16e9e1cf7..11395f673 100644 --- a/src/Shared/Components/CICDHistory/Sidebar.tsx +++ b/src/Shared/Components/CICDHistory/Sidebar.tsx @@ -41,7 +41,12 @@ import { HistorySummaryCardType, SidebarType, } from './types' -import { getHistoryItemStatusIconFromWorkflowStages, getTriggerStatusIcon, getWorkflowNodeStatusTitle } from './utils' +import { + getHistoryItemStatusIconFromWorkflowStages, + getSortedTriggerHistory, + getTriggerStatusIcon, + getWorkflowNodeStatusTitle, +} from './utils' /** * @description To be shown on deployment history or when we don't have workflowExecutionStages @@ -378,30 +383,28 @@ const Sidebar = React.memo( {fetchIdData === FetchIdDataStatus.SUCCESS && ( )} - {Array.from(triggerHistory) - .sort(([a], [b]) => b - a) - .map(([triggerId, triggerDetails], index) => ( - - ))} + {getSortedTriggerHistory(triggerHistory).map(([triggerId, triggerDetails], index) => ( + + ))} {hasMore && (fetchIdData === FetchIdDataStatus.SUSPEND || !fetchIdData) && ( )} diff --git a/src/Shared/Components/CICDHistory/TriggerDetails.tsx b/src/Shared/Components/CICDHistory/TriggerDetails.tsx index ffd7738ca..c6166c105 100644 --- a/src/Shared/Components/CICDHistory/TriggerDetails.tsx +++ b/src/Shared/Components/CICDHistory/TriggerDetails.tsx @@ -26,6 +26,7 @@ import { ZERO_TIME_STRING } from '@Common/Constants' import { CommitChipCell } from '@Shared/Components/CommitChipCell' import { ImageChipCell } from '@Shared/Components/ImageChipCell' import { getHandleOpenURL } from '@Shared/Helpers' +import { useMainContext } from '@Shared/Providers' import { ToastManager, ToastVariantType } from '@Shared/Services' import { getDeploymentStageTitle } from '@Pages/Applications' @@ -34,15 +35,19 @@ import { GitTriggers } from '../../types' import { Button, ButtonStyleType, ButtonVariantType } from '../Button' import { ConfirmationModal, ConfirmationModalVariantType } from '../ConfirmationModal' import { Icon } from '../Icon' +import { InfoBlock } from '../InfoBlock' import { DEFAULT_CLUSTER_ID, DEFAULT_ENV, EXECUTION_FINISHED_TEXT_MAP, PROGRESSING_STATUS, PULSATING_STATUS_MAP, + RESOURCE_CONFLICT_DEPLOY_ERROR, statusColor as colorMap, TERMINAL_STATUS_COLOR_CLASS_MAP, } from './constants' +import ResourceConflictDeployDialog from './ResourceConflictDeployDialog' +import ResourceConflictDetailsModal from './ResourceConflictDetailsModal' import { cancelCiTrigger, cancelPrePostCdTrigger } from './service' import { CurrentStatusIconProps, @@ -50,6 +55,7 @@ import { FinishedType, HistoryComponentType, ProgressingStatusType, + ResourceConflictModalType, StartDetailsType, TriggerDetailsType, WorkflowStageStatusType, @@ -445,128 +451,218 @@ const TriggerDetails = memo( renderTargetConfigInfo, workflowExecutionStages, namespace, + isLatest, + appName, }: TriggerDetailsType) => { + const { isFELibAvailable } = useMainContext() + + const [resourceConflictModal, setResourceConflictModal] = useState(null) + const executionInfo = useMemo( () => sanitizeWorkflowExecutionStages(workflowExecutionStages), [workflowExecutionStages], ) - return ( -
-
-
-
-
-
- {renderDetailsSuccessIconBlock()} -
-
+ const errorMessage = executionInfo?.workerDetails.message || message -
- -
-
+ const showResourceConflictInfoBlock = + isFELibAvailable && + isLatest && + (type === HistoryComponentType.CD || type === HistoryComponentType.GROUP_CD) && + stage === DeploymentStageType.DEPLOY && + errorMessage?.includes(RESOURCE_CONFLICT_DEPLOY_ERROR) + + const handleShowRedeployDialog = () => { + setResourceConflictModal(ResourceConflictModalType.DEPLOY_DIALOG) + } + + const handleShowResourceConflictDetailsModal = () => { + setResourceConflictModal(ResourceConflictModalType.RESOURCE_DETAIL_MODAL) + } + + const handleCloseRedeployModal = () => { + setResourceConflictModal(null) + } + + const renderInfoBlockDescription = () => ( +
+
+ ) - {!!triggerMetadata && !!renderDeploymentHistoryTriggerMetaText && ( + const renderDialogs = () => { + if (resourceConflictModal === ResourceConflictModalType.DEPLOY_DIALOG) { + return ( + + ) + } + + if (resourceConflictModal === ResourceConflictModalType.RESOURCE_DETAIL_MODAL) { + return ( + + ) + } + + return null + } + + return ( + <> +
+
- {renderBlockWithBorder()} - {renderDeploymentHistoryTriggerMetaText(triggerMetadata, true)} - {renderBlockWithBorder()} +
+ {renderDetailsSuccessIconBlock()}
- {renderDeploymentHistoryTriggerMetaText(triggerMetadata)} +
+ +
- )} - {isJobView && ( -
-
-
- {renderBlockWithBorder()} - - {renderBlockWithBorder()} + {!!triggerMetadata && !!renderDeploymentHistoryTriggerMetaText && ( +
+
+
+ {renderBlockWithBorder()} + {renderDeploymentHistoryTriggerMetaText(triggerMetadata, true)} + {renderBlockWithBorder()} +
+ + {renderDeploymentHistoryTriggerMetaText(triggerMetadata)}
+ )} -
- Env - - {environmentName !== '' ? environmentName : DEFAULT_ENV} - - {environmentName === '' && (Default)} + {isJobView && ( +
+
+
+ {renderBlockWithBorder()} + + {renderBlockWithBorder()} +
+
+ +
+ Env + + {environmentName !== '' ? environmentName : DEFAULT_ENV} + + {environmentName === '' && (Default)} +
-
- )} + )} + + {!!executionInfo?.executionStartedOn && ( +
+
+
+ {renderBlockWithBorder()} + {renderDetailsSuccessIconBlock()} +
+
+ +
+

Execution started

+ +
+
+ )} - {!!executionInfo?.executionStartedOn && (
{renderBlockWithBorder()} - {renderDetailsSuccessIconBlock()} + + + +
-
-

Execution started

- -
+
- )} - -
-
-
- {renderBlockWithBorder()} - - -
-
+
+ + {showResourceConflictInfoBlock && ( +
+ , + onClick: handleShowRedeployDialog, + variant: ButtonVariantType.text, + style: ButtonStyleType.warning, + size: ComponentSizeType.medium, + }} + /> +
+ )} +
- - -
- -
-
-
+ + {renderDialogs()} + ) }, ) diff --git a/src/Shared/Components/CICDHistory/TriggerOutput.tsx b/src/Shared/Components/CICDHistory/TriggerOutput.tsx index f3929c229..df565dcae 100644 --- a/src/Shared/Components/CICDHistory/TriggerOutput.tsx +++ b/src/Shared/Components/CICDHistory/TriggerOutput.tsx @@ -47,8 +47,9 @@ import { statusSet, terminalStatus, TriggerOutputProps, + TriggerOutputURLParamsType, } from './types' -import { getTriggerOutputTabs } from './utils' +import { getSortedTriggerHistory, getTriggerOutputTabs } from './utils' import './cicdHistory.scss' @@ -250,12 +251,7 @@ const TriggerOutput = ({ renderTargetConfigInfo, appName, }: TriggerOutputProps) => { - const { appId, triggerId, envId, pipelineId } = useParams<{ - appId: string - triggerId: string - envId: string - pipelineId: string - }>() + const { appId, triggerId, envId, pipelineId } = useParams() const triggerDetails = triggerHistory.get(+triggerId) const [triggerDetailsLoading, triggerDetailsResult, triggerDetailsError, reloadTriggerDetails] = useAsync( () => getTriggerDetails({ appId, envId, pipelineId, triggerId, fetchIdData }), @@ -363,6 +359,8 @@ const TriggerOutput = ({ useInterval(reloadTriggerDetails, timeout) + const latestTriggerHistoryId = useMemo(() => getSortedTriggerHistory(triggerHistory)?.[0]?.[0], [triggerHistory]) + if ( (!areTagDetailsRequired && triggerDetailsLoading && !triggerDetails) || !triggerId || @@ -411,6 +409,8 @@ const TriggerOutput = ({ renderTargetConfigInfo={renderTargetConfigInfo} workflowExecutionStages={triggerDetails.workflowExecutionStages} namespace={triggerDetails.namespace} + isLatest={latestTriggerHistoryId === triggerDetails.id} + appName={appName} />
diff --git a/src/Shared/Components/CICDHistory/WorkerStatus.tsx b/src/Shared/Components/CICDHistory/WorkerStatus.tsx index ccf7c79fa..69ce4d7bd 100644 --- a/src/Shared/Components/CICDHistory/WorkerStatus.tsx +++ b/src/Shared/Components/CICDHistory/WorkerStatus.tsx @@ -41,6 +41,7 @@ const WorkerStatus = memo( titleClassName = 'cn-9 fs-13 fw-4 lh-20', viewWorkerPodClassName = 'fs-13', hideShowMoreMessageButton = false, + children, }: WorkerStatusType): JSX.Element | null => { if (!message && !podStatus) { return null @@ -98,6 +99,8 @@ const WorkerStatus = memo( hideShowMore={hideShowMoreMessageButton} /> )} + + {children}
) diff --git a/src/Shared/Components/CICDHistory/constants.tsx b/src/Shared/Components/CICDHistory/constants.tsx index 9d3d366f5..e0b4a3cf6 100644 --- a/src/Shared/Components/CICDHistory/constants.tsx +++ b/src/Shared/Components/CICDHistory/constants.tsx @@ -14,10 +14,12 @@ * limitations under the License. */ +import { stringComparatorBySortOrder } from '@Shared/Helpers' import { WorkflowStatusEnum } from '@Shared/types' import { multiSelectStyles } from '../../../Common/MultiSelectCustomization' -import { WorkflowStageStatusType } from './types' +import { FiltersTypeEnum, TableProps } from '../Table' +import { ResourceConflictItemType, WorkflowStageStatusType } from './types' export const HISTORY_LABEL = { APPLICATION: 'Application', @@ -170,3 +172,48 @@ export const FAILED_WORKFLOW_STAGE_STATUS_MAP: Record< } export const APP_HEALTH_DROP_DOWN_LIST = ['inprogress', 'failed', 'disconnect', 'timed_out'] + +export const RESOURCE_CONFLICT_DEPLOY_ERROR = 'cannot be imported into the current release: invalid ownership metadata;' + +export const CONFLICTED_RESOURCES_COLUMNS: TableProps['columns'] = [ + { + field: 'name' satisfies keyof ResourceConflictItemType, + label: 'Name', + size: { + range: { + startWidth: 250, + maxWidth: 400, + minWidth: 120, + }, + }, + isSortable: true, + comparator: stringComparatorBySortOrder, + horizontallySticky: true, + }, + { + field: 'namespace' satisfies keyof ResourceConflictItemType, + label: 'Namespace', + size: { + range: { + startWidth: 150, + maxWidth: 400, + minWidth: 100, + }, + }, + comparator: stringComparatorBySortOrder, + isSortable: true, + }, + { + field: 'gvkTitle' satisfies keyof ResourceConflictItemType, + label: 'GVK', + size: { + range: { + startWidth: 250, + maxWidth: 400, + minWidth: 100, + }, + }, + isSortable: true, + comparator: stringComparatorBySortOrder, + }, +] diff --git a/src/Shared/Components/CICDHistory/service.tsx b/src/Shared/Components/CICDHistory/service.tsx index 6a130c68c..1a85c464d 100644 --- a/src/Shared/Components/CICDHistory/service.tsx +++ b/src/Shared/Components/CICDHistory/service.tsx @@ -15,11 +15,23 @@ */ /* eslint-disable dot-notation */ +import { generatePath } from 'react-router-dom' import moment from 'moment' -import { get, getUrlWithSearchParams, ResponseType, ROUTES, sanitizeUserApprovalMetadata, trash } from '../../../Common' +import { ToastManager, ToastVariantType } from '@Shared/Services' +import { GVKType, K8S_EMPTY_GROUP } from '@Pages/ResourceBrowser' + +import { + get, + getUrlWithSearchParams, + post, + ResponseType, + ROUTES, + sanitizeUserApprovalMetadata, + trash, +} from '../../../Common' import { DATE_TIME_FORMAT_STRING, DEPLOYMENT_HISTORY_CONFIGURATION_LIST_MAP, EXTERNAL_TYPES } from '../../constants' -import { decode, isNullOrUndefined } from '../../Helpers' +import { decode, getGVKTitle, getUniqueId, isNullOrUndefined } from '../../Helpers' import { ResourceKindType, ResourceVersionType } from '../../types' import { DeploymentHistoryDetail, @@ -27,7 +39,12 @@ import { DeploymentHistorySingleValue, DeploymentStatusDetailsResponse, FetchIdDataStatus, + GetResourceConflictDetailsParamsType, ModuleConfigResponse, + ResourceConflictItemType, + ResourceConflictListItemDTO, + ResourceConflictRedeployParamsType, + ResourceConflictRedeployPayloadType, TriggerDetailsResponseType, TriggerHistoryParamsType, } from './types' @@ -292,3 +309,51 @@ export const getTriggerHistory = async ({ export const getModuleConfigured = (moduleName: string): Promise => get(`${ROUTES.MODULE_CONFIGURED}?name=${moduleName}`) + +export const resourceConflictRedeploy = async ({ + pipelineId, + triggerId, + appId, +}: ResourceConflictRedeployParamsType) => { + await post(ROUTES.CD_TRIGGER_POST, { + pipelineId: +pipelineId, + wfrIdForDeploymentWithSpecificTrigger: +triggerId, + appId: +appId, + helmRedeploymentRequest: true, + }) + + ToastManager.showToast({ + variant: ToastVariantType.success, + title: 'Redeployment initiated', + description: 'Redeployment for application has been successfully initiated.', + }) +} + +export const getResourceConflictDetails = async ({ + appId, + pipelineId, + triggerId, + signal, +}: GetResourceConflictDetailsParamsType): Promise => { + const { result } = await get( + generatePath(ROUTES.RESOURCE_CONFLICTS_LIST, { + appId, + pipelineId, + wfrId: triggerId, + }), + { signal }, + ) + + return (result?.conflictingResources || []).map((resource) => ({ + name: resource.name || '', + namespace: resource.namespace || '', + gvk: { + Group: resource.groupVersionKind.Group || K8S_EMPTY_GROUP, + Version: resource.groupVersionKind.Version || '', + Kind: resource.groupVersionKind.Kind || ('' as GVKType['Kind']), + }, + gvkTitle: getGVKTitle(resource.groupVersionKind), + clusterId: result.clusterId, + id: getUniqueId(), + })) +} diff --git a/src/Shared/Components/CICDHistory/types.tsx b/src/Shared/Components/CICDHistory/types.tsx index 7f6f8483f..58a299b95 100644 --- a/src/Shared/Components/CICDHistory/types.tsx +++ b/src/Shared/Components/CICDHistory/types.tsx @@ -17,6 +17,7 @@ import { CSSProperties, MutableRefObject, ReactElement, ReactNode } from 'react' import { SupportedKeyboardKeysType } from '@Common/Hooks/UseRegisterShortcut/types' +import { GVKType } from '@Pages/ResourceBrowser' import { DeploymentAppTypes, @@ -35,6 +36,7 @@ import { DeploymentStageType } from '../../constants' import { AggregationKeys, AppDetails, + BaseURLParams, DeploymentStatusDetailsBreakdownDataType, DeploymentStatusDetailsType, DeploymentStatusTimelineType, @@ -331,6 +333,32 @@ export interface TriggerDetailsType workerPodName?: string triggerMetadata?: string renderDeploymentHistoryTriggerMetaText: (triggerMetaData: string, onlyRenderIcon?: boolean) => JSX.Element + /** + * Only present in case of CD trigger details as of now + */ + isLatest?: boolean + /** + * Only present in case of CD trigger details as of now + */ + appName?: string +} + +export enum ResourceConflictModalType { + DEPLOY_DIALOG = 'DEPLOY_DIALOG', + RESOURCE_DETAIL_MODAL = 'RESOURCE_DETAIL_MODAL', +} + +interface ResourceConflictDialogBaseProps extends Required> { + handleClose: () => void +} + +export interface ResourceConflictDeployDialogProps extends ResourceConflictDialogBaseProps {} + +export interface ResourceConflictDetailsModalProps extends ResourceConflictDialogBaseProps {} + +export interface TriggerOutputURLParamsType extends Pick { + triggerId: string + pipelineId: string } export type ProgressingStatusType = { @@ -362,6 +390,7 @@ export interface WorkerStatusType * @default false */ hideShowMoreMessageButton?: boolean + children?: ReactNode } export type FinishedType = { artifact: string; type: HistoryComponentType } & ( @@ -856,3 +885,50 @@ export interface CIPipelineSourceConfigInterface { primaryBranchAfterRegex?: string rootClassName?: string } + +export interface ResourceConflictItemType { + name: string + namespace: string + gvk: GVKType + gvkTitle: string + clusterId: number + /** + * Generated at ui + */ + id: string +} + +export interface ConflictedResourcesTableProps { + resourceConflictDetails: ResourceConflictItemType[] +} + +export interface ResourceConflictDeployDialogURLParamsType + extends Pick {} + +export interface ResourceConflictRedeployParamsType + extends Pick {} + +export interface ResourceConflictRedeployPayloadType { + pipelineId: number + appId: number + wfrIdForDeploymentWithSpecificTrigger: number + helmRedeploymentRequest: true +} + +export interface GetResourceConflictDetailsParamsType + extends Pick { + signal: AbortSignal +} + +export interface ResourceConflictListItemDTO { + clusterId: number + conflictingResources: { + name: string + namespace: string + groupVersionKind: { + Group: string + Version: string + Kind: NodeType + } + }[] +} diff --git a/src/Shared/Components/CICDHistory/utils.tsx b/src/Shared/Components/CICDHistory/utils.tsx index 90f66bd1f..430d4622f 100644 --- a/src/Shared/Components/CICDHistory/utils.tsx +++ b/src/Shared/Components/CICDHistory/utils.tsx @@ -460,3 +460,6 @@ export const getTriggerOutputTabs = ( ] : []), ] + +export const getSortedTriggerHistory = (triggerHistory: Map) => + Array.from(triggerHistory).sort(([a], [b]) => b - a) diff --git a/src/Shared/Components/DocLink/constants.ts b/src/Shared/Components/DocLink/constants.ts index c4775d779..029e3d3af 100644 --- a/src/Shared/Components/DocLink/constants.ts +++ b/src/Shared/Components/DocLink/constants.ts @@ -42,23 +42,24 @@ export const DOCUMENTATION = { CHART_STORE: 'usage/deploy-chart', CHART_STORE_METRICS_SERVER: 'dashboard//chart-store/discover?appStoreName=metrics-server', CUSTOM_VALUES: 'usage/deploy-chart/overview-of-charts#custom-values', + CONFIGURING_WEBHOOK: 'usage/applications/creating-application/workflow/ci-pipeline#configuring-webhook', DEPLOYMENT: 'usage/applications/creating-application/deployment-template/deployment', DEPLOYMENT_TEMPLATE: 'usage/applications/creating-application/deployment-template', DEVTRON_UPGRADE: 'getting-started/upgrade', - CONFIGURING_WEBHOOK: 'usage/applications/creating-application/workflow/ci-pipeline#configuring-webhook', + DOC_HOME_PAGE: DOCUMENTATION_HOME_PAGE, ENTERPRISE_LICENSE: 'enterprise-license', EXECUTE_CUSTOM_SCRIPT: 'usage/applications/creating-application/workflow/ci-pipeline/ci-build-pre-post-plugins#execute-custom-script', EXTERNAL_LINKS: 'getting-started/global-configurations/external-links', EXTERNAL_SECRET: 'usage/applications/creating-application/secrets#external-secrets', HOME_PAGE: 'https://devtron.ai', - DOC_HOME_PAGE: DOCUMENTATION_HOME_PAGE, - KUBE_CONFIG: 'usage/resource-browser#running-kubectl-commands-locally', JOBS: 'usage/jobs', - TAINT: 'usage/resource-browser#taint-a-node', + KUBE_CONFIG: 'usage/resource-browser#running-kubectl-commands-locally', RESOURCE_BROWSER: 'usage/resource-browser', + TAINT: 'usage/resource-browser#taint-a-node', // Global Configurations + GLOBAL_CONFIGUDATIONS: 'getting-started/global-configurations', GLOBAL_CONFIG_API_TOKEN: 'getting-started/global-configurations/authorization/api-tokens', GLOBAL_CONFIG_BUILD_INFRA: 'global-configurations/build-infra', GLOBAL_CONFIG_CHART: 'getting-started/global-configurations/chart-repo', @@ -117,6 +118,9 @@ export const DOCUMENTATION = { GLOBAL_CONFIG_PULL_IMAGE_DIGEST: 'global-configurations/pull-image-digest', GLOBAL_CONFIG_TAGS: 'getting-started/global-configurations/tags-policy', + // Application Management + APP_MANAGEMENT: 'docs/user-guide/app-management', + // Software Release Management SOFTWARE_DISTRIBUTION_HUB: 'usage/software-distribution-hub', RELEASE_TRACKS: 'usage/software-distribution-hub/release-hub#creating-release-tracks-and-versions', @@ -126,8 +130,21 @@ export const DOCUMENTATION = { TENANTS_INSTALLATION: 'usage/software-distribution-hub/tenants', // Infrastructure Management - AUTOSCALER_DETECTION: 'user-guide/infra-management/infrastructure-overview#troubleshooting-autoscaler-detection', + AUTOSCALER_DETECTION: + 'docs/user-guide/infra-management/infrastructure-overview#troubleshooting-autoscaler-detection', + INFRA_MANAGEMENT: 'docs/user-guide/infra-management', // Cost Visibility - COST_CALCULATION: 'user-guide/finops/overview-cost-visibility#how-is-the-cost-calculated', + COST_BREAKDOWN: 'docs/user-guide/finops', + COST_CALCULATION: 'docs/user-guide/finops/overview-cost-visibility#how-is-the-cost-calculated', + COST_VISIBILITY_OVERVIEW: 'docs/user-guide/finops/overview-cost-visibility', + + // Security Center + SECURITY_CENTER: 'docs/user-guide/security-features', + + // AI Recommendations + AI_RECOMMENDATIONS: 'docs/user-guide/ai-recommendations', + + // Automation & Enablement + AUTOMATION_AND_ENABLEMENT: 'docs/user-guide/automation', } as const diff --git a/src/Shared/Components/Header/HeaderWithCreateButton/HeaderWithCreateButon.tsx b/src/Shared/Components/Header/HeaderWithCreateButton/HeaderWithCreateButon.tsx index 9301b40e3..f7000d997 100644 --- a/src/Shared/Components/Header/HeaderWithCreateButton/HeaderWithCreateButon.tsx +++ b/src/Shared/Components/Header/HeaderWithCreateButton/HeaderWithCreateButon.tsx @@ -22,6 +22,7 @@ import { BreadCrumb, BreadcrumbText, useBreadcrumb } from '@Common/index' import { ActionMenu } from '@Shared/Components/ActionMenu' import { ButtonComponentType } from '@Shared/Components/Button' import Button from '@Shared/Components/Button/Button.component' +import { DOCUMENTATION } from '@Shared/Components/DocLink' import { Icon } from '@Shared/Components/Icon' import { ComponentSizeType } from '@Shared/constants' import { useMainContext } from '@Shared/Providers' @@ -93,6 +94,16 @@ export const HeaderWithCreateButton = ({ viewType }: HeaderWithCreateButtonProps ) const renderBreadcrumbs = () => + const getDocPath = () => { + if (viewType === 'jobs') { + return DOCUMENTATION.AUTOMATION_AND_ENABLEMENT + } + if (viewType === 'infra-apps') { + return DOCUMENTATION.INFRA_MANAGEMENT + } + return DOCUMENTATION.APP_MANAGEMENT + } + return (
) diff --git a/src/Shared/Components/Header/HelpButton.tsx b/src/Shared/Components/Header/HelpButton.tsx index 975f046ea..7e745eb14 100644 --- a/src/Shared/Components/Header/HelpButton.tsx +++ b/src/Shared/Components/Header/HelpButton.tsx @@ -55,7 +55,13 @@ const CheckForUpdates = ({
) -export const HelpButton = ({ serverInfo, fetchingServerInfo, onClick, hideGettingStartedCard }: HelpButtonProps) => { +export const HelpButton = ({ + serverInfo, + fetchingServerInfo, + onClick, + hideGettingStartedCard, + docPath, +}: HelpButtonProps) => { // STATES const [isActionMenuOpen, setIsActionMenuOpen] = useState(false) const [expiryDate, setExpiryDate] = useState(0) @@ -96,7 +102,7 @@ export const HelpButton = ({ serverInfo, fetchingServerInfo, onClick, hideGettin setSidePanelConfig((prev) => ({ ...prev, state: SidePanelTab.DOCUMENTATION, - docLink: DOCUMENTATION_HOME_PAGE, + docLink: `${DOCUMENTATION_HOME_PAGE}${docPath ? `/${docPath}` : ''}`, reinitialize: true, })) } @@ -150,6 +156,7 @@ export const HelpButton = ({ serverInfo, fetchingServerInfo, onClick, hideGettin options={getHelpActionMenuOptions({ isTrialOrFreemium: (licenseData?.isTrial || licenseData?.isFreemium) ?? false, isEnterprise, + docPath, })} onClick={handleActionMenuClick} onOpen={setIsActionMenuOpen} diff --git a/src/Shared/Components/Header/PageHeader.tsx b/src/Shared/Components/Header/PageHeader.tsx index 2ccb423ff..fd3f84b5d 100644 --- a/src/Shared/Components/Header/PageHeader.tsx +++ b/src/Shared/Components/Header/PageHeader.tsx @@ -50,6 +50,7 @@ const PageHeader = ({ onClose, tippyProps, closeIcon, + docPath, }: PageHeaderType) => { const { setLoginCount, setShowGettingStartedCard, setSidePanelConfig, sidePanelConfig, tempAppWindowConfig } = useMainContext() @@ -158,6 +159,7 @@ const PageHeader = ({ fetchingServerInfo={currentServerInfo.fetchingServerInfo} onClick={handleHelpButtonClick} hideGettingStartedCard={hideGettingStartedCard} + docPath={docPath} /> {!window._env_.K8S_CLIENT && ( ): HelpButtonActionMenuProps['options'][number]['items'] => [ ...((!window._env_?.K8S_CLIENT ? [ { @@ -36,7 +38,7 @@ export const COMMON_HELP_ACTION_MENU_ITEMS: HelpButtonActionMenuProps['options'] label: 'View documentation', startIcon: { name: 'ic-book-open' }, componentType: 'anchor', - href: DOCUMENTATION_HOME_PAGE, + href: `${DOCUMENTATION_HOME_PAGE}${docPath ? `/${docPath}` : ''}`, }, { id: HelpMenuItems.DEVTRON_GPT, diff --git a/src/Shared/Components/Header/types.ts b/src/Shared/Components/Header/types.ts index c97da44dc..4065c8a4e 100644 --- a/src/Shared/Components/Header/types.ts +++ b/src/Shared/Components/Header/types.ts @@ -39,6 +39,7 @@ export interface PageHeaderType { } onClose?: () => void closeIcon?: JSX.Element + docPath?: string } export interface ServerInfo { @@ -52,7 +53,7 @@ export interface ServerInfoResponse extends ResponseType { result?: ServerInfo } -export interface HelpButtonProps { +export interface HelpButtonProps extends Pick { serverInfo: ServerInfo fetchingServerInfo: boolean onClick: () => void @@ -79,3 +80,8 @@ export interface ProfileMenuProps { user: string onClick?: () => void } + +export interface HelpActionOptionTypes extends Pick { + isEnterprise: boolean + isTrialOrFreemium: boolean +} diff --git a/src/Shared/Components/Header/utils.ts b/src/Shared/Components/Header/utils.ts index 50dae36d9..af79adaf6 100644 --- a/src/Shared/Components/Header/utils.ts +++ b/src/Shared/Components/Header/utils.ts @@ -17,13 +17,13 @@ import { LOGIN_COUNT } from '@Common/Constants' import { - COMMON_HELP_ACTION_MENU_ITEMS, ENTERPRISE_HELP_ACTION_MENU_ITEMS, ENTERPRISE_TRIAL_HELP_ACTION_MENU_ITEMS, + getCommonHelpActionMenuItems, OSS_HELP_ACTION_MENU_ITEMS, } from './constants' import { updatePostHogEvent } from './service' -import { HelpButtonActionMenuProps } from './types' +import { HelpActionOptionTypes, HelpButtonActionMenuProps } from './types' const millisecondsInDay = 86400000 export const getDateInMilliseconds = (days) => 1 + new Date().valueOf() + (days ?? 0) * millisecondsInDay @@ -45,12 +45,10 @@ export const setActionWithExpiry = (key: string, days: number): void => { export const getHelpActionMenuOptions = ({ isEnterprise, isTrialOrFreemium, -}: { - isEnterprise: boolean - isTrialOrFreemium: boolean -}): HelpButtonActionMenuProps['options'] => [ + docPath, +}: HelpActionOptionTypes): HelpButtonActionMenuProps['options'] => [ { - items: COMMON_HELP_ACTION_MENU_ITEMS, + items: getCommonHelpActionMenuItems({ docPath }), }, ...(isEnterprise ? [ diff --git a/src/Shared/Components/Icon/Icon.tsx b/src/Shared/Components/Icon/Icon.tsx index 4d80ff930..f9517d50e 100644 --- a/src/Shared/Components/Icon/Icon.tsx +++ b/src/Shared/Components/Icon/Icon.tsx @@ -64,6 +64,7 @@ import { ReactComponent as ICCaretLeft } from '@IconsV2/ic-caret-left.svg' import { ReactComponent as ICCaretRight } from '@IconsV2/ic-caret-right.svg' import { ReactComponent as ICCd } from '@IconsV2/ic-cd.svg' import { ReactComponent as ICChartLineUp } from '@IconsV2/ic-chart-line-up.svg' +import { ReactComponent as ICChartRepo } from '@IconsV2/ic-chart-repo.svg' import { ReactComponent as ICChatCircleDots } from '@IconsV2/ic-chat-circle-dots.svg' import { ReactComponent as ICChatCircleOnline } from '@IconsV2/ic-chat-circle-online.svg' import { ReactComponent as ICCheck } from '@IconsV2/ic-check.svg' @@ -129,6 +130,7 @@ import { ReactComponent as ICError } from '@IconsV2/ic-error.svg' import { ReactComponent as ICExitFullscreen } from '@IconsV2/ic-exit-fullscreen.svg' import { ReactComponent as ICExpandRightSm } from '@IconsV2/ic-expand-right-sm.svg' import { ReactComponent as ICExpandSm } from '@IconsV2/ic-expand-sm.svg' +import { ReactComponent as ICExternalLink } from '@IconsV2/ic-external-link.svg' import { ReactComponent as ICFailure } from '@IconsV2/ic-failure.svg' import { ReactComponent as ICFastForward } from '@IconsV2/ic-fast-forward.svg' import { ReactComponent as ICFile } from '@IconsV2/ic-file.svg' @@ -378,6 +380,7 @@ export const iconMap = { 'ic-caret-right': ICCaretRight, 'ic-cd': ICCd, 'ic-chart-line-up': ICChartLineUp, + 'ic-chart-repo': ICChartRepo, 'ic-chat-circle-dots': ICChatCircleDots, 'ic-chat-circle-online': ICChatCircleOnline, 'ic-check-all': ICCheckAll, @@ -443,6 +446,7 @@ export const iconMap = { 'ic-exit-fullscreen': ICExitFullscreen, 'ic-expand-right-sm': ICExpandRightSm, 'ic-expand-sm': ICExpandSm, + 'ic-external-link': ICExternalLink, 'ic-failure': ICFailure, 'ic-fast-forward': ICFastForward, 'ic-file-code': ICFileCode, diff --git a/src/Shared/Components/InfoBlock/InfoBlock.component.tsx b/src/Shared/Components/InfoBlock/InfoBlock.component.tsx index 9ebecb106..194cd67a1 100644 --- a/src/Shared/Components/InfoBlock/InfoBlock.component.tsx +++ b/src/Shared/Components/InfoBlock/InfoBlock.component.tsx @@ -98,7 +98,7 @@ const InfoBlock = ({ if (layout === 'row') { return (
-
+
{renderIcon()} {renderContent()}
diff --git a/src/Shared/Components/SelectPicker/SelectPickerTextArea.component.tsx b/src/Shared/Components/SelectPicker/SelectPickerTextArea.component.tsx index 5fe8fdb38..2f7181d94 100644 --- a/src/Shared/Components/SelectPicker/SelectPickerTextArea.component.tsx +++ b/src/Shared/Components/SelectPicker/SelectPickerTextArea.component.tsx @@ -183,10 +183,8 @@ export const SelectPickerTextArea = ({ selectRef.current.inputRef.selectionEnd = selectionStart + 1 }) - return + updateValueIfOnlyDirty() } - - updateValueIfOnlyDirty() } return ( diff --git a/src/Shared/Components/Table/InternalTable.tsx b/src/Shared/Components/Table/InternalTable.tsx index fc93f5203..d179c91a4 100644 --- a/src/Shared/Components/Table/InternalTable.tsx +++ b/src/Shared/Components/Table/InternalTable.tsx @@ -24,7 +24,7 @@ import { UseRegisterShortcutProvider } from '@Common/Hooks' import { NO_ROWS_OR_GET_ROWS_ERROR } from './constants' import TableContent from './TableContent' -import { FiltersTypeEnum, InternalTableProps, PaginationEnum, RowsResultType } from './types' +import { FiltersTypeEnum, InternalTableProps, RowsResultType } from './types' import { getFilteringPromise, searchAndSortRows } from './utils' const InternalTable = < @@ -79,8 +79,6 @@ const InternalTable = < const wrapperDivRef = useRef(null) - const { setIdentifiers } = bulkSelectionReturnValue ?? {} - const searchSortTimeoutRef = useRef(-1) useEffect(() => { @@ -182,26 +180,6 @@ const InternalTable = < const areFilteredRowsLoading = _areFilteredRowsLoading || filteredRowsError === NO_ROWS_OR_GET_ROWS_ERROR - const visibleRows = useMemo(() => { - const normalizedFilteredRows = filteredRows ?? [] - - const paginatedRows = - paginationVariant !== PaginationEnum.PAGINATED - ? normalizedFilteredRows - : normalizedFilteredRows.slice(offset, offset + pageSize) - - return paginatedRows - }, [paginationVariant, offset, pageSize, filteredRows]) - - useEffect(() => { - setIdentifiers?.( - visibleRows.reduce((acc, row) => { - acc[row.id] = row - return acc - }, {}), - ) - }, [visibleRows]) - const Wrapper = ViewWrapper ?? Fragment const renderContent = () => { diff --git a/src/Shared/Helpers.tsx b/src/Shared/Helpers.tsx index be06ee862..902bd8d9a 100644 --- a/src/Shared/Helpers.tsx +++ b/src/Shared/Helpers.tsx @@ -53,7 +53,7 @@ import { UserApprovalInfo, ZERO_TIME_STRING, } from '../Common' -import { getAggregator } from '../Pages' +import { getAggregator, GVKType } from '../Pages' import { AggregatedNodes, PodMetadatum } from './Components' import { CUBIC_BEZIER_CURVE, UNSAVED_CHANGES_PROMPT_MESSAGE } from './constants' import { @@ -767,3 +767,24 @@ export const explainCronExpression = (expression: string): string => { parseCronExpression(expression, { hasSeconds: expression.trim().split(' ').length > 5 }) return cronstrue.toString(expression) } + +export const getGVKTitle = (gvk: GVKType): string => { + if (!gvk) { + return '' + } + + let title: string = '' + if (gvk.Group) { + title += gvk.Group + } + + if (gvk.Version) { + title += title ? ` / ${gvk.Version}` : gvk.Version + } + + if (gvk.Kind) { + title += title ? ` / ${gvk.Kind}` : gvk.Kind + } + + return title +} diff --git a/src/Shared/Hooks/useUserPreferences/types.ts b/src/Shared/Hooks/useUserPreferences/types.ts index a3c2db55d..a03c7eb10 100644 --- a/src/Shared/Hooks/useUserPreferences/types.ts +++ b/src/Shared/Hooks/useUserPreferences/types.ts @@ -17,74 +17,7 @@ import { USER_PREFERENCES_ATTRIBUTE_KEY } from '@Shared/Hooks/useUserPreferences/constants' import { AppThemeType, ThemeConfigType, ThemePreferenceType } from '@Shared/Providers/ThemeProvider/types' import { ResourceKindType } from '@Shared/types' - -export type NavigationItemID = - | 'application-management-overview' - | 'application-management-devtron-applications' - | 'application-management-application-groups' - | 'application-management-bulk-edit' - | 'application-management-application-templates' - | 'application-management-projects' - | 'application-management-configurations' - | 'application-management-policies' - | 'infrastructure-management-overview' - | 'infrastructure-management-applications' - | 'infrastructure-management-chart-store' - | 'infrastructure-management-resource-browser' - | 'infrastructure-management-resource-watcher' - | 'infrastructure-management-catalog-framework' - | 'software-release-management-overview' - | 'software-release-management-release-hub' - | 'software-release-management-tenants' - | 'cost-visibility-overview' - | 'cost-visibility-cost-breakdown' - | 'cost-visibility-configurations' - | 'security-center-overview' - | 'security-center-security-vulnerabilities' - | 'security-center-security-enablement' - | 'security-center-security-policy' - | 'automation-and-enablement-jobs' - | 'automation-and-enablement-alerting' - | 'automation-and-enablement-incident-response' - | 'automation-and-enablement-api-portal' - | 'automation-and-enablement-runbook-automation' - | 'global-configuration-sso-login-services' - | 'global-configuration-host-urls' - | 'global-configuration-cluster-and-environments' - | 'global-configuration-container-oci-registry' - | 'global-configuration-authorization' - | 'data-protection-overview' - | 'data-protection-backup-and-schedule' - | 'data-protection-restores' - | 'data-protection-backup-repositories' - | 'data-protection-backup-locations' - | 'data-protection-history-and-logs' - -export type NavigationSubMenuItemID = - | 'application-management-configurations-gitops' - | 'application-management-configurations-git-accounts' - | 'application-management-configurations-external-links' - | 'application-management-configurations-chart-repository' - | 'application-management-configurations-deployment-charts' - | 'application-management-configurations-notifications' - | 'application-management-configurations-catalog-frameworks' - | 'application-management-configurations-scoped-variables' - | 'application-management-configurations-build-infra' - | 'application-management-policies-deployment-window' - | 'application-management-policies-approval-policy' - | 'application-management-policies-plugin-policy' - | 'application-management-policies-pull-image-digest' - | 'application-management-policies-tag-policy' - | 'application-management-policies-filter-conditions' - | 'application-management-policies-image-promotion' - | 'application-management-policies-lock-deployment-configuration' - | 'cost-visibility-cost-breakdown-clusters' - | 'cost-visibility-cost-breakdown-environments' - | 'cost-visibility-cost-breakdown-projects' - | 'cost-visibility-cost-breakdown-applications' - | 'global-configuration-authorization-user-permissions' - | 'global-configuration-authorization-permission-groups' - | 'global-configuration-authorization-api-tokens' +import { NavigationItemID, NavigationSubMenuItemID } from '@PagesDevtron2.0/Navigation' export interface GetUserPreferencesQueryParamsType { key: typeof USER_PREFERENCES_ATTRIBUTE_KEY