lingo link transformation

[vhargrave]

This PR adds functionality for language-based link localisation for project lingo. The first project that will be consuming this is da-bacom and in order to unblock other teams this will hopefully be merged before the 9th December.

This PR is not fully ready for review as unit tests still need to be added and I'm testing last functionality. Creating the draft now though, so first insights and feedback can already start coming in.

When going through the PR you'll see that localizeLink and decorateLinks are being made async. This was not a decision that was made lightly, but seemed to be the cleanest long term solution for link localization. For example, when localizeLink or decorateLinks are called, especially in other projects like cc, it is important that these functions always returns the same result if they are given the same input. Because query indexes can now play a rmajor role in how links are localized, when a call to localizeLink is made, these query indexes must sometimes be awaited. localizeLink and decorateLinks are being used in other projects and will need to be updated there after this PR. The blast damage is the following (usually one or max two usages per project)

List of projects to update localizeLink: Da-marketo Unity Cc-sandbox Exchange-partners Dme-partners Cc Genuine Da-dx-partners

decorateLinks: Cc Dme-partners Da-dx-partners Express-milo

Resolves: MWPW-179494

Test URLs:

• Before: https://main--milo--adobecom.aem.page/?martech=off

• After: https://vhargrave-lingo-link-transformation--milo--adobecom.aem.page/?martech=off

• Before: https://main--cc--adobecom.aem.page/ch_de/creativecloud/photography?georouting=off&martech=off

• After: https://main--cc--adobecom.aem.page/ch_de/creativecloud/photography?milolibs=vhargrave-lingo-link-transformation&georouting=off&martech=off Steps to test:

• Scroll down to the accordion
• Open first collapsible element - the link should be regionalized because it's in the preview query index https://main--cc--adobecom.aem.page/ch_de/cc-shared/assets/lingo/query-index-preview.json
• Open fifth collapsible element - the link should also be regionalized
• Go down to the footer
• Second column, business.adobe.com link personalization at scale should be localized to /ch_de/ All other links in that column should point to /de

• Before: https://main--cc--adobecom.aem.page/de/creativecloud/photography?martech=off

• After: https://main--cc--adobecom.aem.page/de/creativecloud/photography?milolibs=vhargrave-lingo-link-transformation&martech=off Steps to test: Everything should be /de

• Before: https://main--da-bacom--adobecom.aem.live/ar/?martech=off

• After: https://main--da-bacom--adobecom.aem.live/ar/?milolibs=vhargrave-lingo-link-transformation&martech=off Scroll down to the first bricks One on right should be regionaled to /ar for both .page & .live One in middle should be regionalized to /ar only for .page. On .live it should be /es because there is no entry of the page in the previewed query index and it should therefore default to /es. The brick on the left should always point to /es Scroll down to the footer. Look at the third column of links.

The express link should get turned into /es The Creative cloud link should get turned into /ar The Illustrator link should get turned into /es

• Before: https://main--da-bacom--adobecom.aem.live/es/?martech=off
• After: https://main--da-bacom--adobecom.aem.live/es/?milolibs=vhargrave-lingo-link-transformation&martech=off Everything should be /es

GNav Test URLs

Gnav + Footer + Region Picker modal:

• Acrobat: https://main--dc--adobecom.aem.live/acrobat?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• BACOM: https://main--da-bacom--adobecom.aem.live/?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• CC: https://main--cc--adobecom.aem.live/creativecloud?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• Milo: https://vhargrave/lingo-link-transformation--milo--adobecom.aem.page/drafts/blaishram/test-urls/page?martech=off
• Express: https://main--express-milo--adobecom.aem.live/express/?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• News: https://main--news--adobecom.aem.live/?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• Homepage: https://main--homepage--adobecom.aem.live/homepage/index-loggedout?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom

Thin Gnav + ThinFooter + Region Picker dropup:

• Acrobat: https://main--dc--adobecom.aem.page/drafts/blaishram/test-urls/page-gnav-footer-thin?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• BACOM: https://main--da-bacom--adobecom.aem.page/drafts/blaishram/test-urls/page-gnav-footer-thin?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• CC: https://main--cc--adobecom.aem.page/drafts/blaishram/test-urls/page-gnav-footer-thin?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• Milo: https://vhargrave/lingo-link-transformation--milo--adobecom.aem.page/drafts/blaishram/test-urls/page-gnav-footer-thin?martech=off
• Express: https://main--express-milo--adobecom.aem.page/drafts/blaishram/test-urls/page-gnav-footer-thin?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• News: https://main--news--adobecom.aem.page/drafts/blaishram/test-urls/page-gnav-footer-thin?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• Homepage: https://main--homepage--adobecom.aem.page/drafts/blaishram/test-urls/page-gnav-footer-thin?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom

Localnav + Promo:

