58 lines
1.5 KiB
TypeScript
58 lines
1.5 KiB
TypeScript
import { View } from "react-native";
|
|
import { StyleSheet, useUnistyles } from "react-native-unistyles";
|
|
import {
|
|
AGENT_LIFECYCLE_STATUSES,
|
|
type AgentLifecycleStatus,
|
|
} from "@server/shared/agent-lifecycle";
|
|
import { deriveSidebarStateBucket } from "@/utils/sidebar-agent-state";
|
|
import { getStatusDotColor } from "@/utils/status-dot-color";
|
|
|
|
export function AgentStatusDot({
|
|
status,
|
|
requiresAttention,
|
|
attentionReason,
|
|
pendingPermissionCount,
|
|
showInactive = false,
|
|
}: {
|
|
status: string | null | undefined;
|
|
requiresAttention: boolean | null | undefined;
|
|
attentionReason?: "finished" | "error" | "permission" | null;
|
|
pendingPermissionCount?: number;
|
|
showInactive?: boolean;
|
|
}) {
|
|
const { theme } = useUnistyles();
|
|
|
|
if (!status) {
|
|
return null;
|
|
}
|
|
if (!isAgentLifecycleStatus(status)) {
|
|
return null;
|
|
}
|
|
|
|
const bucket = deriveSidebarStateBucket({
|
|
status,
|
|
requiresAttention: Boolean(requiresAttention),
|
|
attentionReason: attentionReason ?? null,
|
|
pendingPermissionCount: pendingPermissionCount ?? 0,
|
|
});
|
|
const color = getStatusDotColor({ theme, bucket, showDoneAsInactive: showInactive });
|
|
|
|
if (!color) {
|
|
return null;
|
|
}
|
|
|
|
return <View style={[styles.dot, { backgroundColor: color }]} />;
|
|
}
|
|
|
|
function isAgentLifecycleStatus(value: string): value is AgentLifecycleStatus {
|
|
return AGENT_LIFECYCLE_STATUSES.some((status) => status === value);
|
|
}
|
|
|
|
const styles = StyleSheet.create((theme) => ({
|
|
dot: {
|
|
width: 8,
|
|
height: 8,
|
|
borderRadius: theme.borderRadius.full,
|
|
},
|
|
}));
|