ammar/cally
1
0
Fork 0
mirror of https://github.com/urosran/cally.git synced 2025-11-26 16:34:54 +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

2
app/_layout.tsx
View File

@ -209,8 +209,6 @@ export default function RootLayout() {
useEffect(() => {
if (loaded) {
SplashScreen.hideAsync();
const typographies: Partial<Record<TextStyle, FontStyle>> = {};
(
[

3
components/pages/calendar/DetailedCalendar.tsx
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 ?? []}

77
components/pages/calendar/ManuallyAddEventModal.tsx
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,
}
});

2
components/pages/calendar/useFormattedEvents.ts
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

2
hooks/firebase/useGetNotifications.ts
View File

@ -35,11 +35,11 @@ export const useGetNotifications = () => {
const snapshot = await firestore()
.collection("Notifications")
.where("familyId", "==", profileData?.familyId)
.orderBy("timestamp", "desc")
.get();
return snapshot.docs.map((doc) => {
const data = doc.data() as NotificationFirestore;
return {
id: doc.id,
...data,