🚧 Work in progress
Changes
2 files changed, +18 -7
MODIFY
app/modal.tsx
+15 -5
@@ -1,7 +1,7 @@
1
1
import React, { useRef } from 'react';
2
2
import { StyleSheet, TouchableOpacity, Platform, Dimensions, Keyboard } from 'react-native';
3
3
import { ThemedView } from '@/components/themed-view';
4
-import { router, useRouter, useLocalSearchParams } from 'expo-router';
4
+import { router, useRouter, useLocalSearchParams, useNavigation } from 'expo-router';
5
5
import { Gesture, GestureDetector } from 'react-native-gesture-handler';
6
6
import Animated, {
7
7
useSharedValue,
@@ -21,6 +21,12 @@
21
21
const colors = Colors[colorScheme];
22
22
const { taskId, projectId } = useLocalSearchParams<{ taskId?: string; projectId?: string }>();
23
23
const taskFormRef = React.useRef<any>(null);
24
+ const navigation = useNavigation();
25
+
26
+ // Check if this modal is nested (opened from another modal)
27
+ const isNested = !!projectId;
28
+ const modalHeight = isNested ? '80%' : '90%';
29
+ const modalTopOffset = isNested ? 60 : 0;
24
30
25
31
const handleClose = async () => {
26
32
// Try to save before closing
@@ -40,6 +46,8 @@
40
46
};
41
47
42
48
const pan = Gesture.Pan()
49
+ .activeOffsetY([-10, 10])
50
+ .failOffsetX([-10, 10])
43
51
.onStart(() => {
44
52
runOnJS(dismissKeyboard)();
45
53
})
@@ -56,8 +64,7 @@
56
64
} else {
57
65
translateY.value = withTiming(0);
58
66
}
59
- })
60
- .simultaneousWithExternalGesture();
67
+ });
61
68
62
69
const animatedStyle = useAnimatedStyle(() => {
63
70
return {
@@ -73,7 +80,11 @@
73
80
activeOpacity={1}
74
81
/>
75
82
<GestureDetector gesture={pan}>
76
- <Animated.View style={[styles.modal, animatedStyle]}>
83
+ <Animated.View style={[
84
+ styles.modal,
85
+ { height: modalHeight, marginTop: modalTopOffset },
86
+ animatedStyle
87
+ ]}>
77
88
<ThemedView style={styles.handleContainer}>
78
89
<ThemedView style={styles.handle} />
79
90
</ThemedView>
@@ -97,7 +108,6 @@
97
108
backgroundColor: 'rgba(0,0,0,0.4)',
98
109
},
99
110
modal: {
100
- height: '90%',
101
111
borderTopLeftRadius: 30,
102
112
borderTopRightRadius: 30,
103
113
paddingTop: 16,
MODIFY
app/project-modal.tsx
+3 -2
@@ -40,6 +40,8 @@
40
40
};
41
41
42
42
const pan = Gesture.Pan()
43
+ .activeOffsetY([-10, 10])
44
+ .failOffsetX([-10, 10])
43
45
.onStart(() => {
44
46
runOnJS(dismissKeyboard)();
45
47
})
@@ -56,8 +58,7 @@
56
58
} else {
57
59
translateY.value = withTiming(0);
58
60
}
59
- })
60
- .simultaneousWithExternalGesture();
61
+ });
61
62
62
63
const animatedStyle = useAnimatedStyle(() => {
63
64
return {