@devtron-labs/devtron-fe-common-lib 0.0.37-beta-2 → 0.0.37-beta-4

package/dist/Common/AppStatus/AppStatus.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { AppStatusType } from './types';
+export default function AppStatus({ appStatus, isDeploymentStatus, isJobView, isVirtualEnv, hideStatusMessage, }: AppStatusType): JSX.Element;

package/dist/Common/AppStatus/constants.d.ts

@@ -0,0 +1,51 @@
+export declare const StatusConstants: {
+    NOT_DEPLOYED: {
+        noSpaceLower: string;
+        normalCase: string;
+        lowerCase: string;
+    };
+    APP_STATUS: {
+        noSpaceLower: string;
+        normalText: string;
+    };
+    PROJECT: {
+        pluralLower: string;
+        lowerCase: string;
+    };
+    CLUSTER: {
+        pluralLower: string;
+        lowerCase: string;
+    };
+    NAMESPACE: {
+        pluralLower: string;
+        lowerCase: string;
+    };
+    ENVIRONMENT: {
+        pluralLower: string;
+        lowerCase: string;
+    };
+    NOT_AVILABLE: {
+        normalCase: string;
+    };
+};
+export declare enum TIMELINE_STATUS {
+    DEPLOYMENT_INITIATED = "DEPLOYMENT_INITIATED",
+    GIT_COMMIT = "GIT_COMMIT",
+    GIT_COMMIT_FAILED = "GIT_COMMIT_FAILED",
+    KUBECTL_APPLY = "KUBECTL_APPLY",
+    KUBECTL_APPLY_STARTED = "KUBECTL_APPLY_STARTED",
+    KUBECTL_APPLY_SYNCED = "KUBECTL_APPLY_SYNCED",
+    HEALTHY = "HEALTHY",
+    APP_HEALTH = "APP_HEALTH",
+    DEPLOYMENT_FAILED = "FAILED",
+    FETCH_TIMED_OUT = "TIMED_OUT",
+    UNABLE_TO_FETCH_STATUS = "UNABLE_TO_FETCH_STATUS",
+    DEGRADED = "DEGRADED",
+    DEPLOYMENT_SUPERSEDED = "DEPLOYMENT_SUPERSEDED",
+    ABORTED = "ABORTED",
+    INPROGRESS = "INPROGRESS",
+    HELM_PACKAGE_GENERATED = "HELM_PACKAGE_GENERATED",
+    HELM_MANIFEST_PUSHED_TO_HELM_REPO = "HELM_MANIFEST_PUSHED_TO_HELM_REPO",
+    HELM_MANIFEST_PUSHED_TO_HELM_REPO_FAILED = "HELM_MANIFEST_PUSHED_TO_HELM_REPO_FAILED"
+}
+export declare const YET_TO_RUN = "Yet to run";

package/dist/Common/AppStatus/index.d.ts

@@ -0,0 +1 @@
+export { default as AppStatus } from './AppStatus';

package/dist/Common/AppStatus/types.d.ts

@@ -0,0 +1,12 @@
+export interface AppStatusType {
+    appStatus: string;
+    isDeploymentStatus?: boolean;
+    isJobView?: boolean;
+    isVirtualEnv?: boolean;
+    /**
+     * Hide the status message if true
+     *
+     * @default false
+     */
+    hideStatusMessage?: boolean;
+}

package/dist/Common/AppStatus/utils.d.ts

@@ -0,0 +1 @@
+export declare const triggerStatus: (triggerDetailStatus: string) => string;

package/dist/Common/Helper.d.ts

@@ -51,4 +51,5 @@ export declare const closeOnEscKeyPressed: (e: any, actionClose: () => void) =>
  */
 export declare function copyToClipboard(str: any, callback?: typeof noop): void;
 export declare function useAsync<T>(func: (...rest: any[]) => Promise<T>, dependencyArray?: any[], shouldRun?: boolean, options?: AsyncOptions): [boolean, T, any | null, () => void, React.Dispatch<any>, any[]];
+export declare const processDeployedTime: (lastDeployed: any, isArgoInstalled: any) => string;
 export {};

package/dist/Common/Types.d.ts

