Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Provide the modal link label function on Fides object #4766

Conversation

gilluminate
Copy link
Contributor

@gilluminate gilluminate commented Apr 1, 2024

Closes #PROD-1710

Description Of Changes

Provide the modal link label function to the client based on the current locale unless specified via props to return default locale's language.

Assumes translation string will be returned along with other strings from the server as modal_link_label (WIP. Not hooked up to BE yet)

Code Changes

  • Defines a DEFAULT_MODAL_LINK_LABEL
  • During fides initialization, after i18n has been initialized, sets the function for consumption on window.Fides object.
  • Updates documentation to include getModalLinkLabel() instructions.
  • Updates demo pages to use this new function for displaying the modal link when available.

Steps to Confirm

  • Set the string for a couple of languages
    1. Go to /consent/privacy-experience
    2. Click US Modal to open its configuration settings
    3. Click English (Default) language
    4. Add some English text in the "Trigger link label" field and Save. (eg. "Privacy Options").
    5. Click Save again to also save it to the experience.
    6. Click US Modal to open its configuration settings again.
    7. Open the Spanish language
    8. Add some spanish text in the "Trigger link label" field and Save. (eg. "Opciones de privacidad")
    9. Click Save again to also save it to the experience.
  • visit the demo page with ?fides_locale set for desired language, and make sure the geolocation used in demo page supports US Modal experience we just configured:
    * /fides-js-demo.html?geolocation=us-ut&fides_locale=en
    * /fides-js-demo.html?geolocation=us-ut&fides_locale=es
  • See translated string you entered on demo page under the "Consent Modal Link" heading.
  • You should also see the same string returned in the console by typing Fides.getModalLinkLabel()

Pre-Merge Checklist

Copy link

vercel bot commented Apr 1, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment
Name Status Preview Comments Updated (UTC)
fides-plus-nightly ⬜️ Ignored (Inspect) Visit Preview Apr 2, 2024 9:16pm

Copy link

cypress bot commented Apr 1, 2024

Passing run #7033 ↗︎

0 4 0 0 Flakiness 0

Details:

Merge 2d57b0f into 064362e...
Project: fides Commit: c85c0a483f ℹ️
Status: Passed Duration: 00:37 💡
Started: Apr 2, 2024 9:27 PM Ended: Apr 2, 2024 9:28 PM

Review all test suite changes for PR #4766 ↗︎

Copy link
Contributor

@eastandwestwind eastandwestwind left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice start on this! Just a couple things to address before we can merge.

@@ -40,6 +40,7 @@ existence of Fides *or* subscribe to the global `FidesInitialized` event (see
- [fides\_string](Fides.md#fides_string)
- [initialized](Fides.md#initialized)
- [showModal](Fides.md#showmodal)
- [getModalLinkLabel](Fides.md#getmodallinklabel)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💯

@@ -36,6 +48,12 @@
<h1>fides.js demo page</h1>
<p>This page exists to demonstrate the fides.js script.</p>

<div>
<button type="button" onclick="deleteCookie()">
delete cookie and reload
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thanks for adding this here too!

clients/fides-js/src/lib/initialize.ts Outdated Show resolved Hide resolved
clients/fides-js/src/lib/initialize.ts Outdated Show resolved Hide resolved
clients/fides-js/src/lib/initialize.ts Outdated Show resolved Hide resolved
clients/fides-js/src/lib/initialize.ts Outdated Show resolved Hide resolved
@@ -45,6 +47,37 @@ describe("i18n-utils", () => {
{ locale: "en", label_en: "English", label_original: "English" },
{ locale: "es", label_en: "Spanish", label_original: "Español" },
];
const mockI18nCatalogLoad = [
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thanks for extracting these out 💯

@@ -906,6 +865,42 @@ describe("i18n-utils", () => {
});
});

describe("localizeModalLinkText", () => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

super easy to read, nice work!

@gilluminate gilluminate merged commit 71a1d7e into main Apr 2, 2024
13 checks passed
@gilluminate gilluminate deleted the PROD-1710-fides-js-provide-functions-methods-to-get-or-set-the-string-in-a-link branch April 2, 2024 21:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants