Custom authRequired = true

I want to be able to check if a user has paid ("isActive" in db) before going into a specific page Ideally, I do not want to add it at the beginning of each page Do you have someting to maybe custom the authRequired in .wasp ? Or do you plan to add certain Layouts maybe? Thanks
5 Replies
MEE6
MEE66mo ago
Wohooo @Estelle, you just became a Waspeteer level 4!
kapa.ai
kapa.ai6mo ago
Hi @Estelle. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- Currently, Wasp allows you to set the authRequired property to true when declaring a page. This ensures that only authenticated users can access the page. Unauthenticated users are redirected to a route defined by the app.auth.onAuthFailedRedirectTo field. Here is an example:
page MainPage {
component: import Main from "@src/pages/Main",
authRequired: true
}
page MainPage {
component: import Main from "@src/pages/Main",
authRequired: true
}
(Source: Wasp Docs (https://wasp-lang.dev/docs/auth/overview#protecting-a-page-with-authrequired)) However, this does not directly support checking custom properties like "isActive". For now, you might need to handle this manually in your page's React component by checking the user object that is passed as a prop when authRequired is set to true. In terms of future plans, there has been discussion in the Wasp community about adding more advanced authorization features, such as role-based access control (RBAC). This could potentially be used to handle cases like yours in the future. However, this feature is not available yet and there is no specific timeline for its implementation. (Source: Discord Support Thread (https://discord.com/channels/686873244791210014/1211733266235916358)) As for layouts, you can create a custom layout that includes a navigation bar and other common elements, and use this layout in multiple pages. You can check the user's status in this layout and conditionally render content based on that. Here is an example of how to create a layout in Wasp: Wasp Github (https://github.com/wasp-lang/wasp/tree/main/examples/thoughts/src/client/Layout.jsx) Remember, these are just workarounds. The Wasp team is actively working on improving the framework, and more advanced authorization features may be added in the future. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ---------------------- Sorry @Estelle, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist: Perhaps try again in 15mins?
Estelle
Estelle6mo ago
ok so I'm gonna add custom Layout that I'll add to all the concerned pages thanks
Soham
Soham6mo ago
My suggestion: Is Active should used to enable/ disable accounts. Use other Name for this flag like haspaid
martinsos
martinsos6mo ago
@Soham that sounds like a good suggestion : would you mind opening an issue on wasp-lang/open-saas repo for this, so we can work on it there? @Estelle so we have rootComponent feature that allows you to have one "mega"-layout for all of the app, but yeah, if you want it for specific group of pages, you will do best with writing your own layout React compnent and then wraping each page into it on your own. In the future we will have direct support via Wasp but don't yet.
Want results from more Discord servers?
Add your server