/*
    Предрейсовые осмотры - мобильное приложение
    Компонент элемента меню
*/

//---------------------
//Подключение библиотек
//---------------------

const React = require('react'); //React
const { View, Pressable } = require('react-native'); //Базовые компоненты
const AppText = require('../common/AppText'); //Общий текстовый компонент
const styles = require('../../styles/menu/MenuItem.styles'); //Стили элемента меню

//-----------
//Тело модуля
//-----------

//Стиль элемента меню при нажатии
function getMenuItemPressableStyle(stylesRef, isDestructive, disabled, style) {
    return function styleFn({ pressed }) {
        return [
            stylesRef.menuItem,
            pressed && !disabled && stylesRef.menuItemPressed,
            isDestructive && stylesRef.menuItemDestructive,
            disabled && stylesRef.menuItemDisabled,
            style
        ];
    };
}

//Элемент меню
function MenuItem({ title, icon, onPress, isDestructive = false, disabled = false, style, textStyle }) {
    const handlePress = React.useCallback(() => {
        if (!disabled && typeof onPress === 'function') {
            onPress();
        }
    }, [disabled, onPress]);

    const getPressableStyle = React.useMemo(
        () => getMenuItemPressableStyle(styles, isDestructive, disabled, style),
        [isDestructive, disabled, style]
    );

    return (
        <Pressable style={getPressableStyle} onPress={handlePress} disabled={disabled}>
            <View style={styles.menuItemContent}>
                {icon ? <View style={styles.menuItemIcon}>{icon}</View> : null}
                <AppText
                    style={[styles.menuItemText, isDestructive && styles.menuItemTextDestructive, disabled && styles.menuItemTextDisabled, textStyle]}
                    numberOfLines={2}
                >
                    {title}
                </AppText>
            </View>
        </Pressable>
    );
}

//----------------
//Интерфейс модуля
//----------------

module.exports = MenuItem;
