From fb12a2fb5812d0a09f61f687bf84d33a63132bde Mon Sep 17 00:00:00 2001 From: Sebastian Malton Date: Fri, 15 Oct 2021 10:02:34 -0400 Subject: [PATCH] Fix navigation issues, delete modal not showing, and observability Signed-off-by: Sebastian Malton --- src/common/catalog/catalog-entity.ts | 5 ++++- src/common/routes/apps.ts | 2 +- src/common/routes/cluster.ts | 2 +- src/common/routes/config-maps.ts | 2 +- src/common/routes/crd.ts | 2 +- src/common/routes/endpoints.ts | 2 +- src/common/routes/events.ts | 2 +- src/common/routes/hpa.ts | 2 +- src/common/routes/ingresses.ts | 2 +- src/common/routes/limit-ranges.ts | 2 +- src/common/routes/namespaces.ts | 2 +- src/common/routes/network-policies.ts | 2 +- src/common/routes/nodes.ts | 2 +- src/common/routes/pod-disruption-budgets.ts | 2 +- src/common/routes/port-forwards.ts | 2 +- src/common/routes/resource-quotas.ts | 2 +- src/common/routes/secrets.ts | 2 +- src/common/routes/services.ts | 2 +- src/common/routes/storage-classes.ts | 2 +- src/common/routes/user-management.ts | 12 ++++++------ src/common/routes/volume-claims.ts | 2 +- src/common/routes/volumes.ts | 2 +- src/common/routes/workloads.ts | 16 ++++++++-------- src/renderer/components/app.tsx | 3 +++ src/renderer/components/layout/sidebar.tsx | 19 +++++++++++++++++-- src/renderer/navigation/events.ts | 1 + 26 files changed, 59 insertions(+), 37 deletions(-) diff --git a/src/common/catalog/catalog-entity.ts b/src/common/catalog/catalog-entity.ts index d59a21686c..4407f04dd3 100644 --- a/src/common/catalog/catalog-entity.ts +++ b/src/common/catalog/catalog-entity.ts @@ -172,7 +172,10 @@ export interface CatalogEntitySettingsMenu { } export interface CatalogEntityContextMenuContext { - navigate: (url: string) => void; + /** + * Navigate to the specified pathname + */ + navigate: (pathname: string) => void; menuItems: CatalogEntityContextMenu[]; } diff --git a/src/common/routes/apps.ts b/src/common/routes/apps.ts index 72a92616dc..3e54a73a15 100644 --- a/src/common/routes/apps.ts +++ b/src/common/routes/apps.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const appsRoute: RouteProps = { - path: "/apps", + path: "/cluster/apps", }; export const appsURL = buildURL(appsRoute.path); diff --git a/src/common/routes/cluster.ts b/src/common/routes/cluster.ts index 3a39ccd22a..cfc714950f 100644 --- a/src/common/routes/cluster.ts +++ b/src/common/routes/cluster.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const clusterRoute: RouteProps = { - path: "/cluster" + path: "/cluster/overview" }; export const clusterURL = buildURL(clusterRoute.path); diff --git a/src/common/routes/config-maps.ts b/src/common/routes/config-maps.ts index 99aeaaf553..1931ac361c 100644 --- a/src/common/routes/config-maps.ts +++ b/src/common/routes/config-maps.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const configMapsRoute: RouteProps = { - path: "/configmaps" + path: "/cluster/configmaps" }; export interface ConfigMapsRouteParams { diff --git a/src/common/routes/crd.ts b/src/common/routes/crd.ts index 1a70fac875..01c338c8c3 100644 --- a/src/common/routes/crd.ts +++ b/src/common/routes/crd.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const crdRoute: RouteProps = { - path: "/crd" + path: "/cluster/crd" }; export const crdDefinitionsRoute: RouteProps = { diff --git a/src/common/routes/endpoints.ts b/src/common/routes/endpoints.ts index db09de66a0..ec4dc88a76 100644 --- a/src/common/routes/endpoints.ts +++ b/src/common/routes/endpoints.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const endpointRoute: RouteProps = { - path: "/endpoints" + path: "/cluster/endpoints" }; export interface EndpointRouteParams { diff --git a/src/common/routes/events.ts b/src/common/routes/events.ts index 73995ce6b0..dea2c18223 100644 --- a/src/common/routes/events.ts +++ b/src/common/routes/events.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const eventRoute: RouteProps = { - path: "/events" + path: "/cluster/events" }; export const eventsURL = buildURL(eventRoute.path); diff --git a/src/common/routes/hpa.ts b/src/common/routes/hpa.ts index a6f89661c2..8d18a65063 100644 --- a/src/common/routes/hpa.ts +++ b/src/common/routes/hpa.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const hpaRoute: RouteProps = { - path: "/hpa" + path: "/cluster/hpa" }; export interface HpaRouteParams { diff --git a/src/common/routes/ingresses.ts b/src/common/routes/ingresses.ts index 66c37774d5..83fc03d61e 100644 --- a/src/common/routes/ingresses.ts +++ b/src/common/routes/ingresses.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const ingressRoute: RouteProps = { - path: "/ingresses" + path: "/cluster/ingresses" }; export interface IngressRouteParams { diff --git a/src/common/routes/limit-ranges.ts b/src/common/routes/limit-ranges.ts index 02b9258c67..23cf3481b3 100644 --- a/src/common/routes/limit-ranges.ts +++ b/src/common/routes/limit-ranges.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const limitRangesRoute: RouteProps = { - path: "/limitranges" + path: "/cluster/limitranges" }; export interface LimitRangeRouteParams { diff --git a/src/common/routes/namespaces.ts b/src/common/routes/namespaces.ts index 4a23950648..ba85d162c7 100644 --- a/src/common/routes/namespaces.ts +++ b/src/common/routes/namespaces.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const namespacesRoute: RouteProps = { - path: "/namespaces" + path: "/cluster/namespaces" }; export interface NamespacesRouteParams { diff --git a/src/common/routes/network-policies.ts b/src/common/routes/network-policies.ts index b49094a418..54a97add6d 100644 --- a/src/common/routes/network-policies.ts +++ b/src/common/routes/network-policies.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const networkPoliciesRoute: RouteProps = { - path: "/network-policies" + path: "/cluster/network-policies" }; export interface NetworkPoliciesRouteParams { diff --git a/src/common/routes/nodes.ts b/src/common/routes/nodes.ts index bfb6d8ea00..5a196131da 100644 --- a/src/common/routes/nodes.ts +++ b/src/common/routes/nodes.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const nodesRoute: RouteProps = { - path: "/nodes" + path: "/cluster/nodes" }; export interface NodesRouteParams { diff --git a/src/common/routes/pod-disruption-budgets.ts b/src/common/routes/pod-disruption-budgets.ts index 985752746a..f1391cb847 100644 --- a/src/common/routes/pod-disruption-budgets.ts +++ b/src/common/routes/pod-disruption-budgets.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const pdbRoute: RouteProps = { - path: "/poddisruptionbudgets" + path: "/cluster/poddisruptionbudgets" }; export interface PodDisruptionBudgetsRouteParams { diff --git a/src/common/routes/port-forwards.ts b/src/common/routes/port-forwards.ts index d05b8583ab..317327c688 100644 --- a/src/common/routes/port-forwards.ts +++ b/src/common/routes/port-forwards.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const portForwardsRoute: RouteProps = { - path: "/port-forwards" + path: "/cluster/port-forwards" }; export interface PortForwardsRouteParams { diff --git a/src/common/routes/resource-quotas.ts b/src/common/routes/resource-quotas.ts index 7d8a5163a2..aac4e18f15 100644 --- a/src/common/routes/resource-quotas.ts +++ b/src/common/routes/resource-quotas.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const resourceQuotaRoute: RouteProps = { - path: "/resourcequotas" + path: "/cluster/resourcequotas" }; export interface ResourceQuotaRouteParams { diff --git a/src/common/routes/secrets.ts b/src/common/routes/secrets.ts index 10ee187f64..cfaaead75c 100644 --- a/src/common/routes/secrets.ts +++ b/src/common/routes/secrets.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const secretsRoute: RouteProps = { - path: "/secrets" + path: "/cluster/secrets" }; export interface SecretsRouteParams { diff --git a/src/common/routes/services.ts b/src/common/routes/services.ts index b4e3acdad9..14c9134a14 100644 --- a/src/common/routes/services.ts +++ b/src/common/routes/services.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const servicesRoute: RouteProps = { - path: "/services" + path: "/cluster/services" }; export interface ServicesRouteParams { diff --git a/src/common/routes/storage-classes.ts b/src/common/routes/storage-classes.ts index 1a0128cbf8..d918506b78 100644 --- a/src/common/routes/storage-classes.ts +++ b/src/common/routes/storage-classes.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const storageClassesRoute: RouteProps = { - path: "/storage-classes" + path: "/cluster/storage-classes" }; export interface StorageClassesRouteParams { diff --git a/src/common/routes/user-management.ts b/src/common/routes/user-management.ts index 97aef36e1f..af50217830 100644 --- a/src/common/routes/user-management.ts +++ b/src/common/routes/user-management.ts @@ -24,22 +24,22 @@ import { buildURL, URLParams } from "../utils/buildUrl"; // Routes export const serviceAccountsRoute: RouteProps = { - path: "/service-accounts" + path: "/cluster/service-accounts" }; export const podSecurityPoliciesRoute: RouteProps = { - path: "/pod-security-policies" + path: "/cluster/pod-security-policies" }; export const rolesRoute: RouteProps = { - path: "/roles" + path: "/cluster/roles" }; export const clusterRolesRoute: RouteProps = { - path: "/cluster-roles" + path: "/cluster/cluster-roles" }; export const roleBindingsRoute: RouteProps = { - path: "/role-bindings" + path: "/cluster/role-bindings" }; export const clusterRoleBindingsRoute: RouteProps = { - path: "/cluster-role-bindings" + path: "/cluster/cluster-role-bindings" }; export const usersManagementRoute: RouteProps = { diff --git a/src/common/routes/volume-claims.ts b/src/common/routes/volume-claims.ts index 42171328df..6a784c2807 100644 --- a/src/common/routes/volume-claims.ts +++ b/src/common/routes/volume-claims.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const volumeClaimsRoute: RouteProps = { - path: "/persistent-volume-claims" + path: "/cluster/persistent-volume-claims" }; export interface VolumeClaimsRouteParams { diff --git a/src/common/routes/volumes.ts b/src/common/routes/volumes.ts index c5a969e988..171651ba5e 100644 --- a/src/common/routes/volumes.ts +++ b/src/common/routes/volumes.ts @@ -23,7 +23,7 @@ import type { RouteProps } from "react-router"; import { buildURL } from "../utils/buildUrl"; export const volumesRoute: RouteProps = { - path: "/persistent-volumes" + path: "/cluster/persistent-volumes" }; export interface VolumesRouteParams { diff --git a/src/common/routes/workloads.ts b/src/common/routes/workloads.ts index 94a9378d02..169fdd4388 100644 --- a/src/common/routes/workloads.ts +++ b/src/common/routes/workloads.ts @@ -25,28 +25,28 @@ import type { KubeResource } from "../rbac"; // Routes export const overviewRoute: RouteProps = { - path: "/workloads" + path: "/cluster/workloads" }; export const podsRoute: RouteProps = { - path: "/pods" + path: "/cluster/pods" }; export const deploymentsRoute: RouteProps = { - path: "/deployments" + path: "/cluster/deployments" }; export const daemonSetsRoute: RouteProps = { - path: "/daemonsets" + path: "/cluster/daemonsets" }; export const statefulSetsRoute: RouteProps = { - path: "/statefulsets" + path: "/cluster/statefulsets" }; export const replicaSetsRoute: RouteProps = { - path: "/replicasets" + path: "/cluster/replicasets" }; export const jobsRoute: RouteProps = { - path: "/jobs" + path: "/cluster/jobs" }; export const cronJobsRoute: RouteProps = { - path: "/cronjobs" + path: "/cluster/cronjobs" }; export const workloadsRoute: RouteProps = { diff --git a/src/renderer/components/app.tsx b/src/renderer/components/app.tsx index 769c9fe9c4..470ad8f845 100755 --- a/src/renderer/components/app.tsx +++ b/src/renderer/components/app.tsx @@ -75,6 +75,7 @@ import type { ClusterId } from "../../common/cluster-types"; import { watchHistoryState } from "../remote-helpers/history-updater"; import { unmountComponentAtNode } from "react-dom"; import { PortForwardDialog } from "../port-forward"; +import { DeleteClusterDialog } from "./delete-cluster-dialog"; @observer export class App extends React.Component { @@ -220,6 +221,7 @@ export class App extends React.Component { {this.renderExtensionTabLayoutRoutes()} {this.renderExtensionRoutes()} + @@ -233,6 +235,7 @@ export class App extends React.Component { + diff --git a/src/renderer/components/layout/sidebar.tsx b/src/renderer/components/layout/sidebar.tsx index 3974f317a1..53087e9f83 100644 --- a/src/renderer/components/layout/sidebar.tsx +++ b/src/renderer/components/layout/sidebar.tsx @@ -42,9 +42,11 @@ import * as routes from "../../../common/routes"; import { Config } from "../+config"; import { catalogEntityRegistry } from "../../api/catalog-entity-registry"; import { HotbarIcon } from "../hotbar/hotbar-icon"; -import { observable } from "mobx"; +import { makeObservable, observable } from "mobx"; import type { CatalogEntityContextMenuContext } from "../../../common/catalog"; import { HotbarStore } from "../../../common/hotbar-store"; +import { broadcastMessage } from "../../../common/ipc"; +import { IpcRendererNavigationEvents } from "../../navigation/events"; interface Props { className?: string; @@ -55,9 +57,22 @@ export class Sidebar extends React.Component { static displayName = "Sidebar"; @observable private contextMenu: CatalogEntityContextMenuContext = { menuItems: [], - navigate: (url: string) => navigate(url), + navigate: (pathname: string) => { + if (pathname.startsWith("/cluster/")) { + // assume in-frame navigation + // FIXME: this is not entirely correct because of extension navigation rules + navigate(pathname); + } else { + broadcastMessage(IpcRendererNavigationEvents.NAVIGATE_IN_APP, pathname); + } + }, }; + constructor(props: Props) { + super(props); + makeObservable(this); + } + async componentDidMount() { crdStore.reloadAll(); } diff --git a/src/renderer/navigation/events.ts b/src/renderer/navigation/events.ts index eaf3741b34..6435bfde1f 100644 --- a/src/renderer/navigation/events.ts +++ b/src/renderer/navigation/events.ts @@ -63,6 +63,7 @@ function bindClusterManagerRouteEvents() { ipcRendererOn(IpcRendererNavigationEvents.NAVIGATE_IN_APP, (event, url: string) => { logger.info(`[IPC]: navigate to ${url}`, { currentLocation: location.href }); navigate(url); + window.focus(); // make sure that the main frame is focused }); }