- 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.
30 lines
926 B
TypeScript
30 lines
926 B
TypeScript
import { View, Text } from "react-native";
|
|
import { useTheme } from "../theme";
|
|
|
|
interface BadgeProps {
|
|
label: string;
|
|
variant?: "default" | "primary" | "success" | "error";
|
|
}
|
|
|
|
export function Badge({ label, variant = "default" }: BadgeProps) {
|
|
const theme = useTheme();
|
|
|
|
const variants = {
|
|
default: { bg: theme.colors.surface, text: theme.colors.textSecondary },
|
|
primary: { bg: theme.colors.primaryLight, text: theme.colors.primary },
|
|
success: { bg: "#D1FAE5", text: "#059669" },
|
|
error: { bg: theme.colors.errorLight, text: theme.colors.error },
|
|
};
|
|
|
|
const { bg, text: textColor } = variants[variant];
|
|
|
|
return (
|
|
<View
|
|
accessible
|
|
accessibilityLabel={label}
|
|
style={{ backgroundColor: bg, paddingHorizontal: 8, paddingVertical: 4, borderRadius: theme.radius.sm }}
|
|
>
|
|
<Text style={{ color: textColor, fontSize: 12, fontWeight: "600" }}>{label}</Text>
|
|
</View>
|
|
);
|
|
} |