O3: Embedding "International calendars - DatePicker and Date Converter" to O3

Hi, all Again,

It’s January 2, 2023, now when I write this post in the gregorian calendar but it’s Tahisase 24, 2015, here in Ethiopia which uses Ge’ez Calendar.

What is International Calander While most of the world uses the Gregorian calendar, there are several regional calendar eras used around the world. this includes the Julian, the Hindu, the Hijri/Islamic, Buddhist, Japanese, Chinese, and the Hebrew calendar.

Why International Calander As nice as it would be, the world doesn’t have one universal way to tell time. Each month has a different name depending on the country, some religions use the moon while others use the sun, and Ethiopia is even 7 years behind America!

Lets Go To the Business it’s been a while since ICAP Ethiopia (EthiOHRI team) raised this concept and there is also a tread in Slack about how to integrate International Calendar into the O3 registration form. and yes we have successfully have integrated react-spectrum Datepicker which uses Unicode calendar locale extension and we have create a configuration for that

git link

We have just implemented this for the registration page but there are plenty of forms in O3 with Datepicker and we can’t go over each one. but there must be some way to control rather than frontend configuration system. also, we need to implement a date converter as when the dates are shown in the list or view page it should be in respective calendars.

we are open to any suggestions and implementation plans as we are eager for any solutions

cc: @bistenes, @jdick, @mksd, @dkibet, @mayanja, @eudson, @grace, @dagimm, @zacbutko @ibacher

1 Like

Great to hear from you @sinte!! I miss working with your whole team. Hope to see you in Addis some day.

It’s good to hear this progress. I believe @Mekom might be interested in partnering on this issue, as their project in Cambodia also (I believe) requires a non-gregorian calendar. Actually I think they were planning to use the Thai calendar provided by the jQuery library you originally were using.

I have a few questions:

And some clarifications: So @sinte just to make sure I understand you correctly:

  • Goal #1: You want to leverage the i18n’d datepicker in forms, not just in the registration page, correct? I thought this work was already done by @amanryder? As shown here: https://talk.openmrs.org/t/o3-supporting-non-western-calendars-ethiopia-and-beyond/36566/3 Is this work no longer being used?

  • Goal #2: You also want a single place to set date configuration for the entire EMR, correct?

  • Goal #3: You then want anywhere that a date shows up in any widgets to be converted, e.g. like dates shown here, correct? image

    • Does this also include Dates of Birth?
1 Like

Thanks @grace and we have missed working with you too.

and to answer your questions

The goal is

  1. To Use React-spectrum Datepicker and we have also changed @amanya implementation as it uses jQuery Library. now we already implemented it for all of our forms (OHRIFORMS) @samuel34 can give us a detailed explanation about that.

  2. Yes we want a single place to set date configuration for the entire EMR, not only for the Forms, and Registration Page but for Appointments and all date-related fields.

  3. Yes exactly we need to show the user the converted dates, not the default, AND this is also for the entire EMR date-related widgets.

  4. Yes it includes Dates of Birth.

if @Mekom have already started this implementation we are happy to hear that @mksd @achachiez @ruhanga @enochb

1 Like

Good to hear from you Sinte and I hope to help - we definitely need to sort this out together for our overall O3 i18n strategy.

From a quick review - the scope of implementing a single config component might be big-ish, given there are many different O3 apps leveraging date-type fields: >30 in esm-core, >180 in esm-patient-chart and >140 in esm-patient-management. Mind you maybe it’s just a refactoring challenge, once the component has been built.

It looks like omrsDateFormat could be the component to focus on but I’m not sure.

@sinte or @dagimm is your team interested in partnering with an org to build this config out? I might be able to find some OMRS Inc resource to help with the Architecture but we’ll most likely need help with manpower when it comes to implementing it. I’ll also raise this with the whole tech team in next week’s TAC call.

Minor Clarifications:

Pinging also @mogoodrich & @mseaton & @dkayiwa b/c they’ve suffered through so much of OMRS’ i18n history and may have some sage advice here - e.g. Mark & Mike, do you guys have a Date locale config you use for PIH EMRs?

1 Like

Hi @grace, We really want to collaborate on sorting this out. We can dedicate a person to work on this. It would be great if @grace can help us coordinate this so we can start to work on it. FYI @sinte

1 Like

This is a really interesting thread. Did anyone follow up with @sinte ? Do we have a plan for datepicker internationalization in O3? @ibacher @dennis @mksrom

Oh + @amanryder , just seeing the post about your work: https://talk.openmrs.org/t/o3-supporting-non-western-calendars-ethiopia-and-beyond/

I don’t know that we have anything concrete, but it’s a real need. I was hoping to look into implementing something with a similar API to the Carbon components using either react-spectrum or, failing that, the @internationalized/date library. The idea was to make it as simple as possible to just swap out our uses of Carbon’s calendar components with components that are able to handle non-Gregorian dates.


Awesome. I support that. Maybe we should create a new ticket for this and cancel [O3-998] Datepicker date format should be locale-sensitive - OpenMRS Issues .