feat: onboard argo apps

src/Common/InfoColorBar/InfoColourbar.tsx

@@ -17,6 +17,7 @@
 import { Link } from 'react-router-dom'
 import { InfoColourBarType } from '../Types'
 import { Tooltip } from '@Common/Tooltip'
+import { Button } from '@Shared/Components'
 import './infoColourBar.scss'
 
 const InfoColourBar = ({
@@ -82,15 +83,23 @@ const InfoColourBar = ({
 
     const renderMessageWrapper = () => {
         if (textConfig) {
-            const { heading, description } = textConfig
+            const { heading, description, actionButtonConfig } = textConfig
 
             return (
-                <div className="flexbox-col">
-                    {heading && <h6 className="m-0 cn-9 fs-13 fw-6 lh-20 dc__truncate">{heading}</h6>}
+                <div className="flexbox flex-grow-1 dc__content-space dc__align-start">
+                    <div className="flexbox-col">
+                        {heading && <h6 className="m-0 cn-9 fs-13 fw-6 lh-20 dc__truncate">{heading}</h6>}
 
-                    <Tooltip content={description}>
-                        <p className="dc__truncate--clamp-3 m-0 cn-9 fs-13 fw-4 lh-20">{description}</p>
-                    </Tooltip>
+                        <Tooltip content={description}>
+                            <p className="dc__truncate--clamp-3 m-0 cn-9 fs-13 fw-4 lh-20">{description}</p>
+                        </Tooltip>
+                    </div>
+
+                    {actionButtonConfig && (
+                        <Button
+                            {...actionButtonConfig}
+                        />
+                    )}
                 </div>
             )
         }
@@ -109,7 +118,7 @@ const InfoColourBar = ({
                 className={`${classname} info_text flex dc__content-space pt-8 pb-8 pl-12 pr-12 br-4 top fs-13 fw-4`}
                 style={styles}
             >
-                <div className={`flex top ${typeof renderActionButton === 'function' ? 'mr-5' : ''}`}>
+                <div className={`flex top ${typeof renderActionButton === 'function' ? 'mr-5' : ''} ${!!textConfig ? 'flex-grow-1' : ''}`}>
                     {!hideIcon && (
                         <div className={`icon-dim-${iconSize ?? '20'} mr-10`}>
                             <Icon className={`icon-dim-${iconSize ?? '20'} ${iconClass || ''} mr-8`} />

src/Common/Types.ts

@@ -25,6 +25,7 @@ import {
     Severity,
     PolicyBlockInfo,
     TargetPlatformItemDTO,
+    ButtonProps,
 } from '../Shared'
 import {
     ACTION_STATE,
@@ -217,6 +218,7 @@ interface InfoColourBarTextConfigType {
      * If given would be shown below the heading (if given)
      */
     description: string
+    actionButtonConfig?: ButtonProps
 }
 
 type InfoColourBarMessageProp = {

src/Pages/Applications/DevtronApps/Details/AppConfigurations/DeploymentTemplate/types.ts

@@ -129,6 +129,11 @@ export interface SelectedChartDetailsType {
     selectedChart: DeploymentChartVersionType
 }
 
+export enum PipelineMigratedFromType {
+    HELM_RELEASE = 'helmRelease',
+    ARGO_APPLICATION = 'argoApplication',
+}
+
 interface EnvironmentConfigType {
     id: number
     status: number

src/Pages/Applications/DevtronApps/Details/CDPipeline/types.tsx

@@ -57,7 +57,7 @@ export interface CustomTagType {
 
 export enum ReleaseMode {
     NEW_DEPLOYMENT = 'create',
-    MIGRATE_HELM = 'link',
+    MIGRATE_EXTERNAL_APPS = 'link',
 }
 
 export interface CDFormType {

src/Shared/Components/CICDHistory/types.tsx

@@ -641,6 +641,15 @@ export interface StatusFilterButtonType {
     maxInlineFiltersCount?: number
 }
 
+export enum NodeStatusDTO {
+    Healthy = 'Healthy',
+    Progressing = 'Progressing',
+    Unknown = 'Unknown',
+    Suspended = 'Suspended',
+    Degraded = 'Degraded',
+    Missing = 'Missing',
+}
+
 export enum NodeStatus {
     Degraded = 'degraded',
     Healthy = 'healthy',

src/Shared/Components/GenericSectionErrorState/GenericSectionErrorState.component.tsx

@@ -14,9 +14,11 @@
  * limitations under the License.
  */
 
+import { ReactNode } from 'react'
 import { ComponentSizeType } from '@Shared/constants'
-import { ReactComponent as ErrorIcon } from '../../../Assets/Icon/ic-error-exclamation.svg'
-import { ReactComponent as ICInfoOutline } from '../../../Assets/Icon/ic-info-outline.svg'
+import { Progressing } from '@Common/Progressing'
+import { ReactComponent as ErrorIcon } from '@Icons/ic-error-exclamation.svg'
+import { ReactComponent as ICInfoOutline } from '@Icons/ic-info-outline.svg'
 import { Button, ButtonVariantType } from '../Button'
 import { GenericSectionErrorStateProps } from './types'
 
@@ -29,33 +31,57 @@ const GenericSectionErrorState = ({
     buttonText = 'Reload',
     rootClassName,
     useInfoIcon = false,
-}: GenericSectionErrorStateProps) => (
-    <div className={`flex column dc__gap-8 p-16 ${withBorder ? 'dc__border br-4' : ''} ${rootClassName || ''}`}>
-        {useInfoIcon ? (
-            <ICInfoOutline className="icon-dim-24" />
-        ) : (
-            <ErrorIcon className="icon-dim-24 alert-icon-r5-imp" />
-        )}
-        <div className="flex column dc__gap-4 dc__align-center">
-            <h3 className="fs-13 lh-20 fw-6 cn-9 m-0">{title}</h3>
-            {(subTitle || description) && (
-                <div className="flex column fs-13 lh-20 fw-4 cn-7">
-                    {subTitle && <p className="m-0">{subTitle}</p>}
-                    {description && <p className="m-0">{description}</p>}
-                </div>
+    progressingProps,
+}: GenericSectionErrorStateProps) => {
+    const renderMarker = () => {
+        if (progressingProps) {
+            return <Progressing {...progressingProps} />
+        }
+
+        if (useInfoIcon) {
+            return <ICInfoOutline className="icon-dim-24" />
+        }
+
+        return <ErrorIcon className="icon-dim-24 alert-icon-r5-imp" />
+    }
+
+    const renderSubHeading = (content: ReactNode) => {
+        if (!content) {
+            return null
+        }
+
+        if (typeof content === 'string') {
+            return <p className="m-0 dc__truncate--clamp-6">{content}</p>
+        }
+
+        return content
+    }
+
+    return (
+        <div className={`flex column dc__gap-8 p-16 ${withBorder ? 'dc__border br-4' : ''} ${rootClassName || ''}`}>
+            {renderMarker()}
+
+            <div className="flex column dc__gap-4 dc__align-center">
+                <h3 className="fs-13 lh-20 fw-6 cn-9 m-0">{title}</h3>
+                {(subTitle || description) && (
+                    <div className="flex column fs-13 lh-20 fw-4 cn-7">
+                        {renderSubHeading(subTitle)}
+                        {renderSubHeading(description)}
+                    </div>
+                )}
+            </div>
+
+            {reload && (
+                <Button
+                    text={buttonText}
+                    onClick={reload}
+                    variant={ButtonVariantType.text}
+                    size={ComponentSizeType.small}
+                    dataTestId="generic-section-reload-button"
+                />
             )}
         </div>
-
-        {reload && (
-            <Button
-                text={buttonText}
-                onClick={reload}
-                variant={ButtonVariantType.text}
-                size={ComponentSizeType.small}
-                dataTestId="generic-section-reload-button"
-            />
-        )}
-    </div>
-)
+    )
+}
 
 export default GenericSectionErrorState

src/Shared/Components/GenericSectionErrorState/types.ts

@@ -14,7 +14,10 @@
  * limitations under the License.
  */
 
-export interface GenericSectionErrorStateProps {
+import { ReactNode } from 'react'
+import { ProgressingProps } from '@Common/Types'
+
+export type GenericSectionErrorStateProps = {
     /**
      * Handler for reloading the section
      */
@@ -32,11 +35,11 @@ export interface GenericSectionErrorStateProps {
     /**
      * @default 'We could not load the information on this page.'
      */
-    subTitle?: string
+    subTitle?: ReactNode
     /**
      * @default 'Please reload or try again later'
      */
-    description?: string
+    description?: ReactNode
     /**
      * @default 'Reload'
      */
@@ -45,10 +48,25 @@ export interface GenericSectionErrorStateProps {
      * to be applied on parent div
      */
     rootClassName?: string
-    /**
-     * If true, info icon would be used instead of error
-     *
-     * @default false
-     */
-    useInfoIcon?: boolean
-}
+} & (
+    | {
+          /**
+           * If provided, would render the Progressing component with given props instead of error icon
+           */
+          progressingProps: ProgressingProps
+          useInfoIcon?: never
+      }
+    | {
+          progressingProps?: never
+          /**
+           * If true, info icon would be used instead of error
+           *
+           * @default false
+           */
+          useInfoIcon: boolean
+      }
+    | {
+          progressingProps?: never
+          useInfoIcon?: never
+      }
+)

src/Shared/Providers/types.ts

@@ -39,6 +39,17 @@ export interface MainContext {
     }
     isAirgapped: boolean
     isSuperAdmin: boolean
+    featureGitOpsFlags: {
+        isFeatureGitOpsEnabled: boolean
+        /**
+         *
+         */
+        isFeatureUserDefinedGitOpsEnabled: boolean
+        /**
+         * Feature flag for Migrate to devtron from argo cd
+         */
+        isFeatureArgoCdMigrationEnabled: boolean
+    }
     isManifestScanningEnabled: boolean
 }