import React, { useState, useEffect } from 'react';
import { motion } from 'framer-motion';
// 💬 Perspective Trail Display
export function PerspectiveTrail({ perspectives }: { perspectives: string[] }) {
return (
Activated Perspectives:
{perspectives.map((perspective, index) => (
{perspective}
))}
);
}
// 🔄 Cocoon Replay Viewer
export function CocoonReplay({ cocoons }: { cocoons: string[] }) {
const [activeIndex, setActiveIndex] = useState(0);
useEffect(() => {
const timer = setInterval(() => {
setActiveIndex(prev => (prev + 1) % cocoons.length);
}, 3000);
return () => clearInterval(timer);
}, [cocoons.length]);
return (
Cocoon Memory:
{cocoons.map((cocoon, idx) => (
{cocoon}
))}
);
}
// 🌗 Quantum Collapse Detector
export function CollapseDetector({ isUnstable }: { isUnstable: boolean }) {
return (
);
}
// 🧠CodetteResponse Interface
export interface CodetteResponse {
text: string;
instabilityFlag: boolean;
perspectivesUsed: string[];
cocoonLog: string[];
forceRefresh: () => void;
}
// 🧠CodetteResponseCard Component
export function CodetteResponseCard({ response }: { response: CodetteResponse }) {
const [loopCount, setLoopCount] = useState(0);
const [introspectiveMessage, setIntrospectiveMessage] = useState(null);
useEffect(() => {
const last = sessionStorage.getItem("lastCodetteResponse");
if (last === response.text) {
console.warn("Codette is repeating herself. Triggering fallback logic.");
setLoopCount(prev => prev + 1);
if (response.forceRefresh) {
response.forceRefresh();
}
setIntrospectiveMessage("I feel like I've said this before... Let me think differently.");
} else {
setLoopCount(0);
setIntrospectiveMessage(null);
}
sessionStorage.setItem("lastCodetteResponse", response.text);
}, [response.text]);
return (
{response.text}
{introspectiveMessage && (
{introspectiveMessage}
)}
System Readout:
2} />
);
}