feat: improve chat keyboard handling and MonthSelector memory efficiency
- Add KeyboardAvoidingView with platform-specific behavior to chat screen - Implement auto-scroll to end on new messages and keyboard show - Configure keyboardDismissMode and keyboardShouldPersistTaps for better UX - Lazy-load MonthSelector data only when modal opens, clear on close - Add .env to gitignore
This commit is contained in:
@@ -323,16 +323,7 @@ const MonthSelector = ({
|
||||
const listRef = useRef<React.ComponentRef<typeof FlashList<MonthItem>>>(null);
|
||||
const INITIAL_RANGE = 12; // 12 months before and after current
|
||||
|
||||
const [monthSelectorData, setMonthSelectorData] = useState<MonthItem[]>(() =>
|
||||
generateMonths(currentYear, currentMonthIndex, INITIAL_RANGE),
|
||||
);
|
||||
|
||||
// Reset data when current month changes
|
||||
useEffect(() => {
|
||||
setMonthSelectorData(
|
||||
generateMonths(currentYear, currentMonthIndex, INITIAL_RANGE),
|
||||
);
|
||||
}, [currentYear, currentMonthIndex]);
|
||||
const [monthSelectorData, setMonthSelectorData] = useState<MonthItem[]>([]);
|
||||
|
||||
const appendMonths = (direction: "start" | "end", count: number) => {
|
||||
setMonthSelectorData((prevData) => {
|
||||
@@ -378,6 +369,10 @@ const MonthSelector = ({
|
||||
|
||||
useEffect(() => {
|
||||
if (modalVisible) {
|
||||
// Generate fresh data centered on current month
|
||||
setMonthSelectorData(
|
||||
generateMonths(currentYear, currentMonthIndex, INITIAL_RANGE),
|
||||
);
|
||||
Animated.timing(heightAnim, {
|
||||
toValue: 200,
|
||||
duration: 200,
|
||||
@@ -385,8 +380,10 @@ const MonthSelector = ({
|
||||
}).start();
|
||||
} else {
|
||||
heightAnim.setValue(0);
|
||||
// Clear data when closing
|
||||
setMonthSelectorData([]);
|
||||
}
|
||||
}, [modalVisible, heightAnim]);
|
||||
}, [modalVisible, heightAnim, currentYear, currentMonthIndex]);
|
||||
|
||||
const renderItem = ({ item }: { item: MonthItem }) => (
|
||||
<Pressable
|
||||
|
||||
Reference in New Issue
Block a user