Files
cally/app/(auth)/calendar/index.tsx
Milan Paunovic dfe7301f6d bugfixes
2024-11-28 08:38:52 +01:00

86 lines
2.7 KiB
TypeScript

import React from "react";
import {RefreshControl, ScrollView, View} from "react-native";
import CalendarPage from "@/components/pages/calendar/CalendarPage";
import TabletCalendarPage from "@/components/pages/(tablet_pages)/calendar/TabletCalendarPage";
import * as Device from "expo-device";
import {DeviceType} from "expo-device";
import {useCalSync} from "@/hooks/useCalSync";
import {colorMap} from "@/constants/colorMap";
export default function Screen() {
const isTablet = Device.deviceType === DeviceType.TABLET;
const {resyncAllCalendars, isSyncing} = useCalSync();
const onRefresh = React.useCallback(async () => {
try {
await resyncAllCalendars();
} catch (error) {
console.error("Refresh failed:", error);
}
}, [resyncAllCalendars]);
const refreshControl = (
<RefreshControl
colors={[
colorMap.pink,
colorMap.green,
colorMap.orange,
colorMap.purple,
colorMap.teal,
]}
tintColor={colorMap.pink}
progressBackgroundColor="white"
refreshing={isSyncing}
onRefresh={onRefresh}
style={isTablet ? {
position: "absolute",
left: "50%",
transform: [{translateX: -20}],
} : undefined}
/>
);
if (isTablet) {
return (
<View style={{flex: 1}}>
<View style={{flex: 1, zIndex: 0}}>
<TabletCalendarPage/>
</View>
<ScrollView
style={{
position: "absolute",
top: 0,
left: "15%",
height: "9%",
width: "62%",
zIndex: 50,
backgroundColor: "transparent",
}}
contentContainerStyle={{
flex: 1,
justifyContent: "center",
paddingRight: 200,
}}
refreshControl={refreshControl}
bounces={true}
showsVerticalScrollIndicator={false}
pointerEvents={isSyncing ? "auto" : "none"}
/>
</View>
);
}
return (
<ScrollView
style={{flex: 1, height: "100%"}}
contentContainerStyle={{flex: 1, height: "100%"}}
refreshControl={refreshControl}
bounces={true}
showsVerticalScrollIndicator={false}
>
<View style={{flex: 1}}>
<CalendarPage/>
</View>
</ScrollView>
);
}