refactor: clean up imports and improve code formatting in Common.service.ts and related components

AbhishekA1509 · AbhishekA1509 · commit 86e6d0b49299 · 2025-01-19T20:26:15.000+05:30
diff --git a/src/Common/Common.service.ts b/src/Common/Common.service.ts
@@ -16,8 +16,17 @@
 
 import { MutableRefObject } from 'react'
 import moment from 'moment'
-import { sanitizeApprovalConfigData, sanitizeTargetPlatforms, sanitizeUserApprovalList, stringComparatorBySortOrder } from '@Shared/Helpers'
-import { PolicyBlockInfo, RuntimeParamsAPIResponseType, RuntimePluginVariables, TargetPlatformItemDTO } from '@Shared/types'
+import {
+    sanitizeApprovalConfigData,
+    sanitizeTargetPlatforms,
+    sanitizeUserApprovalList,
+    stringComparatorBySortOrder,
+} from '@Shared/Helpers'
+import {
+    PolicyBlockInfo,
+    RuntimeParamsAPIResponseType,
+    RuntimePluginVariables,
+} from '@Shared/types'
 import { get, post } from './Api'
 import { GitProviderType, ROUTES } from './Constants'
 import { getUrlWithSearchParams, showError, sortCallback } from './Helper'
@@ -82,7 +91,9 @@ export function setImageTags(request, pipelineId: number, artifactId: number) {
     return post(`${ROUTES.IMAGE_TAGGING}/${pipelineId}/${artifactId}`, request)
 }
 
