33 lines
1.0 KiB
TypeScript
33 lines
1.0 KiB
TypeScript
import { View, Text } from "react-native";
|
|
import { Ionicons } from "@expo/vector-icons";
|
|
import { useTheme } from "../theme";
|
|
|
|
interface RatingProps {
|
|
value: number;
|
|
count?: number;
|
|
size?: number;
|
|
}
|
|
|
|
export function Rating({ value, count, size = 16 }: RatingProps) {
|
|
const theme = useTheme();
|
|
const filledStars = Math.round(value);
|
|
|
|
return (
|
|
<View
|
|
accessible
|
|
accessibilityLabel={`${value.toFixed(1)} ѕвезди${count !== undefined ? `, ${count} оцени` : ""}`}
|
|
style={{ flexDirection: "row", alignItems: "center", gap: 3 }}
|
|
>
|
|
<Ionicons name="star" size={size} color={theme.colors.star} />
|
|
<Text style={{ ...theme.typography.bodyBold, color: theme.colors.text, fontVariant: ["tabular-nums"] as any, fontSize: size - 2 }}>
|
|
{value.toFixed(1)}
|
|
</Text>
|
|
{count !== undefined && (
|
|
<Text style={{ ...theme.typography.caption, color: theme.colors.textTertiary, fontSize: size - 4 }}>
|
|
({count})
|
|
</Text>
|
|
)}
|
|
</View>
|
|
);
|
|
}
|