Split out kube-detail URL params

Signed-off-by: Sebastian Malton <[email protected]>

src/extensions/renderer-api/components.ts

@@ -62,6 +62,7 @@ export * from "../../renderer/components/chart/bar-chart";
 export * from "../../renderer/components/chart/pie-chart";
 
 // kube helpers
+export * from "../../renderer/components/kube-detail-params";
 export * from "../../renderer/components/kube-object-details";
 export * from "../../renderer/components/kube-object-list-layout";
 export * from "../../renderer/components/kube-object-menu";

src/extensions/renderer-api/navigation.ts

@@ -23,7 +23,7 @@ import { navigation, PageParam, PageParamInit } from "../../renderer/navigation"
 
 export type { PageParamInit, PageParam } from "../../renderer/navigation/page-param";
 export { navigate, isActiveRoute } from "../../renderer/navigation/helpers";
-export { hideDetails, showDetails, getDetailsUrl } from "../../renderer/components/kube-object-details";
+export { hideDetails, showDetails, getDetailsUrl } from "../../renderer/components/kube-detail-params";
 export type { URLParams } from "../../common/utils/buildUrl";
 
 export function createPageParam<V>(init: PageParamInit<V>) {

src/renderer/components/+apps-releases/release-details.tsx

@@ -45,7 +45,7 @@ import { apiManager } from "../../api/api-manager";
 import { SubTitle } from "../layout/sub-title";
 import { secretsStore } from "../+config-secrets/secrets.store";
 import { Secret } from "../../api/endpoints";
-import { getDetailsUrl } from "../kube-object-details";
+import { getDetailsUrl } from "../kube-detail-params";
 import { Checkbox } from "../checkbox";
 
 interface Props {

src/renderer/components/+apps-releases/release-menu.tsx

@@ -45,7 +45,7 @@ export class HelmReleaseMenu extends React.Component<Props> {
     const { release, hideDetails } = this.props;
 
     createUpgradeChartTab(release);
-    hideDetails && hideDetails();
+    hideDetails?.();
   }
 
   @boundMethod

src/renderer/components/+cluster/cluster-issues.tsx

@@ -34,7 +34,7 @@ import type { ItemObject } from "../../item.store";
 import { Spinner } from "../spinner";
 import { ThemeStore } from "../../theme.store";
 import { lookupApiLink } from "../../api/kube-api";
-import { kubeSelectedUrlParam, showDetails } from "../kube-object-details";
+import { kubeSelectedUrlParam, showDetails } from "../kube-detail-params";
 import { kubeWatchApi } from "../../api/kube-watch-api";
 
 interface Props {

src/renderer/components/+config-secrets/add-secret-dialog.tsx

@@ -37,7 +37,7 @@ import type { KubeObjectMetadata } from "../../api/kube-object";
 import { base64 } from "../../utils";
 import { Notifications } from "../notifications";
 import upperFirst from "lodash/upperFirst";
-import { showDetails } from "../kube-object-details";
+import { showDetails } from "../kube-detail-params";
 
 interface Props extends Partial<DialogProps> {
 }

src/renderer/components/+events/event-details.tsx

@@ -26,12 +26,13 @@ import kebabCase from "lodash/kebabCase";
 import { DrawerItem, DrawerTitle } from "../drawer";
 import { Link } from "react-router-dom";
 import { observer } from "mobx-react";
-import { KubeObjectDetailsProps, getDetailsUrl } from "../kube-object-details";
+import type { KubeObjectDetailsProps } from "../kube-object-details";
 import type { KubeEvent } from "../../api/endpoints/events.api";
 import { KubeObjectMeta } from "../kube-object-meta/kube-object-meta";
 import { Table, TableCell, TableHead, TableRow } from "../table";
 import { lookupApiLink } from "../../api/kube-api";
 import { LocaleDate } from "../locale-date";
+import { getDetailsUrl } from "../kube-detail-params";
 
 interface Props extends KubeObjectDetailsProps<KubeEvent> {
 }

src/renderer/components/+events/events.tsx

@@ -37,7 +37,7 @@ import { cssNames, IClassName, stopPropagation } from "../../utils";
 import { Icon } from "../icon";
 import { lookupApiLink } from "../../api/kube-api";
 import { eventsURL } from "../../../common/routes";
-import { getDetailsUrl } from "../kube-object-details";
+import { getDetailsUrl } from "../kube-detail-params";
 
 enum columnId {
   message = "message",

src/renderer/components/+network-endpoints/endpoint-subset-list.tsx

@@ -28,7 +28,7 @@ import { Table, TableCell, TableHead, TableRow } from "../table";
 import { boundMethod } from "../../utils";
 import { lookupApiLink } from "../../api/kube-api";
 import { Link } from "react-router-dom";
-import { getDetailsUrl } from "../kube-object-details";
+import { getDetailsUrl } from "../kube-detail-params";
 
 interface Props {
   subset: EndpointSubset;

src/renderer/components/+network-services/service-details-endpoint.tsx

@@ -26,7 +26,7 @@ import { Table, TableHead, TableCell, TableRow } from "../table";
 import { prevDefault } from "../../utils";
 import { endpointStore } from "../+network-endpoints/endpoints.store";
 import { Spinner } from "../spinner";
-import { showDetails } from "../kube-object-details";
+import { showDetails } from "../kube-detail-params";
 
 interface Props {
   endpoint: KubeObject;

src/renderer/components/+storage-volume-claims/volume-claim-details.tsx

@@ -30,11 +30,12 @@ import { podsStore } from "../+workloads-pods/pods.store";
 import { Link } from "react-router-dom";
 import { ResourceMetrics } from "../resource-metrics";
 import { VolumeClaimDiskChart } from "./volume-claim-disk-chart";
-import { getDetailsUrl, KubeObjectDetailsProps} from "../kube-object-details";
+import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { getMetricsForPvc, IPvcMetrics, PersistentVolumeClaim } from "../../api/endpoints";
 import { getActiveClusterEntity } from "../../api/catalog-entity-registry";
 import { ClusterMetricsResourceType } from "../../../common/cluster-types";
 import { KubeObjectMeta } from "../kube-object-meta";
+import { getDetailsUrl } from "../kube-detail-params";
 
 interface Props extends KubeObjectDetailsProps<PersistentVolumeClaim> {
 }

src/renderer/components/+storage-volume-claims/volume-claims.tsx

@@ -32,7 +32,7 @@ import { stopPropagation } from "../../utils";
 import { storageClassApi } from "../../api/endpoints";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
 import type { VolumeClaimsRouteParams } from "../../../common/routes";
-import { getDetailsUrl } from "../kube-object-details";
+import { getDetailsUrl } from "../kube-detail-params";
 
 enum columnId {
   name = "name",

src/renderer/components/+storage-volumes/volume-details-list.tsx

@@ -27,7 +27,7 @@ import type { PersistentVolume } from "../../api/endpoints/persistent-volume.api
 import { boundMethod } from "../../../common/utils/autobind";
 import { TableRow } from "../table/table-row";
 import { cssNames, prevDefault } from "../../utils";
-import { showDetails } from "../kube-object-details";
+import { showDetails } from "../kube-detail-params";
 import { TableCell } from "../table/table-cell";
 import { Spinner } from "../spinner/spinner";
 import { DrawerTitle } from "../drawer/drawer-title";

src/renderer/components/+storage-volumes/volume-details.tsx

@@ -28,8 +28,9 @@ import { observer } from "mobx-react";
 import { DrawerItem, DrawerTitle } from "../drawer";
 import { Badge } from "../badge";
 import { PersistentVolume, pvcApi } from "../../api/endpoints";
-import { getDetailsUrl, KubeObjectDetailsProps } from "../kube-object-details";
+import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { KubeObjectMeta } from "../kube-object-meta/kube-object-meta";
+import { getDetailsUrl } from "../kube-detail-params";
 
 interface Props extends KubeObjectDetailsProps<PersistentVolume> {
 }

src/renderer/components/+storage-volumes/volumes.tsx

@@ -25,7 +25,7 @@ import React from "react";
 import { observer } from "mobx-react";
 import { Link, RouteComponentProps } from "react-router-dom";
 import { KubeObjectListLayout } from "../kube-object-list-layout";
-import { getDetailsUrl} from "../kube-object-details";
+import { getDetailsUrl } from "../kube-detail-params";
 import { stopPropagation } from "../../utils";
 import { volumesStore } from "./volumes.store";
 import { pvcApi, storageClassApi } from "../../api/endpoints";

src/renderer/components/+user-management/+cluster-role-bindings/dialog.tsx

@@ -30,7 +30,7 @@ import { ClusterRole, ClusterRoleBinding, ClusterRoleBindingSubject, ServiceAcco
 import { Dialog, DialogProps } from "../../dialog";
 import { EditableList } from "../../editable-list";
 import { Icon } from "../../icon";
-import { showDetails } from "../../kube-object-details";
+import { showDetails } from "../../kube-detail-params";
 import { SubTitle } from "../../layout/sub-title";
 import { Notifications } from "../../notifications";
 import { Select, SelectOption } from "../../select";

src/renderer/components/+user-management/+cluster-roles/add-dialog.tsx

@@ -26,7 +26,7 @@ import React from "react";
 
 import { Dialog, DialogProps } from "../../dialog";
 import { Input } from "../../input";
-import { showDetails } from "../../kube-object-details";
+import { showDetails } from "../../kube-detail-params";
 import { SubTitle } from "../../layout/sub-title";
 import { Notifications } from "../../notifications";
 import { Wizard, WizardStep } from "../../wizard";

src/renderer/components/+user-management/+role-bindings/dialog.tsx

@@ -32,7 +32,7 @@ import { ClusterRole, Role, roleApi, RoleBinding, RoleBindingSubject, ServiceAcc
 import { Dialog, DialogProps } from "../../dialog";
 import { EditableList } from "../../editable-list";
 import { Icon } from "../../icon";
-import { showDetails } from "../../kube-object-details";
+import { showDetails } from "../../kube-detail-params";
 import { SubTitle } from "../../layout/sub-title";
 import { Notifications } from "../../notifications";
 import { Select, SelectOption } from "../../select";

src/renderer/components/+user-management/+roles/add-dialog.tsx

@@ -28,7 +28,7 @@ import { observer } from "mobx-react";
 import { NamespaceSelect } from "../../+namespaces/namespace-select";
 import { Dialog, DialogProps } from "../../dialog";
 import { Input } from "../../input";
-import { showDetails } from "../../kube-object-details";
+import { showDetails } from "../../kube-detail-params";
 import { SubTitle } from "../../layout/sub-title";
 import { Notifications } from "../../notifications";
 import { Wizard, WizardStep } from "../../wizard";

src/renderer/components/+user-management/+service-accounts/create-dialog.tsx

@@ -29,7 +29,7 @@ import { NamespaceSelect } from "../../+namespaces/namespace-select";
 import { Dialog, DialogProps } from "../../dialog";
 import { Input } from "../../input";
 import { systemName } from "../../input/input_validators";
-import { showDetails } from "../../kube-object-details";
+import { showDetails } from "../../kube-detail-params";
 import { SubTitle } from "../../layout/sub-title";
 import { Notifications } from "../../notifications";
 import { Wizard, WizardStep } from "../../wizard";

src/renderer/components/+user-management/+service-accounts/details.tsx

@@ -30,10 +30,11 @@ import { secretsStore } from "../../+config-secrets/secrets.store";
 import { Secret, ServiceAccount } from "../../../api/endpoints";
 import { DrawerItem, DrawerTitle } from "../../drawer";
 import { Icon } from "../../icon";
-import { getDetailsUrl, KubeObjectDetailsProps } from "../../kube-object-details";
+import type { KubeObjectDetailsProps } from "../../kube-object-details";
 import { KubeObjectMeta } from "../../kube-object-meta/kube-object-meta";
 import { Spinner } from "../../spinner";
 import { ServiceAccountsSecret } from "./secret";
+import { getDetailsUrl } from "../../kube-detail-params";
 
 interface Props extends KubeObjectDetailsProps<ServiceAccount> {
 }

src/renderer/components/+workloads-cronjobs/cronjob-details.tsx

@@ -29,9 +29,10 @@ import { Badge } from "../badge/badge";
 import { jobStore } from "../+workloads-jobs/job.store";
 import { Link } from "react-router-dom";
 import { cronJobStore } from "./cronjob.store";
-import { getDetailsUrl, KubeObjectDetailsProps } from "../kube-object-details";
+import type { KubeObjectDetailsProps } from "../kube-object-details";
 import type { CronJob, Job } from "../../api/endpoints";
 import { KubeObjectMeta } from "../kube-object-meta/kube-object-meta";
+import { getDetailsUrl } from "../kube-detail-params";
 
 interface Props extends KubeObjectDetailsProps<CronJob> {
 }

src/renderer/components/+workloads-deployments/deployment-replicasets.tsx

@@ -31,7 +31,7 @@ import { DrawerTitle } from "../drawer";
 import { Table, TableCell, TableHead, TableRow } from "../table";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
 import { replicaSetStore } from "../+workloads-replicasets/replicasets.store";
-import { showDetails } from "../kube-object-details";
+import { showDetails } from "../kube-detail-params";
 
 
 enum sortBy {

src/renderer/components/+workloads-jobs/job-details.tsx

@@ -32,7 +32,7 @@ import { PodDetailsTolerations } from "../+workloads-pods/pod-details-toleration
 import { PodDetailsAffinities } from "../+workloads-pods/pod-details-affinities";
 import { podsStore } from "../+workloads-pods/pods.store";
 import { jobStore } from "./job.store";
-import { getDetailsUrl, KubeObjectDetailsProps } from "../kube-object-details";
+import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { getMetricsForJobs, IPodMetrics, Job } from "../../api/endpoints";
 import { PodDetailsList } from "../+workloads-pods/pod-details-list";
 import { lookupApiLink } from "../../api/kube-api";
@@ -43,6 +43,7 @@ import { ClusterMetricsResourceType } from "../../../common/cluster-types";
 import { getActiveClusterEntity } from "../../api/catalog-entity-registry";
 import { ResourceMetrics } from "../resource-metrics";
 import { boundMethod } from "autobind-decorator";
+import { getDetailsUrl } from "../kube-detail-params";
 
 interface Props extends KubeObjectDetailsProps<Job> {
 }

src/renderer/components/+workloads-pods/pod-details-list.tsx

@@ -34,7 +34,7 @@ import { Table, TableCell, TableHead, TableRow } from "../table";
 import { Spinner } from "../spinner";
 import { DrawerTitle } from "../drawer";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
-import { showDetails } from "../kube-object-details";
+import { showDetails } from "../kube-detail-params";
 
 enum sortBy {
   name = "name",

src/renderer/components/+workloads-pods/pod-details-secrets.tsx

@@ -26,7 +26,7 @@ import { Link } from "react-router-dom";
 import { autorun, observable, makeObservable } from "mobx";
 import { disposeOnUnmount, observer } from "mobx-react";
 import { Pod, Secret, secretsApi } from "../../api/endpoints";
-import { getDetailsUrl } from "../kube-object-details";
+import { getDetailsUrl } from "../kube-detail-params";
 
 interface Props {
   pod: Pod;

src/renderer/components/+workloads-pods/pod-details.tsx

@@ -36,12 +36,13 @@ import { PodDetailsTolerations } from "./pod-details-tolerations";
 import { Icon } from "../icon";
 import { PodDetailsSecrets } from "./pod-details-secrets";
 import { ResourceMetrics } from "../resource-metrics";
-import { getDetailsUrl, KubeObjectDetailsProps } from "../kube-object-details";
+import type { KubeObjectDetailsProps } from "../kube-object-details";
 import { getItemMetrics } from "../../api/endpoints/metrics.api";
 import { PodCharts, podMetricTabs } from "./pod-charts";
 import { KubeObjectMeta } from "../kube-object-meta/kube-object-meta";
 import { getActiveClusterEntity } from "../../api/catalog-entity-registry";
 import { ClusterMetricsResourceType } from "../../../common/cluster-types";
+import { getDetailsUrl } from "../kube-detail-params";
 
 interface Props extends KubeObjectDetailsProps<Pod> {
 }

src/renderer/components/+workloads-pods/pods.tsx

@@ -39,7 +39,7 @@ import { lookupApiLink } from "../../api/kube-api";
 import { KubeObjectStatusIcon } from "../kube-object-status-icon";
 import { Badge } from "../badge";
 import type { PodsRouteParams } from "../../../common/routes";
-import { getDetailsUrl } from "../kube-object-details";
+import { getDetailsUrl } from "../kube-detail-params";
 
 enum columnId {
   name = "name",

src/renderer/components/kube-detail-params/index.ts

@@ -0,0 +1,22 @@
+/**
+ * Copyright (c) 2021 OpenLens Authors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of
+ * this software and associated documentation files (the "Software"), to deal in
+ * the Software without restriction, including without limitation the rights to
+ * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+ * the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+ * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+ * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+ * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+
+export * from "./params";

src/renderer/components/kube-detail-params/params.ts

@@ -0,0 +1,67 @@
+/**
+ * Copyright (c) 2021 OpenLens Authors
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of
+ * this software and associated documentation files (the "Software"), to deal in
+ * the Software without restriction, including without limitation the rights to
+ * use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+ * the Software, and to permit persons to whom the Software is furnished to do so,
+ * subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in all
+ * copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+ * FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+ * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+ * IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+ * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+ */
+import { createPageParam, navigation } from "../../navigation";
+
+/**
+ * Used to store `object.selfLink` to show more info about resource in the details panel.
+ */
+export const kubeDetailsUrlParam = createPageParam({
+  name: "kube-details",
+});
+
+/**
+ * Used to highlight last active/selected table row with the resource.
+ *
+ * @example
+ * If we go to "Nodes (page) -> Node (details) -> Pod (details)",
+ * last clicked Node should be "active" while Pod details are shown).
+ */
+export const kubeSelectedUrlParam = createPageParam({
+  name: "kube-selected",
+  get defaultValue() {
+    return kubeDetailsUrlParam.get();
+  }
+});
+
+export function showDetails(selfLink = "", resetSelected = true) {
+  const detailsUrl = getDetailsUrl(selfLink, resetSelected);
+
+  navigation.merge({ search: detailsUrl });
+}
+
+export function hideDetails() {
+  showDetails();
+}
+
+export function getDetailsUrl(selfLink: string, resetSelected = false, mergeGlobals = true) {
+  console.debug("getDetailsUrl", { selfLink, resetSelected, mergeGlobals });
+  const params = new URLSearchParams(mergeGlobals ? navigation.searchParams : "");
+
+  params.set(kubeDetailsUrlParam.name, selfLink);
+
+  if (resetSelected) {
+    params.delete(kubeSelectedUrlParam.name);
+  } else {
+    params.set(kubeSelectedUrlParam.name, kubeSelectedUrlParam.get());
+  }
+
+  return `?${params}`;
+}