TTC
Theo's Typesafe CultSam

Clerk + Next.js app router <SignedOut> children not rendered after <UserButton> sign out

Hi there! I'm currently building an app with Clerk and I've got signing in working however when I sign out using the <UserButton> component however after the redirect, my sign in button isn't rendered until a refresh of the page. Here's my code: 
<SignedOut>
          <SignInButton />
        </SignedOut>
        <SignedIn>
          <div className="flex h-12 w-12 items-center">
            <UserButton
              afterSignOutUrl="/"
              appearance={{
                layout: {
                  logoPlacement: "none",
                },
                elements: {
                  userButtonAvatarBox: "h-8 w-8 sm:h-12 sm:w-12",
                },
              }}
            />
          </div>
        </SignedIn
<SignedOut>
          <SignInButton />
        </SignedOut>
        <SignedIn>
          <div className="flex h-12 w-12 items-center">
            <UserButton
              afterSignOutUrl="/"
              appearance={{
                layout: {
                  logoPlacement: "none",
                },
                elements: {
                  userButtonAvatarBox: "h-8 w-8 sm:h-12 sm:w-12",
                },
              }}
            />
          </div>
        </SignedIn
Thanks in advance!
S
Sam•377d ago
Any help at all would be really appreciated :) Would like to get this fixed asap if anyone would like to help 😊
R
Rhys•376d ago
You'll get faster support in the clerk Discord for this since it's a Clerk question https://discord.gg/Hqvzh4cadb
S
Sam•376d ago
Yeah, it turned out to be a clerk issue which they had to fix on their end
Want results from more Discord servers?
Add your server
More Posts
turbo repo built lint errorI was setting up ct3turbo when I saw the GitHub action workflow is showing errors, how do I fix it?changing col-span with template literalany idea why this isnt working?[Solved] T3 Stack PWA ??Does anybody know how to turn a t3 site into a PWA? I am using next-pwa but I am getting a few errortRPC Error: Invalid hook call.Sorry for the noob question I just cant figure out how to do this I have the following tRPC route: eStack?Hey how would I go about creating a website where you can post minecraft servers and include a imageHow would I order by the role?Hello, I'm trying to set up an API, where I return some users. I've got it working, where it returnsPrisma Create with Connect IssueHey! I wasn't able to find another thread explaining this, but I'd love help with this! I have twoGenerating image background jobI'm making a game where you can create levels in HTML5 Canvas and upload them to the api. I will neeHelp with Vercel deploymentHi folks, I am having issues deploying to vercel. I keep getting this error:My DB shouldn’t be this slow, RIGHT❓A fresh DB (pscale) and Table with just two entries, but takes 10s to fetch them (prisma studio) I’❌ tRPC failed on profile.getUserByUsername: No "query"-procedure on path "profile.getUserByUsername"I am a bit lost. This is the profileRouter. export const profileRouter = createTRPCRouter({ getUHelp with Prisma Validator static evaluationI am trying to build a helper function that will allow me to abstract away some deeply nested includ