Yoshify Comments - Answer Overflow

Yoshify

Posts Comments

KKinde

•Created by daraxdray on 12/20/2024 in #💻┃support

Fetching user's organization from Next.js SDK returns null and no name for organization returned.

7 replies

KKinde

•Created by ryno1234. on 12/15/2024 in #💻┃support

ext_provider missing

Unfortunately this doesn’t appear to be supported by the management API - there is an endpoint to update application tokens, but only their lifetimes, not their additional claims. Sorry mate!

4 replies

KKinde

•Created by ryno1234. on 12/15/2024 in #💻┃support

ext_provider missing

4 replies

KKinde

•Created by moggelitalanya on 12/18/2024 in #💻┃support

NextJS API endpoint - verify token

tRPC is a library that integrates with almost any framework and allows you to choose how to expose it - for example, in NextJS, you could have it exposed on your domains /api endpoint just like a traditional route handler. All this is at the end of the day is a much nicer wrapper around it 🙂 the example from Create T3 App shows you how to do this. No worries! Let me know if you have any dramas.

13 replies

KKinde

•Created by moggelitalanya on 12/18/2024 in #💻┃support

NextJS API endpoint - verify token

In the case that you want to stick with traditional NextJS API route handlers though, instead of doing your fetch in a server action do it through a client component. I recommend using React Query at the very least for handling this as you'll get caching, loading states, etc.

13 replies

KKinde

•Created by moggelitalanya on 12/18/2024 in #💻┃support

NextJS API endpoint - verify token

No worries - if you're planning on sharing this API between multiple platforms, I highly recommend checking out https://trpc.io/ - it's significantly easier to package and share, handles most of the fetching headaches for you and allows you to communicate with your backend via React Query APIs. https://create.t3.gg/ as a starter kit has a really great starter setup and example of how to use tRPC 🙂

13 replies

KKinde

•Created by moggelitalanya on 12/18/2024 in #💻┃support

NextJS API endpoint - verify token

Pseudo-code, but it should help direct you

13 replies

KKinde

•Created by moggelitalanya on 12/18/2024 in #💻┃support

NextJS API endpoint - verify token

An example of what this could look like: Your page.tsx:

// no need for 'use server' directive here,
// it's a server component by default.
// note the use of 'async' - server components can // be asynchronous
export default async function DashboardPage() {
  const posts = await db.query.posts.findMany();
  return (
    <PostsList posts={posts}/>
  )
}

// no need for 'use server' directive here,
// it's a server component by default.
// note the use of 'async' - server components can // be asynchronous
export default async function DashboardPage() {
  const posts = await db.query.posts.findMany();
  return (
    <PostsList posts={posts}/>
  )
}

// this is my PostsList component in a separate file

'use client'

export const PostsList = ({posts}: {posts: Post[]}) => {
  return posts.map((post, index) =>
    <div>
      <h3>{post.title}</h3>
      <p>{post.content}</p>
    </div>
  )
}

// this is my PostsList component in a separate file

'use client'

export const PostsList = ({posts}: {posts: Post[]}) => {
  return posts.map((post, index) =>
    <div>
      <h3>{post.title}</h3>
      <p>{post.content}</p>
    </div>
  )
}

13 replies

KKinde

•Created by moggelitalanya on 12/18/2024 in #💻┃support

NextJS API endpoint - verify token

Internal fetching inside a server action is a bit of an anti-pattern in NextJS - This is primarily because data fetching by HTTP standards should be a GET request (and you get all the goodies associated with that, like caching!) By using a server action, you're converting this into a POST request, which is not recommended. Internal server<->server fetches in NextJS won't include cookies, which is why you're probably seeing this issue. Where you make your fetch request, you can carry to cookies over like so:

import { cookies } from "next/headers";

const doDataFetchingStuff = async () => {
  const cookieStore = await cookies();
  const response = await fetch(SOME_URL, {
    headers: { Cookie: cookieStore.toString() },
  });
}

import { cookies } from "next/headers";

const doDataFetchingStuff = async () => {
  const cookieStore = await cookies();
  const response = await fetch(SOME_URL, {
    headers: { Cookie: cookieStore.toString() },
  });
}

This is a band-aid though - the real fix to this problem is doing away with your fetch endpoint altogether and communicating with your database in your page/layout/server component and passing the data down as props to client components. By default in Next, layouts, pages, and components are React Server Components and can talk to your backend directly unless specifically marked otherwise with the 'use client' directive at the top of a file.

