-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Francisco del Castillo
committed
Jul 16, 2024
1 parent
8cab706
commit 5eee26d
Showing
82 changed files
with
5,125 additions
and
81 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,74 @@ | ||
| import API from "api" | ||
| import { eventToCalendarEvents } from "components/aggregations/utils" | ||
| import Calendar from "components/Calendar" | ||
| import Model from "components/Model" | ||
| import { PageDispatchersPropType } from "components/Page" | ||
| import _isEqual from "lodash/isEqual" | ||
| import { Event } from "models" | ||
| import moment from "moment" | ||
| import PropTypes from "prop-types" | ||
| import React, { useRef } from "react" | ||
| import { useNavigate } from "react-router-dom" | ||
|
|
||
| const EventCalendar = ({ | ||
| pageDispatchers: { showLoading, hideLoading }, | ||
| queryParams, | ||
| setTotalCount | ||
| }) => { | ||
| const navigate = useNavigate() | ||
| const prevEventQuery = useRef(null) | ||
| const apiPromise = useRef(null) | ||
| const calendarComponentRef = useRef(null) | ||
| return ( | ||
| <Calendar | ||
| events={getEvents} | ||
| eventClick={info => { | ||
| navigate(info.event.url) | ||
| // Prevent browser navigation to the url | ||
| info.jsEvent.preventDefault() | ||
| }} | ||
| calendarComponentRef={calendarComponentRef} | ||
| /> | ||
| ) | ||
|
|
||
| function getEvents(fetchInfo, successCallback, failureCallback) { | ||
| const eventQuery = Object.assign({}, queryParams, { | ||
| status: Model.STATUS.ACTIVE, | ||
| pageSize: 0, | ||
| startDate: moment(fetchInfo.start).startOf("day"), | ||
| endDate: moment(fetchInfo.end).endOf("day") | ||
| }) | ||
| if (_isEqual(prevEventQuery.current, eventQuery)) { | ||
| // Optimise, return API promise instead of calling API.query again | ||
| return apiPromise.current | ||
| } | ||
| prevEventQuery.current = eventQuery | ||
| if (setTotalCount) { | ||
| // Reset the total count | ||
| setTotalCount(null) | ||
| } | ||
| // Store API promise to use in optimised case | ||
| showLoading() | ||
| apiPromise.current = API.query(Event.getEventListQuery, { | ||
| eventQuery | ||
| }).then(data => { | ||
| const events = data ? data.eventList.list : [] | ||
| if (setTotalCount) { | ||
| const { totalCount } = data.eventList | ||
| setTotalCount(totalCount) | ||
| } | ||
| const results = eventToCalendarEvents(events) | ||
| hideLoading() | ||
| return results | ||
| }) | ||
| return apiPromise.current | ||
| } | ||
| } | ||
|
|
||
| EventCalendar.propTypes = { | ||
| pageDispatchers: PageDispatchersPropType, | ||
| queryParams: PropTypes.object, | ||
| setTotalCount: PropTypes.func | ||
| } | ||
|
|
||
| export default EventCalendar |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,150 @@ | ||
| import { setPagination } from "actions" | ||
| import ButtonToggleGroup from "components/ButtonToggleGroup" | ||
| import EventCalendar from "components/EventCalendar" | ||
| import EventMap from "components/EventMap" | ||
| import EventSummary from "components/EventSummary" | ||
| import EventTable from "components/EventTable" | ||
| import { | ||
| mapPageDispatchersToProps, | ||
| PageDispatchersPropType | ||
| } from "components/Page" | ||
| import PropTypes from "prop-types" | ||
| import React, { useState } from "react" | ||
| import { Button } from "react-bootstrap" | ||
| import { connect } from "react-redux" | ||
|
|
||
| export const FORMAT_CALENDAR = "calendar" | ||
| export const FORMAT_MAP = "map" | ||
| export const FORMAT_SUMMARY = "summary" | ||
| export const FORMAT_TABLE = "table" | ||
|
|
||
| const EventCollection = ({ | ||
| pageDispatchers, | ||
| paginationKey, | ||
| pagination, | ||
| setPagination, | ||
| viewFormats, | ||
| queryParams, | ||
| setTotalCount, | ||
| mapId, | ||
| width, | ||
| height, | ||
| marginBottom | ||
| }) => { | ||
| const [viewFormat, setViewFormat] = useState(viewFormats[0]) | ||
| const showHeader = viewFormats.length > 1 | ||
| return ( | ||
| <div className="event-collection"> | ||
| <div> | ||
| {showHeader && ( | ||
| <header> | ||
| {viewFormats.length > 1 && ( | ||
| <> | ||
| <ButtonToggleGroup | ||
| value={viewFormat} | ||
| onChange={setViewFormat} | ||
| className="d-print-none" | ||
| > | ||
| {viewFormats.includes(FORMAT_TABLE) && ( | ||
| <Button value={FORMAT_TABLE} variant="outline-secondary"> | ||
| Table | ||
| </Button> | ||
| )} | ||
| {viewFormats.includes(FORMAT_SUMMARY) && ( | ||
| <Button value={FORMAT_SUMMARY} variant="outline-secondary"> | ||
| Summary | ||
| </Button> | ||
| )} | ||
| {viewFormats.includes(FORMAT_CALENDAR) && ( | ||
| <Button value={FORMAT_CALENDAR} variant="outline-secondary"> | ||
| Calendar | ||
| </Button> | ||
| )} | ||
| {viewFormats.includes(FORMAT_MAP) && ( | ||
| <Button value={FORMAT_MAP} variant="outline-secondary"> | ||
| Map | ||
| </Button> | ||
| )} | ||
| </ButtonToggleGroup> | ||
| </> | ||
| )} | ||
| </header> | ||
| )} | ||
|
|
||
| <div> | ||
| {viewFormat === FORMAT_TABLE && ( | ||
| <EventTable | ||
| pageDispatchers={pageDispatchers} | ||
| paginationKey={paginationKey} | ||
| pagination={pagination} | ||
| setPagination={setPagination} | ||
| queryParams={queryParams} | ||
| setTotalCount={setTotalCount} | ||
| /> | ||
| )} | ||
| {viewFormat === FORMAT_SUMMARY && ( | ||
| <EventSummary | ||
| pageDispatchers={pageDispatchers} | ||
| paginationKey={paginationKey} | ||
| pagination={pagination} | ||
| setPagination={setPagination} | ||
| queryParams={queryParams} | ||
| setTotalCount={setTotalCount} | ||
| /> | ||
| )} | ||
| {viewFormat === FORMAT_CALENDAR && ( | ||
| <EventCalendar | ||
| pageDispatchers={pageDispatchers} | ||
| queryParams={queryParams} | ||
| setTotalCount={setTotalCount} | ||
| /> | ||
| )} | ||
| {viewFormat === FORMAT_MAP && ( | ||
| <EventMap | ||
| pageDispatchers={pageDispatchers} | ||
| queryParams={queryParams} | ||
| setTotalCount={setTotalCount} | ||
| mapId={mapId} | ||
| width={width} | ||
| height={height} | ||
| marginBottom={marginBottom} | ||
| /> | ||
| )} | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ) | ||
| } | ||
|
|
||
| EventCollection.propTypes = { | ||
| pageDispatchers: PageDispatchersPropType, | ||
| paginationKey: PropTypes.string, | ||
| pagination: PropTypes.object.isRequired, | ||
| setPagination: PropTypes.func.isRequired, | ||
| viewFormats: PropTypes.arrayOf(PropTypes.string), | ||
| queryParams: PropTypes.object, | ||
| setTotalCount: PropTypes.func, | ||
| mapId: PropTypes.string, | ||
| width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), | ||
| height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]), | ||
| marginBottom: PropTypes.oneOfType([PropTypes.number, PropTypes.string]) | ||
| } | ||
|
|
||
| EventCollection.defaultProps = { | ||
| viewFormats: [FORMAT_TABLE, FORMAT_SUMMARY, FORMAT_CALENDAR, FORMAT_MAP] | ||
| } | ||
|
|
||
| const mapDispatchToProps = (dispatch, ownProps) => { | ||
| const pageDispatchers = mapPageDispatchersToProps(dispatch, ownProps) | ||
| return { | ||
| setPagination: (pageKey, pageNum) => | ||
| dispatch(setPagination(pageKey, pageNum)), | ||
| ...pageDispatchers | ||
| } | ||
| } | ||
|
|
||
| const mapStateToProps = (state, ownProps) => ({ | ||
| pagination: state.pagination | ||
| }) | ||
|
|
||
| export default connect(mapStateToProps, mapDispatchToProps)(EventCollection) |
Oops, something went wrong.