finos / calendar Goto Github PK

• create .eslintrc.json
• include react and react-hooks rules
• add eslint check to build
• fix issues that come up

If an event has no description (field), the calendar crashes when the event is clicked.

Add the possibility to filter events by projects; visually, the should be a list of projects (either in a dropdown or as a checklist) and by clicking (or enabling/disabling) events should instantly show or hide.

Tasks:

1. Define a way to associate events to projects; this can be done by defining string matching between project names and the event title during the event fetching/parsing (googleapi2events.js)
2. Populate the project field in events.json
3. Render out the list of projects (create a set from the list of all project fields in events.json) as a checklist or drop-down, somewhere in the event grid page
4. Filter events in FullCalendar based on the project event field (this code can be partially reused)
5. Add the project field in the event details popup

cc @jgavronsky , as she suggested this enhancement

While setting up the project, I found a few steps were missing or required more elaboration. For example :

1. Project requires GNUPG to be installed on the device.
2. dist directory needs to be created in order to generate events.json file.

Adding these steps and some improvements will definitely help future contributors save some setup time that they can otherwise use in contribution. I would also like to work on this issue.

Code is partially done.

@TheJuanAndOnly99 - please create a branch with existing code and drop a comment with what's left to be done.

TY!

Dec 13th CDM event is not showing up on https://calendar.finos.org/ this event was moved from it original date on Tuesday Dec 26th. Same thing happened with this event in November when it was re scheduled.

Add a search bar on the top to search based on the text content of the entries, and hide items based on that.

When clicking on the "+X more" link the pop up does not display correctly when in dark mode (see screenshots)

The ICS contains an UNTIL=20230315T035959Z, which breaks things

Overall, this is a proposal to use a framework / component library that will abstract away the HTML templating and state management aspects of JavaScript into a documented and approachable way.

I'm proposing React because I already know it and it not as heavy as Angular, my favorite enterprise front end framework. Using a tool I already know will help me get something out in a few hours and to best support anyone on this team that wants to contribute. The codebase will follow the basic best practices (nothing too complex to start) and allow those with React experience to contribute easily while allowing others to learn those practices.

I propose starting with create-react-app as the base and to continue using FullCalendar with their React component.

Please let me know your thoughts.

As it is using the calculated variables, and they are not properly recalculated for dark mode, the fc-popovers do have the wrong colors:

It should be possible to run this calendar locally, using vite, express or similar frameworks.

Running from file:// is not an option, since CORS blocks the loading of the local ICS file.

Use https://codesandbox.io to test FullCalendar with a basic .ics or events.json file with 2-3 events.

Below is a list of screenshots that show formatting issues on some calendar events; for each of those, we'd need to understand why they're rendering out differently than others.

It would be very helpful to integrate something like Netlify to create PR previews.

Each event shows a start and end date, which is currently expressed using Eastern Timezone.

This task is to express these dates/times following the timezone passed by the browser.

Some events are being duplicated:

• KDB Project call
• FINOS Diversity, Equity and Inclusion SIG - Monthly Meeting
• CDM Steering Working group
• and others

Some are duplicated on https://calendar.google.com/calendar/embed?src=finos.org_fac8mo1rfc6ehscg0d80fi8jig%40group.calendar.google.com&ctz=Europe%2FMadrid (like CDM Collateral Working Group) which leads to the duplication. Others are not. Some are duplicated only on some occurrences and some are duplicated on every instance. Not sure why. Need to investigate.

Some options from https://medevel.com/os-js-calendar/ :

• https://github.com/vkurko/calendar
• https://github.com/williamtroup/Calendar.js
• https://github.com/nhn/tui.calendar
• https://github.com/GramThanos/jsCalendar
• https://github.com/DHTMLX/scheduler
• https://github.com/edlynvillegas/evo-calendar

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

• Update dependency @types/react to v18.2.48
• Update dependency ical-generator to v6.0.1
• Update dependency vite to v5.0.12
• Update dependency html-react-parser to v5.1.1
• Update actions/upload-artifact action to v4
• Update dependency googleapis to v131
• Click on this checkbox to rebase all open PRs at once

Detected dependencies

• Check this box to trigger a request for Renovate to run again on this repository

node_modules are currently committed due to a typo in the .gitignore.

Currently, the calendar is not mobile friendly. Since the calendar is also embedded in a larger webpage, it might be best to focus the effort to viewport size instead of device type.

Add a dark mode (probably based on browser rule based on user settings too) possibility.