@devtron-labs/devtron-fe-common-lib 0.0.9-beta-10 → 0.0.9-beta-11

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.0.9-beta-10",
+    "version": "0.0.9-beta-11",
     "description": "Supporting common component library",
     "main": "dist/index.js",
     "scripts": {
@@ -33,7 +33,6 @@
         "@svgr/rollup": "6.5.1",
         "@rollup/plugin-url": "8.0.1",
         "@rollup/plugin-commonjs": "24.0.1",
-        "moment": "^2.29.4",
         "typescript": "^4.9.4",
         "react-toastify": "^8.2.0",
         "@tippyjs/react": "^4.2.0",

package/src/Common/Constants.ts

@@ -57,10 +57,4 @@ export const TOKEN_COOKIE_NAME = 'argocd.token'
 export const TriggerTypeMap = {
     automatic: 'Auto',
     manual: 'Manual',
-}
-
-export const BuildStageVariable = {
-  PreBuild: 'preBuildStage',
-  Build: 'buildStage',
-  PostBuild: 'postBuildStage',
 }

package/src/Common/Dialogs/DeleteDialog.tsx

@@ -1,53 +1,35 @@
-import React from 'react'
-import warn from '../../Assets/Img/delete-medium.svg'
+import React from 'react';
+import warn from '../../Assets/Img/warning-medium.svg';
 import { Progressing } from '../Progressing'
-import ConfirmationDialog from './ConfirmationDialog'
-import { DeleteDialogProps } from './Types'
+import ConfirmationDialog from './ConfirmationDialog';
+import { DeleteDialogProps } from './Types';
 
 export const DeleteDialog: React.FC<DeleteDialogProps> & { Description?: React.FC<any> } = function (props) {
-    return (
-        <ConfirmationDialog className="confirmation-dialog__body--w-400">
-            <ConfirmationDialog.Icon src={warn} />
-            <ConfirmationDialog.Body title={props.title}>
-                <div className="fs-13 cn-7 lh-1-54 w-100">
-                    {props.description ? props.description : null}
-                    {props.children}
-                </div>
-            </ConfirmationDialog.Body>
-            <ConfirmationDialog.ButtonGroup>
-                <div className="flex right">
-                    <button
-                        type="button"
-                        className="cta cancel cta-cd-delete-modal ml-16"
-                        onClick={props.closeDelete}
-                        disabled={props.apiCallInProgress}
-                        data-testid="dialog-cancel"
-                    >
-                        Cancel
-                    </button>
-                    <button
-                        type="button"
-                        className="cta delete cta-cd-delete-modal ml-16"
-                        onClick={() => props.delete()}
-                        disabled={props.apiCallInProgress}
-                        data-testid="dialog-delete"
-                    >
-                        {props.apiCallInProgress ? (
-                            <Progressing />
-                        ) : (
-                            `${props.deletePrefix || ''}${
-                                props.buttonPrimaryText ? props.buttonPrimaryText : 'Delete'
-                            }${props.deletePostfix || ''}`
-                        )}
-                    </button>
-                </div>
-            </ConfirmationDialog.ButtonGroup>
-        </ConfirmationDialog>
-    )
+
+    return <ConfirmationDialog className="confirmation-dialog__body--w-400">
+        <ConfirmationDialog.Icon src={warn} />
+        <ConfirmationDialog.Body title={props.title}>
+            <div className="fs-13 cn-7 lh-1-54 w-100">
+                {props.description ? props.description : null}
+                {props.children}
+            </div>
+        </ConfirmationDialog.Body>
+        <ConfirmationDialog.ButtonGroup>
+            <div className="flex right">
+                <button type="button" className="cta cancel cta-cd-delete-modal ml-16" onClick={props.closeDelete} disabled={props.apiCallInProgress} data-testid="dialog-cancel">Cancel</button>
+                <button type="button" className="cta delete cta-cd-delete-modal ml-16" onClick={() => props.delete()} disabled={props.apiCallInProgress} data-testid="dialog-delete">
+                    {props.apiCallInProgress ? <Progressing /> :  `${props.deletePrefix || ''}Delete${props.deletePostfix || ''}`}
+                </button>
+            </div>
+        </ConfirmationDialog.ButtonGroup>
+    </ConfirmationDialog >
 }
 
 function DeleteDialogDescription(props) {
-    return <>{props.children}</>
+
+    return <>
+        {props.children}
+    </>
 }
 
-DeleteDialog.Description = DeleteDialogDescription
+DeleteDialog.Description = DeleteDialogDescription;

package/src/Common/Dialogs/Types.ts

@@ -9,7 +9,6 @@ export interface DeleteDialogProps {
     deletePostfix?: string
     apiCallInProgress?: boolean
     dataTestId?: string
-    buttonPrimaryText?: string
 }
 
 export interface ForceDeleteDialogType {

package/src/Common/Helper.tsx

@@ -5,7 +5,6 @@ import * as Sentry from '@sentry/browser'
 import { toastAccessDenied } from './ToastBody'
 import { ERROR_EMPTY_SCREEN, TOKEN_COOKIE_NAME } from './Constants'
 import { ReactComponent as FormError } from '../Assets/Icon/ic-warning.svg'
-import moment from 'moment';
 
 toast.configure({
     autoClose: 3000,
@@ -332,17 +331,3 @@ export function CustomInput({
         </div>
     )
 }
-
-export function handleUTCTime(ts: string, isRelativeTime = false) {
-  let timestamp = "";
-  try {
-      if (ts && ts.length) {
-          let date = moment(ts);
-          if (isRelativeTime) timestamp = date.fromNow();
-          else timestamp = date.format("ddd DD MMM YYYY HH:mm:ss");
-      }
-  } catch (error) {
-      console.error("Error Parsing Date:", ts);
-  }
-  return timestamp;
-}

package/src/Common/TippyCustomized.tsx

@@ -1,17 +1,13 @@
-import React, { useRef, useState } from 'react'
+import React, { useRef } from 'react'
 import Tippy from '@tippyjs/react'
 import { ReactComponent as CloseIcon } from '../Assets/Icon/ic-cross.svg'
-import { ReactComponent as QuestionFilled } from '../Assets/Icon/ic-help.svg'
-import { ReactComponent as Question } from '../Assets/Icon/ic-help-outline.svg'
 import 'tippy.js/animations/shift-toward-subtle.css'
 import { TippyCustomizedProps, TippyTheme } from './Types'
-import { not } from './Helper'
 
 // This component will handle some of the new tippy designs and interactions
 // So this can be updated to support further for new features or interactions
 export function TippyCustomized(props: TippyCustomizedProps) {
     const tippyRef = useRef(null)
-    const [showHeadingInfo, setShowHeadingInfo] = useState(false)
     const isWhiteTheme = props.theme === TippyTheme.white
 
     const onTippyMount = (tippyInstance) => {
@@ -28,7 +24,6 @@ export function TippyCustomized(props: TippyCustomizedProps) {
                 props.onClose()
             }
         }
-        setShowHeadingInfo(false)
     }
 
     const closeOnEsc = (e) => {
@@ -37,10 +32,6 @@ export function TippyCustomized(props: TippyCustomizedProps) {
         }
     }
 
-    const toggleHeadingInfo = (e) => {
-        setShowHeadingInfo(not)
-    }
-
     const getTippyContent = () => {
         const {
             Icon,
@@ -49,7 +40,6 @@ export function TippyCustomized(props: TippyCustomizedProps) {
             iconSize,
             onImageLoadError,
             heading,
-            headingInfo,
             infoTextHeading,
             infoText,
             showCloseButton,
@@ -61,9 +51,7 @@ export function TippyCustomized(props: TippyCustomizedProps) {
             <>
                 <div
                     className={`dc__word-break dc__hyphens-auto flex left ${
-                        isWhiteTheme
-                            ? `p-12 cn-9 ${props.noHeadingBorder ? '' : 'dc__border-bottom-n1'}`
-                            : 'pt-20 pb-12 pr-20 pl-20 cn-0 top'
+                        isWhiteTheme ? 'p-12 dc__border-bottom-n1 cn-9' : 'pt-20 pb-12 pr-20 pl-20 cn-0 top'
                     }`}
                 >
                     {iconPath ? (
@@ -81,11 +69,6 @@ export function TippyCustomized(props: TippyCustomizedProps) {
                         )
                     )}
                     {heading && <span className={`fs-14 fw-6 lh-20 ${showCloseButton ? 'mr-6' : ''}`}>{heading}</span>}
-                    {headingInfo && (
-                        <div className="icon-dim-20 cursor" onClick={toggleHeadingInfo}>
-                            <Question className="icon-dim-20" />
-                        </div>
-                    )}
                     {showCloseButton && (
                         <div className="icon-dim-16 ml-auto">
                             <CloseIcon
@@ -95,18 +78,6 @@ export function TippyCustomized(props: TippyCustomizedProps) {
                         </div>
                     )}
                 </div>
-                {showHeadingInfo && (
-                    <div
-                        className={`flex left top bcv-1 fs-13 fw-4 lh-20 pt-8 pb-8 ${
-                            isWhiteTheme ? 'pl-12 pr-12' : 'pl-20 pr-20'
-                        }`}
-                    >
-                        <div className="icon-dim-20 mr-8">
-                            <QuestionFilled className="icon-dim-20 fcv-5" />
-                        </div>
-                        <div className="dc__word-break dc__hyphens-auto">{headingInfo}</div>
-                    </div>
-                )}
                 {infoTextHeading && (
                     <div
                         className={`dc__word-break dc__hyphens-auto fs-14 fw-6 lh-20 ${

package/src/Common/Types.ts

@@ -52,8 +52,6 @@ export interface TippyCustomizedProps {
     theme: TippyTheme
     visible?: boolean
     heading?: ReactNode | string
-    headingInfo?: ReactNode | string
-    noHeadingBorder?: boolean
     infoTextHeading?: string
     placement: Placement
     className?: string
@@ -188,7 +186,7 @@ export enum DeploymentNodeType {
     PRECD = 'PRECD',
     CD = 'CD',
     POSTCD = 'POSTCD',
-    APPROVAL = 'APPROVAL',
+    APPROVAL = 'APPROVAL'
 }
 
 export interface UserApprovalConfigType {
@@ -211,6 +209,33 @@ export interface UserApprovalMetadataType {
     requestedUserData: ApprovalUserDataType
 }
 
+
+export interface CDMaterialType {
+    index: number
+    id: string
+    materialInfo: MaterialInfo[]
+    tab: CDModalTabType
+    scanEnabled: boolean
+    scanned: boolean
+    vulnerabilitiesLoading: boolean
+    lastExecution: string //timestamp
+    vulnerabilities: VulnerabilityType[]
+    vulnerable: boolean
+    deployedTime: string
+    deployedBy?: string
+    wfrId?: number
+    buildTime: string
+    image: string
+    isSelected: boolean
+    showSourceInfo: boolean
+    latest: boolean
+    runningOnParentCd?: boolean
+    userApprovalMetadata?: UserApprovalMetadataType
+    triggeredBy?: number
+    imageComment?: ImageComment
+    imageReleaseTags?: ReleaseTag[]
+}
+
 export interface CommonNodeAttr {
     connectingCiPipelineId?: number
     parents: string | number[] | string[]
@@ -259,28 +284,25 @@ export interface CommonNodeAttr {
     approvalUsers?: string[]
     userApprovalConfig?: UserApprovalConfigType
     requestedUserId?: number
-    showPluginWarning?: boolean
     helmPackageName?: string
     isVirtualEnvironment?: boolean
-    isCITriggerBlocked?: boolean
-    ciBlockState?: {
-        action: any,
-        metadataField: string
-    }
+    appReleaseTagNames?: string[]
+    tagsEditable?: boolean
 }
 
+
 export interface VulnerabilityType {
-    name: string
-    severity: 'CRITICAL' | 'MODERATE' | 'LOW'
-    package: string
-    version: string
-    fixedVersion: string
-    policy: string
-    url?: string
+    name: string;
+    severity: "CRITICAL" | "MODERATE" | "LOW";
+    package: string;
+    version: string;
+    fixedVersion: string;
+    policy: string;
+    url?: string;
 }
 
 export interface ScanVulnerabilitiesTableProps {
-    vulnerabilities: VulnerabilityType[]
+    vulnerabilities: VulnerabilityType[];
 }
 
 export interface MaterialInfo {
@@ -296,33 +318,28 @@ export interface MaterialInfo {
     type?: string
 }
 
-export interface CDMaterialType {
-    index: number
-    id: string
-    materialInfo: MaterialInfo[]
-    tab: CDModalTabType
-    scanEnabled: boolean
-    scanned: boolean
-    vulnerabilitiesLoading: boolean
-    lastExecution: string //timestamp
-    vulnerabilities: VulnerabilityType[]
-    vulnerable: boolean
-    deployedTime: string
-    deployedBy?: string
-    wfrId?: number
-    buildTime: string
-    image: string
-    isSelected: boolean
-    showSourceInfo: boolean
-    latest: boolean
-    runningOnParentCd?: boolean
-    userApprovalMetadata?: UserApprovalMetadataType
-    triggeredBy?: number
-}
-
 export interface CDMaterialResponseType {
     approvalUsers: string[]
     materials: any[]
     userApprovalConfig: UserApprovalConfigType
     requestedUserId: number
-}
+    tagsEditable: boolean
+    appReleaseTagNames: string[]
+}
+
+export interface ReleaseTag {
+    id: number
+    tagName: string
+    appId: number
+    deleted: boolean
+    artifactId: number
+}
+
+export interface ImageComment {
+    id: number
+    comment: string
+    artifactId: number
+}
+
+
+

package/src/Common/index.ts

@@ -29,6 +29,4 @@ export { default as GenericEmptyState } from './EmptyState/GenericEmptyState'
 export { default as Toggle } from './Toggle/Toggle'
 export { default as ScanVulnerabilitiesTable } from './Security/ScanVulnerabilitiesTable'
 export { default as StyledRadioGroup } from './RadioGroup/RadioGroup'
-export * from './CIPipeline.Types'
-export * from './Policy.Types'
 export { default as DeleteComponent } from './DeleteComponentModal/DeleteComponent'

package/dist/Common/CIPipeline.Types.d.ts

@@ -1,265 +0,0 @@
-export interface MaterialType {
-    name: string;
-    type: string;
-    value: string;
-    gitMaterialId: number;
-    id: number;
-    isSelected: boolean;
-    gitHostId: number;
-    gitProviderId: number;
-    regex?: string;
-    isRegex: boolean;
-}
-export interface Githost {
-    id: number;
-    name: string;
-    active: boolean;
-    webhookSecret: string;
-    webhookUrl: string;
-}
-export interface WebhookEvent {
-    id: number;
-    gitHostId: number;
-    name: string;
-    isActive: boolean;
-    selectors: WebhookEventSelectors[];
-}
-interface WebhookEventSelectors {
-    id: number;
-    eventId: number;
-    name: string;
-    selector: string;
-    toShowInCiFilter: boolean;
-    fixValue: string;
-    toShow: boolean;
-    possibleValues: string;
-    isActive: boolean;
-}
-export interface CiPipelineSourceTypeOption {
-    label: string;
-    value: string;
-    isDisabled: boolean;
-    isSelected: boolean;
-    isWebhook: boolean;
-}
-export declare enum RefVariableType {
-    GLOBAL = "GLOBAL",
-    FROM_PREVIOUS_STEP = "FROM_PREVIOUS_STEP",
-    NEW = "NEW"
-}
-export declare enum PluginType {
-    INLINE = "INLINE",
-    PLUGIN_REF = "REF_PLUGIN"
-}
-export declare enum ScriptType {
-    SHELL = "SHELL",
-    DOCKERFILE = "DOCKERFILE",
-    CONTAINERIMAGE = "CONTAINER_IMAGE"
-}
-export declare enum MountPath {
-    TRUE = "Yes",
-    FALSE = "No"
-}
-export declare enum ConditionType {
-    SKIP = "SKIP",
-    TRIGGER = "TRIGGER",
-    PASS = "PASS",
-    FAIL = "FAIL"
-}
-export declare enum RefVariableStageType {
-    PRE_CI = "PRE_CI",
-    POST_CI = "POST_CI"
-}
-export interface VariableType {
-    id: number;
-    name: string;
-    value: string;
-    format: string;
-    description: string;
-    defaultValue: string;
-    variableType: RefVariableType;
-    refVariableStepIndex: number;
-    refVariableName: string;
-    refVariableStage?: RefVariableStageType;
-    variableStepIndexInPlugin?: number;
-}
-interface CommandArgsMap {
-    command: string;
-    args: string[];
-}
-export interface PortMapType {
-    portOnLocal: number;
-    portOnContainer: number;
-}
-interface ConditionDetails {
-    id: number;
-    conditionOnVariable: string;
-    conditionOperator: string;
-    conditionType: ConditionType;
-    conditionalValue: string;
-}
-interface InlineStepDetailType {
-    scriptType: ScriptType;
-    isMountCustomScript?: boolean;
-    script?: string;
-    dockerFileExists?: boolean;
-    mountPath?: string;
-    mountCodeToContainer?: boolean;
-    mountDirectoryFromHost?: boolean;
-    containerImagePath?: string;
-    imagePullSecret?: string;
-    commandArgsMap?: CommandArgsMap[];
-    portMap?: PortMapType[];
-    mountPathMap?: {
-        filePathOnDisk: string;
-        filePathOnContainer: string;
-    }[];
-    inputVariables?: VariableType[];
-    outputVariables?: VariableType[];
-    conditionDetails: ConditionDetails[];
-}
-interface PluginRefStepDetailType {
-    id: number;
-    pluginId: number;
-    inputVariables?: VariableType[];
-    outputVariables?: VariableType[];
-    conditionDetails?: ConditionDetails[];
-}
-export interface StepType {
-    id: number;
-    index: number;
-    name: string;
-    description: string;
-    stepType: PluginType;
-    outputDirectoryPath: string[];
-    inlineStepDetail?: InlineStepDetailType;
-    pluginRefStepDetail?: PluginRefStepDetailType;
-    triggerIfParentStageFail: boolean;
-    isMandatory?: boolean;
-}
-export interface BuildStageType {
-    id: number;
-    steps: StepType[];
-}
-export declare enum CIBuildType {
-    SELF_DOCKERFILE_BUILD_TYPE = "self-dockerfile-build",
-    MANAGED_DOCKERFILE_BUILD_TYPE = "managed-dockerfile-build",
-    BUILDPACK_BUILD_TYPE = "buildpack-build"
-}
-export interface BuildPackConfigType {
-    builderId: string;
-    language: string;
-    languageVersion: string;
-    projectPath: string;
-    builderLangEnvParam?: string;
-    currentBuilderLangEnvParam?: string;
-    buildPacks?: any;
-    args?: Record<string, string>;
-}
-export interface DockerBuildConfigType {
-    dockerfileContent: string;
-    dockerfileRelativePath: string;
-    buildContext: string;
-    dockerfilePath?: string;
-    dockerfileRepository?: string;
-    args?: Record<string, string>;
-    targetPlatform?: any;
-    language?: string;
-    languageFramework?: string;
-}
-export interface CIBuildConfigType {
-    buildPackConfig: BuildPackConfigType;
-    ciBuildType: CIBuildType;
-    dockerBuildConfig: DockerBuildConfigType;
-    gitMaterialId: number;
-    buildContextGitMaterialId: number;
-    id?: number;
-    useRootBuildContext: boolean;
-}
-export interface DockerConfigOverrideType {
-    dockerRegistry: string;
-    dockerRepository: string;
-    ciBuildConfig: CIBuildConfigType;
-}
-export interface FormType {
-    name: string;
-    args: {
-        key: string;
-        value: string;
-    }[];
-    materials: MaterialType[];
-    gitHost: Githost;
-    webhookEvents: WebhookEvent[];
-    ciPipelineSourceTypeOptions: CiPipelineSourceTypeOption[];
-    webhookConditionList: {
-        selectorId: number;
-        value: string;
-    }[];
-    triggerType: string;
-    scanEnabled?: boolean;
-    beforeDockerBuildScripts?: {
-        id: number;
-        name: string;
-        outputLocation: string;
-        script: string;
-        isCollapsed: boolean;
-        index: number;
-    }[];
-    afterDockerBuildScripts?: {
-        id: number;
-        name: string;
-        outputLocation: string;
-        script: string;
-        isCollapsed: boolean;
-        index: number;
-    }[];
-    ciPipelineEditable: true;
-    preBuildStage?: BuildStageType;
-    postBuildStage?: BuildStageType;
-    isDockerConfigOverridden?: boolean;
-    dockerConfigOverride?: DockerConfigOverrideType;
-    isOffendingMandatoryPlugin?: boolean;
-}
-export interface ErrorObj {
-    isValid: boolean;
-    message: string | null;
-}
-export interface TaskErrorObj {
-    isValid: boolean;
-    name: ErrorObj;
-    inlineStepDetail?: {
-        inputVariables?: ErrorObj[];
-        outputVariables?: ErrorObj[];
-    };
-    pluginRefStepDetail?: {
-        inputVariables?: ErrorObj[];
-        outputVariables?: ErrorObj[];
-    };
-}
-export interface FormErrorObjectType {
-    name: ErrorObj;
-    materials?: MaterialType[];
-    preBuildStage?: {
-        isValid: boolean;
-        steps: TaskErrorObj[];
-    };
-    buildStage?: {
-        isValid: boolean;
-        name: ErrorObj;
-    };
-    postBuildStage?: {
-        isValid: boolean;
-        steps: TaskErrorObj[];
-    };
-}
-export interface PluginDetailType {
-    id: number;
-    name: string;
-    type: string;
-    description: string;
-    icon: string;
-    tags: string[];
-    inputVariables?: VariableType[];
-    outputVariables?: VariableType[];
-}
-export {};