FEATURE: Display times from the obs portal to book RTI sessions
Background:
We're getting so much closer to the MVP! Before this change, the times to book an rti session were hardcoded. Now, the times are obtained by making an api GET request to the observation portal.
Implementation:
The TimePicker component now fetches real-time telescope availability data from http://observation-portal-dev.lco.gtn/api/realtime/availability/ when it's mounted. This data is processed in processTelescopeAvailability and stored in the availableTimes object.
Because more than one site can have the same availability, getUniqueLocaleTimes filters out duplicate times to only show unique times. Then, in the LeafletMap component the map markers are dynamically updated based on the selected time and the real-time availability data from the API. This ensures that only relevant sites are marked as available or unavailable.
In TimePicker, I also added the functionality to refresh available times when the same date is selected again so that users can change their selected time without reloading the page. And lastly, I added limited date selection to only valid dates within the range returned by the API, so that users can only select valid observation dates : )
I updated formatToUTC to better work for the needs of this application and be used more broadly and I also added more sites with their lat and lon so that the markers on the map can render on the map
VISUALS
The screen recording shows the following:
The time picker only allows for the user to select from range of available times (from the obs portal response)
Accurately displays all available times
Once a time is selected, sites that are available at that time are represented by the green marker
The user can now select the same date to view more times
FEATURE: Display times from the obs portal to book RTI sessions
Background: We're getting so much closer to the MVP! Before this change, the times to book an rti session were hardcoded. Now, the times are obtained by making an api GET request to the observation portal.
Implementation: The
TimePickercomponent now fetches real-time telescope availability data fromhttp://observation-portal-dev.lco.gtn/api/realtime/availability/when it's mounted. This data is processed inprocessTelescopeAvailabilityand stored in theavailableTimesobject.Because more than one site can have the same availability,
getUniqueLocaleTimesfilters out duplicate times to only show unique times. Then, in theLeafletMapcomponent the map markers are dynamically updated based on the selected time and the real-time availability data from the API. This ensures that only relevant sites are marked as available or unavailable.In
TimePicker, I also added the functionality to refresh available times when the same date is selected again so that users can change their selected time without reloading the page. And lastly, I added limited date selection to only valid dates within the range returned by the API, so that users can only select valid observation dates : )I updated
formatToUTCto better work for the needs of this application and be used more broadly and I also added more sites with theirlatandlonso that the markers on the map can render on the mapVISUALS
The screen recording shows the following:
https://github.com/user-attachments/assets/d8276f73-0ae8-4e83-ab7d-4b52b270f356