Language in LoginSignupForm.tsx
I'm building my first wasp based on the saas app template and I want to first translate everything to Spanish. I've changed the language everywhere but in the Language in LoginSignupForm.tsx I cannot as it is imported. So then I click to Log in, some text is in english.
I would like to know if there is a multilanguage feature I didn't discovered yet, or if the test in LoginSignupForm.tsx can be changed.
3 Replies
Hi @pollastrepiupiu. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Currently, Wasp does not have a built-in multilanguage feature for the authentication UI components. The
LoginForm and SignupForm components provided by Wasp are pre-generated and don't offer direct language customization options.
However, there are a couple of approaches you can consider to achieve your goal of translating the auth forms to Spanish:
1. Custom Implementation: Instead of using the pre-generated LoginForm and SignupForm components, you can create your own custom forms using Wasp's lower-level authentication primitives. This approach is described in the Auth UI documentation:
"If you want finer control you can pull in the Wasp auth functions and hooks and build your own form."
You can import the login and signup functions from wasp/client/auth and create your own forms with Spanish text.
2. CSS Hack: As a temporary workaround, you could use CSS to hide the English text and overlay it with Spanish translations. This is not an ideal solution but might work as a quick fix.
3. Future Customization: The Wasp team is aware of the need for more customization options for the auth UI. There's an open issue for making the signup form more flexible: GitHub Issue #1617.
For the most control over the language and appearance of your auth forms, the recommended approach would be to implement your own custom forms using Wasp's authentication primitives. This way, you can have full control over the text and layout while still leveraging Wasp's authentication backend.
If you need more detailed guidance on implementing custom auth forms, you may want to consult the Wasp documentation on customizing the auth flow.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @pollastrepiupiu, 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?Hey @pollastrepiupiu, this a great question and something we plan to work on soon.
The answer is:
- If you're using Wasp's Auth UI, you can't change the language. They come as-is with limited customization options
- To change the language, you have to implement your own login and signup pages that use our actions (shown here for username and password). I'm not sure whether you need to implement your own auth actions if you're using Google. I'll let @miho answer that.
Okay, understood it! Thank you