- Error boundary with Macedonian fallback screen and retry button wrapping all navigation - Pull-to-refresh on all list/detail screens (home, explore, posts, chat, profile, ad detail, post detail) - Accessibility: labels on all interactive elements, roles on Pressable/Button, selectable text for user data - Deep linking: mojmajstor:// scheme configured in app.json, ad/[id] and chat/[id] routes work via Expo Router auto-routing - Pagination: cursor-based paginated queries for ads, posts, messages, chats, reviews with Load More buttons on frontend - Profile: shows customer posts with PostCard, loading/error states, create-post navigation - Auth error messages in Macedonian (Невалидни акредитиви, итн.) All UI text in Macedonian. TypeScript clean, Convex functions deployed.
50 lines
1.1 KiB
TypeScript
50 lines
1.1 KiB
TypeScript
import { View, Text } from "react-native";
|
|
import { Image } from "expo-image";
|
|
import { useTheme } from "../theme";
|
|
|
|
interface AvatarProps {
|
|
uri?: string | null;
|
|
name: string;
|
|
size?: number;
|
|
}
|
|
|
|
export function Avatar({ uri, name, size = 44 }: AvatarProps) {
|
|
const theme = useTheme();
|
|
const initials = name
|
|
.split(" ")
|
|
.map((w) => w[0])
|
|
.join("")
|
|
.toUpperCase()
|
|
.slice(0, 2);
|
|
|
|
if (uri) {
|
|
return (
|
|
<Image
|
|
accessible
|
|
accessibilityLabel={`Аватар на ${name}`}
|
|
source={uri}
|
|
style={{ width: size, height: size, borderRadius: size / 2 }}
|
|
contentFit="cover"
|
|
/>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<View
|
|
accessible
|
|
accessibilityLabel={`Аватар на ${name}`}
|
|
style={{
|
|
width: size,
|
|
height: size,
|
|
borderRadius: size / 2,
|
|
backgroundColor: theme.colors.primaryLight,
|
|
alignItems: "center",
|
|
justifyContent: "center",
|
|
}}
|
|
>
|
|
<Text style={{ color: theme.colors.primary, fontWeight: "600", fontSize: size * 0.38 }}>
|
|
{initials}
|
|
</Text>
|
|
</View>
|
|
);
|
|
} |