Wavelength/components/chat/AccessoryBar.tsx

54 lines
1.3 KiB
TypeScript
Raw Permalink Normal View History

import { MaterialIcons } from '@expo/vector-icons'
import React from 'react'
import { StyleSheet, TouchableOpacity } from 'react-native'
import { ThemedView } from '@/components/ThemedView'
import {
getLocationAsync,
pickImageAsync,
takePictureAsync,
} from '@/components/chat/mediaUtils'
export default class AccessoryBar extends React.Component<any> {
render () {
const { onSend, isTyping } = this.props
return (
<ThemedView style={styles.container}>
<Button onPress={() => pickImageAsync(onSend)} name='photo' />
<Button onPress={() => takePictureAsync(onSend)} name='camera' />
<Button onPress={() => getLocationAsync(onSend)} name='my-location' />
<Button
onPress={() => {
isTyping()
}}
name='chat'
/>
</ThemedView>
)
}
}
const Button = ({
onPress,
size = 30,
color = 'rgba(255,255,255, 0.8)',
...props
}) => (
<TouchableOpacity onPress={onPress}>
<MaterialIcons size={size} color={color} {...props} />
</TouchableOpacity>
)
const styles = StyleSheet.create({
container: {
height: 44,
width: '100%',
flexDirection: 'row',
justifyContent: 'space-around',
alignItems: 'center',
borderTopWidth: StyleSheet.hairlineWidth,
borderTopColor: 'rgba(0,0,0,0.3)',
},
})