@livelike/react-native
Version:
LiveLike React Native package
72 lines • 2.08 kB
JavaScript
import React from 'react';
import { ActivityIndicator, Image, StyleSheet, TouchableOpacity, View } from 'react-native';
import { useApi, useMessageItemPopover, useStyles } from '../../hooks';
import { LLText } from '../LLText';
export function LLChatMessageMenuOption(_ref) {
let {
icon,
textDesc,
divider = {},
onClickApiFn,
styles: stylesProp
} = _ref;
const {
isLoading,
onApi: onClick
} = useApi(onClickApiFn);
const menuItemStyles = useStyles({
componentStylesFn: getChatMessageMenuOptionStyles,
stylesProp
});
const {
hidePopover
} = useMessageItemPopover();
return /*#__PURE__*/React.createElement(React.Fragment, null, divider.top && /*#__PURE__*/React.createElement(View, {
style: menuItemStyles.menuItemTopDivider
}), /*#__PURE__*/React.createElement(TouchableOpacity, {
onPress: () => onClick().finally(hidePopover)
}, /*#__PURE__*/React.createElement(View, {
style: menuItemStyles.menuItem
}, isLoading ? /*#__PURE__*/React.createElement(ActivityIndicator, {
size: "small",
style: menuItemStyles.menuItemIcon
}) : /*#__PURE__*/React.createElement(Image, {
style: menuItemStyles.menuItemIcon,
source: icon
}), /*#__PURE__*/React.createElement(LLText, {
style: menuItemStyles.menuItemText
}, textDesc))), divider.bottom && /*#__PURE__*/React.createElement(View, {
style: menuItemStyles.menuItemBottomDivider
}));
}
const getChatMessageMenuOptionStyles = _ref2 => {
let {
theme
} = _ref2;
return StyleSheet.create({
menuItem: {
flexDirection: 'row',
justifyContent: 'flex-start',
alignItems: 'center',
height: 45,
padding: 5
},
menuItemText: {
color: theme.text
},
menuItemIcon: {
height: 18,
width: 18,
marginRight: 10
},
menuItemTopDivider: {
borderTopWidth: 1,
borderTopColor: theme.border
},
menuItemBottomDivider: {
borderBottomWidth: 1,
borderBottomColor: theme.border
}
});
};
//# sourceMappingURL=LLChatMessageMenuOption.js.map