Fix planning management to match new api

This commit is contained in:
Arnaud Vergnet 2020-08-26 10:14:44 +02:00
parent dafd454a42
commit ea7321eb9d
6 changed files with 33 additions and 140 deletions

View file

@ -4,12 +4,12 @@ import * as React from 'react';
import {StyleSheet, View} from 'react-native';
import i18n from 'i18n-js';
import {Avatar, Button, Card, TouchableRipple} from 'react-native-paper';
import {getFormattedEventTime, isDescriptionEmpty} from '../../utils/Planning';
import {getTimeOnlyString, isDescriptionEmpty} from '../../utils/Planning';
import CustomHTML from '../Overrides/CustomHTML';
import type {EventType} from '../../screens/Home/HomeScreen';
import type {PlanningEventType} from '../../utils/Planning';
type PropsType = {
event?: EventType | null,
event?: PlanningEventType | null,
clickAction: () => void,
};
@ -62,19 +62,13 @@ class PreviewEventDashboardItem extends React.Component<PropsType> {
{hasImage ? (
<Card.Title
title={event.title}
subtitle={getFormattedEventTime(
event.date_begin,
event.date_end,
)}
subtitle={getTimeOnlyString(event.date_begin)}
left={getImage}
/>
) : (
<Card.Title
title={event.title}
subtitle={getFormattedEventTime(
event.date_begin,
event.date_end,
)}
subtitle={getTimeOnlyString(event.date_begin)}
/>
)}
{!isEmpty ? (

View file

@ -28,6 +28,7 @@ import MascotPopup from '../../components/Mascot/MascotPopup';
import DashboardManager from '../../managers/DashboardManager';
import type {ServiceItemType} from '../../managers/ServicesManager';
import {getDisplayEvent, getFutureEvents} from '../../utils/Home';
import type {PlanningEventType} from '../../utils/Planning';
// import DATA from "../dashboard_data.json";
const DATA_URL =
@ -49,24 +50,12 @@ export type FeedItemType = {
page_id: string,
};
export type EventType = {
id: number,
title: string,
logo: string | null,
date_begin: string,
date_end: string,
description: string,
club: string,
category_id: number,
url: string,
};
export type FullDashboardType = {
today_menu: Array<{[key: string]: {...}}>,
proximo_articles: number,
available_dryers: number,
available_washers: number,
today_events: Array<EventType>,
today_events: Array<PlanningEventType>,
available_tutorials: number,
};
@ -193,7 +182,7 @@ class HomeScreen extends React.Component<PropsType, StateType> {
* @param content
* @return {*}
*/
getDashboardEvent(content: Array<EventType>): React.Node {
getDashboardEvent(content: Array<PlanningEventType>): React.Node {
const futureEvents = getFutureEvents(content);
const displayEvent = getDisplayEvent(futureEvents);
// const clickPreviewAction = () =>

View file

@ -5,7 +5,7 @@ import {View} from 'react-native';
import {Card} from 'react-native-paper';
import i18n from 'i18n-js';
import {StackNavigationProp} from '@react-navigation/stack';
import {getDateOnlyString, getFormattedEventTime} from '../../utils/Planning';
import {getDateOnlyString, getTimeOnlyString} from '../../utils/Planning';
import DateManager from '../../managers/DateManager';
import BasicLoadingScreen from '../../components/Screens/BasicLoadingScreen';
import {apiRequest, ERROR_TYPE} from '../../utils/WebData';
@ -96,12 +96,9 @@ class PlanningDisplayScreen extends React.Component<PropsType, StateType> {
const {navigation} = this.props;
const {displayData} = this;
if (displayData == null) return null;
let subtitle = getFormattedEventTime(
displayData.date_begin,
displayData.date_end,
);
let subtitle = getTimeOnlyString(displayData.date_begin);
const dateString = getDateOnlyString(displayData.date_begin);
if (dateString !== null)
if (dateString !== null && subtitle != null)
subtitle += ` | ${DateManager.getInstance().getTranslatedDate(
dateString,
)}`;

View file

@ -12,7 +12,7 @@ import {
generateEventAgenda,
getCurrentDateString,
getDateOnlyString,
getFormattedEventTime,
getTimeOnlyString,
} from '../../utils/Planning';
import CustomAgenda from '../../components/Overrides/CustomAgenda';
import {MASCOT_STYLE} from '../../components/Mascot/Mascot';
@ -198,7 +198,7 @@ class PlanningScreen extends React.Component<PropsType, StateType> {
<Divider />
<List.Item
title={item.title}
description={getFormattedEventTime(item.date_begin, item.date_end)}
description={getTimeOnlyString(item.date_begin)}
left={(): React.Node => (
<Avatar.Image
source={{uri: item.logo}}
@ -215,7 +215,7 @@ class PlanningScreen extends React.Component<PropsType, StateType> {
<Divider />
<List.Item
title={item.title}
description={getFormattedEventTime(item.date_begin, item.date_end)}
description={getTimeOnlyString(item.date_begin)}
onPress={onPress}
/>
</View>

View file

@ -1,7 +1,7 @@
// @flow
import {stringToDate} from './Planning';
import type {EventType} from '../screens/Home/HomeScreen';
import type {PlanningEventType} from './Planning';
/**
* Gets the time limit depending on the current day:
@ -20,20 +20,6 @@ export function getTodayEventTimeLimit(): Date {
return now;
}
/**
* Gets the duration (in milliseconds) of an event
*
* @param event {EventType}
* @return {number} The number of milliseconds
*/
export function getEventDuration(event: EventType): number {
const start = stringToDate(event.date_begin);
const end = stringToDate(event.date_end);
let duration = 0;
if (start != null && end != null) duration = end - start;
return duration;
}
/**
* Gets events starting after the limit
*
@ -42,11 +28,11 @@ export function getEventDuration(event: EventType): number {
* @return {Array<Object>}
*/
export function getEventsAfterLimit(
events: Array<EventType>,
events: Array<PlanningEventType>,
limit: Date,
): Array<EventType> {
): Array<PlanningEventType> {
const validEvents = [];
events.forEach((event: EventType) => {
events.forEach((event: PlanningEventType) => {
const startDate = stringToDate(event.date_begin);
if (startDate != null && startDate >= limit) {
validEvents.push(event);
@ -55,44 +41,19 @@ export function getEventsAfterLimit(
return validEvents;
}
/**
* Gets the event with the longest duration in the given array.
* If all events have the same duration, return the first in the array.
*
* @param events
*/
export function getLongestEvent(events: Array<EventType>): EventType {
let longestEvent = events[0];
let longestTime = 0;
events.forEach((event: EventType) => {
const time = getEventDuration(event);
if (time > longestTime) {
longestTime = time;
longestEvent = event;
}
});
return longestEvent;
}
/**
* Gets events that have not yet ended/started
*
* @param events
*/
export function getFutureEvents(events: Array<EventType>): Array<EventType> {
export function getFutureEvents(
events: Array<PlanningEventType>,
): Array<PlanningEventType> {
const validEvents = [];
const now = new Date();
events.forEach((event: EventType) => {
events.forEach((event: PlanningEventType) => {
const startDate = stringToDate(event.date_begin);
const endDate = stringToDate(event.date_end);
if (startDate != null) {
if (startDate > now) validEvents.push(event);
else if (endDate != null) {
if (endDate > now || endDate < startDate)
// Display event if it ends the following day
validEvents.push(event);
}
}
if (startDate != null && startDate > now) validEvents.push(event);
});
return validEvents;
}
@ -101,23 +62,19 @@ export function getFutureEvents(events: Array<EventType>): Array<EventType> {
* Gets the event to display in the preview
*
* @param events
* @return {EventType | null}
* @return {PlanningEventType | null}
*/
export function getDisplayEvent(events: Array<EventType>): EventType | null {
export function getDisplayEvent(
events: Array<PlanningEventType>,
): PlanningEventType | null {
let displayEvent = null;
if (events.length > 1) {
const eventsAfterLimit = getEventsAfterLimit(
events,
getTodayEventTimeLimit(),
);
if (eventsAfterLimit.length > 0) {
if (eventsAfterLimit.length === 1) [displayEvent] = eventsAfterLimit;
else displayEvent = getLongestEvent(events);
} else {
displayEvent = getLongestEvent(events);
}
} else if (events.length === 1) {
[displayEvent] = events;
}
if (eventsAfterLimit.length > 0) [displayEvent] = eventsAfterLimit;
else [displayEvent] = events;
} else if (events.length === 1) [displayEvent] = events;
return displayEvent;
}

View file

@ -3,13 +3,13 @@
export type PlanningEventType = {
id: number,
title: string,
logo: string,
date_begin: string,
date_end: string,
description: string,
club: string,
category_id: number,
description: string,
place: string,
url: string,
logo: string | null,
};
// Regex used to check date string validity
@ -120,50 +120,6 @@ export function getTimeOnlyString(dateString: string): string | null {
return null;
}
/**
* Returns a string corresponding to the event start and end times in the following format:
*
* HH:MM - HH:MM
*
* If the end date is not specified or is equal to start time, only start time will be shown.
*
* If the end date is not on the same day, 23:59 will be shown as end time
*
* @param start Start time in YYYY-MM-DD HH:MM:SS format
* @param end End time in YYYY-MM-DD HH:MM:SS format
* @return {string} Formatted string or "/ - /" on error
*/
export function getFormattedEventTime(start: string, end: string): string {
let formattedStr = '/ - /';
const startDate = stringToDate(start);
const endDate = stringToDate(end);
if (
startDate !== null &&
endDate !== null &&
startDate.getTime() !== endDate.getTime()
) {
formattedStr = `${String(startDate.getHours()).padStart(2, '0')}:${String(
startDate.getMinutes(),
).padStart(2, '0')} - `;
if (
endDate.getFullYear() > startDate.getFullYear() ||
endDate.getMonth() > startDate.getMonth() ||
endDate.getDate() > startDate.getDate()
)
formattedStr += '23:59';
else
formattedStr += `${String(endDate.getHours()).padStart(2, '0')}:${String(
endDate.getMinutes(),
).padStart(2, '0')}`;
} else if (startDate !== null)
formattedStr = `${String(startDate.getHours()).padStart(2, '0')}:${String(
startDate.getMinutes(),
).padStart(2, '0')}`;
return formattedStr;
}
/**
* Checks if the given description can be considered empty.
* <br>