From bebf91c6600f853fd356cc0b555c403013ab497d Mon Sep 17 00:00:00 2001
From: Jason Sun <sunapi386@gmail.com>
Date: Sun, 10 Sep 2023 18:04:39 -0700
Subject: [PATCH] Fixes for impersonation.mdx

Fixes ImpersonatingUserNotice return null which can cause Suspense to never finish loading.
Fix some imports that were not used or from the wrong location.
Casting `as Role` to remove type mismatch warning.
---
 app/pages/docs/impersonation.mdx | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/app/pages/docs/impersonation.mdx b/app/pages/docs/impersonation.mdx
index 5443dbd0..ba6cd040 100644
--- a/app/pages/docs/impersonation.mdx
+++ b/app/pages/docs/impersonation.mdx
@@ -55,7 +55,7 @@ export default resolver.pipe(
 
     await ctx.session.$create({
       userId: user.id,
-      role: user.role,
+      role: user.role as Role,
       orgId: user.organizationId,
       impersonatingFromUserId: ctx.session.userId,
     })
@@ -84,7 +84,7 @@ export default resolver.pipe(resolver.authorize(), async (_, ctx) => {
 
   await ctx.session.$create({
     userId: user.id,
-    role: user.role,
+    role: user.role as Role,
     orgId: user.organizationId,
     impersonatingFromUserId: undefined,
   })
@@ -96,7 +96,8 @@ export default resolver.pipe(resolver.authorize(), async (_, ctx) => {
 Add a form similar to this in order to switch users.
 
 ```tsx
-import { useMutation, queryClient } from "@blitzjs/rpc"
+// src/auth/components/ImpersonateForm.tsx
+import { useMutation } from "@blitzjs/rpc"
 import impersonateUser, {
   ImpersonateUserInput,
 } from "src/auth/mutations/impersonateUser"
@@ -133,12 +134,18 @@ Lastly, add the following component at the top of your Layout(s).
 
 ```tsx
 // src/core/components/ImpersonatingUserNotice.tsx
-import { invoke, useSession, queryClient } from "@blitzjs/rpc"
+import { useSession } from "@blitzjs/auth"
+import { invoke } from "@blitzjs/rpc"
 import stopImpersonating from "src/auth/mutations/stopImpersonating"
 
 export const ImpersonatingUserNotice = () => {
   const session = useSession()
-  if (!session.impersonatingFromUserId) return null
+  if (!session.impersonatingFromUserId) 
+    return (
+      <div className="bg-yellow-400 px-2 py-1 text-center font-semibold">
+        Currently not impersonating any user
+      </div>
+    )
 
   return (
     <div className="bg-yellow-400 px-2 py-1 text-center font-semibold">