13 replies

KKinde

•Created by moggelitalanya on 12/18/2024 in #💻┃support

NextJS API endpoint - verify token

If you could also share how you're calling this route handler that'd be good too!

13 replies

KKinde

•Created by moggelitalanya on 12/18/2024 in #💻┃support

NextJS API endpoint - verify token

👋 could you please share what your middleware.ts file looks like, as well as your route handler? 🙂

13 replies

KKinde

•Created by Woet on 12/10/2024 in #💻┃support

Next.js - blocking error upon login when creating new organisations

Any time mate, it's what I'm here for! Happy building 👏

29 replies

KKinde

•Created by Woet on 12/10/2024 in #💻┃support

Next.js - blocking error upon login when creating new organisations

Thanks for sharing @Woet - I wasn’t aware of this limitation either (I might actually run into this same issue in my app soon…) Hopefully it’s something the team can fix soon!

29 replies

KKinde

•Created by Woet on 12/10/2024 in #💻┃support

Next.js - blocking error upon login when creating new organisations

@Woet Understood - and this only happens with this Finibase Support user you've created? No other user causes this problem?

29 replies

KKinde

•Created by Gamer Guy on 12/11/2024 in #💻┃support

Next.js Build doesn't call getUser() from kinde

Just to add further onto Sams comment - the reason this happens is because your page is being generated as a Static page (which means API requests, etc. are resolved and embedded statically in the page). If you have dynamic content on your page (such as user specific information) you should not be generating this statically. Next is normally pretty good at automatically detecting this, but in some cases you need to tell it what to do. You can manually opt into dynamic rendering (SSR) by adding the following within your route: export const dynamic = 'force-dynamic'; This should resolve the error entirely. If you want to stick with SSG however, you'll just need to ignore the null user entirely.

7 replies

KKinde

•Created by Woet on 12/10/2024 in #💻┃support

Next.js - blocking error upon login when creating new organisations

On that note, these are also redundant in your middleware options:

...
publicPaths: [],
isAuthorized: ({ token }: { token: KindeAccessToken }) => {
  return true;
},
...

...
publicPaths: [],
isAuthorized: ({ token }: { token: KindeAccessToken }) => {
  return true;
},
...

public paths defaults to nothing by default, and isAuthorized will default to true, so if these aren't in use you can omit them 🙂 (unrelated to the bug, just thought I'd let you know)

29 replies

KKinde

•Created by Woet on 12/10/2024 in #💻┃support

Next.js - blocking error upon login when creating new organisations

I don't believe so - if this is your root layout though, your middleware may be a little redundant. Understood RE: logging, build times suck - I have tried to replicate it on Vercel and locally to no avail unfortunately (though I'm not using your CSP headers, but I don't think that would be the cause of issue here) - unfortunately it's hard to move much further without logging to narrow down the cause. All I can get from the error returned right now is that the error appears to be happening on this line of the source, which means the idTokenValue defined on line 39 is for some reason in your case null.

29 replies

KKinde

•Created by Woet on 12/10/2024 in #💻┃support

Next.js - blocking error upon login when creating new organisations

Okay great! In the middleware, can we try doing:

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

const {isAuthenticated} = getKindeServerSession();
const isUserAuthenticated = await isAuthenticated();
console.log('Authed?', isUserAuthenticated);

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

const {isAuthenticated} = getKindeServerSession();
const isUserAuthenticated = await isAuthenticated();
console.log('Authed?', isUserAuthenticated);

Just to confirm the user is definitely authenticated? If that returns true, I'd like to see if we're getting any ID token at all:

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

const {getIdTokenRaw} = getKindeServerSession();
const idToken = await getIdTokenRaw();
console.log('Token:', idToken);

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

const {getIdTokenRaw} = getKindeServerSession();
const idToken = await getIdTokenRaw();
console.log('Token:', idToken);

29 replies

KKinde

•Created by Woet on 12/10/2024 in #💻┃support

Next.js - blocking error upon login when creating new organisations

Okay, so that leaves us with 2 possibilities here - the ID token is null, or, somehow, the user has a null family name. Let’s try the easy one first - in the users profile on the Kinde admin dashboard, do they have a family name set? If not can we set it to something temporary?

Gaming

Programming