For exact details that I will not litigate in this issue, the design choices of NextJS's App directory model clash with tanstack/query's approach to supporting server prefetching/SSR and React Suspense. Most notably is the inability to pass server functions (AKA, server "actions", a pattern supported by the react server model) to client components that then use that server action for data fetching (again, a legal pattern with react server components). These two incompatibilities, together, required me to write a series of wrapper components around paginated-data-table.tsx instead of simply passing these details to the table.
This is not the end of the world but it is hilariously redundant. By using a parameterized getter function (that is never passed but mutually used between server and client components), I might yet-again be able to use a single common paginated-data-table component as the client instantiated component (as opposed to all of the wrapper components for paginated-data-table.tsx). Now that they're no longer passed from the wrapping server component to client components, the existing getter functions are entirely superfluous now, anyway.
ejmg
commented
3 months ago
Summary
For exact details that I will not litigate in this issue, the design choices of NextJS's App directory model clash with
tanstack/query's approach to supporting server prefetching/SSR and React Suspense. Most notably is the inability to pass server functions (AKA, server "actions", a pattern supported by the react server model) to client components that then use that server action for data fetching (again, a legal pattern with react server components). These two incompatibilities, together, required me to write a series of wrapper components aroundpaginated-data-table.tsxinstead of simply passing these details to the table.This is not the end of the world but it is hilariously redundant. By using a parameterized getter function (that is never passed but mutually used between server and client components), I might yet-again be able to use a single common paginated-data-table component as the client instantiated component (as opposed to all of the wrapper components for
paginated-data-table.tsx). Now that they're no longer passed from the wrapping server component to client components, the existing getter functions are entirely superfluous now, anyway.