import { ArrowUp } from 'lucide-react'; import { useRouter } from '@uirouter/react'; import { useState } from 'react'; import { EnvironmentId } from '@/react/portainer/environments/types'; import { notifySuccess } from '@/portainer/services/notifications'; import { semverCompare } from '@/react/common/semver-utils'; import { Button, LoadingButton } from '@@/buttons'; import { InlineLoader } from '@@/InlineLoader'; import { Tooltip } from '@@/Tip/Tooltip'; import { Link } from '@@/Link'; import { HelmRelease, UpdateHelmReleasePayload } from '../../types'; import { useUpdateHelmReleaseMutation } from '../../queries/useUpdateHelmReleaseMutation'; import { useHelmRepoVersions } from '../../queries/useHelmRepoVersions'; import { useHelmRelease } from '../queries/useHelmRelease'; import { useHelmRegistries } from '../../queries/useHelmRegistries'; import { openUpgradeHelmModal } from './UpgradeHelmModal'; export function UpgradeButton({ environmentId, releaseName, namespace, release, updateRelease, }: { environmentId: EnvironmentId; releaseName: string; namespace: string; release?: HelmRelease; updateRelease: (release: HelmRelease) => void; }) { const router = useRouter(); const [useCache, setUseCache] = useState(true); const updateHelmReleaseMutation = useUpdateHelmReleaseMutation(environmentId); const registriesQuery = useHelmRegistries(); const helmRepoVersionsQuery = useHelmRepoVersions( release?.chart.metadata?.name || '', 60 * 60 * 1000, // 1 hour registriesQuery.data, useCache ); const versions = helmRepoVersionsQuery.data; // Combined loading state const isLoading = registriesQuery.isInitialLoading || helmRepoVersionsQuery.isFetching; // use 'isFetching' for helmRepoVersionsQuery because we want to show when it's refetching const isError = registriesQuery.isError || helmRepoVersionsQuery.isError; const latestVersionQuery = useHelmRelease( environmentId, releaseName, namespace, { select: (data) => data.chart.metadata?.version, } ); const latestVersionAvailable = versions[0]?.Version ?? ''; const isNewVersionAvailable = Boolean( latestVersionQuery?.data && semverCompare(latestVersionAvailable, latestVersionQuery?.data) === 1 ); const currentRepo = versions?.find( (v) => v.Chart === release?.chart.metadata?.name && v.AppVersion === release?.chart.metadata?.appVersion && v.Version === release?.chart.metadata?.version )?.Repo; const editableHelmRelease: UpdateHelmReleasePayload = { name: releaseName, namespace: namespace || '', values: release?.values?.userSuppliedValues, chart: release?.chart.metadata?.name || '', appVersion: release?.chart.metadata?.appVersion, version: release?.chart.metadata?.version, repo: currentRepo ?? '', }; const filteredVersions = currentRepo ? versions?.filter((v) => v.Repo === currentRepo) || [] : versions || []; return (