• Acrobat: https://main--dc--adobecom.aem.page/drafts/blaishram/test-urls/page-with-promo?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• BACOM: https://main--da-bacom--adobecom.aem.page/drafts/blaishram/test-urls/page-with-promo?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• CC: https://main--cc--adobecom.aem.page/drafts/blaishram/test-urls/page-with-promo?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• Milo: https://vhargrave/lingo-link-transformation--milo--adobecom.aem.page/drafts/blaishram/test-urls/page-with-promo?martech=off
• Express: https://main--express-milo--adobecom.aem.page/drafts/blaishram/test-urls/page-with-promo?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• News: https://main--news--adobecom.aem.page/drafts/blaishram/test-urls/page-with-promo?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom
• Homepage: https://main--homepage--adobecom.aem.page/drafts/blaishram/test-urls/page-with-promo?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom

Sticky Branch Banner:

• URL: https://main--federal--adobecom.aem.page/drafts/blaishram/banner/branch-banner-sticky?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom

Inline Branch Banner:

• URL: https://main--federal--adobecom.aem.page/drafts/blaishram/banner/branch-banner-inline?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom

Blog

• URL: https://main--blog--adobecom.aem.page/?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom

RTL Locale

• URL: https://main--homepage--adobecom.aem.live/mena_ar/homepage/index-loggedout?martech=off&milolibs=vhargrave/lingo-link-transformation--milo--adobecom

[aem-code-sync[bot]]

Hello, I'm the AEM Code Sync Bot and I will run some actions to deploy your branch. In case there are problems, just click the checkbox below to rerun the respective action.

• [ ] Re-sync branch

Commits

• 4455c40 :white_check_mark: (latest)
• 5d9d062 :white_check_mark:
• 1bb98c4 :white_check_mark:
• 90be857 :white_check_mark:
• 2108a60 :white_check_mark:
• 6ae1fa7 :white_check_mark:
• d0b071f :white_check_mark:
• 593eae6 :white_check_mark:
• a38eca1 :white_check_mark:
• b5528e7 :white_check_mark:
• 1b5c1ce :white_check_mark:
• 289ffac :white_check_mark:
• 8aeba71 :white_check_mark:
• db4960a :white_check_mark:
• 79ae411 :white_check_mark:
• ddaedd8 :white_check_mark:
• 115f15c :white_check_mark:
• 0d953b1 :white_check_mark:
• 3bbe482 :white_check_mark:
• 6b4ef75 :white_check_mark:
• 88de18d :x:
• 41ac25a :x:
• 0189e06 :x:
• 60d1517 :x:
• 8b3bb3c :x:
• babc24c :x:
• 19cc391 :x:
• a76eaca :x:
• 20a1818 :x:
• 67d7632 :x:

[github-actions[bot]]

This pull request is not passing all required checks. Please see this discussion for information on how to get all checks passing. Inconsistent checks can be manually retried. If a test absolutely can not pass for a good reason, please add a comment with an explanation to the PR.

[vhargrave]

Is all of the new code in utils critical for LCP? E.g. can we not create any links without it? Otherwise, if we can move some parts out of utils, that would be great.

400 new lines in oen go, is quite heavy 😬

yeah I know ☹️ i'll think about it some more, because there might be some things I can extract - but just gut feeling (don't have crawl data), most of the code will be necessary for LCP of about 50% of all future regional pages. I think the amount of code is also not helped by the fact that that it also contains all the changes to utils from this PR, that hasn't been merged to stage yet. - https://github.com/adobecom/milo/pull/5096

[vhargrave]

Only gave this a high level look. This is definitely a mouthful and maintainability might not be so straightforward, but having looked into the Lingo universe, I also know that any solution using the current architecture will seem over-engineered ☹️

yeah, this has been a journey 😓 ... I'm happy about that lack of impact on page performance at least, even if it's a lot to swallow.

[mokimo]

Few nits and simplifications / leaner code / readability! BTW All the suggestions are purely demo code and untested! Should ideally function as is mostly though

[sukamat]

Looks like there is a limit on how many people can be added to the review list. If I add some, it is removing some. Tagging folks here just in case @nateekar @gmirijan @spadmasa @sigadamvenkata @robert-bogos @adobecom/feds @adobecom/mep-squad

[spadmasa]

Hi @vhargrave , can you please confirm on below observation when verified on the below url https://main--cc--adobecom.aem.page/ch_de/creativecloud/photography?milolibs=vhargrave-lingo-link-transformation-test&martech=off the geo routing link is seen pointing to ch_de/creativecloud/photography

in gnav when hovered on creativecloud/photography seen pointing to de

can you please advise on this will all gnav , footer links points to de ?

cc: @sukamat , @sigadamvenkata , @sonawanesnehal3 , @nishantka

[vhargrave]

