zenstackhq / zenstack

Fullstack TypeScript toolkit that enhances Prisma ORM with flexible Authorization layer for RBAC/ABAC/PBAC/ReBAC, offering auto-generated type-safe APIs and frontend hooks.
https://zenstack.dev
MIT License
2.07k stars 88 forks source link

[Doc] More clarity on ZenStack + tRPC + SvelteKit #506

Closed lega0208 closed 1 year ago

lega0208 commented 1 year ago

Is your feature request related to a problem? Please describe. I'm interested in integrating ZenStack and tRPC into my SvelteKit project, but there's an awkward triangle of adapters and it's not immediately clear to me how they interact or what the right combination might be (or if they're even compatible).

I'm relatively new to SvelteKit and have yet to try ZenStack and tRPC so forgive me if this should be obvious.

Describe the solution you'd like Just some general guidance in the docs about the compatibility between the adapters/plugins. Even just a passing mention in one of the related sections would be great.

My guess would be that they're all compatible, but there's probably at least some amount of redundancy? I'll probably end up playing around with stuff and figure it out. But in the mean time, if anyone has some general guidance on this setup, it would be much appreciated 🙏

Edit: Might be worth mentioning I'm using Supabase auth, and I've introspected the Supabase-provided auth schema and plan to use that to set up access control. But currently using the Supabase SvelteKit auth helpers to do authentication.

Also just wanted to shout out the creators/maintainers. It looks like it's still early days for this project, but it seems like it'll make working with prisma much more pleasant, so thank you for this!

ymc9 commented 1 year ago

Hi @lega0208 , thanks for your interest to ZenStack!

To be honest, I haven't tried using tRPC with SvelteKit yet, but my belief is that tRPC-SvelteKit is for setting the environment of using tRPC with SvelteKit. tRPC doesn't seem to provide official support to SvelteKit yet, so it's a community effort. It's basically equivalent to tRPC's binding to Next.js, Express.js, etc. If you plan to use tRPC with SvelteKit, it's a must-have.

If you've already decided to use tRPC for your project (regardless using ZenStack or not), you can use the trpc plugin to generate CRUD routers. The routers are agnostic to the underlying framework (SvelteKit, Next.js, etc.); as long as there's a valid tRPC setup, they should work. They simply expose all Prisma CRUD operations through tRPC. You can use this project as a reference (it's tRPC + Next.js, but the router set up part should be quite similar). This setup DOESN'T involve the ZenStack SvelteKit adapter.

If you're only thinking of using tRPC for the sake of using ZenStack, you can consider the combination of ZenStack SvelteKit adapter and ZenStack tanstack-query plugin instead. The server adapter installs CRUD service as REST-like APIs on SvelteKit's server side, and the tanstack-query plugin can generate client-side code consuming the API. Functionality wise, it should be mostly equivalent to the tRPC setup, but without the complexity of setting up tRPC. You can use this project as a reference.

I understand the relationship is a bit confusing (mainly because tRPC is like a server above server 😂). Let me know if I clarified it. Thanks!

PS: yes, ZenStack is still a project in the early phase but as you said, we believe in its potential to make working with Prisma to a new level. Nothing worth more than feedback from early adopters!

lega0208 commented 1 year ago

@ymc9 Thanks so much for the response! I'm actually not particularly concerned with the generated endpoints, mostly just wanted to integrate ZenStack's access control. From what I now understand, it seems like ZenStack's trpc plugin and SvelteKit adapter are mostly for easily generating endpoints (correct me if I'm wrong).

So thanks to your reply and looking into it a bit more, I think what makes the most sense for my use case would be to just use tRPC-SvelteKit along with withPreset/withPolicy, essentially following the Backend-only Usage quickstart but adapted for SvelteKit.

And as a side note, I realize now that Supabase auth can probably be used pretty much exactly as usual, all you have to do is pass the user info when creating the enhanced stores, very easy integration!

Looking forward to trying this out 😄 and once I have it set up and played around with it a little, I'll come back and let you know my findings!

ymc9 commented 1 year ago

You're welcome! @lega0208

Yes, if the main goal is to utilize access control, the "backend only" guide is a good one to follow, and you can essentially just use withPreset/withPolicy without messing with server adapters at all.

We've recently updated the Introduction part of the documentation and explains the structure of ZenStack inside out layer by layer. Maybe you'll also find that helpful and clarify some of the confusion.

Have fun playing with it and let us know if you need any support. You can also find me on Discord.


Good to know integrating Supabase is easy! I have a TODO to add a guide for it and will do it soon, then 😄.

ymc9 commented 1 year ago

Hopefully, the new introduction section is helpful. Closing for now.