From 3697924c3c82517ee1663a9e96bb8cfb8e4553e3 Mon Sep 17 00:00:00 2001 From: ztefanie Date: Tue, 10 Oct 2023 09:49:14 +0200 Subject: [PATCH 1/3] 2031: Refactor getDate method --- api-client/src/models/DateModel.ts | 17 +++++++++++++++++ native/src/components/EventListItem.tsx | 24 ++++++++++++------------ web/src/components/EventListItem.tsx | 24 ++++++++++++------------ 3 files changed, 41 insertions(+), 24 deletions(-) diff --git a/api-client/src/models/DateModel.ts b/api-client/src/models/DateModel.ts index ab7e4fb8c5..53bbbe5570 100644 --- a/api-client/src/models/DateModel.ts +++ b/api-client/src/models/DateModel.ts @@ -3,6 +3,7 @@ import { RRule as RRuleType } from 'rrule' const MAX_RECURRENCE_YEARS = 5 +export type EventIcon = 'CalendarTodayRecurringIcon' | 'CalendarRecurringIcon' | 'CalendarTodayIcon' class DateModel { _startDate: DateTime _endDate: DateTime @@ -101,6 +102,22 @@ class DateModel { return `${localizedStartDate} - ${localizedEndDate.toFormat(format)}` } + getDateIcon(): { icon: EventIcon; label: string } | null { + const isRecurring = this.hasMoreRecurrencesThan(1) + const isToday = this.isToday + + if (isRecurring && isToday) { + return { icon: 'CalendarTodayRecurringIcon', label: 'todayRecurring' } + } + if (isRecurring) { + return { icon: 'CalendarRecurringIcon', label: 'recurring' } + } + if (isToday) { + return { icon: 'CalendarTodayIcon', label: 'today' } + } + return null + } + private rruleToDateTime(date: Date): DateTime { const dateTime = DateTime.fromJSDate(date) // rrule is not correctly handling timezones and always returning local time in the shape of UTC diff --git a/native/src/components/EventListItem.tsx b/native/src/components/EventListItem.tsx index 89ac5042f4..121aa01bc2 100644 --- a/native/src/components/EventListItem.tsx +++ b/native/src/components/EventListItem.tsx @@ -4,6 +4,7 @@ import { SvgProps } from 'react-native-svg' import styled from 'styled-components/native' import { DateModel, EventModel, parseHTML } from 'api-client' +import { EventIcon } from 'api-client/src/models/DateModel' import { CalendarRecurringIcon, @@ -25,19 +26,18 @@ const Description = styled.Text` const placeholderThumbnails = [EventThumbnailPlaceholder1, EventThumbnailPlaceholder2, EventThumbnailPlaceholder3] const getDateIcon = (date: DateModel): { icon: JSXElementConstructor; label: string } | null => { - const isRecurring = date.hasMoreRecurrencesThan(1) - const isToday = date.isToday - - if (isRecurring && isToday) { - return { icon: CalendarTodayRecurringIcon, label: 'todayRecurring' } - } - if (isRecurring) { - return { icon: CalendarRecurringIcon, label: 'recurring' } - } - if (isToday) { - return { icon: CalendarTodayIcon, label: 'today' } + const nativeIcons: { [key in EventIcon]: JSXElementConstructor } = { + CalendarTodayRecurringIcon, + CalendarRecurringIcon, + CalendarTodayIcon, } - return null + const iconToUse = date.getDateIcon() + return iconToUse + ? { + icon: nativeIcons[iconToUse.icon], + label: iconToUse.label, + } + : null } type EventListItemProps = { diff --git a/web/src/components/EventListItem.tsx b/web/src/components/EventListItem.tsx index 3396725e8c..88b8730e59 100644 --- a/web/src/components/EventListItem.tsx +++ b/web/src/components/EventListItem.tsx @@ -3,6 +3,7 @@ import { useTranslation } from 'react-i18next' import styled from 'styled-components' import { DateModel, EventModel, getExcerpt } from 'api-client' +import { EventIcon } from 'api-client/src/models/DateModel' import { CalendarRecurringIcon, @@ -38,19 +39,18 @@ const getEventPlaceholder = (path: string): string => { } const getDateIcon = (date: DateModel): { icon: string; tooltip: string } | null => { - const isRecurring = date.hasMoreRecurrencesThan(1) - const isToday = date.isToday - - if (isRecurring && isToday) { - return { icon: CalendarTodayRecurringIcon, tooltip: 'todayRecurring' } - } - if (isRecurring) { - return { icon: CalendarRecurringIcon, tooltip: 'recurring' } - } - if (isToday) { - return { icon: CalendarTodayIcon, tooltip: 'today' } + const webIcons: { [key in EventIcon]: string } = { + CalendarTodayRecurringIcon, + CalendarRecurringIcon, + CalendarTodayIcon, } - return null + const iconToUse = date.getDateIcon() + return iconToUse + ? { + icon: webIcons[iconToUse.icon], + tooltip: iconToUse.label, + } + : null } const EventListItem = ({ event, languageCode }: EventListItemProps): ReactElement => { From 164bfd556a3a83e72071941cff5aadab9a42a09c Mon Sep 17 00:00:00 2001 From: ztefanie Date: Tue, 10 Oct 2023 10:26:13 +0200 Subject: [PATCH 2/3] 2031: Small adjustments --- api-client/src/index.ts | 2 +- api-client/src/models/DateModel.ts | 5 +++-- native/src/components/EventListItem.tsx | 7 +++---- web/src/components/EventListItem.tsx | 7 +++---- 4 files changed, 10 insertions(+), 11 deletions(-) diff --git a/api-client/src/index.ts b/api-client/src/index.ts index fc71734c0d..bda5b2e581 100644 --- a/api-client/src/index.ts +++ b/api-client/src/index.ts @@ -101,7 +101,7 @@ export { prepareFeatureLocations, prepareFeatureLocation } from './utils/geoJson export { default as CategoriesMapModel } from './models/CategoriesMapModel' export { default as CategoryModel } from './models/CategoryModel' export { default as CityModel } from './models/CityModel' -export { default as DateModel } from './models/DateModel' +export { default as DateModel, DateIcon } from './models/DateModel' export { default as EventModel } from './models/EventModel' export { default as LocalNewsModel } from './models/LocalNewsModel' export { default as TunewsModel } from './models/TunewsModel' diff --git a/api-client/src/models/DateModel.ts b/api-client/src/models/DateModel.ts index 53bbbe5570..fc3eee0c6a 100644 --- a/api-client/src/models/DateModel.ts +++ b/api-client/src/models/DateModel.ts @@ -3,7 +3,8 @@ import { RRule as RRuleType } from 'rrule' const MAX_RECURRENCE_YEARS = 5 -export type EventIcon = 'CalendarTodayRecurringIcon' | 'CalendarRecurringIcon' | 'CalendarTodayIcon' +export type DateIcon = 'CalendarTodayRecurringIcon' | 'CalendarRecurringIcon' | 'CalendarTodayIcon' + class DateModel { _startDate: DateTime _endDate: DateTime @@ -102,7 +103,7 @@ class DateModel { return `${localizedStartDate} - ${localizedEndDate.toFormat(format)}` } - getDateIcon(): { icon: EventIcon; label: string } | null { + getDateIcon(): { icon: DateIcon; label: string } | null { const isRecurring = this.hasMoreRecurrencesThan(1) const isToday = this.isToday diff --git a/native/src/components/EventListItem.tsx b/native/src/components/EventListItem.tsx index 121aa01bc2..5c7e13d4ad 100644 --- a/native/src/components/EventListItem.tsx +++ b/native/src/components/EventListItem.tsx @@ -3,8 +3,7 @@ import { useTranslation } from 'react-i18next' import { SvgProps } from 'react-native-svg' import styled from 'styled-components/native' -import { DateModel, EventModel, parseHTML } from 'api-client' -import { EventIcon } from 'api-client/src/models/DateModel' +import { DateModel, DateIcon, EventModel, parseHTML } from 'api-client' import { CalendarRecurringIcon, @@ -26,7 +25,7 @@ const Description = styled.Text` const placeholderThumbnails = [EventThumbnailPlaceholder1, EventThumbnailPlaceholder2, EventThumbnailPlaceholder3] const getDateIcon = (date: DateModel): { icon: JSXElementConstructor; label: string } | null => { - const nativeIcons: { [key in EventIcon]: JSXElementConstructor } = { + const icons: { [key in DateIcon]: JSXElementConstructor } = { CalendarTodayRecurringIcon, CalendarRecurringIcon, CalendarTodayIcon, @@ -34,7 +33,7 @@ const getDateIcon = (date: DateModel): { icon: JSXElementConstructor; const iconToUse = date.getDateIcon() return iconToUse ? { - icon: nativeIcons[iconToUse.icon], + icon: icons[iconToUse.icon], label: iconToUse.label, } : null diff --git a/web/src/components/EventListItem.tsx b/web/src/components/EventListItem.tsx index 88b8730e59..cf8fce65e1 100644 --- a/web/src/components/EventListItem.tsx +++ b/web/src/components/EventListItem.tsx @@ -2,8 +2,7 @@ import React, { ReactElement } from 'react' import { useTranslation } from 'react-i18next' import styled from 'styled-components' -import { DateModel, EventModel, getExcerpt } from 'api-client' -import { EventIcon } from 'api-client/src/models/DateModel' +import { DateModel, DateIcon, EventModel, getExcerpt } from 'api-client' import { CalendarRecurringIcon, @@ -39,7 +38,7 @@ const getEventPlaceholder = (path: string): string => { } const getDateIcon = (date: DateModel): { icon: string; tooltip: string } | null => { - const webIcons: { [key in EventIcon]: string } = { + const icons: { [key in DateIcon]: string } = { CalendarTodayRecurringIcon, CalendarRecurringIcon, CalendarTodayIcon, @@ -47,7 +46,7 @@ const getDateIcon = (date: DateModel): { icon: string; tooltip: string } | null const iconToUse = date.getDateIcon() return iconToUse ? { - icon: webIcons[iconToUse.icon], + icon: icons[iconToUse.icon], tooltip: iconToUse.label, } : null From 73fa804258dc789d9ac5f6c5bfca87e6546b5ba8 Mon Sep 17 00:00:00 2001 From: ztefanie Date: Tue, 10 Oct 2023 12:36:56 +0200 Subject: [PATCH 3/3] 2031: Fix import --- api-client/src/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/api-client/src/index.ts b/api-client/src/index.ts index bda5b2e581..af13969f12 100644 --- a/api-client/src/index.ts +++ b/api-client/src/index.ts @@ -101,7 +101,7 @@ export { prepareFeatureLocations, prepareFeatureLocation } from './utils/geoJson export { default as CategoriesMapModel } from './models/CategoriesMapModel' export { default as CategoryModel } from './models/CategoryModel' export { default as CityModel } from './models/CityModel' -export { default as DateModel, DateIcon } from './models/DateModel' +export { default as DateModel, type DateIcon } from './models/DateModel' export { default as EventModel } from './models/EventModel' export { default as LocalNewsModel } from './models/LocalNewsModel' export { default as TunewsModel } from './models/TunewsModel'