Hi @vhargrave , can you please confirm on below observation when verified on the below url https://main--cc--adobecom.aem.page/ch_de/creativecloud/photography?milolibs=vhargrave-lingo-link-transformation-test&martech=off the geo routing link is seen pointing to ch_de/creativecloud/photography

in gnav when hovered on creativecloud/photography seen pointing to de

can you please advise on this will all gnav , footer links points to de ?

cc: @sukamat , @sigadamvenkata , @sonawanesnehal3 , @nishantka

Hi @spadmasa The logic is pretty much the following - if a site has opted in for project lingo, and the user is on a regional page like ch_de and the link is not already localized , then I check in the regional query index or indexes, if the page exists. If it does , then I add /ch_de/ or whatever the regional prefix is, to the beginning of the link. If it doesn't, then I add the base prefix, so in this case /de. For this test, I only have a few pages listed in the regional index which is why most of the links should be getting converted to /de. There are also special cases like the Einzelanwender link, which is right above the other link you showed in the gnav. This link is already /ch_de in the source document, which is why my conversion logic doesn't touch it, i.e. the link is already localized.

As for the georouting, those links are not going through the typical localizeLink logic. They're prepared and manually set by the georouter itself. In general the georouter is going to need to be updated for the newest changes coming with project lingo, and work is already happening on a new type of region mismatch modal. That's not part of this ticket though.

Hope that makes sense and if not just send a ping with other questions or we can also jump on a call! cc: @sukamat , @sigadamvenkata , @sonawanesnehal3 , @nishantka

[sigadamvenkata]

Hi @vhargrave , we can see the 'query-index' XSL files are previewed and published. so once the code goes to stage & prod will the feature enables? so we have any mechanism to turn feature on or off?

@sunilkamat @spadmasa

[vhargrave]

Hi @vhargrave , we can see the 'query-index' XSL files are previewed and published. so once the code goes to stage & prod will the feature enables? so we have any mechanism to turn feature on or off?

@sunilkamat @spadmasa

Hey @sigadamvenkata - yes, the link localization feature is an opt in and turned on over the metadata lingo . What is not opt in though because it shouldn't be breaking anything is that localizeLink and decorateLinks are now renamed and async. This shouldn't , but could have an impact on the following features:

• caas
• faas
• email-collection
• marketo
• global navigation (gnav & footer)
• fragments / personalization

so I'm grateful for any testing of these features using my code.

@sunilkamat @spadmasa

[sukamat]

@spadmasa @sigadamvenkata For testing, @vhargrave has setup a manual query-index excel sheet in /ch_de/cc-shared/assets/lingo/query-index-preview just so that you guys can see that behavior. What is more important is that the existing functionality in ACOM is not broken. So other than validating the new feature in the test page that Victor provided, it is important to also make sure that ACOM continues to work as before by using other pages with Victor's branch. This link transformation feature will only apply to BACOM when it goes live in Feb (along with many other Lingo specific features) and will eventually be used on ACOM mid-next year. Hope that provides additional context.

cc: @nateekar

[skumar09]

@team: I’ve added the do-not-merge label. I’ll remove it once we have QA sign-off from all the impacted projects/tracks. Testing is currently in progress. cc: @vhargrave , @narcis-radu , @sunilkamat

[sukamat]

@vhargrave I had mentioned this in Slack but adding it here as well. CaaS is using a metadata flag langFirst for Lingo. They had set it up back in June when Newsroom went live as a language-first site. You can see the usage in the Newsroom metadata.xml file. Could we re-use the same flag? I cannot think of a use-case to keep them separate but LMK.

[vhargrave]

@vhargrave I had mentioned this in Slack but adding it here as well. CaaS is using a metadata flag langFirst for Lingo. They had set it up back in June when Newsroom went live as a language-first site. You can see the usage in the Newsroom metadata.xml file. Could we re-use the same flag? I cannot think of a use-case to keep them separate but LMK.

@sunilkamat I think we can - if we notice it's a mistake later on, this is something we can quickly pivot on. I've changed it 👍

[sigadamvenkata]

we are good from CC, FEDS, Unity, News.adobe.com tracks and can to STAGE.

[Ruchika4]

Hi @vhargrave , for https://main--dc--adobecom.aem.page/ch_de/acrobat?milolibs=vhargrave-lingo-link-transformation-test&georouting=off&martech=off I see that links in footer that should point to /de/ as per PR description are also pointing to /ch_de/ Could you please help check.

[vhargrave]

Hi @vhargrave , for https://main--dc--adobecom.aem.page/ch_de/acrobat?milolibs=vhargrave-lingo-link-transformation-test&georouting=off&martech=off I see that links in footer that should point to /de/ as per PR description are also pointing to /ch_de/ Could you please help check.

Just had a call with @Ruchika4 to answer this. The code is working correctly since lingo is not active on dc.

[gmirijan]

No impact to the current CAAS functionality.