soconnor
14c880123c
Expo app with dashboard, time clock, invoices, and settings — native tabs, glass UI, theme-aware components, and iOS Live Activities. Co-authored-by: Cursor <cursoragent@cursor.com>
34 lines
933 B
TypeScript
34 lines
933 B
TypeScript
import { StyleSheet, Text, View } from "react-native";
|
|
|
|
import { fonts, radii, spacing } from "@/constants/theme";
|
|
import { useAppTheme } from "@/contexts/ThemeContext";
|
|
import { getStatusColor, statusLabels, type InvoiceStatus } from "@/lib/invoice-status";
|
|
|
|
export function StatusBadge({ status }: { status: InvoiceStatus }) {
|
|
const { isDark } = useAppTheme();
|
|
const color = getStatusColor(status, isDark);
|
|
|
|
return (
|
|
<View style={[styles.badge, { backgroundColor: `${color}22` }]}>
|
|
<Text style={[styles.text, { color }]}>{statusLabels[status]}</Text>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
badge: {
|
|
height: 22,
|
|
justifyContent: "center",
|
|
alignItems: "center",
|
|
paddingHorizontal: spacing.sm,
|
|
borderRadius: radii.pill,
|
|
},
|
|
text: {
|
|
fontSize: 10,
|
|
fontFamily: fonts.bodyBold,
|
|
textTransform: "uppercase",
|
|
letterSpacing: 0.4,
|
|
includeFontPadding: false,
|
|
},
|
|
});
|