Merge branch 'develop' of github.com:devtron-labs/devtron-fe-common-lib into feat/deployment-exception

Author: RohitRaj011

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "1.12.0-beta-2",
+    "version": "1.12.0-pre-3",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { DynamicDataTableCellValidationState } from '@Shared/Components'
+import { DynamicDataTableCellValidationState, KeyValueTableData } from '@Shared/Components'
 
 export interface MaterialType {
     name: string
@@ -158,7 +158,7 @@ export interface PortMapType {
     portOnLocal: number
     portOnContainer: number
 }
-interface ConditionDetails {
+export interface ConditionDetails {
     id: number
     conditionOnVariable: string
     conditionOperator: string
@@ -266,7 +266,7 @@ export enum WORKFLOW_CACHE_CONFIG_ENUM {
 
 export interface FormType {
     name: string
-    args: { key: string; value: string }[]
+    args: KeyValueTableData[]
     materials: MaterialType[]
     gitHost: Githost
     webhookEvents: WebhookEvent[]
@@ -314,23 +314,29 @@ export enum InputOutputVariablesHeaderKeys {
     VALUE = 'val',
 }
 
-export type InputOutputVariablesErrorObj = Record<InputOutputVariablesHeaderKeys, DynamicDataTableCellValidationState>
+export enum ConditionDataTableHeaderKeys {
+    VARIABLE = 'variable',
+    OPERATOR = 'operator',
+    VALUE = 'val',
+}
+
+type InputOutputVariablesErrorObj = Record<InputOutputVariablesHeaderKeys, DynamicDataTableCellValidationState>
+type ConditionDetailsErrorObj = Record<ConditionDataTableHeaderKeys, DynamicDataTableCellValidationState>
+
+interface StepDetailTaskErrorObj {
+    inputVariables?: Record<number, InputOutputVariablesErrorObj>
+    outputVariables?: Record<number, InputOutputVariablesErrorObj>
+    isInputVariablesValid?: boolean
+    isOutputVariablesValid?: boolean
+    conditionDetails?: Record<number, ConditionDetailsErrorObj>
+    isConditionDetailsValid?: boolean
+}
 
 export interface TaskErrorObj {
     isValid: boolean
     name: ErrorObj
-    inlineStepDetail?: {
-        inputVariables?: Record<number, InputOutputVariablesErrorObj>
-        outputVariables?: Record<number, InputOutputVariablesErrorObj>
-        isInputVariablesValid?: boolean
-        isOutputVariablesValid?: boolean
-    }
-    pluginRefStepDetail?: {
-        inputVariables?: Record<number, InputOutputVariablesErrorObj>
-        outputVariables?: Record<number, InputOutputVariablesErrorObj>
-        isInputVariablesValid?: boolean
-        isOutputVariablesValid?: boolean
-    }
+    inlineStepDetail?: StepDetailTaskErrorObj
+    pluginRefStepDetail?: StepDetailTaskErrorObj
 }
 export interface FormErrorObjectType {
     name: ErrorObj

src/Assets/Icon/ic-nav-rocket.svg

@@ -45,10 +45,14 @@ import {
     GlobalVariableDTO,
     GlobalVariableOptionType,
     UserRole,
+    EnvAppsMetaDTO,
+    GetAppsInfoForEnvProps,
+    AppMeta,
 } from './Types'
 import { ApiResourceType, STAGE_MAP } from '../Pages'
 import { RefVariableType, VariableTypeFormat } from './CIPipeline.Types'
 import { get, post } from './API'
+import { StatusType } from '@Shared/Components'
 
 export const getTeamListMin = (): Promise<TeamList> => {
     // ignore active field
@@ -511,3 +515,25 @@ export const getGlobalVariables = async ({
         throw err
     }
 }
+
+export const getAppsInfoForEnv = async ({ envId, appIds }: GetAppsInfoForEnvProps): Promise<EnvAppsMetaDTO> => {
+    const url = getUrlWithSearchParams(`${ROUTES.ENV}/${envId}/${ROUTES.APP_METADATA}`, {
+        appIds: appIds?.join(),
+    })
+    const response = await get<EnvAppsMetaDTO>(url)
+
+    return {
+        appCount: response.result?.appCount ?? 0,
+        apps: (response.result?.apps ?? []).reduce<AppMeta[]>((agg, { appId, appName, appStatus }) => {
+            if (!appId) {
+                return agg
+            }
+            agg.push({
+                appId,
+                appName: appName || '',
+                appStatus: appStatus || StatusType.UNKNOWN,
+            })
+            return agg
+        }, []),
+    }
+}

src/Assets/IconV2/ic-hand-pointing.svg

@@ -157,6 +157,8 @@ export const ROUTES = {
     ENVIRONMENT_DATA: 'global/environment-variables',
     DASHBOARD_EVENT: 'dashboard-event',
     LICENSE_DATA: 'license/data',
+    ENV: 'env',
+    APP_METADATA: 'app-metadata',
 } as const
 
 export enum KEY_VALUE {

src/Common/CIPipeline.Types.ts

@@ -27,6 +27,7 @@ import {
     TargetPlatformItemDTO,
     ButtonProps,
     ComponentLayoutType,
+    StatusType,
 } from '../Shared'
 import {
     ACTION_STATE,
@@ -1113,3 +1114,19 @@ export enum ActionTypes {
     EDIT = 'edit',
     APPROVER = 'approver',
 }
+
+export interface GetAppsInfoForEnvProps {
+    envId: number
+    appIds?: number[]
+}
+
+export interface AppMeta {
+    appId: number
+    appStatus: StatusType
+    appName: string
+}
+
+export interface EnvAppsMetaDTO {
+    appCount: number
+    apps: AppMeta[]
+}

src/Common/Common.service.ts

@@ -0,0 +1,79 @@
+import ReactGA from 'react-ga4'
+
+import DevtronCopyright from '@Common/DevtronCopyright'
+import { EULA_LINK, PRIVACY_POLICY_LINK, TERMS_OF_USE_LINK } from '@Shared/constants'
+import { useMainContext } from '@Shared/Providers'
+
+import { Button, ButtonComponentType, ButtonStyleType, ButtonVariantType } from '../Button'
+import { InstallationType } from '../Header/types'
+import { Icon } from '../Icon'
+
+const AboutDevtronBody = ({ isFELibAvailable }: { isFELibAvailable: boolean }) => {
+    const { currentServerInfo } = useMainContext()
+
+    const currentVersion = currentServerInfo?.serverInfo?.currentVersion
+    const isEnterprise = currentServerInfo?.serverInfo?.installationType === InstallationType.ENTERPRISE
+
+    const isVersionCompatible = isFELibAvailable === isEnterprise
+
+    const handleEULAClick = () => {
+        ReactGA.event({
+            category: 'about-devtron',
+            action: 'ABOUT_DEVTRON_LICENSE_AGREEMENT_CLICKED',
+        })
+    }
+
+    return (
+        <div className="flexbox-col p-32 dc__gap-24 br-16 border__secondary bg__secondary">
+            <div className="flexbox-col dc__align-items-center dc__gap-16 text-center">
+                <div className="flex p-6 border__primary br-8">
+                    <Icon name="ic-devtron" color="B500" size={40} />
+                </div>
+                <div>
+                    <p className="fs-16 cn-9 fw-6 lh-1-5 m-0">Devtron</p>
+                    {isVersionCompatible && (
+                        <p className="fs-13 cn-7 fw-4 lh-20 m-0">{`${isEnterprise ? 'Enterprise' : 'OSS'} Version${currentVersion ? `(${currentVersion})` : ''}`}</p>
+                    )}
+                </div>
+                <DevtronCopyright />
+            </div>
+            <div className="flexbox flex-wrap dc__content-center dc__gap-4">
+                <Button
+                    dataTestId="terms-of-service"
+                    text="Terms of service"
+                    variant={ButtonVariantType.text}
+                    style={ButtonStyleType.neutral}
+                    component={ButtonComponentType.anchor}
+                    anchorProps={{
+                        href: TERMS_OF_USE_LINK,
+                    }}
+                />
+                <span>•</span>
+                <Button
+                    dataTestId="privacy-policy"
+                    text="Privacy policy"
+                    variant={ButtonVariantType.text}
+                    style={ButtonStyleType.neutral}
+                    component={ButtonComponentType.anchor}
+                    anchorProps={{
+                        href: PRIVACY_POLICY_LINK,
+                    }}
+                />
+                <span>•</span>
+                <Button
+                    dataTestId="license-agreement"
+                    text="End-User License agreement"
+                    variant={ButtonVariantType.text}
+                    style={ButtonStyleType.neutral}
+                    onClick={handleEULAClick}
+                    component={ButtonComponentType.anchor}
+                    anchorProps={{
+                        href: EULA_LINK,
+                    }}
+                />
+            </div>
+        </div>
+    )
+}
+
+export default AboutDevtronBody

src/Common/Constants.ts

@@ -0,0 +1,31 @@
+import { ComponentSizeType } from '@Shared/constants'
+
+import { Backdrop } from '../Backdrop'
+import { Button } from '../Button'
+import AboutDevtronBody from './AboutDevtronBody'
+
+const AboutDevtronDialog = ({
+    handleCloseLicenseInfoDialog,
+    isFELibAvailable,
+}: {
+    handleCloseLicenseInfoDialog: () => void
+    isFELibAvailable: boolean
+}) => (
+    <Backdrop onEscape={handleCloseLicenseInfoDialog}>
+        <div className="flexbox-col w-400 br-12 bg__primary border__primary dc__m-auto mt-40">
+            <div className="p-24">
+                <AboutDevtronBody isFELibAvailable={isFELibAvailable} />
+            </div>
+            <div className="flex px-24 py-20 dc__content-end">
+                <Button
+                    dataTestId="license-info-okay"
+                    text="Okay"
+                    size={ComponentSizeType.medium}
+                    onClick={handleCloseLicenseInfoDialog}
+                />
+            </div>
+        </div>
+    </Backdrop>
+)
+
+export default AboutDevtronDialog