ammar/cally
1
0
Fork 0
mirror of https://github.com/urosran/cally.git synced 2026-10-23 07:57:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

Notifications sorting, modal fixes

Browse Source
This commit is contained in:
Milan Paunovic
2024-12-15 18:45:04 +01:00
parent 56f37cef94
commit 72aa06ad22
5 changed files with 52 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/pages/calendar/DetailedCalendar.tsx
+2 -1
View File
@@ -50,7 +50,7 @@ export const DetailedCalendar: React.FC<EventCalendarProps> = ({calendarHeight,
}), []);
const containerProps = useMemo(() => ({
hourWidth: 60,
hourWidth: 70,
allowPinchToZoom: true,
useHaptic: true,
scrollToNow: true,
@@ -84,6 +84,7 @@ export const DetailedCalendar: React.FC<EventCalendarProps> = ({calendarHeight,
{...containerProps}
numberOfDays={numberOfDays}
calendarWidth={calendarWidth}
onDateChanged={debouncedOnDateChanged}
firstDay={firstDay}
events={formattedEvents ?? []}
components/pages/calendar/ManuallyAddEventModal.tsx
+48 -29
View File
@@ -113,7 +113,7 @@ export const ManuallyAddEventModal = () => {
}
const baseDate = editEvent?.end ?? initialDate ?? new Date();
return addHours(startOfHour(baseDate), 1);
return addHours(baseDate, 1);
});
const [startDate, setStartDate] = useState(initialDate ?? new Date());
const [endDate, setEndDate] = useState(
@@ -162,7 +162,7 @@ export const ManuallyAddEventModal = () => {
}
const baseDate = editEvent?.end ?? initialDate ?? new Date();
return addHours(startOfHour(baseDate), 1);
return addHours(baseDate, 1);
});
setStartDate(initialDate ?? new Date());
@@ -356,6 +356,14 @@ export const ManuallyAddEventModal = () => {
newDate.setHours(currentDate.getHours());
newDate.setMinutes(currentDate.getMinutes());
setDate(newDate);
if (isStart && newDate > endDate) {
const newEndDate = new Date(newDate);
newEndDate.setHours(endDate.getHours());
newEndDate.setMinutes(endDate.getMinutes());
setEndDate(newEndDate);
}
onDismiss();
}}
theme={{
@@ -397,18 +405,18 @@ export const ManuallyAddEventModal = () => {
</View>
</View>
<TouchableOpacity
onPress={() => setShowStartDatePicker(true)}
style={styles.dateButton}
>
<View row centerV spread paddingR-30>
<View row centerV>
<Feather name="calendar" size={25} color="#919191"/>
<View row marginB-10 spread centerV>
<View row centerV>
<Feather name="calendar" size={25} color="#919191"/>
<TouchableOpacity onPress={() => setShowStartDatePicker(true)}>
<Text marginL-8 style={styles.dateText}>
{format(startDate, 'MMM d, yyyy')}
</Text>
</View>
{!isAllDay && (
</TouchableOpacity>
</View>
{!isAllDay && (
<View right marginR-30>
<DateTimePicker
value={startTime}
onChange={(time) => {
@@ -419,24 +427,24 @@ export const ManuallyAddEventModal = () => {
minuteInterval={5}
mode="time"
timeFormat="HH:mm"
style={styles.timePicker}
style={[styles.timePicker]}
/>
)}
</View>
</TouchableOpacity>
</View>
)}
</View>
{!isAllDay && (
<TouchableOpacity
onPress={() => setShowEndDatePicker(true)}
style={styles.dateButton}
>
<View row centerV spread paddingR-30>
<View row centerV>
<Feather name="calendar" size={25} color="#919191"/>
<View row marginB-10 spread centerV>
<View row centerV>
<Feather name="calendar" size={25} color="#919191"/>
<TouchableOpacity onPress={() => setShowEndDatePicker(true)}>
<Text marginL-8 style={styles.dateText}>
{format(endDate, 'MMM d, yyyy')}
</Text>
</View>
</TouchableOpacity>
</View>
<View right marginR-30>
<DateTimePicker
value={endTime}
onChange={(time) => {
@@ -453,15 +461,16 @@ export const ManuallyAddEventModal = () => {
minuteInterval={5}
mode="time"
timeFormat="HH:mm"
style={styles.timePicker}
style={[styles.timePicker]}
/>
</View>
</TouchableOpacity>
</View>
)}
{renderCalendarPicker(true, showStartDatePicker, () => setShowStartDatePicker(false))}
{renderCalendarPicker(false, showEndDatePicker, () => setShowEndDatePicker(false))}
</View>)
</View>
)
return (
<>
@@ -533,9 +542,8 @@ export const ManuallyAddEventModal = () => {
Cancel
</Text>
</TouchableOpacity>
<View row center>
<DropModalIcon onPress={close}/>
</View>
<View flexS row gap-10>
<TouchableOpacity onPress={handleSave}>
<Text
@@ -822,4 +830,15 @@ const styles = StyleSheet.create({
marginBottom: 10,
marginTop: 25,
},
timePicker: {
fontFamily: "PlusJakartaSans_500Medium",
fontSize: 16,
},
dateText: {
fontFamily: "PlusJakartaSans_500Medium",
fontSize: 16,
},
dateButton: {
marginTop: 10,
}
});
components/pages/calendar/useFormattedEvents.ts
+1 -1
View File
@@ -31,7 +31,7 @@ interface FormattedEvent {
// Precompute time constants
const DAY_IN_MS = 24 * 60 * 60 * 1000;
const PERIOD_IN_MS = 5 * DAY_IN_MS;
const PERIOD_IN_MS = 45 * DAY_IN_MS;
const TIME_ZONE = Intl.DateTimeFormat().resolvedOptions().timeZone;
// Memoize date range calculations