mirror of
https://github.com/urosran/cally.git
synced 2025-07-09 22:57:16 +00:00
86 lines
2.7 KiB
TypeScript
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>
|
|
);
|
|
} |