BearStudio / start-ui-web

πŸš€ Start UI [web] is an opinionated UI starter with 🟦 TypeScript, βš›οΈ React, ⚫️ NextJS, ⚑️ Chakra UI, 🟦 tRPC, πŸ” Lucia Auth, β–² Prisma, πŸ–οΈ TanStack Query, πŸ“• Storybook, 🎭 Playwright,πŸ“‹ React Hook Form,β—½From the 🐻 BearStudio Team
https://demo.start-ui.com
MIT License
1.39k stars 129 forks source link

i18n and date formatting #391

Open yoannfleurydev opened 1 year ago

yoannfleurydev commented 1 year ago

It could be great to handle date formatting with i18next and give example in the code

i18next
    .use(initReactI18next)
    .init({
        resources,
        lng: DEFAULT_I18N_LANGUAGE,
        interpolation: {
            escapeValue: false,
            format: (value, format) => {
                if (isDate(value)) {
                    return formatDate(value, format);
                }
                // List of custom formatters
                if (format === 'minutesToHours') {
                    return minutesToHours(value)?.toString();
                }
                return value;
            },
        },
    })
    "create_by": "{{displayName}} le {{date, dd MMMM yyyy}}"
Jessy-BAER commented 1 year ago

It's a great idea !

yoannfleurydev commented 1 year ago

It's a great idea !

Of course it is, it's yours πŸ˜›

ntatoud commented 1 year ago

@yoannfleurydev I would like to contribute on this issue !

yoannfleurydev commented 1 year ago

@yoannfleurydev I would like to contribute on this issue !

Awesome, I assigned you to the issue πŸ˜ƒ

ntatoud commented 1 year ago

@yoannfleurydev I would like to clarify 1 small detail : On top of the formatDate that will allow the use of the synthax : "create_by": "{{displayName}} le {{date, dd MMMM yyyy}}"

Should I provide more functions like 'hoursToMinutes or simply demonstrate the possibility to add more ?

yoannfleurydev commented 1 year ago

@yoannfleurydev I would like to clarify 1 small detail : On top of the formatDate that will allow the use of the synthax : "create_by": "{{displayName}} le {{date, dd MMMM yyyy}}"

Should I provide more functions like 'hoursToMinutes or simply demonstrate the possibility to add more ?

Don't bother adding too much logic @ntatoud , just the bare minimum to show how to add custom date format in translation.