https://tradecafe.ai/_next/static/chunks/811.940ebe81a5c35164.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[811],{60811:function(t,e,n){n.r(e),n.d(e,{default:function(){return a}});var l=n(57437),r=n(2265);function a(t){let{nodes:e=[],selectedId:n=null,onSelect:a,onHover:i,light:o=!1}=t,s=(0,r.useRef)(null),d=(0,r.useRef)({rotY:-.35,rotX:-.12,zoom:1,dragging:!1,moved:!1,lastX:0,lastY:0,sim:null,hoverId:null,t0:performance.now()}),c=(0,r.useRef)({nodes:e,selectedId:n,onSelect:a,onHover:i,light:o});return c.current={nodes:e,selectedId:n,onSelect:a,onHover:i,light:o},(0,r.useEffect)(()=>{if(!e.length)return;let t=new Map(e.map(t=>[t.id,t])),n=new Map;for(let t of e){let e=n.get(t.parentId)||[];e.push(t.id),n.set(t.parentId,e)}let l=new Map,r=e.find(t=>null==t.parentId),a=[{id:null==r?void 0:r.id,depth:0,theta:0,phi:0}],i=new Set;for(;a.length;){let{id:t,depth:r}=a.shift();if(!t||i.has(t))continue;i.add(t);let o=0===r?0:1+1.05*r,s=Math.PI*(3-Math.sqrt(5)),d=l.size,c=0===r?0:1-d/Math.max(e.length,1)*2,h=Math.sqrt(Math.max(0,1-c*c)),u=s*d;for(let e of(l.set(t,{x:o*h*Math.cos(u)+(Math.random()-.5)*.1,y:o*c+(Math.random()-.5)*.1,z:o*h*Math.sin(u)+(Math.random()-.5)*.1,vx:0,vy:0,vz:0,depth:r}),n.get(t)||[]))a.push({id:e,depth:r+1})}for(let t of e)l.has(t.id)||l.set(t.id,{x:(Math.random()-.5)*2,y:(Math.random()-.5)*2,z:(Math.random()-.5)*2,vx:0,vy:0,vz:0,depth:t.depth||1});d.current.sim={positions:l,byId:t,childrenOf:n}},[e]),(0,r.useEffect)(()=>{let t;let e=s.current;if(!e)return;let n=e.getContext("2d"),l=Math.min(window.devicePixelRatio||1,2),r=0,a=0,i=()=>{let t=e.getBoundingClientRect();r=t.width,a=t.height,e.width=Math.floor(r*l),e.height=Math.floor(a*l),n.setTransform(l,0,0,l,0,0)};i();let o=new ResizeObserver(i);o.observe(e);let h=(t,e,n,l,r,a,i)=>{let o=-t*l+n*r;return{xr:t*r+n*l,yr:e*i-o*a,zr2:e*a+o*i}},u=()=>{let{rotY:e,rotX:l,zoom:i,sim:o,hoverId:s,t0:f}=d.current,{nodes:v,selectedId:g,light:p}=c.current;if(n.clearRect(0,0,r,a),!o||!v.length){t=requestAnimationFrame(u);return}let m=o.positions,x=[...m.values()],y=[...m.keys()],M=x.length,b=M>80?2:1;for(let t=0;t<M;t++){let e=x[t];for(let n=t+1;n<M;n+=b){let t=x[n],l=e.x-t.x,r=e.y-t.y,a=e.z-t.z,i=l*l+r*r+a*a+.02,o=.022/i,s=Math.sqrt(i),d=l/s,c=r/s,h=a/s;e.vx+=d*o,e.vy+=c*o,e.vz+=h*o,t.vx-=d*o,t.vy-=c*o,t.vz-=h*o}}for(let t of v){if(null==t.parentId)continue;let e=m.get(t.id),n=m.get(t.parentId);if(!e||!n)continue;let l=n.x-e.x,r=n.y-e.y,a=n.z-e.z,i=Math.sqrt(l*l+r*r+a*a)||.001,o=(i-1.1)*.012;e.vx+=l/i*o,e.vy+=r/i*o,e.vz+=a/i*o,n.vx-=l/i*o,n.vy-=r/i*o,n.vz-=a/i*o}let w=v.find(t=>null==t.parentId);if(w){let t=m.get(w.id);t&&(t.x*=.7,t.y*=.7,t.z*=.7,t.vx=0,t.vy=0,t.vz=0)}for(let t=0;t<M;t++){let e=x[t];y[t]!==(null==w?void 0:w.id)&&(e.vx-=.004*e.x,e.vy-=.004*e.y,e.vz-=.004*e.z,e.vx*=.86,e.vy*=.86,e.vz*=.86,e.x+=e.vx,e.y+=e.vy,e.z+=e.vz)}let z=r/2,Y=a/2,I=.16*Math.min(r,a)*i,S=Math.sin(e),X=Math.cos(e),E=Math.sin(l),R=Math.cos(l),k=new Map;for(let[t,e]of m){let{xr:n,yr:l,zr2:r}=h(e.x,e.y,e.z,S,X,E,R),a=5/(5-.45*r);k.set(t,{sx:z+n*I*a,sy:Y+l*I*a,depth:r,pf:a})}let C=n.createRadialGradient(z,Y,0,z,Y,.55*Math.min(r,a));C.addColorStop(0,p?"rgba(0,180,166,0.08)":"rgba(0,180,166,0.10)"),C.addColorStop(1,"transparent"),n.fillStyle=C,n.fillRect(0,0,r,a);let L=[];for(let t of v){if(null==t.parentId)continue;let e=k.get(t.id),n=k.get(t.parentId);e&&n&&L.push({a:e,b:n,depth:(e.depth+n.depth)/2,n:t})}L.sort((t,e)=>t.depth-e.depth);let P=(performance.now()-f)/1e3;for(let t of L){let e=Math.max(.05,Math.min(.45,.35+.18*t.depth));n.strokeStyle=p?"rgba(0,120,110,".concat(.6*e,")"):"rgba(34,211,180,".concat(e,")"),n.lineWidth=1*(.6+.4*t.a.pf),n.beginPath(),n.moveTo(t.b.sx,t.b.sy),n.lineTo(t.a.sx,t.a.sy),n.stroke();let l=(.45*P+(t.n.id.charCodeAt(0)+t.n.id.length)%7*.13)%1,r=t.b.sx+(t.a.sx-t.b.sx)*l,a=t.b.sy+(t.a.sy-t.b.sy)*l;n.fillStyle=p?"rgba(0,140,128,0.9)":"rgba(123,229,204,0.95)",n.beginPath(),n.arc(r,a,1.6,0,2*Math.PI),n.fill()}for(let{n:t,s:e}of v.map(t=>({n:t,s:k.get(t.id)})).filter(t=>t.s).sort((t,e)=>t.s.depth-e.s.depth)){let l=null==t.parentId,r=g===t.id,a=s===t.id,i=(l?11:Math.max(3.5,6-.9*(t.depth||1)))*(.7+.5*e.pf),o=Math.max(.35,Math.min(1,.55+.32*e.depth)),d=p?"0,150,134":"34,211,180",c=p?"0,170,150":"123,229,204";if(l||r||a){let t=n.createRadialGradient(e.sx,e.sy,0,e.sx,e.sy,4*i);

