antoinepiron
bbbcf9f586
Adds necessary dependencies including axios and react-native-calendars to pnpm-lock.yaml. Replit-Commit-Author: Agent Replit-Commit-Session-Id: 7b0991ce-c7b8-4c82-9acc-fd3f9e762a01 Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Event-Id: dc1266fa-8375-43e1-aca0-9df31350f647 Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/86064bd6-c937-4ca5-a5bf-bbef5749fb60/7b0991ce-c7b8-4c82-9acc-fd3f9e762a01/kWnlAIM Replit-Helium-Checkpoint-Created: true
51 lines
1.4 KiB
TypeScript
51 lines
1.4 KiB
TypeScript
import React from "react";
|
|
import { StyleSheet, Text, View } from "react-native";
|
|
import { useColors } from "@/hooks/useColors";
|
|
|
|
type PostStatus = "QUEUE" | "PUBLISHED" | "ERROR" | "DRAFT";
|
|
|
|
interface StatusBadgeProps {
|
|
status: PostStatus;
|
|
}
|
|
|
|
export function StatusBadge({ status }: StatusBadgeProps) {
|
|
const colors = useColors();
|
|
|
|
const config: Record<PostStatus, { bg: string; text: string; label: string }> = {
|
|
QUEUE: { bg: colors.warning + "25", text: colors.warning, label: "Queue" },
|
|
PUBLISHED: { bg: colors.success + "25", text: colors.success, label: "Published" },
|
|
ERROR: { bg: colors.error + "25", text: colors.error, label: "Error" },
|
|
DRAFT: { bg: colors.muted, text: colors.mutedForeground, label: "Draft" },
|
|
};
|
|
|
|
const { bg, text, label } = config[status] ?? config.DRAFT;
|
|
|
|
return (
|
|
<View style={[styles.badge, { backgroundColor: bg }]}>
|
|
<View style={[styles.dot, { backgroundColor: text }]} />
|
|
<Text style={[styles.label, { color: text }]}>{label}</Text>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create({
|
|
badge: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
paddingHorizontal: 8,
|
|
paddingVertical: 3,
|
|
borderRadius: 20,
|
|
gap: 4,
|
|
},
|
|
dot: {
|
|
width: 5,
|
|
height: 5,
|
|
borderRadius: 3,
|
|
},
|
|
label: {
|
|
fontSize: 11,
|
|
fontFamily: "Inter_600SemiBold",
|
|
letterSpacing: 0.3,
|
|
},
|
|
});
|