Kinde•7mo ago

useKindeAuth isLoading doesn't change to false

Trying to get the org in a client component, but isLoading does not change to false. What am I missing?

"use client";

import { useKindeAuth } from "@kinde-oss/kinde-auth-nextjs";

export const MyComponent = () => {
  const { isLoading, getOrganization } = useKindeAuth();

  // Prints: {isLoading: true, org: null}
  console.log({
    isLoading,
    org: getOrganization(),
  });

  ...
};

"use client";

import { useKindeAuth } from "@kinde-oss/kinde-auth-nextjs";

export const MyComponent = () => {
  const { isLoading, getOrganization } = useKindeAuth();

  // Prints: {isLoading: true, org: null}
  console.log({
    isLoading,
    org: getOrganization(),
  });

  ...
};

3 Replies

palooka8300•7mo ago

The auth hooks are asynchronous. If you wrap your console.log into a useEffect dependant on isLoading, it should change to false once it’s loaded.

moroshkoOP•7mo ago

They are async on the server, not the client. I just realized that if I swap useKindeAuth with useKindeBrowserClient then it works as expected. I'm wondering why useKindeAuth is exported from @kinde-oss/kinde-auth-nextjs, feels like it only causes confusion 🤔

palooka8300•7mo ago

Ah sorry I assumed react.

Gaming

Programming

useKindeAuth isLoading doesn't change to false