Make login wall wording more positive and add i18n support #772
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Co-authored-by: VaiTon <[email protected]>
| disabled={isLoading || !loggedIn} | ||
| title={!loggedIn | ||
| ? 'You must be logged in to create a new tag' | ||
| ? 'Please log in to create new tags and contribute to food transparency' |
There was a problem hiding this comment.
@copilot move this to the en.json file to make this i18n-able
There was a problem hiding this comment.
Done! Moved the tooltip message to auth.login_to_create_tags_tooltip in en.json and updated the component to use $_('auth.login_to_create_tags_tooltip').
Commit: acda548
| <p class="mb-4"> | ||
| To create new tags and contribute to food transparency, please log in to your Open Food | ||
| Facts account | ||
| </p> |
There was a problem hiding this comment.
Done! Moved the login message to auth.login_to_create_tags_message in en.json and the Login button text to auth.login. Updated the component to use $_('auth.login_to_create_tags_message') and $_('auth.login').
Commit: acda548
| error(401, { | ||
| message: 'You must be logged in to view this page', | ||
| message: | ||
| 'In order to edit this product, and contribute to food transparency, you need to be logged in to your Open Food Facts account.', |
There was a problem hiding this comment.
Done! Moved the error message to auth.login_to_edit_message in en.json and updated the page loader to use get(_)('auth.login_to_edit_message'). Also moved the action button labels to auth.login and auth.create_account.
Commit: acda548
Co-authored-by: VaiTon <[email protected]>
|
@teolemon what do you think? |
|
still very red, but definitely better @VaiTon |
|
@teolemon we can redirect to another page and show whatever, do we have an image? |
The login wall displayed when users try to edit products had negative, restrictive language that focused on blocking access rather than encouraging contribution. This change transforms the messaging to be more positive and welcoming while emphasizing the value of contributing to food transparency. Additionally, all login wall messages are now fully internationalized for translation support.
Changes Made
Main Login Wall (Product Edit Pages)
Before:
After:
Folksonomy Component
Before:
After:
Internationalization Support
All login wall messages are now translatable via the i18n system:
Added to
en.json:auth.login_to_edit_message: Main login wall message for product editingauth.login_to_create_tags_message: Message for folksonomy tag creationauth.login_to_create_tags_tooltip: Tooltip for tag creation buttonauth.create_account: "Create my Open Food Facts account" button textauth.login: "Login" button textUpdated Components:
src/routes/products/[barcode]/edit/+page.ts: Usesget(_)()for server-side translationsrc/routes/products/[barcode]/Folksonomy.svelte: Uses$_()for component translationImpact
The new messaging:
Before (Negative)
After (Positive + Translatable)
Fixes #771.
💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.