can the db records be lazy loaded?

I am using the same tech stack in a personal project, and have been researching the same question for a couple weeks now. My personal opinion is that Server Actions are the best approach for server side data fetching, because they allow to achieve all of Next JS recommendations (fetching data on the server, AND pulling / displaying it in server components, while allowing access in client components as well with AWESOME on demand invalidation techniques and auto reload). However, as I'm sure you are aware, Server Actions are currently in Alpha and considered experimental / not production ready. I have found this EXTREMELY frustrating, because it seems as if they released 13.4 as 'production ready', but they did so missing very important features that only Server Actions thoroughly provide (fetching data directly in server components can be inconvenient to pass data through prop drilling to client components if needed, and on-demand invalidation is not available - also, route handlers are intended to only be called from client components, so not ideal if you want to display the fetched data in a server component). My solution to the problem is to, for now, just continue to use React Query and fetch data on the client. Once Server Actions become production ready, they can be incorporated into the query action function, or replace react query altogether. I would be curious to hear your thoughts on all this, as it definitely is hard to wrap my head around all of it 😂

As another note, supabase has released some helpers to allow for server side auth that seems pretty nice. Also, react query released a Hydrate component / feature that allows initial server-side data fetching, with all additional requests on the client (so for mutations and invalidation). While I can't say for certain, I am personally leaning in the direction of continuing with client-side data fetching with react query until the server actions reach production.