Allow to navigate to created resource details from notification (#4422)

navigate to created resource details from notification

src/common/k8s-api/api-manager.ts

@@ -95,10 +95,10 @@ export class ApiManager {
     return this.stores.get(this.resolveApi(api)?.apiBase) as S;
   }
 
-  lookupApiLink(ref: IKubeObjectRef, parentObject: KubeObject): string {
+  lookupApiLink(ref: IKubeObjectRef, parentObject?: KubeObject): string {
     const {
       kind, apiVersion, name,
-      namespace = parentObject.getNs(),
+      namespace = parentObject?.getNs(),
     } = ref;
 
     if (!kind) return "";

src/renderer/components/+extensions/extensions.tsx

@@ -370,7 +370,7 @@ async function attemptInstall(request: InstallRequest, d?: ExtendableDisposer):
   if (curState !== ExtensionInstallationState.IDLE) {
     dispose();
 
-    return Notifications.error(
+    return void Notifications.error(
       <div className="flex column gaps">
         <b>Extension Install Collision:</b>
         <p>The <em>{name}</em> extension is currently {curState.toLowerCase()}.</p>

src/renderer/components/dock/create-resource.tsx

@@ -35,6 +35,11 @@ import { InfoPanel } from "./info-panel";
 import * as resourceApplierApi from "../../../common/k8s-api/endpoints/resource-applier.api";
 import { Notifications } from "../notifications";
 import logger from "../../../common/logger";
+import type { KubeJsonApiData, KubeJsonApiError } from "../../../common/k8s-api/kube-json-api";
+import { getDetailsUrl } from "../kube-detail-params";
+import { apiManager } from "../../../common/k8s-api/api-manager";
+import { prevDefault } from "../../utils";
+import { navigate } from "../../navigation";
 
 interface Props {
   tab: DockTab;
@@ -103,28 +108,35 @@ export class CreateResource extends React.Component<Props> {
 
     // skip empty documents
     const resources = yaml.loadAll(this.data).filter(Boolean);
-    const createdResources: string[] = [];
 
     if (resources.length === 0) {
       return void logger.info("Nothing to create");
     }
 
-    for (const result of await Promise.allSettled(resources.map(resourceApplierApi.update))) {
-      if (result.status === "fulfilled") {
-        createdResources.push(result.value.metadata.name);
-      } else {
-        Notifications.error(result.reason.toString());
-      }
-    }
+    const creatingResources = resources.map(async (resource: string) => {
+      try {
+        const data: KubeJsonApiData = await resourceApplierApi.update(resource);
+        const { kind, apiVersion, metadata: { name, namespace }} = data;
+        const resourceLink = apiManager.lookupApiLink({ kind, apiVersion, name, namespace });
 
-    if (createdResources.length > 0) {
-      Notifications.ok((
+        const showDetails = () => {
+          navigate(getDetailsUrl(resourceLink));
+          close();
+        };
+
+        const close = Notifications.ok(
           <p>
-          {createdResources.length === 1 ? "Resource" : "Resources"}{" "}
-          <b>{createdResources.join(", ")}</b> successfully created
-        </p>
-      ));
+            {kind} <a onClick={prevDefault(showDetails)}>{name}</a> successfully created.
+          </p>,
+        );
+      } catch (error) {
+        const failureReason = (error as KubeJsonApiError).reason.toString();
+
+        Notifications.error(failureReason);
       }
+    });
+
+    await Promise.allSettled(creatingResources);
 
     return undefined;
   };

src/renderer/components/notifications/notifications.tsx

@@ -35,7 +35,7 @@ export class Notifications extends React.Component {
   public elem: HTMLElement;
 
   static ok(message: NotificationMessage) {
-    notificationsStore.add({
+    return notificationsStore.add({
       message,
       timeout: 2_500,
       status: NotificationStatus.OK,
@@ -43,7 +43,7 @@ export class Notifications extends React.Component {
   }
 
   static error(message: NotificationMessage, customOpts: Partial<Notification> = {}) {
-    notificationsStore.add({
+    return notificationsStore.add({
       message,
       timeout: 10_000,
       status: NotificationStatus.ERROR,
@@ -52,7 +52,7 @@ export class Notifications extends React.Component {
   }
 
   static shortInfo(message: NotificationMessage, customOpts: Partial<Notification> = {}) {
-    this.info(message, {
+    return this.info(message, {
       timeout: 5_000,
       ...customOpts,
     });