chore(ContainerActions): uses global navigation (podman-desktop#7921)

* chore(ContainerActions): uses global navigation Signed-off-by: axel7083 <[email protected]> * fix(ContainerActions): adding unit tests Signed-off-by: axel7083 <[email protected]> --------- Signed-off-by: axel7083 <[email protected]>
axel7083 · Jul 3, 2024 · 79411c2 · 79411c2
1 parent fc03621
commit 79411c2
Show file tree

Hide file tree

Showing 4 changed files with 52 additions and 7 deletions.
diff --git a/packages/main/src/plugin/navigation/navigation-page.ts b/packages/main/src/plugin/navigation/navigation-page.ts
@@ -18,10 +18,12 @@
 
 export enum NavigationPage {
   CONTAINERS = 'containers',
+  CONTAINERS_EXPORT = 'containers-export',
   CONTAINER = 'container',
   CONTAINER_LOGS = 'container-logs',
   CONTAINER_INSPECT = 'container-inspect',
   CONTAINER_TERMINAL = 'container-terminal',
+  CONTAINER_KUBE = 'container-kube',
   IMAGES = 'images',
   IMAGE = 'image',
   PODS = 'pods',
@@ -35,4 +37,5 @@ export enum NavigationPage {
   AUTHENTICATION = 'authentication',
   RESOURCES = 'resources',
   EDIT_CONTAINER_CONNECTION = 'edit-container-connection',
+  DEPLOY_TO_KUBE = 'deploy-to-kube',
 }
diff --git a/packages/renderer/src/lib/container/ContainerActions.spec.ts b/packages/renderer/src/lib/container/ContainerActions.spec.ts
@@ -27,7 +27,10 @@ import { exportContainerInfo } from '/@/stores/export-container-store';
 import ContainerActions from './ContainerActions.svelte';
 import type { ContainerInfoUI } from './ContainerInfoUI';
 
-const container: ContainerInfoUI = {} as ContainerInfoUI;
+const container: ContainerInfoUI = {
+  id: 'container-id',
+  engineId: 'container-engine-id',
+} as ContainerInfoUI;
 
 const getContributedMenusMock = vi.fn();
 const updateMock = vi.fn();
@@ -113,3 +116,23 @@ test('Expect exportContainerInfo is filled and user redirected to export contain
   expect(goToMock).toBeCalledWith('/containers/export');
   expect(storeSetMock).toBeCalledWith(container);
 });
+
+test('Expect Deploy to Kubernetes to redirect to expected page', async () => {
+  const goToMock = vi.spyOn(router, 'goto');
+
+  render(ContainerActions, { container });
+  const deployButton = screen.getByRole('button', { name: 'Deploy to Kubernetes' });
+  await fireEvent.click(deployButton);
+
+  expect(goToMock).toBeCalledWith(`/deploy-to-kube/container-id/container-engine-id`);
+});
+
+test('Expect Generate Kube to redirect to expected page', async () => {
+  const goToMock = vi.spyOn(router, 'goto');
+
+  render(ContainerActions, { container });
+  const deployButton = screen.getByRole('button', { name: 'Generate Kube' });
+  await fireEvent.click(deployButton);
+
+  expect(goToMock).toBeCalledWith(`/containers/container-id/kube`);
+});
diff --git a/packages/renderer/src/lib/container/ContainerActions.svelte b/packages/renderer/src/lib/container/ContainerActions.svelte
@@ -13,14 +13,15 @@ import {
 } from '@fortawesome/free-solid-svg-icons';
 import { DropdownMenu } from '@podman-desktop/ui-svelte';
 import { createEventDispatcher, onMount } from 'svelte';
-import { router } from 'tinro';
 
 import ContributionActions from '/@/lib/actions/ContributionActions.svelte';
 import { withConfirmation } from '/@/lib/dialogs/messagebox-utils';
+import { handleNavigation } from '/@/navigation';
 import { exportContainerInfo } from '/@/stores/export-container-store';
 
 import type { Menu } from '../../../../main/src/plugin/menu-registry';
 import { MenuContext } from '../../../../main/src/plugin/menu-registry';
+import { NavigationPage } from '../../../../main/src/plugin/navigation/navigation-page';
 import FlatMenu from '../ui/FlatMenu.svelte';
 import ListItemButtonIcon from '../ui/ListItemButtonIcon.svelte';
 import { ContainerGroupInfoTypeUI, type ContainerInfoUI } from './ContainerInfoUI';
@@ -97,7 +98,9 @@ function openBrowser(): void {
 }
 
 function openLogs(): void {
-  router.goto(`/containers/${container.id}/logs`);
+  handleNavigation(NavigationPage.CONTAINER_LOGS, {
+    id: container.id,
+  });
 }
 
 async function deleteContainer(): Promise<void> {
@@ -113,19 +116,26 @@ async function deleteContainer(): Promise<void> {
 
 async function exportContainer(): Promise<void> {
   exportContainerInfo.set(container);
-  router.goto('/containers/export');
+  handleNavigation(NavigationPage.CONTAINERS_EXPORT);
 }
 
 function openTerminalContainer(): void {
-  router.goto(`/containers/${container.id}/terminal`);
+  handleNavigation(NavigationPage.CONTAINER_TERMINAL, {
+    id: container.id,
+  });
 }
 
 function openGenerateKube(): void {
-  router.goto(`/containers/${container.id}/kube`);
+  handleNavigation(NavigationPage.CONTAINER_KUBE, {
+    id: container.id,
+  });
 }
 
 function deployToKubernetes(): void {
-  router.goto(`/deploy-to-kube/${container.id}/${container.engineId}`);
+  handleNavigation(NavigationPage.DEPLOY_TO_KUBE, {
+    id: container.id,
+    engineId: container.engineId,
+  });
 }
 
 // If dropdownMenu = true, we'll change style to the imported dropdownMenu style

diff --git a/packages/renderer/src/navigation.ts b/packages/renderer/src/navigation.ts
@@ -34,6 +34,9 @@ export const handleNavigation = (page: NavigationPage, parameters?: { [key: stri
     case NavigationPage.CONTAINERS:
       router.goto('/containers');
       break;
+    case NavigationPage.CONTAINERS_EXPORT:
+      router.goto('/containers/export');
+      break;
     case NavigationPage.CONTAINER:
       router.goto(`/containers/${parameters?.['id']}/`);
       break;
@@ -46,6 +49,12 @@ export const handleNavigation = (page: NavigationPage, parameters?: { [key: stri
     case NavigationPage.CONTAINER_TERMINAL:
       router.goto(`/containers/${parameters?.['id']}/terminal`);
       break;
+    case NavigationPage.CONTAINER_KUBE:
+      router.goto(`/containers/${parameters?.['id']}/kube`);
+      break;
+    case NavigationPage.DEPLOY_TO_KUBE:
+      router.goto(`/deploy-to-kube/${parameters?.['id']}/${parameters?.['engineId']}`);
+      break;
     case NavigationPage.IMAGES:
       router.goto(`/images`);
       break;