Antoni Nuñez Romeu
49 lines
1.0 KiB
TypeScript
49 lines
1.0 KiB
TypeScript
import React from 'react';
|
|
import { View, Text, StyleSheet } from 'react-native';
|
|
import { colors, borderRadius, spacing } from '../constants/theme';
|
|
|
|
interface StockBadgeProps {
|
|
stock: number;
|
|
}
|
|
|
|
export function StockBadge({ stock }: StockBadgeProps) {
|
|
const getBadgeStyle = () => {
|
|
if (stock === 0) return styles.danger;
|
|
if (stock < 5) return styles.warning;
|
|
return styles.success;
|
|
};
|
|
|
|
const getText = () => {
|
|
if (stock === 0) return 'Sin stock';
|
|
if (stock < 5) return `Bajo (${stock})`;
|
|
return `Disponible (${stock})`;
|
|
};
|
|
|
|
return (
|
|
<View style={[styles.badge, getBadgeStyle()]}>
|
|
<Text style={styles.text}>{getText()}</Text>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
badge: {
|
|
paddingHorizontal: spacing.sm,
|
|
paddingVertical: spacing.xs,
|
|
borderRadius: borderRadius.sm,
|
|
},
|
|
success: {
|
|
backgroundColor: '#D4EDDA',
|
|
},
|
|
warning: {
|
|
backgroundColor: '#FFF3CD',
|
|
},
|
|
danger: {
|
|
backgroundColor: '#F8D7DA',
|
|
},
|
|
text: {
|
|
fontSize: 12,
|
|
fontWeight: '600',
|
|
},
|
|
});
|