From c4ca55d2cf90e061ed3458b5d005333238b2728c Mon Sep 17 00:00:00 2001
From: Alex Plotnick <alex@oxidecomputer.com>
Date: Fri, 10 Jun 2022 14:20:22 -0600
Subject: [PATCH 1/7] Add client authn verification page

---
 app/pages/ClientVerifyPage.tsx | 47 ++++++++++++++++++++++++++++++++++
 app/routes.tsx                 |  5 ++++
 2 files changed, 52 insertions(+)
 create mode 100644 app/pages/ClientVerifyPage.tsx

diff --git a/app/pages/ClientVerifyPage.tsx b/app/pages/ClientVerifyPage.tsx
new file mode 100644
index 0000000000..8fe2d7998b
--- /dev/null
+++ b/app/pages/ClientVerifyPage.tsx
@@ -0,0 +1,47 @@
+import { useSearchParams } from 'react-router-dom'
+
+import { useApiMutation } from '@oxide/api'
+import { Button, Success16Icon, Warning12Icon } from '@oxide/ui'
+
+import { useToast } from '../hooks'
+
+/**
+ * Client verification success page
+ */
+export default function ClientVerifyPage() {
+  const [searchParams] = useSearchParams()
+  const addToast = useToast()
+  const confirmPost = useApiMutation('clientConfirm', {
+    onSuccess: () => {
+      addToast({
+        title: 'Client verified',
+        icon: <Success16Icon />,
+        timeout: 4000,
+      })
+    },
+    onError: () => {
+      addToast({
+        title: 'Verification failed',
+        icon: <Warning12Icon />,
+        variant: 'error',
+        timeout: 4000,
+      })
+    },
+  })
+  const userCode = searchParams.get('user_code')
+
+  return (
+    <div className="space-y-4 bg-default">
+      <h3 className="mb-2 text-center text-sans-2xl">Client verification</h3>
+      <h2 className="mb-2 text-center text-sans-2xl">User code: {userCode}</h2>
+      <Button
+        type="submit"
+        className="w-full"
+        disabled={confirmPost.isLoading}
+        onClick={() => confirmPost.mutate({ body: { user_code: userCode } })}
+      >
+        Verify
+      </Button>
+    </div>
+  )
+}
diff --git a/app/routes.tsx b/app/routes.tsx
index d70bace7ed..6c343258f5 100644
--- a/app/routes.tsx
+++ b/app/routes.tsx
@@ -11,6 +11,7 @@ import OrgLayout from './layouts/OrgLayout'
 import ProjectLayout from './layouts/ProjectLayout'
 import RootLayout from './layouts/RootLayout'
 import SettingsLayout from './layouts/SettingsLayout'
+import ClientVerifyPage from './pages/ClientVerifyPage'
 import LoginPage from './pages/LoginPage'
 import NotFound from './pages/NotFound'
 import OrgsPage from './pages/OrgsPage'
@@ -48,6 +49,10 @@ export const Router = () => (
       <Route index element={<LoginPage />} />
     </Route>
 
+    <Route path="/client/verify" element={<AuthLayout />}>
+      <Route index element={<ClientVerifyPage />} />
+    </Route>
+
     <Route index element={<Navigate to="/orgs" replace />} />
 
     <Route path="orgs" errorElement={<RouterDataErrorBoundary />}>

From 1204ba2430108ac14b17bb109c702abc21ee896d Mon Sep 17 00:00:00 2001
From: Alex Plotnick <alex@oxidecomputer.com>
Date: Mon, 27 Jun 2022 15:23:16 -0600
Subject: [PATCH 2/7] Update for renamed device auth endpoints

---
 ...ClientVerifyPage.tsx => DeviceAuthVerifyPage.tsx} | 12 ++++++------
 app/routes.tsx                                       |  6 +++---
 2 files changed, 9 insertions(+), 9 deletions(-)
 rename app/pages/{ClientVerifyPage.tsx => DeviceAuthVerifyPage.tsx} (76%)

diff --git a/app/pages/ClientVerifyPage.tsx b/app/pages/DeviceAuthVerifyPage.tsx
similarity index 76%
rename from app/pages/ClientVerifyPage.tsx
rename to app/pages/DeviceAuthVerifyPage.tsx
index 8fe2d7998b..2c4d6b509a 100644
--- a/app/pages/ClientVerifyPage.tsx
+++ b/app/pages/DeviceAuthVerifyPage.tsx
@@ -6,22 +6,22 @@ import { Button, Success16Icon, Warning12Icon } from '@oxide/ui'
 import { useToast } from '../hooks'
 
 /**
- * Client verification success page
+ * Device authorization verification page
  */
