/lookup/instances/:id looks up instance and redirects to project instance route (#1944)

/instances/:id looks up instance and redirects to project instance route

Author: david-crespo

app/pages/lookups.ts

@@ -0,0 +1,27 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, you can obtain one at https://mozilla.org/MPL/2.0/.
+ *
+ * Copyright Oxide Computer Company
+ */
+import { redirect, type LoaderFunctionArgs } from 'react-router-dom'
+
+import { apiQueryClient } from '@oxide/api'
+
+import { trigger404 } from 'app/components/ErrorBoundary'
+import { pb } from 'app/util/path-builder'
+
+export async function instanceLookupLoader({ params }: LoaderFunctionArgs) {
+  try {
+    const instance = await apiQueryClient.fetchQuery('instanceView', {
+      path: { instance: params.instance! },
+    })
+    const project = await apiQueryClient.fetchQuery('projectView', {
+      path: { project: instance.projectId },
+    })
+    return redirect(pb.instance({ project: project.name, instance: instance.name }))
+  } catch (_e) {
+    throw trigger404
+  }
+}

app/routes.tsx

@@ -43,6 +43,7 @@ import DeviceAuthSuccessPage from './pages/DeviceAuthSuccessPage'
 import DeviceAuthVerifyPage from './pages/DeviceAuthVerifyPage'
 import { LoginPage } from './pages/LoginPage'
 import { LoginPageSaml } from './pages/LoginPageSaml'
+import { instanceLookupLoader } from './pages/lookups'
 import {
   DisksPage,
   ImagesPage,
@@ -229,6 +230,15 @@ export const routes = createRoutesFromElements(
           loader={SiloUtilizationPage.loader}
           handle={{ crumb: 'Utilization' }}
         />
+
+        {/* let's do both. what could go wrong*/}
+        <Route
+          path="lookup/instances/:instance"
+          element={null}
+          loader={instanceLookupLoader}
+        />
+        <Route path="lookup/i/:instance" element={null} loader={instanceLookupLoader} />
+
         <Route loader={ProjectsPage.loader} element={<ProjectsPage />}>
           <Route path="projects" handle={{ crumb: 'Projects' }} element={null} />
           <Route

app/test/e2e/lookup-routes.e2e.ts

@@ -0,0 +1,42 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, you can obtain one at https://mozilla.org/MPL/2.0/.
+ *
+ * Copyright Oxide Computer Company
+ */
+import { expect, test } from '@playwright/test'
+
+test.describe('/lookup/i', () => {
+  test('404s on existing name', async ({ page }) => {
+    await page.goto('/lookup/i/db1')
+    await expect(page.getByText('Page not found')).toBeVisible()
+  })
+
+  test('404s on empty ID', async ({ page }) => {
+    await page.goto('/lookup/i/')
+    await expect(page.getByText('Page not found')).toBeVisible()
+  })
+
+  test('looks up instance by ID', async ({ page }) => {
+    await page.goto('/lookup/i/935499b3-fd96-432a-9c21-83a3dc1eece4')
+    await expect(page).toHaveURL('/projects/mock-project/instances/db1/storage')
+  })
+})
+
+test.describe('/lookup/instances', () => {
+  test('404s on existing name', async ({ page }) => {
+    await page.goto('/lookup/instances/db1')
+    await expect(page.getByText('Page not found')).toBeVisible()
+  })
+
+  test('404s on empty ID', async ({ page }) => {
+    await page.goto('/lookup/instances/')
+    await expect(page.getByText('Page not found')).toBeVisible()
+  })
+
+  test('looks up instance by ID', async ({ page }) => {
+    await page.goto('/lookup/instances/935499b3-fd96-432a-9c21-83a3dc1eece4')
+    await expect(page).toHaveURL('/projects/mock-project/instances/db1/storage')
+  })
+})