WIP client management. Needs typescript work. #57

matthewpereira · 2024-09-23T18:41:25Z

Playing with API Client management, but I'm not a pro engineer, so I might be doing this wrong.

vercel · 2024-09-23T18:41:29Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
auth0-b2b-saas-starter	❌ Failed (Inspect)			Sep 23, 2024 6:41pm

eatplaysleep · 2024-11-19T00:36:39Z

You will also need to add the following to the createClientGrantArgs in scripts/bootstrap.mjs:

        ...,
        "create:users",
        // Add this
        "read:clients",
        "create:clients",
        "update:clients",
        "delete:clients",
        "create:client_keys",
        "read:client_keys",
        "update:client_keys",
        "delete:client_keys",
        "read:client_credentials",
        ...

eatplaysleep · 2024-11-19T04:26:48Z

Make sure to bump sonner to ^1.7.0

eatplaysleep

I think I got everything here. Just a few changes and I think it's good.

eatplaysleep · 2024-11-18T16:34:10Z

app/dashboard/organization/clients/actions.ts

+    }
+
+    try {
+      const newClient = await managementClient.clients.create({


managementClient responses have a data object containing the actual response.

Suggested change

const newClient = await managementClient.clients.create({

const { data: newClient } = await managementClient.clients.create({

eatplaysleep · 2024-11-18T16:35:07Z

app/dashboard/organization/clients/actions.ts

+
+      revalidatePath("/dashboard/organization/api-clients")
+      return { 
+        clientId: newClient.client_id!, 


unnecessary once you get the response object corrected.

Suggested change

clientId: newClient.client_id!,

clientId: newClient.client_id,

eatplaysleep · 2024-11-18T16:35:25Z

app/dashboard/organization/clients/actions.ts

+      revalidatePath("/dashboard/organization/api-clients")
+      return { 
+        clientId: newClient.client_id!, 
+        clientSecret: newClient.client_secret! 


Suggested change

clientSecret: newClient.client_secret!

clientSecret: newClient.client_secret

eatplaysleep · 2024-11-18T16:57:52Z

app/dashboard/organization/clients/actions.ts

+export const rotateApiClientSecret = withServerActionAuth(
+  async function rotateApiClientSecret(clientId: string, session: Session) {
+    try {
+      const result = await managementClient.clients.rotateSecret({ client_id: clientId })


Suggested change

const result = await managementClient.clients.rotateSecret({ client_id: clientId })

const { data: result } = await managementClient.clients.rotateClientSecret({ client_id })

eatplaysleep · 2024-11-18T16:58:49Z

app/dashboard/organization/clients/actions.ts

+import { Session } from "@auth0/nextjs-auth0"
+import { ClientCreateAppTypeEnum } from "auth0"
+
+import { managementClient } from "@/lib/auth0"


Suggested change

import { managementClient } from "@/lib/auth0"

import { managementClient } from "@/lib/auth0"

import { Client } from "@/lib/clients"

eatplaysleep · 2024-11-19T01:26:36Z

app/dashboard/organization/clients/actions.ts

@@ -0,0 +1,135 @@
+import { revalidatePath } from "next/cache"


Suggested change

import { revalidatePath } from "next/cache"

"use server"

import { revalidatePath } from "next/cache"

eatplaysleep · 2024-11-19T04:14:39Z

app/dashboard/organization/clients/create-client-form.tsx

+} from "@/components/ui/select"
+import { SubmitButton } from "@/components/submit-button"
+
+import { createApiClient } from "./actions"


Suggested change

import { createApiClient } from "./actions"

import { createApiClient, CreateApiClientSuccess } from "./actions"

eatplaysleep · 2024-11-19T04:15:30Z

app/dashboard/organization/clients/create-client-form.tsx

+          const result = await createApiClient(formData)
+
+          if ('error' in result) {
+            toast.error(result.error)
+          } else {
+            toast.success(`API Client created: ${formData.get("name")}`)
+            toast.info(`Client ID: ${result.clientId}`)
+            toast.info(`Client Secret: ${result.clientSecret}`)
+            ref.current?.reset()
+          }


Suggested change

const result = await createApiClient(formData)

if ('error' in result) {

toast.error(result.error)

} else {

toast.success(`API Client created: ${formData.get("name")}`)

toast.info(`Client ID: ${result.clientId}`)

toast.info(`Client Secret: ${result.clientSecret}`)

ref.current?.reset()

}

toast.promise(createApiClient(formData), {

loading: "Creating client...",

success: (result) => {

if ("error" in result) {

throw result.error

}

toast(() => <h5>Your client secret is:</h5>, {

description: () => (

<code>

{

(result as unknown as CreateApiClientSuccess)

?.clientSecret

}

</code>

),

duration: Infinity,

action: {

label: "Dismiss",

onClick: () => {},

},

})

return `API Client created: ${formData.get("name")}`

},

error: (err) => err,

})

eatplaysleep · 2024-11-19T04:16:13Z

app/dashboard/organization/clients/actions.ts

+type CreateApiClientResult = 
+  | { error: string }
+  | { clientId: string; clientSecret: string }


Suggested change

type CreateApiClientResult =

| { error: string }

| { clientId: string; clientSecret: string }

interface CreateApiClientError {

error: string

}

export interface CreateApiClientSuccess {

clientId: string

clientSecret: string

}

eatplaysleep · 2024-11-19T04:23:45Z

app/dashboard/organization/clients/invitations-list.tsx

Just realized this is not used. Remove it entirely.

WIP client management. Needs typescript work.

9ebe0b6

eatplaysleep reviewed Nov 19, 2024

View reviewed changes

eatplaysleep mentioned this pull request Nov 19, 2024

Add support for API Client management #62

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

WIP client management. Needs typescript work. #57

WIP client management. Needs typescript work. #57

matthewpereira commented Sep 23, 2024

vercel bot commented Sep 23, 2024

eatplaysleep commented Nov 19, 2024

eatplaysleep commented Nov 19, 2024

eatplaysleep left a comment

eatplaysleep Nov 18, 2024

eatplaysleep Nov 18, 2024

eatplaysleep Nov 18, 2024

eatplaysleep Nov 18, 2024

eatplaysleep Nov 18, 2024

eatplaysleep Nov 19, 2024

eatplaysleep Nov 19, 2024

eatplaysleep Nov 19, 2024

eatplaysleep Nov 19, 2024

eatplaysleep Nov 19, 2024

	const newClient = await managementClient.clients.create({
	const { data: newClient } = await managementClient.clients.create({

	clientId: newClient.client_id!,
	clientId: newClient.client_id,

	clientSecret: newClient.client_secret!
	clientSecret: newClient.client_secret

	const result = await managementClient.clients.rotateSecret({ client_id: clientId })
	const { data: result } = await managementClient.clients.rotateClientSecret({ client_id })

	import { managementClient } from "@/lib/auth0"
	import { managementClient } from "@/lib/auth0"
	import { Client } from "@/lib/clients"

		@@ -0,0 +1,135 @@
		import { revalidatePath } from "next/cache"

	import { createApiClient } from "./actions"
	import { createApiClient, CreateApiClientSuccess } from "./actions"

-          const result = await createApiClient(formData)
-          if ('error' in result) {
-            toast.error(result.error)
-          } else {
-            toast.success(`API Client created: ${formData.get("name")}`)
-            toast.info(`Client ID: ${result.clientId}`)
-            toast.info(`Client Secret: ${result.clientSecret}`)
-            ref.current?.reset()
-          }
+          toast.promise(createApiClient(formData), {
+            loading: "Creating client...",
+            success: (result) => {
+              if ("error" in result) {
+                throw result.error
+              }
+              toast(() => <h5>Your client secret is:</h5>, {
+                description: () => (
+                  <code>
+                    {
+                      (result as unknown as CreateApiClientSuccess)
+                        ?.clientSecret
+                    }
+                  </code>
+                ),
+                duration: Infinity,
+                action: {
+                  label: "Dismiss",
+                  onClick: () => {},
+                },
+              })
+              return `API Client created: ${formData.get("name")}`
+            },
+            error: (err) => err,
+          })

WIP client management. Needs typescript work. #57

Are you sure you want to change the base?

WIP client management. Needs typescript work. #57

Conversation

matthewpereira commented Sep 23, 2024

vercel bot commented Sep 23, 2024

eatplaysleep commented Nov 19, 2024

eatplaysleep commented Nov 19, 2024

eatplaysleep left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment