byGalax
24 lines
774 B
TypeScript
24 lines
774 B
TypeScript
import { StyleSheet, Text, View } from 'react-native';
|
|
|
|
import { colors } from '../theme/colors';
|
|
|
|
// Initial-letter avatar circle. Phase 2 will swap in an image-aware
|
|
// version that prefers profile.avatarUrl when present.
|
|
export function Avatar({ name, size = 40 }: { name: string; size?: number }) {
|
|
const letter = (name.trim().charAt(0) || '?').toUpperCase();
|
|
return (
|
|
<View style={[styles.circle, { width: size, height: size, borderRadius: size / 2 }]}>
|
|
<Text style={[styles.letter, { fontSize: size * 0.45 }]}>{letter}</Text>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
circle: {
|
|
backgroundColor: colors.accentMuted,
|
|
alignItems: 'center',
|
|
justifyContent: 'center',
|
|
},
|
|
letter: { color: colors.accent, fontWeight: '700' },
|
|
});
|