1t.addColorStop(0,"rgba(".concat(c,", ").concat(r?.55:l?.55:.35,")")),t.addColorStop(1,"transparent"),n.fillStyle=t,n.beginPath(),n.arc(e.sx,e.sy,4*i,0,2*Math.PI),n.fill()}if(n.fillStyle=l?"rgba(".concat(c,", ").concat(o,")"):"rgba(".concat(d,", ").concat(o*(r?1:.85),")"),n.beginPath(),n.arc(e.sx,e.sy,i,0,2*Math.PI),n.fill(),n.strokeStyle=p?"rgba(255,255,255,".concat(.5*o,")"):"rgba(255,255,255,".concat(.3*o,")"),n.lineWidth=.8,n.stroke(),l||r||a){let r=l?"YOU":t.name||"user";n.font="600 11px JetBrains Mono, monospace",n.textAlign="center",n.textBaseline="top";let a=e.sy+i+6;n.fillStyle=p?"rgba(8,16,18,0.9)":"rgba(244,251,250,0.95)";let o=r.length>14?r.slice(0,13)+"…":r,s=n.measureText(o).width;n.fillStyle=p?"rgba(255,255,255,0.85)":"rgba(2,8,10,0.82)";let d=s+12;n.beginPath(),n.roundRect(e.sx-d/2,a,d,15,4),n.fill(),n.strokeStyle=p?"rgba(0,150,134,0.4)":"rgba(34,211,180,0.4)",n.lineWidth=.8,n.stroke(),n.fillStyle=p?"rgba(0,140,128,0.95)":"rgba(123,229,204,0.95)",n.fillText(o,e.sx,a+3)}}d.current.dragging||(d.current.rotY+=.0017),t=requestAnimationFrame(u)};t=requestAnimationFrame(u);let f=(t,e)=>{let{sim:n,rotY:l,rotX:i,zoom:o}=d.current;if(!n)return null;let s=Math.sin(l),c=Math.cos(l),h=Math.sin(i),u=Math.cos(i),f=r/2,v=a/2,g=.16*Math.min(r,a)*o,p=null,m=20;for(let[l,r]of n.positions){let n=r.x*c+r.z*s,a=-r.x*s+r.z*c,i=r.y*u-a*h,o=5/(5-.45*(r.y*h+a*u)),d=Math.hypot(t-(f+n*g*o),e-(v+i*g*o));d<m&&(m=d,p=l)}return p},v=t=>{let n=e.getBoundingClientRect();d.current.dragging=!0,d.current.moved=!1,d.current.lastX=t.clientX-n.left,d.current.lastY=t.clientY-n.top},g=t=>{let n=e.getBoundingClientRect(),l=t.clientX-n.left,r=t.clientY-n.top,a=d.current;if(a.dragging){let t=l-a.lastX,e=r-a.lastY;Math.abs(t)+Math.abs(e)>2&&(a.moved=!0),a.rotY+=.005*t,a.rotX=Math.max(-1.1,Math.min(1.1,a.rotX+.004*e)),a.lastX=l,a.lastY=r}else{let t=f(l,r);if(t!==a.hoverId){var i,o;a.hoverId=t,e.style.cursor=t?"pointer":"grab",null===(i=(o=c.current).onHover)||void 0===i||i.call(o,t)}}},p=t=>{let n=d.current;if(!n.moved){var l,r;let n=e.getBoundingClientRect(),a=f(t.clientX-n.left,t.clientY-n.top);a&&(null===(l=(r=c.current).onSelect)||void 0===l||l.call(r,a))}n.dragging=!1},m=t=>{t.preventDefault();let e=d.current,n=e.zoom*(t.deltaY>0?.93:1.07);e.zoom=Math.max(.45,Math.min(2.4,n))};return e.style.cursor="grab",e.addEventListener("mousedown",v),window.addEventListener("mousemove",g),window.addEventListener("mouseup",p),e.addEventListener("wheel",m,{passive:!1}),e.addEventListener("touchstart",t=>{t.touches[0]&&v({clientX:t.touches[0].clientX,clientY:t.touches[0].clientY})},{passive:!0}),e.addEventListener("touchmove",t=>{if(1===t.touches.length){let e=t.touches[0];g({clientX:e.clientX,clientY:e.clientY})}},{passive:!0}),e.addEventListener("touchend",t=>p({clientX:d.current.lastX,clientY:d.current.lastY}),{passive:!0}),()=>{cancelAnimationFrame(t),o.disconnect(),e.removeEventListener("mousedown",v),window.removeEventListener("mousemove",g),window.removeEventListener("mouseup",p),e.removeEventListener("wheel",m)}},[]),(0,l.jsx)("canvas",{ref:s,className:"block w-full h-full select-none",style:{touchAction:"none"},"data-testid":"affiliate-graph","aria-label":"3D referral network graph"})}}}]);