-export default function ClientVerifyPage() {
+export default function DeviceAuthVerifyPage() {
   const [searchParams] = useSearchParams()
   const addToast = useToast()
-  const confirmPost = useApiMutation('clientConfirm', {
+  const confirmPost = useApiMutation('deviceAuthConfirm', {
     onSuccess: () => {
       addToast({
-        title: 'Client verified',
+        title: 'Token authorized',
         icon: <Success16Icon />,
         timeout: 4000,
       })
     },
     onError: () => {
       addToast({
-        title: 'Verification failed',
+        title: 'Token denied',
         icon: <Warning12Icon />,
         variant: 'error',
         timeout: 4000,
@@ -32,7 +32,7 @@ export default function ClientVerifyPage() {
 
   return (
     <div className="space-y-4 bg-default">
-      <h3 className="mb-2 text-center text-sans-2xl">Client verification</h3>
+      <h3 className="mb-2 text-center text-sans-2xl">Device authorization</h3>
       <h2 className="mb-2 text-center text-sans-2xl">User code: {userCode}</h2>
       <Button
         type="submit"
diff --git a/app/routes.tsx b/app/routes.tsx
index 6c343258f5..ce92adc16d 100644
--- a/app/routes.tsx
+++ b/app/routes.tsx
@@ -11,7 +11,7 @@ import OrgLayout from './layouts/OrgLayout'
 import ProjectLayout from './layouts/ProjectLayout'
 import RootLayout from './layouts/RootLayout'
 import SettingsLayout from './layouts/SettingsLayout'
-import ClientVerifyPage from './pages/ClientVerifyPage'
+import DeviceAuthVerifyPage from './pages/DeviceAuthVerifyPage'
 import LoginPage from './pages/LoginPage'
 import NotFound from './pages/NotFound'
 import OrgsPage from './pages/OrgsPage'
@@ -49,8 +49,8 @@ export const Router = () => (
       <Route index element={<LoginPage />} />
     </Route>
 
-    <Route path="/client/verify" element={<AuthLayout />}>
-      <Route index element={<ClientVerifyPage />} />
+    <Route path="/device/verify" element={<AuthLayout />}>
+      <Route index element={<DeviceAuthVerifyPage />} />
     </Route>
 
     <Route index element={<Navigate to="/orgs" replace />} />

From 071a51e227c07ad8a06c1896dcffe5996f1da15b Mon Sep 17 00:00:00 2001
From: Alex Plotnick <alex@oxidecomputer.com>
Date: Tue, 28 Jun 2022 18:44:10 -0600
Subject: [PATCH 3/7] Bump OMICRON_VERSION

---
 OMICRON_VERSION | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/OMICRON_VERSION b/OMICRON_VERSION
index cd31bdf3f6..40116ffe38 100644
--- a/OMICRON_VERSION
+++ b/OMICRON_VERSION
@@ -1 +1 @@
-c45136595220c8566aabd77cf6f12d29b1ca5a91
\ No newline at end of file
+af1049c5f72cc91c4ce89650b74d92c9e26484a6
\ No newline at end of file

From df04b097e17b6fce9979ec9322dcf1632b3d571d Mon Sep 17 00:00:00 2001
From: David Crespo <david.crespo@oxidecomputer.com>
Date: Tue, 28 Jun 2022 21:50:33 -0500
Subject: [PATCH 4/7] prove https://github.com/oxidecomputer/omicron/pull/1303
 fixes it

---
 OMICRON_VERSION                        |  2 +-
 libs/api/__generated__/Api.ts          | 80 ++++++++++++++++++++++++++
 libs/api/__generated__/OMICRON_VERSION |  2 +-
 3 files changed, 82 insertions(+), 2 deletions(-)

diff --git a/OMICRON_VERSION b/OMICRON_VERSION
index e162c681da..7a85e4cafe 100644
--- a/OMICRON_VERSION
+++ b/OMICRON_VERSION
@@ -1 +1 @@
-154a4a6cd623497cbe893c2cd3ea1c241516bc21
\ No newline at end of file
+4dc8037377b68e982fa4c45a2a3a4075779b5624
\ No newline at end of file
diff --git a/libs/api/__generated__/Api.ts b/libs/api/__generated__/Api.ts
index ec51809b1b..471dde9442 100644
--- a/libs/api/__generated__/Api.ts
+++ b/libs/api/__generated__/Api.ts
@@ -34,6 +34,20 @@ export type DerEncodedKeyPair = {
   publicCert: string
 }
 
+export type DeviceAccessTokenRequest = {
+  clientId: string
+  deviceCode: string
+  grantType: string
+}
+
+export type DeviceAuthRequest = {
+  clientId: string
+}
+
+export type DeviceAuthVerify = {
+  userCode: string
+}
+
 export type Digest = { type: 'sha256'; value: string }
 
 /**
@@ -1305,6 +1319,10 @@ export type Silo = {
    * timestamp when this resource was last modified
    */
   timeModified: Date
+  /**
+   * User provision type
+   */
+  userProvisionType: UserProvisionType
 }
 
 /**
@@ -1314,6 +1332,7 @@ export type SiloCreate = {
   description: string
   discoverable: boolean
   name: Name
+  userProvisionType: UserProvisionType
 }
 
 /**
@@ -1589,6 +1608,11 @@ export type UserBuiltinResultsPage = {
   nextPage?: string | null
 }
 
+/**
+ * How users will be provisioned in a silo during authentication.
+ */
+export type UserProvisionType = 'fixed' | 'jit'
+
 /**
  * A single page of results
  */
@@ -2000,6 +2024,16 @@ export type NameSortMode = 'name_ascending'
  */
 export type NameOrIdSortMode = 'name_ascending' | 'name_descending' | 'id_ascending'
 
+export interface DeviceAuthRequestParams {}
+
+export interface DeviceAuthConfirmParams {}
+
+export interface DeviceAccessTokenParams {}
+
+export interface DeviceAuthVerifyParams {
+  userCode?: string
+}
+
 export interface HardwareRacksGetParams {
   limit?: number | null
 
@@ -3002,6 +3036,52 @@ export class HttpClient {
 
 export class Api extends HttpClient {
   methods = {
+    /**
+     * Start an OAuth 2.0 Device Authorization Grant
+     */
+    deviceAuthRequest: (query: DeviceAuthRequestParams, params: RequestParams = {}) =>
+      this.request<void>({
+        path: `/device/auth`,
+        method: 'POST',
+        ...params,
+      }),
+
+    /**
+     * Confirm an OAuth 2.0 Device Authorization Grant
+     */
+    deviceAuthConfirm: (
+      query: DeviceAuthConfirmParams,
+      body: DeviceAuthVerify,
+      params: RequestParams = {}
+    ) =>
+      this.request<void>({
+        path: `/device/confirm`,
+        method: 'POST',
+        body,
+        ...params,
+      }),
+
+    /**
+     * Request a device access token
+     */
+    deviceAccessToken: (query: DeviceAccessTokenParams, params: RequestParams = {}) =>
+      this.request<void>({
+        path: `/device/token`,
+        method: 'POST',
+        ...params,
+      }),
+
+    /**
+     * Verify an OAuth 2.0 Device Authorization Grant
+     */
+    deviceAuthVerify: (query: DeviceAuthVerifyParams, params: RequestParams = {}) =>
+      this.request<void>({
+        path: `/device/verify`,
+        method: 'GET',
+        query,
+        ...params,
+      }),
+
     /**
      * List racks in the system.
      */
diff --git a/libs/api/__generated__/OMICRON_VERSION b/libs/api/__generated__/OMICRON_VERSION
index 50acf1766e..e4e3ae72f7 100644
--- a/libs/api/__generated__/OMICRON_VERSION
+++ b/libs/api/__generated__/OMICRON_VERSION
@@ -1,2 +1,2 @@
 # generated file. do not update manually. see docs/update-pinned-api.md
-0d2410071711d7ecdd3c115ebfb93b3ea3e1e16b
+4dc8037377b68e982fa4c45a2a3a4075779b5624

From a3e900778e40dab76d2dc3be5dfd172afce9bf91 Mon Sep 17 00:00:00 2001
From: David Crespo <david.crespo@oxidecomputer.com>
Date: Tue, 28 Jun 2022 22:11:26 -0500
Subject: [PATCH 5/7] make typescript happy

---
 app/pages/DeviceAuthVerifyPage.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/app/pages/DeviceAuthVerifyPage.tsx b/app/pages/DeviceAuthVerifyPage.tsx
index 2c4d6b509a..dc17e4901d 100644
--- a/app/pages/DeviceAuthVerifyPage.tsx
+++ b/app/pages/DeviceAuthVerifyPage.tsx
@@ -35,10 +35,13 @@ export default function DeviceAuthVerifyPage() {
       <h3 className="mb-2 text-center text-sans-2xl">Device authorization</h3>
       <h2 className="mb-2 text-center text-sans-2xl">User code: {userCode}</h2>
       <Button
-        type="submit"
         className="w-full"
-        disabled={confirmPost.isLoading}
-        onClick={() => confirmPost.mutate({ body: { user_code: userCode } })}
+        disabled={confirmPost.isLoading || !userCode}
+        onClick={() => {
+          // we know `userCode` is non-null because the button is disabled
+          // otherwise, but let's make TS happy
+          if (userCode) confirmPost.mutate({ body: { userCode } })
+        }}
       >
         Verify
       </Button>

From 3cd3b5113858f7136ab86e717cc36deb632863ad Mon Sep 17 00:00:00 2001
From: David Crespo <david.crespo@oxidecomputer.com>
Date: Tue, 28 Jun 2022 23:01:09 -0500
Subject: [PATCH 6/7] use omicron version that's on main now that it's merged

---
 OMICRON_VERSION                        | 2 +-
 libs/api/__generated__/OMICRON_VERSION | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/OMICRON_VERSION b/OMICRON_VERSION
index 7a85e4cafe..c31860bbc7 100644
--- a/OMICRON_VERSION
+++ b/OMICRON_VERSION
@@ -1 +1 @@
-4dc8037377b68e982fa4c45a2a3a4075779b5624
\ No newline at end of file
+1fa8d6d475bd9ba51f0fb045721be6fe20a74dbb
\ No newline at end of file
diff --git a/libs/api/__generated__/OMICRON_VERSION b/libs/api/__generated__/OMICRON_VERSION
index e4e3ae72f7..f8ab0a55b8 100644
--- a/libs/api/__generated__/OMICRON_VERSION
+++ b/libs/api/__generated__/OMICRON_VERSION
@@ -1,2 +1,2 @@
 # generated file. do not update manually. see docs/update-pinned-api.md
-4dc8037377b68e982fa4c45a2a3a4075779b5624
+1fa8d6d475bd9ba51f0fb045721be6fe20a74dbb

From 6c925242342cb87f44052e2494258ce00270977e Mon Sep 17 00:00:00 2001
From: David Crespo <david.crespo@oxidecomputer.com>
Date: Wed, 29 Jun 2022 14:17:24 -0500
Subject: [PATCH 7/7] quick polish on auth and success state

---
 app/pages/DeviceAuthSuccessPage.tsx | 17 +++++++++++++++++
 app/pages/DeviceAuthVerifyPage.tsx  | 22 ++++++++++------------
 app/routes.tsx                      |  6 ++++--
 libs/api-mocks/msw/handlers.ts      | 10 ++++++++++
 4 files changed, 41 insertions(+), 14 deletions(-)
 create mode 100644 app/pages/DeviceAuthSuccessPage.tsx

diff --git a/app/pages/DeviceAuthSuccessPage.tsx b/app/pages/DeviceAuthSuccessPage.tsx
new file mode 100644
index 0000000000..dd90a992c0
--- /dev/null
+++ b/app/pages/DeviceAuthSuccessPage.tsx
@@ -0,0 +1,17 @@
+import { Success16Icon } from '@oxide/ui'
+
+/**
+ * Device authorization success page
+ */
+export default function DeviceAuthSuccessPage() {
+  return (
+    <div className="space-y-4 max-w-sm text-center">
+      <h1 className="text-sans-2xl">Device authentication</h1>
+      <h2 className="text-sans-3xl flex items-center text-accent justify-center">
+        <Success16Icon width={40} height={40} className="mr-3 text-accent" />
+        Success!
+      </h2>
+      <p>Your device is now logged in.</p>
+    </div>
+  )
+}
diff --git a/app/pages/DeviceAuthVerifyPage.tsx b/app/pages/DeviceAuthVerifyPage.tsx
index dc17e4901d..5d01f17b17 100644
--- a/app/pages/DeviceAuthVerifyPage.tsx
+++ b/app/pages/DeviceAuthVerifyPage.tsx
@@ -1,7 +1,7 @@
-import { useSearchParams } from 'react-router-dom'
+import { useNavigate, useSearchParams } from 'react-router-dom'
 
 import { useApiMutation } from '@oxide/api'
-import { Button, Success16Icon, Warning12Icon } from '@oxide/ui'
+import { Button, Warning12Icon } from '@oxide/ui'
 
 import { useToast } from '../hooks'
 
@@ -10,14 +10,11 @@ import { useToast } from '../hooks'
  */
 export default function DeviceAuthVerifyPage() {
   const [searchParams] = useSearchParams()
+  const navigate = useNavigate()
   const addToast = useToast()
   const confirmPost = useApiMutation('deviceAuthConfirm', {
     onSuccess: () => {
-      addToast({
-        title: 'Token authorized',
-        icon: <Success16Icon />,
-        timeout: 4000,
-      })
+      navigate('/device/success')
     },
     onError: () => {
       addToast({
@@ -31,19 +28,20 @@ export default function DeviceAuthVerifyPage() {
   const userCode = searchParams.get('user_code')
 
   return (
-    <div className="space-y-4 bg-default">
-      <h3 className="mb-2 text-center text-sans-2xl">Device authorization</h3>
-      <h2 className="mb-2 text-center text-sans-2xl">User code: {userCode}</h2>
+    <div className="space-y-4 max-w-sm text-center">
+      <h1 className="text-sans-2xl">Device authentication</h1>
+      <p>Make sure this code matches the one shown on the device you are authenticating.</p>
+      <h2 className="text-sans-3xl border p-4">{userCode}</h2>
       <Button
         className="w-full"
-        disabled={confirmPost.isLoading || !userCode}
+        disabled={confirmPost.isLoading || confirmPost.isSuccess || !userCode}
         onClick={() => {
           // we know `userCode` is non-null because the button is disabled
           // otherwise, but let's make TS happy
           if (userCode) confirmPost.mutate({ body: { userCode } })
         }}
       >
-        Verify
+        Log in on device
       </Button>
     </div>
   )
diff --git a/app/routes.tsx b/app/routes.tsx
index 861713b28e..fff239bee9 100644
--- a/app/routes.tsx
+++ b/app/routes.tsx
@@ -9,6 +9,7 @@ import OrgLayout from './layouts/OrgLayout'
 import ProjectLayout from './layouts/ProjectLayout'
 import RootLayout from './layouts/RootLayout'
 import SettingsLayout from './layouts/SettingsLayout'
+import DeviceAuthSuccessPage from './pages/DeviceAuthSuccessPage'
 import DeviceAuthVerifyPage from './pages/DeviceAuthVerifyPage'
 import LoginPage from './pages/LoginPage'
 import NotFound from './pages/NotFound'
@@ -45,8 +46,9 @@ export const Router = () => (
       <Route index element={<LoginPage />} />
     </Route>
 
-    <Route path="/device/verify" element={<AuthLayout />}>
-      <Route index element={<DeviceAuthVerifyPage />} />
+    <Route path="device" element={<AuthLayout />}>
+      <Route path="verify" element={<DeviceAuthVerifyPage />} />
+      <Route path="success" element={<DeviceAuthSuccessPage />} />
     </Route>
 
     <Route index element={<Navigate to="/orgs" replace />} />
diff --git a/libs/api-mocks/msw/handlers.ts b/libs/api-mocks/msw/handlers.ts
index 978769d113..62c11400b5 100644
--- a/libs/api-mocks/msw/handlers.ts
+++ b/libs/api-mocks/msw/handlers.ts
@@ -841,4 +841,14 @@ export const handlers = [
   rest.get<never, never, Json<Api.UserResultsPage> | GetErr>('/api/users', (req, res) => {
     return res(json(paginated(req.url.search, db.users)))
   }),
+
+  rest.post<Json<Api.DeviceAuthVerify>, never, PostErr>(
+    '/api/device/confirm',
+    (req, res, ctx) => {
+      if (req.body.user_code === 'BADD-CODE') {
+        return res(ctx.status(404))
+      }
+      return res(ctx.status(200))
+    }
+  ),
 ]