Sling date format

[HanL]

Hi 

I having an issue on the sling date:

<sly data-sly-test.startingDate="${'dd-MMM-yyyy' @ i18n, format=pnp.firstDayOfYear, locale=countryPage.languageCode, type='date'}"></sly>

the firstDayOfYear value comes from Java method:

    public Calendar getFirstDayOfYear(){
        Calendar c = Calendar.getInstance();
        c.set(Calendar.MONTH, 0);
        c.set(Calendar.DAY_OF_MONTH, 1);
        if (c.get(Calendar.DAY_OF_WEEK) == Calendar.FRIDAY || c.get(Calendar.DAY_OF_WEEK) == Calendar.SATURDAY)
            c.add(Calendar.DAY_OF_MONTH, 3);
        else if (c.get(Calendar.DAY_OF_WEEK) == Calendar.SUNDAY )
            c.add(Calendar.DAY_OF_MONTH, 2);
        else
            c.add(Calendar.DAY_OF_MONTH, 1);
        return c;
    }

and the result is
startingDate="02-Jan-2024" in English 

starting-date="02%20janv.%202024" in French 
The French translation is settled like this:

    <global_date_format_long_day jcr:primaryType="sling:MessageEntry"
        sling:key="dd-MMM-yyyy"
        sling:message="dd MMM yyyy" />

how can I change the code so the French date could show as "02-jan-2024"

thank you

[Imran__Khan · Accepted solution]

@patK-ze1xYs  Use API will allow you to decode this date.

Below code snippet from AEMaaCS from current project.
Create below js file myfile.js within the component folder. We can create this file as part of other folder hierarchy also 

"use strict";
use(function () {
   var date = decodeURI(this.date); 
   return date;
});

Consume above js file as part of component Sightly html

<sly data-sly-use.url="${'myfile.js' @ date=pnp.firstDayOfYear}" />
<h2> ${url.date} </h2>

console.log(decodeURI("02-Jan-2024")); --> 02-Jan-2024
console.log(decodeURI("02%20janv.%202024")); --> 02 janv. 2024