@@ -228,9 +228,6 @@ export interface CDMaterialType {
     imageReleaseTags?: ReleaseTag[];
     artifactStatus?: string;
     filterState: FilterStates;
-    registryType?: string;
-    imagePath?: string;
-    registryName?: string;
 }
 export interface CommonNodeAttr {
     connectingCiPipelineId?: number;

package/dist/Common/index.d.ts

@@ -39,3 +39,4 @@ export { default as DebouncedSearch } from './DebouncedSearch/DebouncedSearch';
 export { default as Grid } from './Grid/Grid';
 export { default as ClipboardButton } from './ClipboardButton/ClipboardButton';
 export * from './Hooks';
+export { AppStatus } from './AppStatus';

package/dist/index.js

@@ -10220,7 +10220,15 @@ function useAsync(func, dependencyArray, shouldRun, options) {
         }
     };
     return [state.loading, state.result, state.error, reload, setResult, state.dependencies];
-}
+}
+var processDeployedTime = function (lastDeployed, isArgoInstalled) {
+    if (lastDeployed) {
+        return handleUTCTime(lastDeployed, true);
+    }
+    else {
+        return isArgoInstalled ? '' : 'Not deployed';
+    }
+};
 
 function Progressing(_a) {
     var pageLoader = _a.pageLoader, size = _a.size, theme = _a.theme, styles = _a.styles, fillColor = _a.fillColor;
@@ -23608,6 +23616,101 @@ var useSuperAdmin = function () {
     return { isSuperAdmin: isSuperAdmin };
 };
 
+var StatusConstants = {
+    NOT_DEPLOYED: {
+        noSpaceLower: 'notdeployed',
+        normalCase: 'Not deployed',
+        lowerCase: 'not-deployed',
+    },
+    APP_STATUS: {
+        noSpaceLower: 'appStatus',
+        normalText: 'App status',
+    },
+    PROJECT: {
+        pluralLower: 'projects',
+        lowerCase: 'project',
+    },
+    CLUSTER: {
+        pluralLower: 'clusters',
+        lowerCase: 'cluster',
+    },
+    NAMESPACE: {
+        pluralLower: 'namespaces',
+        lowerCase: 'namespace',
+    },
+    ENVIRONMENT: {
+        pluralLower: 'environments',
+        lowerCase: 'environment',
+    },
+    NOT_AVILABLE: {
+        normalCase: 'Not available',
+    },
+};
+var TIMELINE_STATUS;
+(function (TIMELINE_STATUS) {
+    TIMELINE_STATUS["DEPLOYMENT_INITIATED"] = "DEPLOYMENT_INITIATED";
+    TIMELINE_STATUS["GIT_COMMIT"] = "GIT_COMMIT";
+    TIMELINE_STATUS["GIT_COMMIT_FAILED"] = "GIT_COMMIT_FAILED";
+    TIMELINE_STATUS["KUBECTL_APPLY"] = "KUBECTL_APPLY";
+    TIMELINE_STATUS["KUBECTL_APPLY_STARTED"] = "KUBECTL_APPLY_STARTED";
+    TIMELINE_STATUS["KUBECTL_APPLY_SYNCED"] = "KUBECTL_APPLY_SYNCED";
+    TIMELINE_STATUS["HEALTHY"] = "HEALTHY";
+    TIMELINE_STATUS["APP_HEALTH"] = "APP_HEALTH";
+    TIMELINE_STATUS["DEPLOYMENT_FAILED"] = "FAILED";
+    TIMELINE_STATUS["FETCH_TIMED_OUT"] = "TIMED_OUT";
+    TIMELINE_STATUS["UNABLE_TO_FETCH_STATUS"] = "UNABLE_TO_FETCH_STATUS";
+    TIMELINE_STATUS["DEGRADED"] = "DEGRADED";
+    TIMELINE_STATUS["DEPLOYMENT_SUPERSEDED"] = "DEPLOYMENT_SUPERSEDED";
+    TIMELINE_STATUS["ABORTED"] = "ABORTED";
+    TIMELINE_STATUS["INPROGRESS"] = "INPROGRESS";
+    TIMELINE_STATUS["HELM_PACKAGE_GENERATED"] = "HELM_PACKAGE_GENERATED";
+    TIMELINE_STATUS["HELM_MANIFEST_PUSHED_TO_HELM_REPO"] = "HELM_MANIFEST_PUSHED_TO_HELM_REPO";
+    TIMELINE_STATUS["HELM_MANIFEST_PUSHED_TO_HELM_REPO_FAILED"] = "HELM_MANIFEST_PUSHED_TO_HELM_REPO_FAILED";
+})(TIMELINE_STATUS || (TIMELINE_STATUS = {}));
+var YET_TO_RUN = 'Yet to run';
+
+var triggerStatus = function (triggerDetailStatus) {
+    var triggerStatus = triggerDetailStatus === null || triggerDetailStatus === void 0 ? void 0 : triggerDetailStatus.toUpperCase();
+    if (triggerStatus === TIMELINE_STATUS.ABORTED || triggerStatus === TIMELINE_STATUS.DEGRADED) {
+        return 'Failed';
+    }
+    else if (triggerStatus === TIMELINE_STATUS.HEALTHY) {
+        return 'Succeeded';
+    }
+    else if (triggerStatus === TIMELINE_STATUS.INPROGRESS) {
+        return 'Inprogress';
+    }
+    else {
+        return triggerDetailStatus;
+    }
+};
+
+function AppStatus(_a) {
+    var appStatus = _a.appStatus, _b = _a.isDeploymentStatus, isDeploymentStatus = _b === void 0 ? false : _b, _c = _a.isJobView, isJobView = _c === void 0 ? false : _c, isVirtualEnv = _a.isVirtualEnv, _d = _a.hideStatusMessage, hideStatusMessage = _d === void 0 ? false : _d;
+    var status = appStatus;
+    if (isDeploymentStatus) {
+        status = triggerStatus(appStatus);
+    }
+    var appStatusLowerCase = status === null || status === void 0 ? void 0 : status.toLowerCase();
+    var isNotDeployed = appStatusLowerCase === StatusConstants.NOT_DEPLOYED.noSpaceLower;
+    var iconClass = isNotDeployed ? StatusConstants.NOT_DEPLOYED.lowerCase : appStatusLowerCase;
+    var statusMessage = status || (isVirtualEnv ? StatusConstants.NOT_AVILABLE.normalCase : '-');
+    var notDeployed = isJobView ? YET_TO_RUN : StatusConstants.NOT_DEPLOYED.normalCase;
+    var renderIcon = function () {
+        if (iconClass) {
+            return jsxRuntime.jsx("span", { className: "dc__app-summary__icon icon-dim-16 ".concat(iconClass, " ").concat(iconClass, "--node") });
+        }
+        else if (isVirtualEnv) {
+            return (jsxRuntime.jsx("span", { className: "dc__app-summary__icon icon-dim-16 ".concat(StatusConstants.NOT_DEPLOYED.lowerCase, " ").concat(StatusConstants.NOT_DEPLOYED.lowerCase, "--node") }));
+        }
+        else {
+            return (jsxRuntime.jsx(Tippy, __assign({ className: "default-tt w-200", arrow: false, placement: "top", content: "To fetch app status for GitOps based deployments open the app detail page" }, { children: jsxRuntime.jsx(SvgIcInfoOutlined, { className: "icon-dim-16 fcn-6" }) })));
+        }
+    };
+    return hideStatusMessage ? (renderIcon()) : (jsxRuntime.jsxs("div", __assign({ className: "flex left" }, { children: [jsxRuntime.jsx("div", __assign({ className: "flex mr-6" }, { children: renderIcon() })), jsxRuntime.jsx("p", __assign({ "data-testid": "".concat(status, "-app-status"), className: "dc__truncate-text dc__first-letter-capitalize cn-6 m-0" }, { children: isNotDeployed ? notDeployed : statusMessage }))] })));
+}
+
+exports.AppStatus = AppStatus;
 exports.BreadCrumb = BreadCrumb;
 exports.BreadcrumbStore = Store;
 exports.BuildStageVariable = BuildStageVariable;
@@ -23697,6 +23800,7 @@ exports.multiSelectStyles = multiSelectStyles;
 exports.noop = noop$1;
 exports.not = not;
 exports.post = post;
+exports.processDeployedTime = processDeployedTime;
 exports.put = put;
 exports.setImageTags = setImageTags;
 exports.showError = showError;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.0.37-beta-2",
+    "version": "0.0.37-beta-4",
     "description": "Supporting common component library",
     "main": "dist/index.js",
     "scripts": {

package/src/Assets/Icon/ic-info-outlined copy.svg

@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+    <g fill="none" fill-rule="evenodd">
+        <g fill="#06C">
+            <g>
+                <g>
+                    <g>
+                        <path d="M10 1.667c4.6 0 8.333 3.733 8.333 8.333S14.6 18.333 10 18.333 1.667 14.6 1.667 10 5.4 1.667 10 1.667zm0 1.666C6.32 3.333 3.333 6.32 3.333 10c0 3.68 2.987 6.667 6.667 6.667 3.68 0 6.667-2.987 6.667-6.667 0-3.68-2.987-6.667-6.667-6.667zm0 5.834c.46 0 .833.373.833.833v3.333c0 .46-.373.834-.833.834-.46 0-.833-.373-.833-.834V10c0-.46.373-.833.833-.833zm0-3.334c.46 0 .833.373.833.834 0 .46-.373.833-.833.833-.46 0-.833-.373-.833-.833 0-.46.373-.834.833-.834z" transform="translate(-315.000000, -313.000000) translate(303.000000, 256.000000) translate(4.000000, 49.000000) translate(8.000000, 8.000000)"/>
+                    </g>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>

package/src/Common/AppStatus/AppStatus.tsx

@@ -0,0 +1,57 @@
+import Tippy from '@tippyjs/react'
+import { ReactComponent as InfoIcon } from '../../Assets/Icon/ic-info-outlined.svg'
+import { StatusConstants, YET_TO_RUN } from './constants'
+import { AppStatusType } from './types'
+import { triggerStatus } from './utils'
+
+export default function AppStatus({
+    appStatus,
+    isDeploymentStatus = false,
+    isJobView = false,
+    isVirtualEnv,
+    hideStatusMessage = false,
+}: AppStatusType) {
+    let status = appStatus
+    if (isDeploymentStatus) {
+        status = triggerStatus(appStatus)
+    }
+    const appStatusLowerCase = status?.toLowerCase()
+    const isNotDeployed = appStatusLowerCase === StatusConstants.NOT_DEPLOYED.noSpaceLower
+    const iconClass = isNotDeployed ? StatusConstants.NOT_DEPLOYED.lowerCase : appStatusLowerCase
+    const statusMessage = status || (isVirtualEnv ? StatusConstants.NOT_AVILABLE.normalCase : '-')
+    const notDeployed = isJobView ? YET_TO_RUN : StatusConstants.NOT_DEPLOYED.normalCase
+
+    const renderIcon = () => {
+        if (iconClass) {
+            return <span className={`dc__app-summary__icon icon-dim-16 ${iconClass} ${iconClass}--node`} />
+        } else if (isVirtualEnv) {
+            return (
+                <span
+                    className={`dc__app-summary__icon icon-dim-16 ${StatusConstants.NOT_DEPLOYED.lowerCase} ${StatusConstants.NOT_DEPLOYED.lowerCase}--node`}
+                />
+            )
+        } else {
+            return (
+                <Tippy
+                    className="default-tt w-200"
+                    arrow={false}
+                    placement="top"
+                    content="To fetch app status for GitOps based deployments open the app detail page"
+                >
+                    <InfoIcon className="icon-dim-16 fcn-6" />
+                </Tippy>
+            )
+        }
+    }
+
+    return hideStatusMessage ? (
+        renderIcon()
+    ) : (
+        <div className="flex left">
+            <div className="flex mr-6">{renderIcon()}</div>
+            <p data-testid={`${status}-app-status`} className="dc__truncate-text dc__first-letter-capitalize cn-6 m-0">
+                {isNotDeployed ? notDeployed : statusMessage}
+            </p>
+        </div>
+    )
+}

package/src/Common/AppStatus/constants.ts

@@ -0,0 +1,53 @@
+export const StatusConstants = {
+    NOT_DEPLOYED: {
+        noSpaceLower: 'notdeployed',
+        normalCase: 'Not deployed',
+        lowerCase: 'not-deployed',
+    },
+    APP_STATUS: {
+        noSpaceLower: 'appStatus',
+        normalText: 'App status',
+    },
+    PROJECT: {
+        pluralLower: 'projects',
+        lowerCase: 'project',
+    },
+    CLUSTER: {
+        pluralLower: 'clusters',
+        lowerCase: 'cluster',
+    },
+    NAMESPACE: {
+        pluralLower: 'namespaces',
+        lowerCase: 'namespace',
+    },
+    ENVIRONMENT: {
+        pluralLower: 'environments',
+        lowerCase: 'environment',
+    },
+    NOT_AVILABLE: {
+        normalCase: 'Not available',
+    },
+}
+
+export enum TIMELINE_STATUS {
+    DEPLOYMENT_INITIATED = 'DEPLOYMENT_INITIATED',
+    GIT_COMMIT = 'GIT_COMMIT',
+    GIT_COMMIT_FAILED = 'GIT_COMMIT_FAILED',
+    KUBECTL_APPLY = 'KUBECTL_APPLY',
+    KUBECTL_APPLY_STARTED = 'KUBECTL_APPLY_STARTED',
+    KUBECTL_APPLY_SYNCED = 'KUBECTL_APPLY_SYNCED',
+    HEALTHY = 'HEALTHY',
+    APP_HEALTH = 'APP_HEALTH',
+    DEPLOYMENT_FAILED = 'FAILED',
+    FETCH_TIMED_OUT = 'TIMED_OUT',
+    UNABLE_TO_FETCH_STATUS = 'UNABLE_TO_FETCH_STATUS',
+    DEGRADED = 'DEGRADED',
+    DEPLOYMENT_SUPERSEDED = 'DEPLOYMENT_SUPERSEDED',
+    ABORTED = 'ABORTED',
+    INPROGRESS = 'INPROGRESS',
+    HELM_PACKAGE_GENERATED = 'HELM_PACKAGE_GENERATED',
+    HELM_MANIFEST_PUSHED_TO_HELM_REPO = 'HELM_MANIFEST_PUSHED_TO_HELM_REPO',
+    HELM_MANIFEST_PUSHED_TO_HELM_REPO_FAILED = 'HELM_MANIFEST_PUSHED_TO_HELM_REPO_FAILED',
+}
+
+export const YET_TO_RUN = 'Yet to run'

package/src/Common/AppStatus/index.ts

@@ -0,0 +1 @@
+export { default as AppStatus } from './AppStatus'

package/src/Common/AppStatus/types.ts

@@ -0,0 +1,12 @@
+export interface AppStatusType {
+    appStatus: string
+    isDeploymentStatus?: boolean
+    isJobView?: boolean
+    isVirtualEnv?: boolean
+    /**
+     * Hide the status message if true
+     *
+     * @default false
+     */
+    hideStatusMessage?: boolean
+}

package/src/Common/AppStatus/utils.ts

@@ -0,0 +1,14 @@
+import { TIMELINE_STATUS } from './constants'
+
+export const triggerStatus = (triggerDetailStatus: string): string => {
+    let triggerStatus = triggerDetailStatus?.toUpperCase()
+    if (triggerStatus === TIMELINE_STATUS.ABORTED || triggerStatus === TIMELINE_STATUS.DEGRADED) {
+        return 'Failed'
+    } else if (triggerStatus === TIMELINE_STATUS.HEALTHY) {
+        return 'Succeeded'
+    } else if (triggerStatus === TIMELINE_STATUS.INPROGRESS) {
+        return 'Inprogress'
+    } else {
+        return triggerDetailStatus
+    }
+}

package/src/Common/Helper.tsx

@@ -487,3 +487,11 @@ export function useAsync<T>(
 
     return [state.loading, state.result, state.error, reload, setResult, state.dependencies]
 }
+
+export const processDeployedTime = (lastDeployed, isArgoInstalled) => {
+    if (lastDeployed) {
+        return handleUTCTime(lastDeployed, true)
+    } else {
+        return isArgoInstalled ? '' : 'Not deployed'
+    }
+}

package/src/Common/Types.ts

@@ -252,9 +252,6 @@ export interface CDMaterialType {
     imageReleaseTags?: ReleaseTag[]
     artifactStatus?: string
     filterState: FilterStates
-    registryType?: string;
-    imagePath?: string
-    registryName?: string
 }
 
 export interface CommonNodeAttr {

package/src/Common/index.ts

@@ -39,3 +39,4 @@ export { default as DebouncedSearch } from './DebouncedSearch/DebouncedSearch'
 export { default as Grid } from './Grid/Grid'
 export { default as ClipboardButton } from './ClipboardButton/ClipboardButton'
 export * from './Hooks'
+export { AppStatus } from './AppStatus'