rendering audio assets

app/mobile/src/session/conversation/topicItem/audioThumb/AudioThumb.jsx

@@ -1,6 +1,21 @@
-import { Text } from 'react-native';
+import { View, Text, Image, TouchableOpacity } from 'react-native';
+import { styles } from './AudioThumb.styled';
+import Colors from 'constants/Colors';
+import audio from 'images/audio.png';
+
+export function AudioThumb({ topicId, asset }) {
+
+  return (
+    <TouchableOpacity activeOpacity={1}>
+      <Image source={audio} style={{ borderRadius: 4, width: 92, height: 92, marginRight: 16, backgroundColor: Colors.lightgrey }} resizeMode={'cover'} />
+      { asset.label && (
+        <View style={styles.overlay}>
+          <Text style={styles.label}>{ asset.label }</Text>
+        </View>
+      )}
+    </TouchableOpacity>
+  );
 
-export function AudioThumb() {
-  return <Text>AUDIO</Text>
 }
 
+  

app/mobile/src/session/conversation/topicItem/audioThumb/AudioThumb.styled.js

@@ -0,0 +1,18 @@
+import { StyleSheet } from 'react-native';
+import { Colors } from 'constants/Colors';
+
+export const styles = StyleSheet.create({
+  overlay: {
+    top: 0,
+    width: '100%',
+    display: 'flex',
+    alignItems: 'center',
+    position: 'absolute',
+    paddingRight: 16,
+    maxHeight: 50,
+  },
+  label: {
+    textOverlay: 'center',
+  },
+})
+