I've never worked with i18n in Next.js but this seems prone to becoming complicated, have you considered the [Next.js Internationalization docs](https://nextjs.org/docs/app/building-your-application/routing/internationalization) and recommended approaches?

Besides that, I can point out a few things tho:
- Do not use Server Actions to fetch data, they're meant for Mutations since they are basically a *POST *endpoint under the hood (adding, updating or deleting, for example, are ok)
- You should try not to export normal functions from files marked with "use server" since only async exported functions will be considered by Next.js to be turned into reacheable POST endpoints

Is it really that wrong to fetch data from a Server Actions?

It has footguns you wanna avoid, I know they provide such a good DX and type safety but until Next.js ships a way to fetch data safely with the same DX benefits they recommend we fetch data directly in Server Components or Route Handlers..

To add to that, you only use a single server action, the others are needlessly exposed and should be conventional server-side functions instead. Also having pages be client component is an anti-pattern.

Reimplementing the wheel with i18n is time not spent well as you should just leverage next-intl which is a great solution.

So, should I use next-intl instead of my current implementation?

I believe you should, that’s one of the listed recommendations on the Next.js docs.

With thanks, I have another question about server actions. Are there any libraries or explanations that explain this feature, what it's used for, and how to use it, so I can understand all the benefits of it?

I also prefer recorded videos or tutorials

They are just REST endpoints that are ergonomic to call.

Everything that applies to public REST endpoints applies to them as well.

And just one more tip that will make it easier to debug your Contexts.

Before returning the value from reading the context, throw an error if value is null or undefined, this will indicate you’re trying to use the hook outside a Provider or there’s nothing to read from it, for example:

export function useSession() {
  const context = use(SessionContext);

  if (context === undefined) {
    throw Error("'useSession' must be used within a SessionProvider");
  }

  return context;
}