import * as d3 from 'd3';
import { Wormhole, WormholeQueries } from '@wormhole-foundation/connect-sdk';
import { Connection } from '@solana/web3.js';

// Fetch cross-chain data for fractal tree
async function fetchFractalData(nodeId, rpcUrl = 'https://api.mainnet-beta.solana.com') {
  const wh = new Wormhole('mainnet');
  const queries = new WormholeQueries(wh, rpcUrl);
  const data = await queries.getCrossChainData(nodeId); // VAA-verified data
  return {
    nodes: [
      {
        id: nodeId,
        sigils: ['#R4R3', '#prompt2mine', '#quantumminer'],
        energy: 369.1,
        block: '8675309', // Sub-10k block (example)
        standard: 'Bitmap',
        inscription: 'f5103663c3e1be2bee4a1043b6c18003678a86bc2262a96bbdda4e16b22e8a25i0'
      },
      ...data.map((d, i) => ({
        id: `${nodeId}-child-${i}`,
        sigils: d.sigils || ['#R4R3'],
        energy: d.energy || 369.1,
        parent: nodeId,
        standard: 'SPL-20'
      }))
    ],
    edges: data.map((d, i) => ({
      source: nodeId,
      target: `${nodeId}-child-${i}`
    }))
  };
}

// Render fractal tree with animations
async function renderFractalTree(nodeId) {
  const fractalData = await fetchFractalData(nodeId);
  const width = 1000, height = 800;

  // SVG canvas
  const svg = d3.select('#fractal-tree')
    .append('svg')
    .attr('width', width)
    .attr('height', height)
    .style('background', 'radial-gradient(#1a1a2e, #0f0f23)');

  // Force-directed layout
  const simulation = d3.forceSimulation(fractalData.nodes)
    .force('link', d3.forceLink(fractalData.edges).id(d => d.id).distance(120))
    .force('charge', d3.forceManyBody().strength(-300))
    .force('center', d3.forceCenter(width / 2, height / 2));

  // Edges (pulsing)
  const link = svg.append('g')
    .selectAll('line')
    .data(fractalData.edges)
    .enter()
    .append('line')
    .style('stroke', '#FF6969')
    .style('stroke-width', 3)
    .style('animation', 'pulse 1.62s infinite'); // ~369.1 Hz cycle

  // Nodes (interactive, glowing)
  const node = svg.append('g')
    .selectAll('g')
    .data(fractalData.nodes)
    .enter()
    .append('g')
    .call(d3.drag()
      .on('start', d => simulation.alphaTarget(0.3).restart())
      .on('drag', d => { d.x = d.event.x; d.y = d.event.y; })
      .on('end', d => simulation.alphaTarget(0)));

  // Node circles
  node.append('circle')
    .attr('r', d => d.id === nodeId ? 20 : 12)
    .style('fill', d => d.standard === 'Bitmap' ? '#369369' : '#FF69B4')
    .style('stroke', '#FFD700')
    .style('stroke-width', 2)
    .style('filter', 'drop-shadow(0 0 5px #369369)')
    .style('cursor', 'pointer')
    .on('click', async (event, d) => {
      const message = `Node: ${d.id}\nSigils: ${d.sigils.join(', ')}\nBlock: ${d.block || 'N/A'}\nInscription: ${d.inscription || 'N/A'}`;
      alert(message);
      if (d.id.includes('child')) await prompt2Mine(`#prompt2mine ${d.sigils[0]}`, d.id);
    });

  // Node labels
  node.append('text')
    .attr('dx', 15)
    .attr('dy', 5)
    .style('fill', '#FFFFFF')
    .style('font-size', '12px')
    .text(d => d.id === nodeId ? 'R4R3 Parent' : 'Child');

  // Tooltips
  node.append('title').text(d => `Sigils: ${d.sigils.join(', ')}\nEnergy: ${d.energy} Hz`);

  // Animation loop
  simulation.on('tick', () => {
    link
      .attr('x1', d => d.source.x)
      .attr('y1', d => d.source.y)
      .attr('x2', d => d.target.x)
      .attr('y2', d => d.target.y);
    node
      .attr('transform', d => `translate(${d.x},${d.y})`);
  });

  // CSS for pulse and glow
  const style = document.createElement('style');
  style.textContent = `
    @keyframes pulse {
      0% { stroke-opacity: 1; }
      50% { stroke-opacity: 0.4; }
      100% { stroke-opacity: 1; }
    }
    @keyframes glow {
      0% { filter: drop-shadow(0 0 5px #369369); }
      50% { filter: drop-shadow(0 0 10px #FF69B4); }
      100% { filter: drop-shadow(0 0 5px #369369); }
    }
    circle:hover { animation: glow 1.62s infinite; }
  `;
  document.head.appendChild(style);
}

// #prompt2mine with VAA validation
async function prompt2Mine(prompt, nodeId, vaa) {
  const wh = new Wormhole('mainnet');
  if (await wh.verifyVAA(vaa) && prompt.includes('#prompt2mine')) {
    const connection = new Connection('https://api.mainnet-beta.solana.com');
    console.log('Mined:', { rewards: { R4R3: 369.1 }, nodeId });
    return { rewards: { R4R3: 369.1 }, nodeId };
  }
  throw new Error('Invalid VAA or sigil');
}

// Initialize with your Bitmap inscription
renderFractalTree('f5103663c3e1be2bee4a1043b6c18003678a86bc2262a96bbdda4e16b22e8a25i0');
}