-export const sanitizeUserApprovalMetadata = (userApprovalMetadata: UserApprovalMetadataType): UserApprovalMetadataType => ({
+export const sanitizeUserApprovalMetadata = (
+    userApprovalMetadata: UserApprovalMetadataType,
+): UserApprovalMetadataType => ({
     ...userApprovalMetadata,
     hasCurrentUserApproved: userApprovalMetadata?.hasCurrentUserApproved ?? false,
     canCurrentUserApprove: userApprovalMetadata?.canCurrentUserApprove ?? false,
@@ -154,9 +165,7 @@ const cdMaterialListModal = ({
             vulnerable: material.vulnerable,
             runningOnParentCd: material.runningOnParentCd,
             artifactStatus: artifactStatusValue,
-            userApprovalMetadata: sanitizeUserApprovalMetadata(
-                material.userApprovalMetadata,
-            ),
+            userApprovalMetadata: sanitizeUserApprovalMetadata(material.userApprovalMetadata),
             triggeredBy: material.triggeredBy,
             isVirtualEnvironment: material.isVirtualEnvironment,
             imageComment: material.imageComment,
@@ -197,7 +206,7 @@ const cdMaterialListModal = ({
             configuredInReleases: material.configuredInReleases ?? [],
             appWorkflowId: material.appWorkflowId ?? null,
             deploymentBlockedState: sanitizeDeploymentBlockedState(material.deploymentBlockedState),
-            targetPlatforms: sanitizeTargetPlatforms(material.targetPlatforms)
+            targetPlatforms: sanitizeTargetPlatforms(material.targetPlatforms),
         }
     })
     return materials
@@ -211,7 +220,9 @@ const sanitizeDeploymentApprovalInfo = (
             approverList: sanitizeUserApprovalList(deploymentApprovalInfo?.eligibleApprovers?.anyUsers?.approverList),
         },
         specificUsers: {
-            approverList: sanitizeUserApprovalList(deploymentApprovalInfo?.eligibleApprovers?.specificUsers?.approverList),
+            approverList: sanitizeUserApprovalList(
+                deploymentApprovalInfo?.eligibleApprovers?.specificUsers?.approverList,
+            ),
         },
         userGroups: (deploymentApprovalInfo?.eligibleApprovers?.userGroups ?? []).map(
             ({ groupName, groupIdentifier, approverList }) => ({
@@ -239,25 +250,22 @@ const processCDMaterialsApprovalInfo = (enableApproval: boolean, cdMaterialsResu
 }
 
 export const parseRuntimeParams = (response: RuntimeParamsAPIResponseType): RuntimePluginVariables[] => {
-    const envVariables = Object.entries(response?.envVariables || {}).map<RuntimePluginVariables>(
-        ([key, value]) => ({
-            name: key,
-            value,
-            defaultValue: '',
-            format: VariableTypeFormat.STRING,
-            isRequired: false,
-            valueType: RefVariableType.NEW,
-            variableStepScope: RefVariableType.GLOBAL,
-            stepName: null,
-            stepType: null,
-            // TODO: (Rohit/Eshank) Replace this with getUniqueId (nanoId method)
-            stepVariableId: Math.floor(new Date().valueOf() * Math.random()),
-            valueConstraint: null,
-            description: null,
-            fileReferenceId: null,
-            fileMountDir: null,
-        }),
-    )
+    const envVariables = Object.entries(response?.envVariables || {}).map<RuntimePluginVariables>(([key, value]) => ({
+        name: key,
+        value,
+        defaultValue: '',
+        format: VariableTypeFormat.STRING,
+        isRequired: false,
+        valueType: RefVariableType.NEW,
+        variableStepScope: RefVariableType.GLOBAL,
+        stepName: null,
+        stepType: null,
+        stepVariableId: Math.floor(new Date().valueOf() * Math.random()),
+        valueConstraint: null,
+        description: null,
+        fileReferenceId: null,
+        fileMountDir: null,
+    }))
 
     const runtimeParams = (response?.runtimePluginVariables ?? []).map<RuntimePluginVariables>((variable) => ({
         ...variable,
diff --git a/src/Shared/Components/CICDHistory/Artifacts.tsx b/src/Shared/Components/CICDHistory/Artifacts.tsx
@@ -16,6 +16,15 @@
 
 import { useParams } from 'react-router-dom'
 import { useDownload } from '@Shared/Hooks'
+import { ReactComponent as Download } from '@Icons/ic-download.svg'
+import { ReactComponent as MechanicalOperation } from '@Icons/ic-mechanical-operation.svg'
+import { ReactComponent as OpenInNew } from '@Icons/ic-arrow-out.svg'
+import { ReactComponent as Down } from '@Icons/ic-arrow-forward.svg'
+import { ReactComponent as ICHelpOutline } from '@Icons/ic-help.svg'
+import noartifact from '@Images/no-artifact@2x.png'
+import folder from '@Icons/ic-folder.svg'
+import docker from '@Icons/ic-docker.svg'
+import { TargetPlatformBadgeList } from '../TargetPlatforms'
 import {
     GenericEmptyState,
     ImageTagsContainer,
@@ -24,18 +33,9 @@ import {
     DOCUMENTATION,
     useSuperAdmin,
 } from '../../../Common'
-import { ReactComponent as Download } from '../../../Assets/Icon/ic-download.svg'
-import { ReactComponent as MechanicalOperation } from '../../../Assets/Icon/ic-mechanical-operation.svg'
-import { ReactComponent as OpenInNew } from '../../../Assets/Icon/ic-arrow-out.svg'
-import { ReactComponent as ICHelpOutline } from '../../../Assets/Icon/ic-help.svg'
-import { ReactComponent as Down } from '../../../Assets/Icon/ic-arrow-forward.svg'
-import docker from '../../../Assets/Icon/ic-docker.svg'
-import folder from '../../../Assets/Icon/ic-folder.svg'
-import noartifact from '../../../Assets/Img/no-artifact@2x.png'
 import { ArtifactType, CIListItemType } from './types'
 import { TERMINAL_STATUS_MAP } from './constants'
 import { EMPTY_STATE_STATUS } from '../../constants'
-import { TargetPlatformBadgeList } from '../TargetPlatforms'
 
 const CIProgressView = (): JSX.Element => (
     <GenericEmptyState
diff --git a/src/Shared/Components/CICDHistory/LogStageAccordion.tsx b/src/Shared/Components/CICDHistory/LogStageAccordion.tsx
@@ -3,9 +3,9 @@ import DOMPurify from 'dompurify'
 import { getTimeDifference } from '@Shared/Helpers'
 import { ReactComponent as ICCaretDown } from '@Icons/ic-caret-down.svg'
 import { ReactComponent as ICStack } from '@Icons/ic-stack.svg'
+import { TargetPlatformListTooltip } from '../TargetPlatforms'
 import { LogStageAccordionProps } from './types'
 import { getLogSearchIndex, getStageStatusIcon } from './utils'
-import { TargetPlatformListTooltip } from '../TargetPlatforms'
 
 const LogsItemContainer = ({ children }: { children: React.ReactNode }) => (
     <div className="display-grid dc__column-gap-10 dc__align-start logs-renderer__log-item">{children}</div>
@@ -87,7 +87,7 @@ const LogStageAccordion = ({
                         <>
                             <TargetPlatformListTooltip targetPlatforms={targetPlatforms}>
                                 <div className="flexbox dc__gap-4 dc__align-items-center">
-                                    <ICStack className="scn-0 dc__no-shrink icon-stroke__white icon-dim-12" />
+                                    <ICStack className="dc__no-shrink icon-stroke__white icon-dim-12" />
                                     <span className="text__white fs-13 fw-4 lh-20">
                                         {targetPlatforms.length}&nbsp;target platform
                                         {targetPlatforms.length > 1 ? 's' : ''}
diff --git a/src/Shared/Components/CICDHistory/types.tsx b/src/Shared/Components/CICDHistory/types.tsx
@@ -399,13 +399,8 @@ export type CIListItemType = Pick<History, 'promotionApprovalMetadata'> & {
     triggeredBy?: string
     children: any
 
-    imageReleaseTags?: ReleaseTag[]
-    appReleaseTagNames?: string[]
-    tagsEditable?: boolean
-    hideImageTaggingHardDelete?: boolean
     appliedFilters?: FilterConditionsListType[]
     appliedFiltersTimestamp?: string
-    isSuperAdmin?: boolean
     selectedEnvironmentName?: string
     renderCIListHeader: (renderCIListHeaderProps: RenderCIListHeaderProps) => JSX.Element
 } & (
diff --git a/src/Shared/Components/ImageCard/types.ts b/src/Shared/Components/ImageCard/types.ts
@@ -31,7 +31,7 @@ export interface ArtifactInfoProps {
     approvalInfoTippy?: ReactNode
 }
 
-export interface SequentialCDCardTitleProps {
+export interface SequentialCDCardTitleProps extends Pick<CDMaterialType, 'targetPlatforms'> {
     isLatest: boolean
     isRunningOnParentCD: boolean
     artifactStatus: string
@@ -42,7 +42,6 @@ export interface SequentialCDCardTitleProps {
     environmentName?: string
     parentEnvironmentName?: string
     additionalInfo?: ReactNode
-    targetPlatforms: CDMaterialType['targetPlatforms']
 }
 
 export interface ImageCardProps {
diff --git a/src/Shared/Helpers.tsx b/src/Shared/Helpers.tsx
@@ -989,11 +989,12 @@ export const sanitizeTargetPlatforms = (
 
     const filteredPlatforms = targetPlatforms
         .filter(({ name }) => !!name)
-        .sort((platformA, platformB) => stringComparatorBySortOrder(platformA.name, platformB.name))
+        .sort(({ name: nameA }, { name: nameB }) => stringComparatorBySortOrder(nameA, nameB))
 
     // They should be unique
     const uniquePlatforms: TargetPlatformItemDTO[] = []
     const platformExistenceMap: Record<string, true> = {}
+
     filteredPlatforms.forEach(({ name }) => {
         if (!platformExistenceMap[name]) {
             platformExistenceMap[name] = true

Original file line number	Diff line number	Diff line change
`@@ -31,7 +31,7 @@ export interface ArtifactInfoProps {`
`31`	`31`	`approvalInfoTippy?: ReactNode`
`32`	`32`	`}`
`33`	`33`
`34`		`-export interface SequentialCDCardTitleProps {`
	`34`	`+export interface SequentialCDCardTitleProps extends Pick<CDMaterialType, 'targetPlatforms'> {`
`35`	`35`	`isLatest: boolean`
`36`	`36`	`isRunningOnParentCD: boolean`
`37`	`37`	`artifactStatus: string`
`@@ -42,7 +42,6 @@ export interface SequentialCDCardTitleProps {`
`42`	`42`	`environmentName?: string`
`43`	`43`	`parentEnvironmentName?: string`
`44`	`44`	`additionalInfo?: ReactNode`
`45`		`- targetPlatforms: CDMaterialType['targetPlatforms']`
`46`	`45`	`}`
`47`	`46`
`48`	`47`	`export interface ImageCardProps {`