@sendbird/uikit-react-native
Version:
Sendbird UIKit for React Native: A feature-rich and customizable chat UI kit with messaging, channel management, and user authentication.
67 lines • 2.02 kB
JavaScript
import React from 'react';
import { Box, Icon, PressBox, Text, createStyleSheet } from '@sendbird/uikit-react-native-foundation';
import { useUIKitTheme } from '@sendbird/uikit-react-native-foundation';
import { getFileExtension, getFileType, truncate } from '@sendbird/uikit-utils';
import { useLocalization } from './../../hooks/useContext';
const ThreadParentMessageFile = props => {
const fileMessage = props.parentMessage;
if (!fileMessage) return null;
const {
STRINGS
} = useLocalization();
const {
select,
colors,
palette
} = useUIKitTheme();
const fileType = getFileType(fileMessage.type || getFileExtension(fileMessage.name));
const fileName = STRINGS.GROUP_CHANNEL.MESSAGE_BUBBLE_FILE_TITLE(fileMessage) ?? fileMessage.name;
return /*#__PURE__*/React.createElement(Box, {
style: styles.fileBubbleContainer,
backgroundColor: select({
light: palette.background100,
dark: palette.background400
})
}, /*#__PURE__*/React.createElement(PressBox, {
onPress: props.onPress,
onLongPress: props.onLongPress
}, /*#__PURE__*/React.createElement(Box, {
style: styles.iconBackground
}, /*#__PURE__*/React.createElement(Icon.File, {
fileType: fileType,
size: 24,
containerStyle: {
backgroundColor: palette.background50,
borderRadius: 8
}
}), /*#__PURE__*/React.createElement(Text, {
body3: true,
numberOfLines: 1,
color: colors.onBackground01,
style: styles.name
}, truncate(fileName, {
mode: 'mid',
maxLen: 30
})))));
};
const styles = createStyleSheet({
fileBubbleContainer: {
alignSelf: 'flex-start',
overflow: 'hidden',
flexDirection: 'row',
alignItems: 'center',
borderRadius: 16,
paddingHorizontal: 12,
paddingVertical: 8
},
iconBackground: {
flexDirection: 'row',
alignItems: 'center'
},
name: {
flexShrink: 1,
marginLeft: 8
}
});
export default ThreadParentMessageFile;
//# sourceMappingURL=ThreadParentMessage.file.js.map