From 574bc0729f1d40160228f44d292bebc56a42a762 Mon Sep 17 00:00:00 2001 From: Michael Nelson Date: Thu, 21 Oct 2021 16:34:47 +1100 Subject: [PATCH] Enable displaying available package detail. Signed-off-by: Michael Nelson --- .../src/components/Catalog/PackageCatalogItem.tsx | 9 --------- .../components/PackageHeader/PackageView.test.tsx | 5 +++-- .../src/components/PackageHeader/PackageView.tsx | 14 ++++++-------- .../src/containers/RoutesContainer/Routes.tsx | 7 ++----- dashboard/src/shared/url.ts | 9 ++++++--- 5 files changed, 17 insertions(+), 27 deletions(-) diff --git a/dashboard/src/components/Catalog/PackageCatalogItem.tsx b/dashboard/src/components/Catalog/PackageCatalogItem.tsx index ecb642314b9..926e9ce2b2f 100644 --- a/dashboard/src/components/Catalog/PackageCatalogItem.tsx +++ b/dashboard/src/components/Catalog/PackageCatalogItem.tsx @@ -1,5 +1,3 @@ -import { useSelector } from "react-redux"; -import { IStoreState } from "shared/types"; import * as url from "shared/url"; import { getPluginIcon, PluginNames, trimDescription } from "shared/utils"; import placeholder from "../../placeholder.png"; @@ -8,12 +6,6 @@ import { IPackageCatalogItem } from "./CatalogItem"; export default function PackageCatalogItem(props: IPackageCatalogItem) { const { cluster, namespace, availablePackageSummary } = props; - const { config } = useSelector((state: IStoreState) => state); - - // A package is "global" if its cluster and namespace are the ones in which Kubeapps is installed on - const isGlobal = - availablePackageSummary.availablePackageRef?.context?.namespace === config.kubeappsNamespace && - availablePackageSummary.availablePackageRef?.context?.cluster === config.kubeappsCluster; // Use the current cluster/namespace in the URL (passed as props here), // but, if it is global a "global" segement will be included in the generated URL. @@ -21,7 +13,6 @@ export default function PackageCatalogItem(props: IPackageCatalogItem) { cluster, namespace, availablePackageSummary.availablePackageRef!, - isGlobal, ); // Historically, this tag is used to show the repository a given package is from, diff --git a/dashboard/src/components/PackageHeader/PackageView.test.tsx b/dashboard/src/components/PackageHeader/PackageView.test.tsx index d79581c03a5..2981ae3c63d 100644 --- a/dashboard/src/components/PackageHeader/PackageView.test.tsx +++ b/dashboard/src/components/PackageHeader/PackageView.test.tsx @@ -101,8 +101,9 @@ afterEach(() => { spyOnUseDispatch.mockRestore(); }); -const routePathParam = `/c/${defaultProps.cluster}/ns/${defaultProps.packageNamespace}/packages/${defaultProps.plugin.name}/${defaultProps.plugin.version}/${defaultProps.id}`; -const routePath = "/c/:cluster/ns/:namespace/packages/:pluginName/:pluginVersion/:packageId"; +const routePathParam = `/c/${defaultProps.cluster}/ns/${defaultProps.namespace}/packages/${defaultProps.plugin.name}/${defaultProps.plugin.version}/${defaultProps.cluster}/${defaultProps.packageNamespace}/${defaultProps.id}`; +const routePath = + "/c/:cluster/ns/:namespace/packages/:pluginName/:pluginVersion/:packageCluster/:packageNamespace/:packageId"; const history = createMemoryHistory({ initialEntries: [routePathParam] }); it("triggers the fetchAvailablePackageVersions when mounting", () => { diff --git a/dashboard/src/components/PackageHeader/PackageView.tsx b/dashboard/src/components/PackageHeader/PackageView.tsx index f08e042e54d..0639d7dd97c 100644 --- a/dashboard/src/components/PackageHeader/PackageView.tsx +++ b/dashboard/src/components/PackageHeader/PackageView.tsx @@ -23,9 +23,10 @@ import PackageReadme from "./PackageReadme"; interface IRouteParams { cluster: string; namespace: string; - global: string; pluginName: string; pluginVersion: string; + packageCluster: string; + packageNamespace: string; packageId: string; packageVersion?: string; } @@ -36,10 +37,11 @@ export default function PackageView() { const { cluster: targetCluster, namespace: targetNamespace, - global, packageId, pluginName, pluginVersion, + packageCluster, + packageNamespace, packageVersion, } = ReactRouter.useParams() as IRouteParams; const { @@ -49,12 +51,8 @@ export default function PackageView() { const [pluginObj] = useState({ name: pluginName, version: pluginVersion } as Plugin); - const isGlobal = global === "global"; - - // Use the cluster/namespace from the URL unless it comes from a "global" repository. - // In that case, use the cluster/namespace from where kubeapps has been installed on - const packageCluster = isGlobal ? config.kubeappsCluster : targetCluster; - const packageNamespace = isGlobal ? config.kubeappsNamespace : targetNamespace; + const isGlobal = + packageCluster == config.kubeappsCluster && packageNamespace == config.kubeappsNamespace; // Fetch the selected/latest version on the initial load useEffect(() => { diff --git a/dashboard/src/containers/RoutesContainer/Routes.tsx b/dashboard/src/containers/RoutesContainer/Routes.tsx index d1e402e042f..00088421052 100644 --- a/dashboard/src/containers/RoutesContainer/Routes.tsx +++ b/dashboard/src/containers/RoutesContainer/Routes.tsx @@ -34,12 +34,9 @@ const privateRoutes = { "/c/:cluster/ns/:namespace/apps/new-from-:global(global)/:pluginName/:pluginVersion/:packageId/versions/:packageVersion": DeploymentForm, "/c/:cluster/ns/:namespace/catalog": Catalog, - "/c/:cluster/ns/:namespace/packages/:pluginName/:pluginVersion/:packageId": PackageView, - "/c/:cluster/ns/:namespace/packages/:pluginName/:pluginVersion/:packageId/versions/:packageVersion": + "/c/:cluster/ns/:namespace/packages/:pluginName/:pluginVersion/:packageCluster/:packageNamespace/:packageId": PackageView, - "/c/:cluster/ns/:namespace/:global(global)-packages/:pluginName/:pluginVersion/:packageId": - PackageView, - "/c/:cluster/ns/:namespace/:global(global)-packages/:pluginName/:pluginVersion/:packageId/versions/:packageVersion": + "/c/:cluster/ns/:namespace/packages/:pluginName/:pluginVersion/:packageCluster/:packageNamespace/:packageId/versions/:packageVersion": PackageView, "/c/:cluster/ns/:namespace/operators": OperatorsListContainer, "/c/:cluster/ns/:namespace/operators/:operator": OperatorViewContainer, diff --git a/dashboard/src/shared/url.ts b/dashboard/src/shared/url.ts index d04e266d500..b774de76f8d 100644 --- a/dashboard/src/shared/url.ts +++ b/dashboard/src/shared/url.ts @@ -41,13 +41,16 @@ export const app = { cluster: string, namespace: string, availablePackageReference: AvailablePackageReference, - isGlobal: boolean, ) => { const pkgPluginName = availablePackageReference?.plugin?.name; const pkgPluginVersion = availablePackageReference?.plugin?.version; const pkgId = availablePackageReference?.identifier || ""; - const globalSegment = isGlobal ? "global-packages" : "packages"; - return `/c/${cluster}/ns/${namespace}/${globalSegment}/${pkgPluginName}/${pkgPluginVersion}/${encodeURIComponent( + // Some plugins may not be cluster-aware nor support multi-cluster, so + // if the returned available package ref doesn't set cluster, use the current + // one. + const pkgCluster = availablePackageReference?.context?.cluster || cluster; + const pkgNamespace = availablePackageReference?.context?.namespace; + return `/c/${cluster}/ns/${namespace}/packages/${pkgPluginName}/${pkgPluginVersion}/${pkgCluster}/${pkgNamespace}/${encodeURIComponent( pkgId, )}`; },