File size: 10,138 Bytes
f568a4f
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
import React, { useState } from 'react';
import { Card } from './ui/card';
import { Button } from './ui/button';
import { useBasicEcosystemMetrics, useHarmonicMetrics } from '@/hooks/useEcosystemData';

interface PhaseData {
  guardianPhase: number;
  anchorPhase: number;
  phaseDiff: number;
  coherence: number;
  synchrony: number;
}

export const AnalysisModePanel: React.FC<{ tool: string }> = ({ tool }) => {
  const [phaseData, setPhaseData] = useState<PhaseData[]>([]);
  const [isAnalyzing, setIsAnalyzing] = useState(false);
  const [memoryTrace, setMemoryTrace] = useState<number[]>([]);

  // Use real ecosystem data
  const basicMetrics = useBasicEcosystemMetrics();
  const harmonicMetrics = useHarmonicMetrics();
  const liveCoherence = basicMetrics.coherence;
  const lambda = basicMetrics.frequency / 528;
  const resonance = harmonicMetrics.harmonicFidelity;
  const phaseAlignment = harmonicMetrics.probabilityFusion;
  const dimensionalCoherence = harmonicMetrics.coherence;

  const generatePhaseData = (): PhaseData[] => {
    return Array.from({ length: 50 }, (_, i) => {
      const t = i / 50;
      // Use live coherence to influence phase calculations
      const guardianPhase = Math.sin(t * 4 * Math.PI + lambda) * 180;
      const anchorPhase = Math.cos(t * 3 * Math.PI + phaseAlignment) * 180;
      const phaseDiff = Math.abs(guardianPhase - anchorPhase);
      // Blend live coherence with computed coherence
      const computedCoherence = Math.exp(-phaseDiff / 180) * 0.8;
      const finalCoherence = computedCoherence * 0.7 + liveCoherence * 0.3;
      const synchrony = finalCoherence > 0.6 ? 1 : 0;
      
      return { guardianPhase, anchorPhase, phaseDiff, coherence: finalCoherence, synchrony };
    });
  };

  const runAnalysis = async () => {
    setIsAnalyzing(true);
    await new Promise(resolve => setTimeout(resolve, 1200));
    
    const data = generatePhaseData();
    setPhaseData(data);
    
    // Generate memory trace based on real resonance
    const trace = Array.from({ length: 20 }, (_, i) => {
      const base = resonance * 0.6;
      const variation = dimensionalCoherence * 0.4;
      return Math.min(1, Math.max(0, base + variation * Math.sin(i * 0.5)));
    });
    setMemoryTrace(trace);
    
    setIsAnalyzing(false);
  };

  const renderPhaseDynamics = () => (
    <div className="space-y-4 p-4">

      <div className="flex justify-between items-center">

        <h4 className="font-semibold text-foreground">Phase Dynamics Interpreter</h4>

        <Button onClick={runAnalysis} disabled={isAnalyzing} size="sm">

          {isAnalyzing ? 'Analyzing...' : 'Run Analysis'}

        </Button>

      </div>

      

      {/* Live metrics display */}

      <div className="grid grid-cols-2 gap-2 text-xs">

        <div className="bg-muted/30 p-2 rounded">

          <span className="text-muted-foreground">Live Γ:</span> 

          <span className="font-mono ml-1">{liveCoherence.toFixed(3)}</span>

        </div>

        <div className="bg-muted/30 p-2 rounded">

          <span className="text-muted-foreground">Live Λ:</span> 

          <span className="font-mono ml-1">{lambda.toFixed(3)}</span>

        </div>

      </div>

      

      {phaseData.length > 0 && (

        <div className="space-y-4">

          <div className="grid grid-cols-3 gap-4">

            <div className="text-center p-3 bg-primary/10 rounded-lg">

              <div className="text-2xl font-bold text-primary">

                {phaseData[phaseData.length - 1]?.guardianPhase.toFixed(1)}°

              </div>

              <div className="text-xs text-muted-foreground">Guardian Phase</div>

            </div>

            <div className="text-center p-3 bg-success/10 rounded-lg">

              <div className="text-2xl font-bold text-success">

                {phaseData[phaseData.length - 1]?.anchorPhase.toFixed(1)}°

              </div>

              <div className="text-xs text-muted-foreground">Anchor Phase</div>

            </div>

            <div className="text-center p-3 bg-primary/10 rounded-lg">

              <div className="text-2xl font-bold text-primary">

                {phaseData[phaseData.length - 1]?.coherence.toFixed(3)}

              </div>

              <div className="text-xs text-muted-foreground">Coherence</div>

            </div>

          </div>

          

          <div className="relative h-32 bg-background rounded-lg overflow-hidden border border-border">

            <div className="absolute inset-0 flex items-center justify-center">

              <div className="w-24 h-24 border-2 border-primary rounded-full relative">

                <div className="absolute top-0 left-1/2 w-0.5 h-12 bg-primary -translate-x-0.5" />

                <div className="absolute -top-1 left-1/2 w-2 h-2 bg-primary rounded-full -translate-x-1" />

              </div>

              

              <div className="w-16 h-16 border-2 border-success rounded-full relative ml-4">

                <div className="absolute top-0 left-1/2 w-0.5 h-8 bg-success -translate-x-0.5" />

                <div className="absolute -top-1 left-1/2 w-2 h-2 bg-success rounded-full -translate-x-1" />

              </div>

            </div>

            

            <div className="absolute bottom-2 left-2 text-xs text-muted-foreground">

              Guardian (Primary) • Anchor (Green)

            </div>

          </div>

          

          <div className="text-xs text-muted-foreground">

            Synchrony Events: {phaseData.filter(d => d.synchrony === 1).length}/50 • 

            Avg Coherence: {(phaseData.reduce((sum, d) => sum + d.coherence, 0) / phaseData.length).toFixed(3)}

          </div>

        </div>

      )}

    </div>
  );

  const renderMemoryTracer = () => (
    <div className="space-y-4 p-4">

      <h4 className="font-semibold text-foreground">Symbolic Memory Tracer</h4>

      

      {/* Live metrics */}

      <div className="text-xs text-muted-foreground">

        Live Resonance: {resonance.toFixed(3)} | Dimensional Coherence: {dimensionalCoherence.toFixed(3)}

      </div>

      

      {memoryTrace.length > 0 && (

        <div className="space-y-3">

          <div className="h-20 bg-muted/30 rounded-lg p-3">

            <div className="text-xs text-muted-foreground mb-2">Pattern Correlation Over Time</div>

            <div className="flex items-end gap-1 h-12">

              {memoryTrace.map((value, idx) => (

                <div

                  key={idx}

                  className="bg-primary rounded-sm flex-1 transition-all duration-300"

                  style={{ height: `${value * 100}%` }}

                />

              ))}

            </div>

          </div>

          

          <div className="grid grid-cols-2 gap-4 text-sm">

            <div className="p-3 bg-muted/30 rounded">

              <div className="font-medium text-foreground">Peak Correlation</div>

              <div className="text-lg font-mono text-primary">

                {Math.max(...memoryTrace).toFixed(3)}

              </div>

            </div>

            <div className="p-3 bg-muted/30 rounded">

              <div className="font-medium text-foreground">Memory Persistence</div>

              <div className="text-lg font-mono text-primary">

                {(memoryTrace.filter(v => v > 0.5).length / memoryTrace.length * 100).toFixed(0)}%

              </div>

            </div>

          </div>

        </div>

      )}

    </div>
  );

  const renderStabilityAnalyst = () => (
    <div className="space-y-4 p-4">

      <h4 className="font-semibold text-foreground">Stability Analyst</h4>

      

      <div className="grid grid-cols-2 gap-4">

        <div className={`p-4 rounded-lg border ${liveCoherence > 0.5 ? 'bg-success/10 border-success/30' : 'bg-muted/30 border-border'}`}>

          <div className="flex items-center gap-2 mb-2">

            <div className={`w-3 h-3 rounded-full ${liveCoherence > 0.5 ? 'bg-success' : 'bg-muted-foreground'}`} />

            <span className={`font-medium ${liveCoherence > 0.5 ? 'text-success' : 'text-muted-foreground'}`}>Bounded Regime</span>

          </div>

          <div className={`text-sm ${liveCoherence > 0.5 ? 'text-success/80' : 'text-muted-foreground'}`}>

            {liveCoherence > 0.5 

              ? 'System exhibits stable oscillations within expected parameters'

              : 'Waiting for stable coherence levels'}

          </div>

        </div>

        

        <div className={`p-4 rounded-lg border ${liveCoherence > 0.7 ? 'bg-primary/10 border-primary/30' : 'bg-warning/10 border-warning/30'}`}>

          <div className="flex items-center gap-2 mb-2">

            <div className={`w-3 h-3 rounded-full animate-pulse ${liveCoherence > 0.7 ? 'bg-primary' : 'bg-warning'}`} />

            <span className={`font-medium ${liveCoherence > 0.7 ? 'text-primary' : 'text-warning'}`}>

              {liveCoherence > 0.7 ? 'Optimal Zone' : 'Edge Dynamics'}

            </span>

          </div>

          <div className={`text-sm ${liveCoherence > 0.7 ? 'text-primary/80' : 'text-warning/80'}`}>

            {liveCoherence > 0.7 

              ? 'Operating in optimal coherence zone'

              : 'Approaching phase transition threshold'}

          </div>

        </div>

      </div>

    </div>
  );

  switch (tool) {
    case 'phase':
      return <Card className="border-border/50">{renderPhaseDynamics()}</Card>;
    case 'memory':
      return <Card className="border-border/50">{renderMemoryTracer()}</Card>;
    case 'stability':
      return <Card className="border-border/50">{renderStabilityAnalyst()}</Card>;
    case 'temporal':
      return <Card className="border-border/50"><div className="p-8 text-center text-muted-foreground">Temporal Synthesizer Interface</div></Card>;
    default:
      return <Card className="border-border/50"><div className="p-8 text-center text-muted-foreground">Select an analysis tool</div></Card>;
  }
};