diff --git a/packages/core/src/features/helm-releases/showing-details-for-helm-release.test.ts b/packages/core/src/features/helm-releases/showing-details-for-helm-release.test.ts index ca947358ad..9a154e07b9 100644 --- a/packages/core/src/features/helm-releases/showing-details-for-helm-release.test.ts +++ b/packages/core/src/features/helm-releases/showing-details-for-helm-release.test.ts @@ -350,8 +350,8 @@ describe("showing details for helm release", () => { expect(rendered.baseElement).toMatchSnapshot(); }); - it("does not reload", () => { - expect(requestDetailedHelmReleaseMock).not.toHaveBeenCalled(); + it("does reload", () => { + expect(requestDetailedHelmReleaseMock).toHaveBeenCalled(); }); }); }); diff --git a/packages/core/src/renderer/components/+helm-releases/release-details/release-details-content.tsx b/packages/core/src/renderer/components/+helm-releases/release-details/release-details-content.tsx index 8e726ede0b..39896a604c 100644 --- a/packages/core/src/renderer/components/+helm-releases/release-details/release-details-content.tsx +++ b/packages/core/src/renderer/components/+helm-releases/release-details/release-details-content.tsx @@ -11,10 +11,7 @@ import { Link } from "react-router-dom"; import { DrawerItem, DrawerTitle } from "../../drawer"; import { stopPropagation } from "../../../utils"; import { observer } from "mobx-react"; -import type { IAsyncComputed } from "@ogre-tools/injectable-react"; -import { withInjectables } from "@ogre-tools/injectable-react"; import type { ConfigurationInput, MinimalResourceGroup, OnlyUserSuppliedValuesAreShownToggle, ReleaseDetailsModel } from "./release-details-model/release-details-model.injectable"; -import releaseDetailsModelInjectable from "./release-details-model/release-details-model.injectable"; import { Button } from "../../button"; import { kebabCase } from "lodash/fp"; import { Badge } from "../../badge"; @@ -22,37 +19,22 @@ import { SubTitle } from "../../layout/sub-title"; import { Table, TableCell, TableHead, TableRow } from "../../table"; import { Checkbox } from "../../checkbox"; import { MonacoEditor } from "../../monaco-editor"; -import { Spinner } from "../../spinner"; -import type { TargetHelmRelease } from "./target-helm-release.injectable"; interface ReleaseDetailsContentProps { - targetRelease: TargetHelmRelease; + model: ReleaseDetailsModel; } -interface Dependencies { - computedModel: IAsyncComputed; -} - -const NonInjectedReleaseDetailsContent = observer(({ computedModel }: Dependencies & ReleaseDetailsContentProps) => { - const model = computedModel.value.get(); - - if (!model) { - return ; - } - +export const ReleaseDetailsContent = observer(({ model }: ReleaseDetailsContentProps) => { const loadingError = model.loadingError.get(); if (loadingError) { return (
- Failed to load release: - {" "} - {loadingError} + {`Failed to load release: ${loadingError}`}
); } - return (
@@ -94,9 +76,7 @@ const NonInjectedReleaseDetailsContent = observer(({ computedModel }: Dependenci Notes @@ -116,13 +96,6 @@ const NonInjectedReleaseDetailsContent = observer(({ computedModel }: Dependenci ); }); -export const ReleaseDetailsContent = withInjectables(NonInjectedReleaseDetailsContent, { - getProps: (di, props) => ({ - ...props, - computedModel: di.inject(releaseDetailsModelInjectable, props.targetRelease), - }), -}); - const ResourceGroup = ({ group: { kind, isNamespaced, resources }, }: { diff --git a/packages/core/src/renderer/components/+helm-releases/release-details/release-details-drawer-toolbar.tsx b/packages/core/src/renderer/components/+helm-releases/release-details/release-details-drawer-toolbar.tsx index ddf6d9e096..d565e2842d 100644 --- a/packages/core/src/renderer/components/+helm-releases/release-details/release-details-drawer-toolbar.tsx +++ b/packages/core/src/renderer/components/+helm-releases/release-details/release-details-drawer-toolbar.tsx @@ -8,33 +8,23 @@ import "./release-details.scss"; import React from "react"; import { observer } from "mobx-react"; -import type { IAsyncComputed } from "@ogre-tools/injectable-react"; import { withInjectables } from "@ogre-tools/injectable-react"; -import type { TargetHelmRelease } from "./target-helm-release.injectable"; import navigateToHelmReleasesInjectable from "../../../../common/front-end-routing/routes/cluster/helm/releases/navigate-to-helm-releases.injectable"; import type { ReleaseDetailsModel } from "./release-details-model/release-details-model.injectable"; -import releaseDetailsModelInjectable from "./release-details-model/release-details-model.injectable"; import { HelmReleaseMenu } from "../release-menu"; interface ReleaseDetailsDrawerProps { - targetRelease: TargetHelmRelease; + model: ReleaseDetailsModel; } interface Dependencies { - computedModel: IAsyncComputed; navigateToHelmReleases: () => void; } const NonInjectedReleaseDetailsDrawerToolbar = observer(({ - computedModel, + model, navigateToHelmReleases, }: Dependencies & ReleaseDetailsDrawerProps) => { - const model = computedModel.value.get(); - - if (!model) { - return null; - } - if (model.loadingError.get()) { return null; } @@ -51,7 +41,6 @@ const NonInjectedReleaseDetailsDrawerToolbar = observer(({ export const ReleaseDetailsDrawerToolbar = withInjectables(NonInjectedReleaseDetailsDrawerToolbar, { getProps: (di, props) => ({ ...props, - computedModel: di.inject(releaseDetailsModelInjectable, props.targetRelease), navigateToHelmReleases: di.inject(navigateToHelmReleasesInjectable), }), }); diff --git a/packages/core/src/renderer/components/+helm-releases/release-details/release-details-drawer.tsx b/packages/core/src/renderer/components/+helm-releases/release-details/release-details-drawer.tsx index 67676ce337..24fc77f028 100644 --- a/packages/core/src/renderer/components/+helm-releases/release-details/release-details-drawer.tsx +++ b/packages/core/src/renderer/components/+helm-releases/release-details/release-details-drawer.tsx @@ -17,6 +17,9 @@ import activeThemeTypeInjectable from "../../../themes/active-type.injectable"; import { ReleaseDetailsContent } from "./release-details-content"; import navigateToHelmReleasesInjectable from "../../../../common/front-end-routing/routes/cluster/helm/releases/navigate-to-helm-releases.injectable"; import { ReleaseDetailsDrawerToolbar } from "./release-details-drawer-toolbar"; +import type { ReleaseDetailsModel } from "./release-details-model/release-details-model.injectable"; +import releaseDetailsModelInjectable from "./release-details-model/release-details-model.injectable"; +import { Spinner } from "../../spinner"; interface ReleaseDetailsDrawerProps { targetRelease: TargetHelmRelease; @@ -25,12 +28,14 @@ interface ReleaseDetailsDrawerProps { interface Dependencies { activeThemeType: ActiveThemeType; closeDrawer: () => void; + model: ReleaseDetailsModel; } const NonInjectedReleaseDetailsDrawer = observer(({ activeThemeType, closeDrawer, targetRelease, + model, }: Dependencies & ReleaseDetailsDrawerProps) => ( } + toolbar={} data-testid={`helm-release-details-for-${targetRelease.namespace}/${targetRelease.name}`} > - + )); -export const ReleaseDetailsDrawer = withInjectables< - Dependencies, - ReleaseDetailsDrawerProps ->(NonInjectedReleaseDetailsDrawer, { +interface PlaceholderDependencies { + activeThemeType: ActiveThemeType; + closeDrawer: () => void; +} + +const NonInjectedReleaseDetailsDrawerPlaceholder = observer(({ + targetRelease, + activeThemeType, + closeDrawer, +}: ReleaseDetailsDrawerProps & PlaceholderDependencies) => ( + + + +)); + +const ReleaseDetailsDrawerPlaceholder = withInjectables(NonInjectedReleaseDetailsDrawerPlaceholder, { getProps: (di, props) => ({ + ...props, activeThemeType: di.inject(activeThemeTypeInjectable), closeDrawer: di.inject(navigateToHelmReleasesInjectable), - ...props, + }), +}); + +export const ReleaseDetailsDrawer = withInjectables(NonInjectedReleaseDetailsDrawer, { + getPlaceholder: ReleaseDetailsDrawerPlaceholder, + getProps: async (di, props) => ({ + ...props, + activeThemeType: di.inject(activeThemeTypeInjectable), + closeDrawer: di.inject(navigateToHelmReleasesInjectable), + model: await di.inject(releaseDetailsModelInjectable, props.targetRelease), }), }); diff --git a/packages/core/src/renderer/components/+helm-releases/release-details/release-details-model/release-details-model.injectable.tsx b/packages/core/src/renderer/components/+helm-releases/release-details/release-details-model/release-details-model.injectable.tsx index dc0eb0871e..405f2dc614 100644 --- a/packages/core/src/renderer/components/+helm-releases/release-details/release-details-model/release-details-model.injectable.tsx +++ b/packages/core/src/renderer/components/+helm-releases/release-details/release-details-model/release-details-model.injectable.tsx @@ -31,15 +31,11 @@ import assert from "assert"; import activeThemeInjectable from "../../../../themes/active.injectable"; import type { ToHelmRelease } from "../../to-helm-release.injectable"; import toHelmReleaseInjectable from "../../to-helm-release.injectable"; -import { asyncComputed } from "@ogre-tools/injectable-react"; -import targetHelmReleaseInjectable from "../target-helm-release.injectable"; const releaseDetailsModelInjectable = getInjectable({ id: "release-details-model", - instantiate: (di, targetRelease: TargetHelmRelease) => { - const detailsHelmRelease = di.inject(targetHelmReleaseInjectable); - + instantiate: async (di, targetRelease: TargetHelmRelease) => { const model = new ReleaseDetailsModel({ requestDetailedHelmRelease: di.inject(requestDetailedHelmReleaseInjectable), targetRelease, @@ -54,27 +50,12 @@ const releaseDetailsModelInjectable = getInjectable({ toHelmRelease: di.inject(toHelmReleaseInjectable), }); - return asyncComputed({ - getValueFromObservedPromise: async () => { - const currentHelmRelease = detailsHelmRelease.get(); + await model.load(); - if ( - currentHelmRelease - && currentHelmRelease.name === targetRelease.name - && currentHelmRelease.namespace === targetRelease.namespace - ) { - await model.load(); - } - - return model; - }, - betweenUpdates: "show-latest-value", - }); + return model; }, - lifecycle: lifecycleEnum.keyedSingleton({ - getInstanceKey: (di, release: TargetHelmRelease) => `${release.namespace}/${release.name}`, - }), + lifecycle: lifecycleEnum.transient, }); export default releaseDetailsModelInjectable;