fix(general-cluster-settings): display callout for managed clusters (#…

…1562)

libs/pages/cluster/src/lib/feature/page-settings-general-feature/page-settings-general-feature.tsx

@@ -37,7 +37,7 @@ export function SettingsGeneralFeature({ cluster, organizationId }: { cluster: C
 
  return (
  <FormProvider {...methods}>
- <PageSettingsGeneral onSubmit={onSubmit} loading={isEditClusterLoading} />
+ <PageSettingsGeneral cluster={cluster} onSubmit={onSubmit} loading={isEditClusterLoading} />
  </FormProvider>
  )
 }

libs/pages/cluster/src/lib/ui/page-settings-general/page-settings-general.spec.tsx

@@ -1,9 +1,11 @@
 import { wrapWithReactHookForm } from '__tests__/utils/wrap-with-react-hook-form'
+import { clusterFactoryMock } from '@qovery/shared/factories'
 import { renderWithProviders, screen } from '@qovery/shared/util-tests'
 import PageSettingsGeneral, { type PageSettingsGeneralProps } from './page-settings-general'
 
 describe('PageSettingsGeneral', () => {
  const props: PageSettingsGeneralProps = {
+ cluster: clusterFactoryMock(1)[0],
  onSubmit: jest.fn((e) => e.preventDefault()),
  loading: false,
  }

libs/pages/cluster/src/lib/ui/page-settings-general/page-settings-general.tsx

@@ -1,41 +1,44 @@
+import { type Cluster } from 'qovery-typescript-axios'
 import { type FormEventHandler } from 'react'
 import { useFormContext } from 'react-hook-form'
 import { ClusterGeneralSettings, SettingsHeading } from '@qovery/shared/console-shared'
 import { BlockContent, Button, Callout, ExternalLink, Icon, Section } from '@qovery/shared/ui'
 
 export interface PageSettingsGeneralProps {
+ cluster: Cluster
  onSubmit: FormEventHandler<HTMLFormElement>
  loading?: boolean
 }
 
-export function PageSettingsGeneral(props: PageSettingsGeneralProps) {
- const { onSubmit, loading } = props
+export function PageSettingsGeneral({ onSubmit, loading, cluster }: PageSettingsGeneralProps) {
  const { formState } = useFormContext()
 
  return (
  <div className="flex w-full flex-col justify-between">
  <Section className="max-w-content-with-navigation-left p-8">
  <SettingsHeading title="General settings" />
- <Callout.Root color="sky" className="mb-4">
- <Callout.Icon>
- <Icon iconName="circle-exclamation" iconStyle="light" />
- </Callout.Icon>
- <Callout.Text>
- <Callout.TextHeading>Qovery manages this resource for you</Callout.TextHeading>
- <Callout.TextDescription className="text-xs">
- Use exclusively the Qovery console to update the resources managed by Qovery on your cloud account.
- <br /> Do not manually update or upgrade them on the cloud provider console, otherwise you will risk a
- drift in the configuration.
- <br />
- <ExternalLink
- href="https://hub.qovery.com/docs/using-qovery/configuration/clusters/#how-does-qovery-handle-cluster-updates-and-upgrades"
- size="xs"
- >
- Click here for more details
- </ExternalLink>
- </Callout.TextDescription>
- </Callout.Text>
- </Callout.Root>
+ {cluster.cloud_provider !== 'ON_PREMISE' && (
+ <Callout.Root color="sky" className="mb-4">
+ <Callout.Icon>
+ <Icon iconName="circle-exclamation" iconStyle="light" />
+ </Callout.Icon>
+ <Callout.Text>
+ <Callout.TextHeading>Qovery manages this resource for you</Callout.TextHeading>
+ <Callout.TextDescription className="text-xs">
+ Use exclusively the Qovery console to update the resources managed by Qovery on your cloud account.
+ <br /> Do not manually update or upgrade them on the cloud provider console, otherwise you will risk a
+ drift in the configuration.
+ <br />
+ <ExternalLink
+ href="https://hub.qovery.com/docs/using-qovery/configuration/clusters/#how-does-qovery-handle-cluster-updates-and-upgrades"
+ size="xs"
+ >
+ Click here for more details
+ </ExternalLink>
+ </Callout.TextDescription>
+ </Callout.Text>
+ </Callout.Root>
+ )}
  <form onSubmit={onSubmit}>
  <BlockContent title="General information">
  <ClusterGeneralSettings fromDetail />