* Initial setup for new keyboard * fix the offset calculation onMove by adding isKeyboardFullyOpened * Done with the keyboard handling implementation * Handled keyboard focus and blured state using context * Added default height for input container * Android support * Tablet state handling * Fix for refreshing offset in list * Created a default context for mention post list * Fix linter errors * Fix tests * Minor * Fix the height issue for tablet view * Review comments * Dependency fix * Reveiw comment * keyboard animation only enabled with screen on top navigation * added tests * Added extra keyboard component for emoji picker (#9328) * Added extra keyboard component * handled swipe geature for extra keyboard * scroll to bottom visible on emoji picker * Check for stale event for keyboard geature area * fix keyboard stale event for mid-gesture change swipe direction * Closing emoji picker when message priority is opened * changing to thread view closes emoji picker * Close emoij picker and keyboard when attachment icons are clicked * handle android emoji picker behaviour * Remove emoji picker code * fix tests * Address reviev comments * Test fixes * usePreventDoubleTab for race condition and corrected comment on isInputAccessoryViewMode flag * File attachments option in bottom sheet quick action (#9331) * Added extra keyboard component * handled swipe geature for extra keyboard * File attachments option in bottom sheet quick action * Updated tests * i18n * fix test * Added tests * Review comment * fix tests * Integrated Emoji picker to Extra keyboard component. (#9339) * Added extra keyboard component * handled swipe geature for extra keyboard * scroll to bottom visible on emoji picker * Fix the post input container height change issue * Added emoji picker with search functionality * keyboard height not recorded fallback to default height, set search to false closing emoji picker * fix search funcitonality in android * scroll to end bottom dismissed with pressed * Fixed the scroll issue for android * fix the flickering post input issue * Wired up the emoji picker * Added keyboard and spaceback in emoji picker * intl extract * initial cursor position and simple calculation review comment * separated grapheme to utils file * Review comments * nitpick * Fix the bottom safe area and navigation stack restore fix * Fix test * disabled emoji picker in edit post screen * change the name of the variable to name it clarier * fix the tab gap issue in andriod * disabled the emoji skin tone change on andriod * fix the input container jump issue * fix the failing test * UX review * added white space after the attachment icon * When @ or / is press open keyboard on andriod also fix the scroll issue when keyboard is open * back bottom closes emoji picker and opening keyboard jump fix * reverted code * fixed the flickering issue of input and scroll position fix * Fix the gap issue in thread * fix the warning reaminated issue when opening a channel * Fix the extra space issue between input and emoij picker * Minor fix for extra space between input and emoji picker * Fix thread view bottom safe area and gap between keyboard and searched emojis * Fix the keyboard issue in tablet * Fix the warning issue react-native-keyboard-controller * Fix tests * Fix the tablet search hight issue * Replaced the ExtraKeyboardProvider with KeyboardProvider from rnkc for permalink * Bottom sheet jump issue resolved * Search do not close after selecting emoji in search list * Added the bottom inset height in search emoji for android * fix buid issue * Fix the cancel state to emoji picker * use portals for autocomplete * fix permalink extra space in post list * Portal only for android --------- Co-authored-by: Mattermost Build <build@mattermost.com> Co-authored-by: Rahim Rahman <rahim.rahman@mattermost.com> Co-authored-by: Harshil Sharma <harshilsharma63@gmail.com> Co-authored-by: Elias Nahum <nahumhbl@gmail.com>
64 lines
2.8 KiB
TypeScript
64 lines
2.8 KiB
TypeScript
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
|
// See LICENSE.txt for license information.
|
|
|
|
import {useCallback} from 'react';
|
|
import {runOnJS, useAnimatedReaction, type SharedValue} from 'react-native-reanimated';
|
|
|
|
import type PostModel from '@typings/database/models/servers/post';
|
|
import type {FlatList} from 'react-native';
|
|
|
|
/**
|
|
* Custom hook to handle automatic scrolling when keyboard opens
|
|
* Keeps messages in the same relative position to the input container
|
|
* Only enabled on iOS - Android uses native keyboard handling
|
|
*/
|
|
export const useKeyboardScrollAdjustment = (
|
|
scrollViewRef: React.RefObject<FlatList<string | PostModel>>,
|
|
scrollPosition: SharedValue<number>,
|
|
scrollOffset: SharedValue<number>,
|
|
enabled = true,
|
|
isInputAccessoryViewMode?: SharedValue<boolean>,
|
|
isTransitioningFromCustomView?: SharedValue<boolean>,
|
|
) => {
|
|
// Callback to scroll the view (needs to be stable reference for runOnJS)
|
|
const scrollToOffset = useCallback(
|
|
(offsetValue: number, scrollValue: number) => {
|
|
scrollViewRef.current?.scrollToOffset({
|
|
offset: -offsetValue + scrollValue,
|
|
animated: false,
|
|
});
|
|
},
|
|
[scrollViewRef],
|
|
);
|
|
|
|
// Watch for scrollOffset changes and adjust scroll position accordingly
|
|
useAnimatedReaction(
|
|
() => ({
|
|
scrollOffset: scrollOffset.value,
|
|
scrollPosition: scrollPosition.value,
|
|
isInputAccessoryViewMode: isInputAccessoryViewMode?.value || false,
|
|
isTransitioning: isTransitioningFromCustomView?.value || false,
|
|
}),
|
|
(current, previous) => {
|
|
'worklet';
|
|
|
|
// Skip scroll adjustment when:
|
|
// - Input Accessory view (emoji picker) is active
|
|
// - Transitioning from custom view to keyboard (heights are same, no scroll needed)
|
|
// - scrollOffset hasn't actually changed (prevents re-scrolling after transition ends)
|
|
const scrollOffsetChanged = previous === null || Math.abs(current.scrollOffset - (previous?.scrollOffset || 0)) > 0.5;
|
|
|
|
// Don't scroll when keyboard closes - let the list naturally return to position
|
|
if (current.scrollOffset === 0) {
|
|
return;
|
|
}
|
|
|
|
// Perform scroll adjustment when keyboard is opening or height changes
|
|
// scrollPosition is preserved (not reset to 0) by keyboardAnimation.ts
|
|
if (enabled && !current.isInputAccessoryViewMode && !current.isTransitioning && scrollOffsetChanged) {
|
|
runOnJS(scrollToOffset)(current.scrollOffset, current.scrollPosition);
|
|
}
|
|
},
|
|
[scrollPosition, scrollOffset, enabled, isInputAccessoryViewMode, isTransitioningFromCustomView],
|
|
);
|
|
};
|