import { useCallback, useMemo } from 'react'; import { ButtonSpec } from '../types'; import { _ } from '@joplin/lib/locale'; import { ButtonRowProps } from '../types'; import time from '@joplin/lib/time'; import { Keyboard, Platform } from 'react-native'; export interface ActionButtonRowProps extends ButtonRowProps { keyboardVisible: boolean; hasSoftwareKeyboard: boolean; } const useActionButtons = (props: ActionButtonRowProps) => { const onDismissKeyboard = useCallback(() => { // Keyboard.dismiss() doesn't dismiss the keyboard if it's editing the WebView. Keyboard.dismiss(); // As such, dismiss the keyboard by sending a message to the View. props.editorControl.hideKeyboard(); }, [props.editorControl]); const onSearch = useCallback(() => { if (props.searchState.dialogVisible) { props.editorControl.searchControl.hideSearch(); } else { props.editorControl.searchControl.showSearch(); } }, [props.editorControl, props.searchState.dialogVisible]); const onAttach = useCallback(() => { onDismissKeyboard(); props.onAttach(); }, [props.onAttach, onDismissKeyboard]); return useMemo(() => { const actionButtons: ButtonSpec[] = []; actionButtons.push({ icon: 'fa calendar-plus', description: _('Insert time'), onPress: () => { props.editorControl.insertText(time.formatDateToLocal(new Date())); }, disabled: props.readOnly, }); actionButtons.push({ icon: 'material attachment', description: _('Attach'), onPress: onAttach, disabled: props.readOnly, }); actionButtons.push({ icon: 'material search', description: ( props.searchState.dialogVisible ? _('Close') : _('Find and replace') ), active: props.searchState.dialogVisible, onPress: onSearch, priority: -3, disabled: props.readOnly, }); actionButtons.push({ icon: 'material keyboard-hide', description: _('Hide keyboard'), disabled: !props.keyboardVisible, visible: props.hasSoftwareKeyboard && Platform.OS === 'ios', onPress: onDismissKeyboard, priority: -3, }); return actionButtons; }, [ props.editorControl, props.keyboardVisible, props.hasSoftwareKeyboard, props.readOnly, props.searchState.dialogVisible, onAttach, onDismissKeyboard, onSearch, ]); }; export default useActionButtons;