https://www.mummy.finance/static/js/997.4bac72ee.chunk.js

1"use strict";(self.webpackChunkgambit_interface=self.webpackChunkgambit_interface||[]).push([[997],{23534:(e,t,n)=>{n.d(t,{Z:()=>A});var a,i,l,r=n(30168),o=n(98863),s=n(763),d=n(72791),c=n(82165),p=n(38725),h=n(28265),m=n(89683),x=n(62066),u=n(18602),v=n(57702),g=n(19913),y=n(2818),f=n(21041),j=n(41048),b=n(35667),w=n(17684),k=n(82839),I=n(90466),N=n(12891),D=n(27281),Z=n(17939),L=n(48572),S=n(41537),F=n(21503),O=n(224),K=n(58445),T=n(80184);function A(e){(0,F.Z)("(max-width:600px)");const{loading:t,title:n,data:a,description:i,height:l=o.Fh,yaxisWidth:r=o.aD,yaxisDataKey:Z="all",yaxisScale:A,truncateYThreshold:C,yaxisTickFormatter:P,yaxisDomain:B=[0,"auto"],xaxisDataKey:W="timestamp",xaxisTickFormatter:E=o.DZ,tooltipFormatter:V=o.CX,tooltipLabelFormatter:R=o.DZ,items:_,type:z="Bar",syncId:U,children:X,rightYaxisDataKey:Y,controls:$={},isLightTheme:q}=e,{viewState:G,togglePercentView:H,formattedData:J,yaxisTickFormatter:Q,itemsUnit:ee}=(0,L.h)({controls:$,data:a});let te;te="Line"===z?c.w:"Bar"===z?p.v:"Area"===z?h.T:m.c;const ne=(0,d.useMemo)((()=>"number"===typeof C&&a&&Math.max(...a.map((e=>e[Z])))>C?[B[0],e=>C]:null),[a,C,null===B||void 0===B?void 0:B.join("-")]),ae=(_||[]).map(((e,t)=>{const n={type:"monotone",dataKey:e.key,stackId:"a",name:e.name||e.key,fill:e.color||o.DM[t%o.DM.length],stroke:e.color||o.DM[t%o.DM.length],dot:e.dot||!1,key:"item-"+t,unit:e.unit||ee,strokeWidth:e.strokeWidth,yAxisId:e.yAxisId};return"Line"===e.type||"Line"===z?(0,T.jsx)(x.x,{...n,type:void 0,isAnimationActive:!1}):"Area"===z?(0,T.jsx)(u.u,{...n,type:void 0,isAnimationActive:!1}):(0,T.jsx)(v.$,{...n,isAnimationActive:!1})})),ie="Pie"!==z?_.map((e=>({key:e.key,name:e.name}))):[],le=e=>{const{active:t,payload:n,label:a}=e;if(t&&n&&n.length){const e=n[0].payload.fill||n[0].payload.stroke||"red";return(0,T.jsx)("div",{className:"custom-tooltip",style:{borderRadius:"4px"},children:(0,T.jsxs)("div",{className:"data-row",children:[(0,T.jsx)("div",{className:"dot",style:{width:16,height:16,backgroundColor:e}}),(0,T.jsxs)("div",{className:"label",style:{color:e},children:[n[0].name,":"," "]}),(0,T.jsxs)("div",{style:{color:e},children:["$",n[0].value?"".concat((0,S.uf)(n[0].value)):"0.00"," "]})]})})}return null},re=(0,d.useMemo)((()=>a.every((e=>0===Number(e.value)))),[a]),oe=(0,d.useMemo)((()=>{(0,s.sumBy)(a,"value");return a.sort(((e,t)=>e.value-t.value))}),[a]);if("Pie"===z){const e=90;return(0,T.jsx)(O.Z,{title:n,data:a,loading:t,children:(0,T.jsx)(M,{children:(0,T.jsx)(g.h,{height:150,width:150,children:(0,T.jsxs)(y.u,{height:150,width:150,children:[!re&&(0,T.jsxs)(T.Fragment,{children:[(0,T.jsx)(f.b,{data:oe,innerRadius:45,outerRadius:75,fill:"#8884d8",dataKey:"value",nameKey:"name",cursor:"pointer",startAngle:e,endAngle:e+360,labelLine:!1,children:oe.map(((e,t)=>(0,T.jsx)(j.b,{fill:K.ZE[t+2],stroke:K.ZE[t+2],style:{cursor:"pointer"}},"cell-".concat(t))))}),(0,T.jsx)(b.u,{content:(0,T.jsx)(le,{}),active:!1})]}),re&&(0,T.jsx)(f.b,{innerRadius:45,outerRadius:75,dataKey:"value",data:[{name:"No Data",value:.1}],fill:q?"rgba(0, 0, 0, 0.10)":"rgba(255, 255, 255, 0.10)",stroke:q?"rgba(255, 255, 255, 0.10)":"#ffffff00",className:"pie-chart-custom",children:(0,T.jsx)(w._,{value:"No Data",fontSize:14,position:"center"})})]})})})})}return(0,T.jsxs)(O.Z,{title:n,loading:t,data:J,csvFields:ie,viewState:G,controls:$,togglePercentView:H,children:[(0,T.jsx)(g.h,{width:"100%",height:l,children:d.createElement(te,{data:J,syncId:U},[(0,T.jsx)(k.q,{strokeDasharray:"1 1"},"a"),(0,T.jsx)(I.K,{dataKey:W,tickFormatter:E,minTickGap:30},"b"),(0,T.jsx)(N.B,{scale:A,domain:ne||B,dataKey:Z,tickFormatter:P||Q},"c"),Y?(0,T.jsx)(N.B,{dataKey:Y,tickFormatter:P,orientation:"right",yAxisId:"right"},"c2"):null,(0,T.jsx)(b.u,{formatter:V,labelFormatter:R,contentStyle:{textAlign:"left"}},"d"),(0,T.jsx)(D.D,{},"e"),...ae,X])}),i&&(0,T.jsx)("div",{className:"chart-description",children:i})]})}Z.ZP.div(a||(a=(0,r.Z)(["\n  width: 100%;\n"]))),Z.ZP.div(i||(i=(0,r.Z)(["\n  width: 100%;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 16px;\n  border-bottom: 1px solid rgba(255, 255, 255, 0.05);\n\n  .dot {\n    width: 8px;\n    height: 8px;\n    border-radius: 50%;\n  }\n"])));const M=Z.ZP.div(l||(l=(0,r.Z)(["\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  gap: 24px;\n  margin: 32px 0 24px;\n  .data-row {\n    display: flex;

1\n    align-items: center;\n    gap: 8px;\n    justify-content: flex-start;\n\n    &.parent {\n      flex-direction: column;\n      align-items: flex-start;\n    }\n  }\n  @media screen and (max-width: 767px) {\n    padding-left: 16px;\n  }\n\n  .recharts-wrapper svg {\n    overflow: inherit !important;\n  }\n\n  .recharts-text.recharts-label {\n    tspan {\n      font-size: 16px;\n      fill: #fff;\n      font-weight: 500;\n    }\n  }\n"])))},32997:(e,t,n)=>{n.r(t),n.d(t,{default:()=>k});var a,i=n(30168),l=n(72791),r=n(17939),o=n(68725),s=n(70696),d=n(98863),c=n(41537),p=n(69007),h=n(58445),m=n(33961),x=n(73716),u=n(763),v=n(23534),g=n(18155),y=n(80184);function f(e,t){return(0,u.sumBy)(Object.values(e).filter((e=>e.type===t)),(e=>Number(e.value)))}const j=r.ZP.div(a||(a=(0,i.Z)(["\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 24px;\n\n  .cricle-chart-cell {\n    padding: 24px;\n    background: transparent;\n    border-radius: 16px;\n    border: 1px solid var(--white-10, rgba(255, 255, 255, 0.1));\n  }\n  @media (max-width: 1000px) {\n    grid-template-columns: repeat(1, 1fr);\n  }\n\n  @media (max-width: 600px) {\n    gap: 16px;\n    /* .cricle-chart-cell {\n      padding: 16px;\n    } */\n  }\n"]))),b=e=>{let{chainId:t,data:n,originData:a,isLightTheme:i}=e;const r=(0,l.useMemo)((()=>{if(n){const e={title:"Open Interest Composition",data:[]};e.data=[{name:"Crypto",value:f(n,"crypto"),key:"Crypto"},{name:"Metals",value:f(n,"metals"),key:"Metals"},{name:"Forex",value:f(n,"forex"),key:"Forex"}];const t={title:"Open Interest (Crypto)",data:[]};t.data=Object.entries(a).filter((e=>{let[t]=e;return t.includes("USD")&&m.yN.includes((0,x.jX)(t))})).map((e=>{let[t,n]=e;return{name:t,value:Number(n),key:t}}));const i={title:"Open Interest (Forex)",data:[]};return i.data=Object.entries(a).filter((e=>{let[t]=e;return t.includes("USD")&&m._y.includes((0,x.jX)(t))})).map((e=>{let[t,n]=e;return{name:t,value:Number(n),key:t}})),{composition:e,openInterestCrypto:t,openInterestForex:i}}}),[n,a]);return(0,y.jsx)(j,{className:"chart-3-columns",children:r&&Object.entries(r).map((e=>{let[n,{data:a,title:l}]=e;return(0,y.jsx)("div",{className:"cricle-chart-cell",children:(0,y.jsx)(v.Z,{title:l,type:"Pie",data:g.l8.includes(t)?a:[],isLightTheme:i})},n)}))})};var w;const k=e=>{var t,n,a,i,l,r,m,x,u,v,g,f;let{loading:j,data:w}=e;const{isLightTheme:k}=(0,o.T)(),{chainId:N}=(0,s.x)(),D=(0,h.C7)(null===w||void 0===w?void 0:w.assets),Z=[{title:"\ud83d\udfe2 Long Open Interest",value:(0,d.Mn)((null===w||void 0===w||null===(t=w.openInterest)||void 0===t?void 0:t.long)||0,{currency:!0})},{title:"\ud83d\udd34 Short Open Interest",value:(0,d.Mn)((null===w||void 0===w||null===(n=w.openInterest)||void 0===n?void 0:n.short)||0,{currency:!0})},{title:"Long Dominance",value:"".concat(null!==w&&void 0!==w&&null!==(a=w.openInterest)&&void 0!==a&&a.long?(0,c.uf)((null===w||void 0===w||null===(i=w.openInterest)||void 0===i?void 0:i.long)/((null===w||void 0===w||null===(l=w.openInterest)||void 0===l?void 0:l.long)+(null===w||void 0===w||null===(r=w.openInterest)||void 0===r?void 0:r.short))*100):0,"%")}];return(0,y.jsxs)(I,{children:[(0,y.jsx)("div",{className:"title",children:"Open Interest (V1 and V2)"}),(0,y.jsx)("div",{className:"overview-interest",children:Z.map(((e,t)=>(0,y.jsxs)("div",{className:"item-overview",children:[(0,y.jsx)("span",{className:"title-overview",children:e.title}),j?(0,y.jsx)("div",{className:"skeleton-box",style:{height:"25px",width:"100px"}}):(0,y.jsx)("div",{className:"value-overview",children:e.value})]},t)))}),(0,y.jsxs)("div",{className:"interest-chart",children:[(0,y.jsx)("div",{className:"chart-cell-primary rounded chart-interest-left",children:(0,y.jsx)(p.Z,{loading:j,title:"Open Interest",height:500,data:(null===w||void 0===w||null===(m=w.openInterest)||void 0===m?void 0:m.chartData)||[],yaxisDataKey:"all",items:(null===w||void 0===w||null===(x=w.openInterest)||void 0===x?void 0:x.chartKeys)||[],type:"Bar"})}),(0,y.jsxs)("div",{className:"chart-interest-right",children:[(0,y.jsx)("div",{className:"chart-cell-primary rounded ",children:(0,y.jsx)(p.Z,{loading:j,title:"Long VS Short Open Interest",height:200,data:(null===w||void 0===w||null===(u=w.openInterest)||void 0===u||null===(v=u.totalOpenInterest)||void 0===v?void 0:v.map((e=>({all:e.all,shortOpenInterest:e.totalShort,longOpenInterest:e.totalLong,timestamp:e.timestamp}))))||[],yaxisDataKey:"all",items:[{key:"shortOpenInterest",name:"Short",color:h.ZE[7]},{key:"longOpenInterest",name:"Long",color:h.ZE[15]}],type:"Bar"})}),(0,y.jsx)("div",{className:"chart-cell-primary rounded",children:(0,y.jsx)(p.Z,{loading:j,title:"Long VS Short Weighting",he

1ight:200,yaxisTickFormatter:d.SV,tooltipFormatter:d.pI,tooltipLabelFormatter:d.gY,data:(null===w||void 0===w||null===(g=w.openInterest)||void 0===g||null===(f=g.totalOpenInterest)||void 0===f?void 0:f.map((e=>({shortWeight:e.totalShort&&e.totalLong?e.totalShort/e.all*100:null!==e&&void 0!==e&&e.totalShort?100:0,longWeight:e.totalShort&&e.totalLong?e.totalLong/e.all*100:null!==e&&void 0!==e&&e.totalLong?100:0,timestamp:e.timestamp,all:100}))))||[],yaxisDataKey:"all",items:[{key:"shortWeight",name:"Short",color:h.ZE[7]},{key:"longWeight",name:"Long",color:h.ZE[15]}],type:"Bar"})})]})]}),(0,y.jsx)("div",{className:"interest-pie",children:(0,y.jsx)(b,{data:null===D||void 0===D?void 0:D.data,originData:null===D||void 0===D?void 0:D.originData,chainId:N,isLightTheme:k})})]})},I=r.ZP.div(w||(w=(0,i.Z)(["\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  gap: 24px;\n  width: 100%;\n\n  .overview-interest {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: 24px;\n    width: 100%;\n  }\n  .item-overview {\n    display: flex;\n    padding: 24px;\n    flex-direction: column;\n    justify-content: center;

1\n    align-items: center;\n    gap: 4px;\n    flex: 1 0 0;\n    border-radius: 16px;\n    background: #14161f;\n  }\n  .title-overview {\n    font-size: 14px;\n    font-style: normal;\n    font-weight: 400;\n    line-height: 140%;\n    color: var(--Text-Text_Secondary, rgba(255, 255, 255, 0.6));\n  }\n  .value-overview {\n    font-size: 24px;\n    font-style: normal;\n    font-weight: 700;\n    line-height: 140%;\n  }\n  .interest-chart {\n    width: 100%;\n    display: flex;\n    gap: 24px;\n    @media screen and (max-width: 900px) {\n      flex-direction: column;\n    }\n  }\n  .chart-interest-right {\n    display: flex;\n    flex-direction: column;\n    gap: 24px;\n    flex: 1;\n  }\n  .chart-interest-left {\n    flex: 1;\n  }\n  .interest-pie {\n    width: 100%;\n  }\n"])))}}]);
2//# sourceMappingURL=997.4bac72ee.chunk.js.map