mirror of
https://github.com/stronk-dev/LivepeerEvents.git
synced 2025-07-05 02:35:09 +02:00
Added share function to orch profiles
Rewrote some class components to functional components Batch multiple redux events on load and in the livepeer explorer component added inset when button is active
This commit is contained in:
parent
361a89e313
commit
a55d422ded
187
public/clipboard.svg
Normal file
187
public/clipboard.svg
Normal file
@ -0,0 +1,187 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
width="500pt"
|
||||
height="500pt"
|
||||
version="1.1"
|
||||
viewBox="0 0 500 500"
|
||||
id="svg317"
|
||||
sodipodi:docname="clipboard.svg"
|
||||
inkscape:version="1.1.2 (0a00cf5339, 2022-02-04)"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:svg="http://www.w3.org/2000/svg">
|
||||
<sodipodi:namedview
|
||||
id="namedview319"
|
||||
pagecolor="#505050"
|
||||
bordercolor="#ffffff"
|
||||
borderopacity="1"
|
||||
inkscape:pageshadow="0"
|
||||
inkscape:pageopacity="0"
|
||||
inkscape:pagecheckerboard="1"
|
||||
inkscape:document-units="pt"
|
||||
showgrid="false"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
fit-margin-bottom="0"
|
||||
inkscape:zoom="0.88714286"
|
||||
inkscape:cx="235.02415"
|
||||
inkscape:cy="279.54911"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1040"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="g315" />
|
||||
<defs
|
||||
id="defs241">
|
||||
<symbol
|
||||
id="t"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 18.766,-1.125 c -0.96875,0.5 -1.9805,0.875 -3.0312,1.125 -1.043,0.25781 -2.1367,0.39062 -3.2812,0.39062 -3.3984,0 -6.0898,-0.94531 -8.0781,-2.8438 -1.9922,-1.9062 -2.9844,-4.4844 -2.9844,-7.7344 0,-3.2578 0.99219,-5.8359 2.9844,-7.7344 1.9883,-1.9062 4.6797,-2.8594 8.0781,-2.8594 1.1445,0 2.2383,0.13281 3.2812,0.39062 1.0508,0.25 2.0625,0.625 3.0312,1.125 v 4.2188 c -0.98047,-0.65625 -1.9453,-1.1406 -2.8906,-1.4531 -0.94922,-0.3125 -1.9492,-0.46875 -3,-0.46875 -1.875,0 -3.3516,0.60547 -4.4219,1.8125 -1.0742,1.1992 -1.6094,2.8555 -1.6094,4.9688 0,2.1055 0.53516,3.7617 1.6094,4.9688 1.0703,1.1992 2.5469,1.7969 4.4219,1.7969 1.0508,0 2.0508,-0.14844 3,-0.45312 0.94531,-0.3125 1.9102,-0.80078 2.8906,-1.4688 z"
|
||||
id="path181" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="c"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 13.734,-11.141 c -0.4375,-0.19531 -0.87109,-0.34375 -1.2969,-0.4375 -0.41797,-0.10156 -0.83984,-0.15625 -1.2656,-0.15625 -1.2617,0 -2.2305,0.40625 -2.9062,1.2188 -0.67969,0.80469 -1.0156,1.9531 -1.0156,3.4531 v 7.0625 H 2.3591 v -15.312 h 4.8906 v 2.5156 c 0.625,-1 1.3438,-1.7266 2.1562,-2.1875 0.82031,-0.46875 1.8008,-0.70312 2.9375,-0.70312 0.16406,0 0.34375,0.01172 0.53125,0.03125 0.19531,0.01172 0.47656,0.03906 0.84375,0.07813 z"
|
||||
id="path184" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="b"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 17.641,-7.7031 v 1.4062 H 6.188 c 0.125,1.1484 0.53906,2.0078 1.25,2.5781 0.70703,0.57422 1.7031,0.85938 2.9844,0.85938 1.0312,0 2.082,-0.14844 3.1562,-0.45312 1.082,-0.3125 2.1914,-0.77344 3.3281,-1.3906 v 3.7656 c -1.1562,0.4375 -2.3125,0.76562 -3.4688,0.98438 -1.1562,0.22656 -2.3125,0.34375 -3.4688,0.34375 -2.7734,0 -4.9297,-0.70312 -6.4688,-2.1094 -1.5312,-1.4062 -2.2969,-3.3789 -2.2969,-5.9219 0,-2.5 0.75391,-4.4609 2.2656,-5.8906 1.5078,-1.4375 3.582,-2.1562 6.2188,-2.1562 2.4062,0 4.332,0.73047 5.7812,2.1875 1.4453,1.4492 2.1719,3.3828 2.1719,5.7969 z m -5.0312,-1.625 c 0,-0.92578 -0.27344,-1.6719 -0.8125,-2.2344 -0.54297,-0.57031 -1.25,-0.85938 -2.125,-0.85938 -0.94922,0 -1.7188,0.26562 -2.3125,0.79688 -0.5937,0.53126 -0.96484,1.2969 -1.1094,2.2969 z"
|
||||
id="path187" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="a"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 9.2188,-6.8906 c -1.0234,0 -1.793,0.17188 -2.3125,0.51562 -0.51172,0.34375 -0.76562,0.85547 -0.76562,1.5312 0,0.625 0.20703,1.1172 0.625,1.4688 0.41406,0.34375 0.98828,0.51562 1.7188,0.51562 0.92578,0 1.7031,-0.32812 2.3281,-0.98438 0.63281,-0.66406 0.95312,-1.4922 0.95312,-2.4844 v -0.5625 z m 7.4688,-1.8438 V 0 h -4.9219 v -2.2656 c -0.65625,0.92969 -1.3984,1.6055 -2.2188,2.0312 -0.82422,0.41406 -1.8242,0.625 -3,0.625 -1.5859,0 -2.8711,-0.45703 -3.8594,-1.375 -0.99219,-0.92578 -1.4844,-2.1289 -1.4844,-3.6094 0,-1.7891 0.61328,-3.1016 1.8438,-3.9375 1.2383,-0.84375 3.1797,-1.2656 5.8281,-1.2656 h 2.8906 v -0.39062 c 0,-0.76953 -0.30859,-1.332 -0.92188,-1.6875 -0.61719,-0.36328 -1.5703,-0.54688 -2.8594,-0.54688 -1.0547,0 -2.0312,0.10547 -2.9375,0.3125 -0.89844,0.21094 -1.7305,0.52344 -2.5,0.9375 v -3.7344 c 1.0391,-0.25 2.0859,-0.44141 3.1406,-0.57812 1.0625,-0.13281 2.125,-0.20312 3.1875,-0.20312 2.7578,0 4.75,0.54688 5.9688,1.6406 1.2266,1.0859 1.8438,2.8555 1.8438,5.3125 z"
|
||||
id="path190" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="d"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 7.7031,-19.656 v 4.3438 H 12.75 v 3.5 H 7.7031 v 6.5 c 0,0.71094 0.14062,1.1875 0.42188,1.4375 0.28126,0.25 0.83594,0.375 1.6719,0.375 h 2.5156 v 3.5 h -4.1875 c -1.9375,0 -3.3125,-0.39844 -4.125,-1.2031 -0.80469,-0.8125 -1.2031,-2.1797 -1.2031,-4.1094 v -6.5 h -2.4219 v -3.5 h 2.4219 v -4.3438 z"
|
||||
id="path193" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="j"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 12.766,-13.078 v -8.2031 h 4.9219 V -1e-4 H 12.766 v -2.2188 c -0.66797,0.90625 -1.4062,1.5703 -2.2188,1.9844 -0.8126,0.4141 -1.7578,0.625 -2.8281,0.625 -1.8867,0 -3.4336,-0.75 -4.6406,-2.25 -1.2109,-1.5 -1.8125,-3.4258 -1.8125,-5.7812 0,-2.3633 0.60156,-4.2969 1.8125,-5.7969 1.207,-1.5 2.7539,-2.25 4.6406,-2.25 1.0625,0 2,0.21484 2.8125,0.64062 0.82031,0.42969 1.5664,1.0859 2.2344,1.9688 z m -3.2188,9.9219 c 1.0391,0 1.8359,-0.37891 2.3906,-1.1406 0.55078,-0.76953 0.82812,-1.8828 0.82812,-3.3438 0,-1.457 -0.27734,-2.5664 -0.82812,-3.3281 -0.55469,-0.76953 -1.3516,-1.1562 -2.3906,-1.1562 -1.043,0 -1.8398,0.38672 -2.3906,1.1562 -0.55469,0.76172 -0.82812,1.8711 -0.82812,3.3281 0,1.4609 0.27344,2.5742 0.82812,3.3438 0.55078,0.76172 1.3477,1.1406 2.3906,1.1406 z"
|
||||
id="path196" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="i"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 10.5,-3.1562 c 1.0508,0 1.8516,-0.37891 2.4062,-1.1406 0.55078,-0.76953 0.82812,-1.8828 0.82812,-3.3438 0,-1.457 -0.27734,-2.5664 -0.82812,-3.3281 -0.55469,-0.76953 -1.3555,-1.1562 -2.4062,-1.1562 -1.0547,0 -1.8594,0.38672 -2.4219,1.1562 -0.55469,0.77344 -0.82812,1.8828 -0.82812,3.3281 0,1.4492 0.27344,2.5586 0.82812,3.3281 0.5625,0.77344 1.3672,1.1562 2.4219,1.1562 z m -3.25,-9.9219 c 0.67578,-0.88281 1.4219,-1.5391 2.2344,-1.9688 0.82031,-0.42578 1.7656,-0.64062 2.8281,-0.64062 1.8945,0 3.4453,0.75 4.6562,2.25 1.207,1.5 1.8125,3.4336 1.8125,5.7969 0,2.3555 -0.60547,4.2812 -1.8125,5.7812 -1.2109,1.5 -2.7617,2.25 -4.6562,2.25 -1.0625,0 -2.0078,-0.21094 -2.8281,-0.625 C 8.6719,-0.6602 7.9258,-1.32032 7.25,-2.21882 V -2e-5 H 2.3594 v -21.281 H 7.25 Z"
|
||||
id="path199" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="h"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 0.34375,-15.312 h 4.8906 l 4.125,10.391 3.5,-10.391 h 4.8906 l -6.4375,16.766 c -0.64844,1.6953 -1.4023,2.8828 -2.2656,3.5625 -0.86719,0.6875 -2,1.0312 -3.4062,1.0312 H 2.79685 V 2.8289 h 1.5312 c 0.83203,0 1.4375,-0.13672 1.8125,-0.40625 C 6.52336,2.16093 6.82024,1.69218 7.03117,1.01645 L 7.17179,0.59457 Z"
|
||||
id="path202" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="f"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="M 2.3594,-15.312 H 7.25 v 15.031 c 0,2.0508 -0.49609,3.6172 -1.4844,4.7031 -0.98047,1.082 -2.4062,1.625 -4.2812,1.625 H -0.9375 V 2.8283 h 0.85938 c 0.92578,0 1.5625,-0.21094 1.9062,-0.625 0.35156,-0.41797 0.53125,-1.2461 0.53125,-2.4844 z m 0,-5.9688 H 7.25 v 4 H 2.3594 Z"
|
||||
id="path205" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="g"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 2.1875,-5.9688 v -9.3438 h 4.9219 v 1.5312 c 0,0.83594 -0.00781,1.875 -0.015625,3.125 -0.011719,1.25 -0.015625,2.0859 -0.015625,2.5 0,1.2422 0.03125,2.1328 0.09375,2.6719 0.070313,0.54297 0.17969,0.93359 0.32812,1.1719 0.20703,0.32422 0.47266,0.57422 0.79688,0.75 0.32031,0.16797 0.69141,0.25 1.1094,0.25 1.0195,0 1.8203,-0.39062 2.4062,-1.1719 0.58203,-0.78125 0.875,-1.8672 0.875,-3.2656 v -7.5625 h 4.8906 V -6e-4 H 12.6875 V -2.2194 C 11.94531,-1.32096 11.1641,-0.6608 10.3437,-0.235 9.51948,0.17906 8.6093,0.39 7.6093,0.39 5.8476,0.39 4.5038,-0.14906 3.5781,-1.235 2.64841,-2.317 2.1875,-3.8952 2.1875,-5.9694 Z"
|
||||
id="path208" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="s"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 1.5938,-15.312 h 13.359 v 3.4219 l -8.0625,8.3906 h 8.0625 v 3.5 H 1.2648 V -3.4214 L 9.3273,-11.812 H 1.5929 Z"
|
||||
id="path211" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="r"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="M 2.3594,-21.281 H 7.25 v 11.594 l 5.625,-5.625 h 5.6875 L 11.0937,-8.2808 19.1562,4e-4 H 13.2187 L 7.2499,-6.3902 V 4e-4 H 2.3593 Z"
|
||||
id="path214" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="q"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 12.422,-21.281 v 3.2188 H 9.7189 c -0.6875,0 -1.1719,0.125 -1.4531,0.375 -0.27344,0.25 -0.40625,0.6875 -0.40625,1.3125 v 1.0625 h 4.1875 v 3.5 H 7.85955 V -2e-4 h -4.8906 v -11.812 h -2.4375 v -3.5 h 2.4375 v -1.0625 c 0,-1.6641 0.46094,-2.8984 1.3906,-3.7031 0.92578,-0.80078 2.3672,-1.2031 4.3281,-1.2031 z"
|
||||
id="path217" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="e"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 9.6406,-12.188 c -1.0859,0 -1.9141,0.39062 -2.4844,1.1719 -0.57422,0.78125 -0.85938,1.9062 -0.85938,3.375 0,1.4688 0.28516,2.5938 0.85938,3.375 0.57031,0.77344 1.3984,1.1562 2.4844,1.1562 1.0625,0 1.875,-0.38281 2.4375,-1.1562 0.57031,-0.78125 0.85938,-1.9062 0.85938,-3.375 0,-1.4688 -0.28906,-2.5938 -0.85938,-3.375 -0.5625,-0.78125 -1.375,-1.1719 -2.4375,-1.1719 z m 0,-3.5 c 2.6328,0 4.6914,0.71484 6.1719,2.1406 1.4766,1.418 2.2188,3.3867 2.2188,5.9062 0,2.5117 -0.74219,4.4805 -2.2188,5.9062 C 14.332,-0.317 12.2734,0.39 9.6406,0.39 6.9922,0.39 4.9258,-0.31703 3.4375,-1.735 1.9453,-3.1608 1.2031,-5.1295 1.2031,-7.6412 c 0,-2.5195 0.74219,-4.4883 2.2344,-5.9062 1.4883,-1.4258 3.5547,-2.1406 6.2031,-2.1406 z"
|
||||
id="path220" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="p"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 16.547,-12.766 c 0.61328,-0.94531 1.3477,-1.6719 2.2031,-2.1719 0.85156,-0.5 1.7891,-0.75 2.8125,-0.75 1.7578,0 3.0977,0.54688 4.0156,1.6406 0.92578,1.0859 1.3906,2.6562 1.3906,4.7188 V -4e-4 h -4.9219 v -7.9844 -0.35938 c 0.0078,-0.13281 0.01563,-0.32031 0.01563,-0.5625 0,-1.082 -0.16406,-1.8633 -0.48438,-2.3438 -0.3125,-0.48828 -0.82422,-0.73438 -1.5312,-0.73438 -0.92969,0 -1.6484,0.38672 -2.1562,1.1562 -0.51172,0.76172 -0.77344,1.8672 -0.78125,3.3125 v 7.5156 h -4.9219 v -7.9844 c 0,-1.6953 -0.14844,-2.7852 -0.4375,-3.2656 -0.29297,-0.48828 -0.8125,-0.73438 -1.5625,-0.73438 -0.9375,0 -1.6641,0.38672 -2.1719,1.1562 -0.51172,0.76172 -0.76562,1.8594 -0.76562,3.2969 v 7.5312 h -4.9219 v -15.312 h 4.9219 v 2.2344 c 0.60156,-0.86328 1.2891,-1.5156 2.0625,-1.9531 0.78125,-0.4375 1.6406,-0.65625 2.5781,-0.65625 1.0625,0 2,0.25781 2.8125,0.76562 0.8125,0.51172 1.4258,1.2305 1.8438,2.1562 z"
|
||||
id="path223" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="o"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="M 17.75,-9.3281 V 0 h -4.9219 v -7.1094 c 0,-1.3438 -0.03125,-2.2656 -0.09375,-2.7656 -0.0625,-0.5 -0.16797,-0.86719 -0.3125,-1.1094 -0.1875,-0.3125 -0.44922,-0.55469 -0.78125,-0.73438 -0.32422,-0.17578 -0.69531,-0.26562 -1.1094,-0.26562 -1.0234,0 -1.8242,0.39844 -2.4062,1.1875 -0.58594,0.78125 -0.875,1.8711 -0.875,3.2656 V -1e-4 H 2.3594 v -21.281 H 7.25 v 8.2031 c 0.73828,-0.88281 1.5195,-1.5391 2.3438,-1.9688 0.83203,-0.42578 1.75,-0.64062 2.75,-0.64062 1.7695,0 3.1133,0.54688 4.0312,1.6406 0.91406,1.0859 1.375,2.6562 1.375,4.7188 z"
|
||||
id="path226" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="n"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 2.5781,-20.406 h 5.875 l 7.4219,14 v -14 h 4.9844 V 0 h -5.875 L 7.5625,-14 V 0 H 2.5781 Z"
|
||||
id="path229" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="m"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="M 17.75,-9.3281 V 0 h -4.9219 v -7.1406 c 0,-1.3203 -0.03125,-2.2344 -0.09375,-2.7344 -0.0625,-0.5 -0.16797,-0.86719 -0.3125,-1.1094 -0.1875,-0.3125 -0.44922,-0.55469 -0.78125,-0.73438 -0.32422,-0.17578 -0.69531,-0.26562 -1.1094,-0.26562 -1.0234,0 -1.8242,0.39844 -2.4062,1.1875 -0.58594,0.78125 -0.875,1.8711 -0.875,3.2656 V -1e-4 H 2.3594 v -15.312 H 7.25 v 2.2344 c 0.73828,-0.88281 1.5195,-1.5391 2.3438,-1.9688 0.83203,-0.42578 1.75,-0.64062 2.75,-0.64062 1.7695,0 3.1133,0.54688 4.0312,1.6406 0.91406,1.0859 1.375,2.6562 1.375,4.7188 z"
|
||||
id="path232" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="l"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 2.5781,-20.406 h 8.7344 c 2.5938,0 4.582,0.57812 5.9688,1.7344 1.3945,1.1484 2.0938,2.7891 2.0938,4.9219 0,2.1367 -0.69922,3.7812 -2.0938,4.9375 -1.3867,1.1562 -3.375,1.7344 -5.9688,1.7344 H 7.8281 V 3e-4 h -5.25 z m 5.25,3.8125 v 5.7031 H 10.75 c 1.0195,0 1.8047,-0.25 2.3594,-0.75 0.5625,-0.5 0.84375,-1.2031 0.84375,-2.1094 0,-0.91406 -0.28125,-1.6172 -0.84375,-2.1094 -0.55469,-0.48828 -1.3398,-0.73438 -2.3594,-0.73438 z"
|
||||
id="path235" />
|
||||
</symbol>
|
||||
<symbol
|
||||
id="k"
|
||||
overflow="visible">
|
||||
<path
|
||||
d="m 14.719,-14.828 v 3.9844 c -0.65625,-0.45703 -1.3242,-0.79688 -2,-1.0156 -0.66797,-0.21875 -1.3594,-0.32812 -2.0781,-0.32812 -1.3672,0 -2.4336,0.40234 -3.2031,1.2031 -0.76172,0.79297 -1.1406,1.9062 -1.1406,3.3438 0,1.4297 0.37891,2.543 1.1406,3.3438 0.76953,0.79297 1.8359,1.1875 3.2031,1.1875 0.75781,0 1.4844,-0.10938 2.1719,-0.32812 0.6875,-0.22656 1.3203,-0.56641 1.9062,-1.0156 v 4 c -0.76172,0.28125 -1.5391,0.48828 -2.3281,0.625 -0.78125,0.14453 -1.5742,0.21875 -2.375,0.21875 -2.7617,0 -4.9219,-0.70703 -6.4844,-2.125 -1.5547,-1.4141 -2.3281,-3.3828 -2.3281,-5.9062 0,-2.5312 0.77344,-4.5039 2.3281,-5.9219 1.5625,-1.4141 3.7227,-2.125 6.4844,-2.125 0.80078,0 1.5938,0.07422 2.375,0.21875 0.78125,0.13672 1.5547,0.35156 2.3281,0.64062 z"
|
||||
id="path238" />
|
||||
</symbol>
|
||||
</defs>
|
||||
<g
|
||||
id="g315"
|
||||
transform="translate(-170.802,-39.202294)">
|
||||
<path
|
||||
d="m 320.48084,48.723777 c -6.4961,-0.07422 -11.238,5.7188 -11.199,11.199 v 11.199 h -22.398 c -24.625,0 -44.801,20.176 -44.801,44.801003 v 369.6 c 0,24.625 20.176,44.801 44.801,44.801 h 268.8 c 24.625,0 44.801,-20.176 44.801,-44.801 v -369.6 c 0,-24.625003 -20.176,-44.801003 -44.801,-44.801003 h -22.398 v -11.199 c 0,-5.8633 -5.3359,-11.199 -11.199,-11.199 z m 11.199,22.398 h 179.2 v 33.602003 h -46.199 c -4.9219,-0.004 -9.6172,3.6328 -10.852,8.3984 -3.7109,14.496 -16.688,25.199 -32.551,25.199 -15.863,0 -28.836,-10.707 -32.551,-25.199 -1.2305,-4.7656 -5.9258,-8.4023 -10.852,-8.3984 h -46.199 V 71.121777 Z m -44.801,22.398 h 22.398 v 22.398003 c 0,5.8633 5.3359,11.199 11.199,11.199 h 50.227 c 8.7578,19.551 27.863,33.602 50.574,33.602 22.711,0 41.816,-14.051 50.574,-33.602 h 50.227 c 5.8633,0 11.199,-5.3359 11.199,-11.199 V 93.519777 h 22.398 c 12.602,0 22.398,9.796903 22.398,22.398003 v 369.6 c 0,12.602 -9.7969,22.398 -22.398,22.398 h -268.8 c -12.602,0 -22.398,-9.7969 -22.398,-22.398 v -369.6 c 0,-12.602 9.7969,-22.398003 22.398,-22.398003 z m 190.4,134.400003 c -18.426,0 -33.602,15.176 -33.602,33.602 0,1.6602 0.11719,3.3008 0.34766,4.8984 l -56.176,37.625 c -5.9883,-5.4922 -13.891,-8.9258 -22.57,-8.9258 -18.426,0 -33.602,15.176 -33.602,33.602 0,18.426 15.176,33.602 33.602,33.602 8.5898,0 16.43,-3.3594 22.398,-8.75 l 56.352,37.625 c -0.21875,1.543 -0.34766,3.1289 -0.34766,4.7266 0,18.426 15.176,33.602 33.602,33.602 18.426,0 33.602,-15.176 33.602,-33.602 0,-18.426 -15.176,-33.602 -33.602,-33.602 -8.6797,0 -16.582,3.4336 -22.574,8.9258 l -56.176,-37.625 c 0.23438,-1.5977 0.34766,-3.2383 0.34766,-4.8984 0,-1.5977 -0.12891,-3.1836 -0.34766,-4.7266 l 56.352,-37.625 c 5.9688,5.3906 13.809,8.75 22.398,8.75 18.426,0 33.602,-15.176 33.602,-33.602 0,-18.426 -15.176,-33.602 -33.602,-33.602 z m 0,22.398 c 6.3164,0 11.199,4.8828 11.199,11.199 0,6.3203 -4.8828,11.199 -11.199,11.199 -6.3203,0 -11.199,-4.8828 -11.199,-11.199 0,-6.3203 4.8828,-11.199 11.199,-11.199 z m -112,67.199 c 6.3164,0 11.199,4.8828 11.199,11.199 0,6.3203 -4.8828,11.199 -11.199,11.199 -6.3203,0 -11.199,-4.8828 -11.199,-11.199 0,-6.3203 4.8828,-11.199 11.199,-11.199 z m 112,67.199 c 6.3164,0 11.199,4.8828 11.199,11.199 0,6.3203 -4.8828,11.199 -11.199,11.199 -6.3203,0 -11.199,-4.8828 -11.199,-11.199 0,-6.3203 4.8828,-11.199 11.199,-11.199 z"
|
||||
id="path243" />
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 16 KiB |
@ -11,7 +11,6 @@ import {
|
||||
} from "react-router-dom";
|
||||
|
||||
|
||||
|
||||
export default function App() {
|
||||
return (
|
||||
<Startup>
|
||||
|
||||
@ -1,4 +1,8 @@
|
||||
import React from "react";
|
||||
import {
|
||||
getOrchestratorInfo
|
||||
} from "./actions/livepeer";
|
||||
import { useDispatch } from 'react-redux'
|
||||
|
||||
const activationColour = "rgba(23, 60, 122, 0.3)";
|
||||
const rewardColour = "rgba(20, 99, 29, 0.3)";
|
||||
@ -7,6 +11,7 @@ const withdrawStakeColour = "rgba(102, 3, 10, 0.3)";
|
||||
const stakeColour = "rgba(71, 23, 122, 0.3)";
|
||||
|
||||
const EventButton = (obj) => {
|
||||
const dispatch = useDispatch();
|
||||
// Data shared among all events in this transaction
|
||||
const thisURL = obj.transactionUrl;
|
||||
//const thisTransaction = obj.transactionHash;
|
||||
@ -81,8 +86,8 @@ const EventButton = (obj) => {
|
||||
}
|
||||
|
||||
// Check name filter on transactionCaller, transactionFrom, transactionTo
|
||||
if (obj.searchTerm){
|
||||
if (obj.searchTerm !== ""){
|
||||
if (obj.searchTerm) {
|
||||
if (obj.searchTerm !== "") {
|
||||
let isFiltered = true;
|
||||
if (transactionCaller.toLowerCase().includes(obj.searchTerm.toLowerCase())) isFiltered = false;
|
||||
if (transactionFrom.toLowerCase().includes(obj.searchTerm.toLowerCase())) isFiltered = false;
|
||||
@ -93,40 +98,40 @@ const EventButton = (obj) => {
|
||||
let isFiltered = true;
|
||||
// Check boolean filters on transactionName
|
||||
let count = 0;
|
||||
if(obj.filterActivated){
|
||||
if (transactionName === "Activated"){
|
||||
if (obj.filterActivated) {
|
||||
if (transactionName === "Activated") {
|
||||
isFiltered = false;
|
||||
}
|
||||
count++;
|
||||
}
|
||||
if(obj.rewardActivated){
|
||||
if (transactionName === "Reward"){
|
||||
if (obj.rewardActivated) {
|
||||
if (transactionName === "Reward") {
|
||||
isFiltered = false;
|
||||
}
|
||||
count++;
|
||||
}
|
||||
if(obj.updateActivated){
|
||||
if (transactionName === "Update"){
|
||||
if (obj.updateActivated) {
|
||||
if (transactionName === "Update") {
|
||||
isFiltered = false;
|
||||
}
|
||||
count++;
|
||||
}
|
||||
if(obj.withdrawActivated){
|
||||
if (transactionName === "Withdraw"){
|
||||
if (obj.withdrawActivated) {
|
||||
if (transactionName === "Withdraw") {
|
||||
isFiltered = false;
|
||||
}
|
||||
count++;
|
||||
}
|
||||
if(obj.stakeActivated){
|
||||
if (transactionName === "Stake"){
|
||||
if (obj.stakeActivated) {
|
||||
if (transactionName === "Stake") {
|
||||
isFiltered = false;
|
||||
}
|
||||
count++;
|
||||
}
|
||||
if (isFiltered && count){
|
||||
if (isFiltered && count) {
|
||||
return null;
|
||||
}
|
||||
|
||||
|
||||
let eventSpecificInfo;
|
||||
if (transactionName === "Reward") {
|
||||
if (transactionAmount - 69 < 1 && transactionAmount - 69 > 0) {
|
||||
@ -150,15 +155,15 @@ const EventButton = (obj) => {
|
||||
eventSpecificInfo =
|
||||
<div className="rowAlignLeft">
|
||||
<p> staked {(transactionAmount / 1000000000000000000).toFixed(2)} LPT to </p>
|
||||
<button className="selectOrch" onClick={() => { obj.setOrchFunction(transactionTo) }} >{transactionTo}</button>
|
||||
<button className="selectOrch" onClick={() => { dispatch(getOrchestratorInfo(transactionTo)) }} >{transactionTo}</button>
|
||||
</div>
|
||||
} else {
|
||||
eventSpecificInfo =
|
||||
<div className="rowAlignLeft">
|
||||
<p> moved {(transactionAmount / 1000000000000000000).toFixed(2)} LPT stake: </p>
|
||||
<button className="selectOrch" onClick={() => { obj.setOrchFunction(transactionFrom) }} >{transactionFrom}</button>
|
||||
<button className="selectOrch" onClick={() => { dispatch(getOrchestratorInfo(transactionFrom)) }} >{transactionFrom}</button>
|
||||
<p> to </p>
|
||||
<button className="selectOrch" onClick={() => { obj.setOrchFunction(transactionTo) }} >{transactionTo}</button>
|
||||
<button className="selectOrch" onClick={() => { dispatch(getOrchestratorInfo(transactionTo)) }} >{transactionTo}</button>
|
||||
</div>
|
||||
}
|
||||
} else if (transactionName === "Withdraw") {
|
||||
@ -196,7 +201,7 @@ const EventButton = (obj) => {
|
||||
<img alt="" src="livepeer.png" width="30" height="30" />
|
||||
</a>
|
||||
<div className="row">
|
||||
<button className="selectOrch" onClick={() => { obj.setOrchFunction(transactionCaller) }} >{transactionCaller}</button>
|
||||
<button className="selectOrch" onClick={() => { dispatch(getOrchestratorInfo(transactionCaller)) }} >{transactionCaller}</button>
|
||||
</div>
|
||||
</div>
|
||||
{eventSpecificInfo}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import React, { useState } from "react";
|
||||
import EventButton from "./eventButton";
|
||||
import ScrollContainer from 'react-indiana-drag-scroll';
|
||||
|
||||
@ -9,7 +9,7 @@ const withdrawStakeColour = "rgba(102, 3, 10, 0.3)";
|
||||
const stakeColour = "rgba(71, 23, 122, 0.3)";
|
||||
|
||||
const EventViewer = (obj) => {
|
||||
const [searchTerm, setSearchTerm] = useState("");
|
||||
const [searchTerm, setSearchTerm] = useState(obj.prefill || "");
|
||||
const [filterActivated, setFilterActivated] = useState(false);
|
||||
const [rewardActivated, setRewardActivated] = useState(false);
|
||||
const [updateActivated, setUpdateActivated] = useState(false);
|
||||
@ -28,23 +28,22 @@ const EventViewer = (obj) => {
|
||||
let finalIdx = 0;
|
||||
return (
|
||||
<div className="stroke roundedOpaque" style={{ padding: 0, margin: 0, marginTop: '2em', position: 'absolute', bottom: 0, top: '300px', left: '0px', right: '0px', overflowY: 'auto', overflowX: 'hidden', width: '100%' }}>
|
||||
<div className="fixed-container">
|
||||
<div className="rowAlignLeft">
|
||||
<input className="searchField"
|
||||
value={searchTerm}
|
||||
onChange={(evt) => setSearchTerm(evt.target.value)}
|
||||
placeholder='Filter by Orchestrator address'
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
<div className="fixed-container" style={{ padding: 0, width: '300px'}}>
|
||||
<input className="searchField" style={{ width: '300px' }}
|
||||
value={searchTerm}
|
||||
onChange={(evt) => setSearchTerm(evt.target.value)}
|
||||
placeholder='Filter by Orchestrator address'
|
||||
type="text"
|
||||
/>
|
||||
</div>
|
||||
<div className="content-wrapper" style={{alignItems: 'stretch', width: '100%'}}>
|
||||
<div className="content-wrapper" style={{ alignItems: 'stretch', width: '100%' }}>
|
||||
<ScrollContainer className="overflow-container" hideScrollbars={false}>
|
||||
<div className="overflow-content" style={{ cursor: 'grab' }}>
|
||||
<div className="overflow-content" style={{ cursor: 'grab', paddingTop: 0 }}>
|
||||
{obj.events.slice(0).reverse().map((eventObj, idx) => {
|
||||
// Filter
|
||||
if (eventObj.name === "WithdrawFees" || eventObj.name === "TransferBond"
|
||||
|| eventObj.name === "Rebond" || eventObj.name === "Unbond" || eventObj.name === "EarningsClaimed") {
|
||||
console.log("Skipping event" + eventObj);
|
||||
return;
|
||||
}
|
||||
// New transaction found
|
||||
@ -73,7 +72,6 @@ const EventViewer = (obj) => {
|
||||
transactionHash={finalHash}
|
||||
events={eventBundle}
|
||||
idx={finalIdx}
|
||||
setOrchFunction={obj.setOrchFunction}
|
||||
searchTerm={searchTerm}
|
||||
filterActivated={filterActivated}
|
||||
rewardActivated={rewardActivated}
|
||||
@ -85,28 +83,28 @@ const EventViewer = (obj) => {
|
||||
})}
|
||||
</div>
|
||||
</ScrollContainer>
|
||||
<div className="strokeSmollLeft" style={{marginRight: "1em"}}>
|
||||
<button className={filterActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: activationColour }} onClick={() => {
|
||||
<div className="strokeSmollLeft" style={{ marginRight: "1em" }}>
|
||||
<button className={filterActivated ? "row homeButton active" : "row homeButton"} style={{ backgroundColor: activationColour }} onClick={() => {
|
||||
setFilterActivated(!filterActivated);
|
||||
}}>
|
||||
<h3>Activated</h3>
|
||||
</button>
|
||||
<button className={rewardActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: rewardColour }} onClick={() => {
|
||||
<button className={rewardActivated ? "row homeButton active" : "row homeButton"} style={{ backgroundColor: rewardColour }} onClick={() => {
|
||||
setRewardActivated(!rewardActivated);
|
||||
}}>
|
||||
<h3>Reward</h3>
|
||||
</button>
|
||||
<button className={updateActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: updateColour }} onClick={() => {
|
||||
<button className={updateActivated ? "row homeButton active" : "row homeButton"} style={{ backgroundColor: updateColour }} onClick={() => {
|
||||
setUpdateActivated(!updateActivated);
|
||||
}}>
|
||||
<h3>Update</h3>
|
||||
</button>
|
||||
<button className={withdrawActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: withdrawStakeColour }} onClick={() => {
|
||||
<button className={withdrawActivated ? "row homeButton active" : "row homeButton"} style={{ backgroundColor: withdrawStakeColour }} onClick={() => {
|
||||
setWithdrawActivated(!withdrawActivated);
|
||||
}}>
|
||||
<h3>Withdraw</h3>
|
||||
</button>
|
||||
<button className={stakeActivated ? "row nonHomeButton active" : "row nonHomeButton"} style={{ backgroundColor: stakeColour }} onClick={() => {
|
||||
<button className={stakeActivated ? "row homeButton active" : "row homeButton"} style={{ backgroundColor: stakeColour }} onClick={() => {
|
||||
setStakeActivated(!stakeActivated);
|
||||
}}>
|
||||
<h3>Stake</h3>
|
||||
|
||||
167
src/grafana.js
167
src/grafana.js
@ -1,120 +1,93 @@
|
||||
import * as React from "react";
|
||||
import React, { useState } from 'react'
|
||||
import './style.css';
|
||||
import {
|
||||
Navigate
|
||||
} from "react-router-dom";
|
||||
import { connect } from "react-redux";
|
||||
import {
|
||||
getQuotes, getCurrentOrchestratorInfo
|
||||
} from "./actions/livepeer";
|
||||
import { useSelector } from 'react-redux'
|
||||
import Orchestrator from "./orchestratorViewer";
|
||||
|
||||
const mapStateToProps = (state) => {
|
||||
return {
|
||||
session: state.session,
|
||||
userstate: state.userstate,
|
||||
errors: state.errors,
|
||||
livepeer: state.livepeerstate
|
||||
}
|
||||
};
|
||||
const Grafana = (obj) => {
|
||||
const livepeer = useSelector((state) => state.livepeerstate);
|
||||
const [redirectToHome, setRedirectToHome] = useState(false);
|
||||
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
getQuotes: () => dispatch(getQuotes()),
|
||||
getCurrentOrchestratorInfo: () => dispatch(getCurrentOrchestratorInfo())
|
||||
});
|
||||
|
||||
class Grafana extends React.Component {
|
||||
state = {
|
||||
redirectToHome: false,
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
if (redirectToHome) {
|
||||
return <Navigate push to="/" />;
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.redirectToHome) {
|
||||
return <Navigate push to="/" />;
|
||||
let lptPrice = 0;
|
||||
let ethPrice = 0;
|
||||
let lptPriceChange24h = 0;
|
||||
let ethPriceChange24h = 0;
|
||||
if (livepeer.quotes) {
|
||||
if (livepeer.quotes.LPT) {
|
||||
lptPrice = livepeer.quotes.LPT.price.toFixed(2);
|
||||
lptPriceChange24h = livepeer.quotes.LPT.percent_change_24h.toFixed(2);
|
||||
}
|
||||
|
||||
let lptPrice = 0;
|
||||
let ethPrice = 0;
|
||||
let lptPriceChange24h = 0;
|
||||
let ethPriceChange24h = 0;
|
||||
if (this.props.livepeer.quotes) {
|
||||
if (this.props.livepeer.quotes.LPT) {
|
||||
lptPrice = this.props.livepeer.quotes.LPT.price.toFixed(2);
|
||||
lptPriceChange24h = this.props.livepeer.quotes.LPT.percent_change_24h.toFixed(2);
|
||||
}
|
||||
if (this.props.livepeer.quotes.ETH) {
|
||||
ethPrice = this.props.livepeer.quotes.ETH.price.toFixed(2);
|
||||
ethPriceChange24h = this.props.livepeer.quotes.ETH.percent_change_24h.toFixed(2);
|
||||
}
|
||||
if (livepeer.quotes.ETH) {
|
||||
ethPrice = livepeer.quotes.ETH.price.toFixed(2);
|
||||
ethPriceChange24h = livepeer.quotes.ETH.percent_change_24h.toFixed(2);
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
return (
|
||||
<div className="stroke" style={{ margin: 0, padding: 0 }}>
|
||||
<div className="row" style={{ margin: 0, padding: 0 }}>
|
||||
<button className="homeButton" onClick={() => {
|
||||
setRedirectToHome(true);
|
||||
}}>
|
||||
<img alt="" src="/livepeer.png" width="100em" height="100em" />
|
||||
</button>
|
||||
</div>
|
||||
<div className="stroke" style={{ margin: 0, padding: 0 }}>
|
||||
<div className="row" style={{ margin: 0, padding: 0 }}>
|
||||
<button className="homeButton" onClick={() => {
|
||||
this.setState({ redirectToHome: true });
|
||||
}}>
|
||||
<img alt="" src="/livepeer.png" width="100em" height="100em" />
|
||||
</button>
|
||||
</div>
|
||||
<div className="stroke" style={{ margin: 0, padding: 0 }}>
|
||||
<div className="flexContainer">
|
||||
<div className="stroke" style={{ marginTop: 0, marginBottom: 5, paddingBottom: 0 }}>
|
||||
<div className="stroke roundedOpaque" style={{}}>
|
||||
<div className="flexContainer">
|
||||
<div className="stroke" style={{ marginTop: 0, marginBottom: 5, paddingBottom: 0 }}>
|
||||
<div className="stroke roundedOpaque" style={{}}>
|
||||
<div className="row">
|
||||
<div className="row">
|
||||
<div className="row">
|
||||
<img alt="" src="livepeer.png" width="30" height="30" />
|
||||
<p>${lptPrice}</p>
|
||||
<p>({lptPriceChange24h}%)</p>
|
||||
</div>
|
||||
<div className="row">
|
||||
<h2> <a href="https://explorer.livepeer.org/accounts/0x847791cbf03be716a7fe9dc8c9affe17bd49ae5e/">Livepeer Orchestrator</a></h2>
|
||||
</div>
|
||||
<div className="row">
|
||||
<img alt="" src="eth.png" width="30" height="30" />
|
||||
<p>${ethPrice}</p>
|
||||
<p>({ethPriceChange24h}%)</p>
|
||||
</div>
|
||||
<img alt="" src="livepeer.png" width="30" height="30" />
|
||||
<p>${lptPrice}</p>
|
||||
<p>({lptPriceChange24h}%)</p>
|
||||
</div>
|
||||
<div className="stroke roundedOpaque" style={{ borderRadius: "1em", backgroundColor: "#111217" }}>
|
||||
<div className="row" style={{paddingLeft: "1em", paddingRight: "1em"}}>
|
||||
<Orchestrator thisOrchestrator={this.props.livepeer.thisOrchestrator} />
|
||||
</div>
|
||||
<div className="flexContainer" style={{ justifyContent: "center" }}>
|
||||
<iframe className="fullGrafana" src="https://grafana.stronk.tech/d-solo/71b6OZ0Gz/orchestrator-overview?orgId=1&refresh=5s&theme=dark&panelId=23763572056" height="200" frameBorder="0"></iframe>
|
||||
</div>
|
||||
<div className="flexContainer" style={{ justifyContent: "center" }}>
|
||||
<iframe className="fullGrafana" src="https://grafana.stronk.tech/d-solo/71b6OZ0Gz/orchestrator-overview?orgId=1&refresh=5s&theme=dark&panelId=23763572077" height="400" frameBorder="0"></iframe>
|
||||
</div>
|
||||
<div className="flexContainer" style={{ justifyContent: "center" }}>
|
||||
<iframe className="fullGrafana" src="https://grafana.stronk.tech/d-solo/71b6OZ0Gz/orchestrator-overview?orgId=1&refresh=5s&theme=dark&panelId=23763572032" height="200" frameBorder="0"></iframe>
|
||||
</div>
|
||||
<div className="flexContainer" style={{ justifyContent: "center" }}>
|
||||
<iframe className="fullGrafana" src="https://grafana.stronk.tech/d-solo/71b6OZ0Gz/orchestrator-overview?orgId=1&from=now-2d&to=now&refresh=5s&theme=dark&panelId=23763572040" height="400" frameBorder="0"></iframe>
|
||||
</div>
|
||||
<div className="row">
|
||||
<a href="https://grafana.stronk.tech/d/71b6OZ0Gz/orchestrator-overview?orgId=1&refresh=5s&theme=dark">
|
||||
<button className="waveButton">
|
||||
<img alt="" src="grafana.png" width="30" height="30" />
|
||||
<p>Full Statistics</p>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
<div className="row">
|
||||
<h2> <a href="https://explorer.livepeer.org/accounts/0x847791cbf03be716a7fe9dc8c9affe17bd49ae5e/">Livepeer Orchestrator</a></h2>
|
||||
</div>
|
||||
<div className="row">
|
||||
<img alt="" src="eth.png" width="30" height="30" />
|
||||
<p>${ethPrice}</p>
|
||||
<p>({ethPriceChange24h}%)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="stroke roundedOpaque" style={{ borderRadius: "1em", backgroundColor: "#111217" }}>
|
||||
<div className="row" style={{ paddingLeft: "1em", paddingRight: "1em" }}>
|
||||
<Orchestrator thisOrchestrator={livepeer.thisOrchestrator} />
|
||||
</div>
|
||||
<div className="flexContainer" style={{ justifyContent: "center" }}>
|
||||
<iframe className="fullGrafana" src="https://grafana.stronk.tech/d-solo/71b6OZ0Gz/orchestrator-overview?orgId=1&refresh=5s&theme=dark&panelId=23763572056" height="200" frameBorder="0"></iframe>
|
||||
</div>
|
||||
<div className="flexContainer" style={{ justifyContent: "center" }}>
|
||||
<iframe className="fullGrafana" src="https://grafana.stronk.tech/d-solo/71b6OZ0Gz/orchestrator-overview?orgId=1&refresh=5s&theme=dark&panelId=23763572077" height="400" frameBorder="0"></iframe>
|
||||
</div>
|
||||
<div className="flexContainer" style={{ justifyContent: "center" }}>
|
||||
<iframe className="fullGrafana" src="https://grafana.stronk.tech/d-solo/71b6OZ0Gz/orchestrator-overview?orgId=1&refresh=5s&theme=dark&panelId=23763572032" height="200" frameBorder="0"></iframe>
|
||||
</div>
|
||||
<div className="flexContainer" style={{ justifyContent: "center" }}>
|
||||
<iframe className="fullGrafana" src="https://grafana.stronk.tech/d-solo/71b6OZ0Gz/orchestrator-overview?orgId=1&from=now-2d&to=now&refresh=5s&theme=dark&panelId=23763572040" height="400" frameBorder="0"></iframe>
|
||||
</div>
|
||||
<div className="row">
|
||||
<a href="https://grafana.stronk.tech/d/71b6OZ0Gz/orchestrator-overview?orgId=1&refresh=5s&theme=dark">
|
||||
<button className="waveButton">
|
||||
<img alt="" src="grafana.png" width="30" height="30" />
|
||||
<p>Full Statistics</p>
|
||||
</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(Grafana);
|
||||
export default Grafana;
|
||||
|
||||
320
src/livepeer.js
320
src/livepeer.js
@ -1,9 +1,9 @@
|
||||
import * as React from "react";
|
||||
import React, { useState, useEffect } from 'react'
|
||||
import './style.css';
|
||||
import {
|
||||
Navigate
|
||||
Navigate, useSearchParams
|
||||
} from "react-router-dom";
|
||||
import { connect } from "react-redux";
|
||||
import { useSelector, useDispatch, batch } from 'react-redux'
|
||||
import {
|
||||
getQuotes, getBlockchainData, getEvents, getCurrentOrchestratorInfo, getOrchestratorInfo
|
||||
} from "./actions/livepeer";
|
||||
@ -11,190 +11,166 @@ import EventViewer from "./eventViewer";
|
||||
import Orchestrator from "./orchestratorViewer";
|
||||
import Stat from "./statViewer";
|
||||
|
||||
const mapStateToProps = (state) => {
|
||||
return {
|
||||
session: state.session,
|
||||
userstate: state.userstate,
|
||||
errors: state.errors,
|
||||
livepeer: state.livepeerstate
|
||||
}
|
||||
};
|
||||
// Refresh every 30 seconds
|
||||
const refreshInterval = 30000;
|
||||
|
||||
const mapDispatchToProps = dispatch => ({
|
||||
getQuotes: () => dispatch(getQuotes()),
|
||||
getBlockchainData: () => dispatch(getBlockchainData()),
|
||||
getEvents: () => dispatch(getEvents()),
|
||||
getCurrentOrchestratorInfo: () => dispatch(getCurrentOrchestratorInfo()),
|
||||
getOrchestratorInfo: (addr) => dispatch(getOrchestratorInfo(addr))
|
||||
});
|
||||
const Livepeer = (obj) => {
|
||||
const [prefill, setPrefill] = useSearchParams();
|
||||
const dispatch = useDispatch();
|
||||
const livepeer = useSelector((state) => state.livepeerstate);
|
||||
const [redirectToHome, setRedirectToHome] = useState(false);
|
||||
|
||||
class Livepeer extends React.Component {
|
||||
state = {
|
||||
redirectToHome: false,
|
||||
};
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
const refreshAllZeData = () => {
|
||||
batch(() => {
|
||||
dispatch(getQuotes())
|
||||
dispatch(getEvents())
|
||||
dispatch(getBlockchainData())
|
||||
dispatch(getCurrentOrchestratorInfo())
|
||||
});
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.props.getQuotes();
|
||||
this.props.getBlockchainData();
|
||||
this.props.getEvents();
|
||||
this.props.getCurrentOrchestratorInfo();
|
||||
useEffect(() => {
|
||||
if (prefill.get('orchAddr') != ""){
|
||||
dispatch(getOrchestratorInfo(prefill.get('orchAddr')));
|
||||
}
|
||||
if (refreshInterval) {
|
||||
const interval = setInterval(refreshAllZeData, refreshInterval);
|
||||
return () => clearInterval(interval);
|
||||
}
|
||||
}, [refreshInterval]);
|
||||
|
||||
if (redirectToHome) {
|
||||
return <Navigate push to="/" />;
|
||||
}
|
||||
|
||||
render() {
|
||||
if (this.state.redirectToHome) {
|
||||
return <Navigate push to="/" />;
|
||||
let ethPrice = 0;
|
||||
if (livepeer.quotes) {
|
||||
if (livepeer.quotes.ETH) {
|
||||
ethPrice = livepeer.quotes.ETH.price.toFixed(2);
|
||||
}
|
||||
}
|
||||
|
||||
let lptPrice = 0;
|
||||
let ethPrice = 0;
|
||||
let lptPriceChange24h = 0;
|
||||
let ethPriceChange24h = 0;
|
||||
if (this.props.livepeer.quotes) {
|
||||
if (this.props.livepeer.quotes.LPT) {
|
||||
lptPrice = this.props.livepeer.quotes.LPT.price.toFixed(2);
|
||||
lptPriceChange24h = this.props.livepeer.quotes.LPT.percent_change_24h.toFixed(2);
|
||||
}
|
||||
if (this.props.livepeer.quotes.ETH) {
|
||||
ethPrice = this.props.livepeer.quotes.ETH.price.toFixed(2);
|
||||
ethPriceChange24h = this.props.livepeer.quotes.ETH.percent_change_24h.toFixed(2);
|
||||
}
|
||||
}
|
||||
let l1GasFeeInGwei = 0;
|
||||
let l2GasFeeInGwei = 0;
|
||||
let redeemRewardCostL1 = 0;
|
||||
let redeemRewardCostL2 = 0;
|
||||
let claimTicketCostL1 = 0;
|
||||
let claimTicketCostL2 = 0;
|
||||
let withdrawFeeCostL1 = 0;
|
||||
let withdrawFeeCostL2 = 0;
|
||||
let stakeFeeCostL1 = 0;
|
||||
let stakeFeeCostL2 = 0;
|
||||
let commissionFeeCostL1 = 0;
|
||||
let commissionFeeCostL2 = 0;
|
||||
let serviceUriFeeCostL1 = 0;
|
||||
let serviceUriFeeCostL2 = 0;
|
||||
if (livepeer.blockchains) {
|
||||
l1GasFeeInGwei = livepeer.blockchains.l1GasFeeInGwei;
|
||||
l2GasFeeInGwei = livepeer.blockchains.l2GasFeeInGwei;
|
||||
redeemRewardCostL1 = livepeer.blockchains.redeemRewardCostL1;
|
||||
redeemRewardCostL2 = livepeer.blockchains.redeemRewardCostL2;
|
||||
claimTicketCostL1 = livepeer.blockchains.claimTicketCostL1;
|
||||
claimTicketCostL2 = livepeer.blockchains.claimTicketCostL2;
|
||||
withdrawFeeCostL1 = livepeer.blockchains.withdrawFeeCostL1;
|
||||
withdrawFeeCostL2 = livepeer.blockchains.withdrawFeeCostL2;
|
||||
stakeFeeCostL1 = livepeer.blockchains.stakeFeeCostL1;
|
||||
stakeFeeCostL2 = livepeer.blockchains.stakeFeeCostL2;
|
||||
commissionFeeCostL1 = livepeer.blockchains.commissionFeeCostL1;
|
||||
commissionFeeCostL2 = livepeer.blockchains.commissionFeeCostL2;
|
||||
serviceUriFeeCostL1 = livepeer.blockchains.serviceUriFeeCostL1;
|
||||
serviceUriFeeCostL2 = livepeer.blockchains.serviceUriFeeCostL2;
|
||||
}
|
||||
|
||||
let blockchainTime = 0;
|
||||
let l1Block = 0;
|
||||
let l2Block = 0;
|
||||
let l1GasFeeInGwei = 0;
|
||||
let l2GasFeeInGwei = 0;
|
||||
let redeemRewardCostL1 = 0;
|
||||
let redeemRewardCostL2 = 0;
|
||||
let claimTicketCostL1 = 0;
|
||||
let claimTicketCostL2 = 0;
|
||||
let withdrawFeeCostL1 = 0;
|
||||
let withdrawFeeCostL2 = 0;
|
||||
let stakeFeeCostL1 = 0;
|
||||
let stakeFeeCostL2 = 0;
|
||||
let commissionFeeCostL1 = 0;
|
||||
let commissionFeeCostL2 = 0;
|
||||
let serviceUriFeeCostL1 = 0;
|
||||
let serviceUriFeeCostL2 = 0;
|
||||
if (this.props.livepeer.blockchains) {
|
||||
blockchainTime = this.props.livepeer.blockchains.timestamp;
|
||||
l1GasFeeInGwei = this.props.livepeer.blockchains.l1GasFeeInGwei;
|
||||
l2GasFeeInGwei = this.props.livepeer.blockchains.l2GasFeeInGwei;
|
||||
redeemRewardCostL1 = this.props.livepeer.blockchains.redeemRewardCostL1;
|
||||
redeemRewardCostL2 = this.props.livepeer.blockchains.redeemRewardCostL2;
|
||||
claimTicketCostL1 = this.props.livepeer.blockchains.claimTicketCostL1;
|
||||
claimTicketCostL2 = this.props.livepeer.blockchains.claimTicketCostL2;
|
||||
withdrawFeeCostL1 = this.props.livepeer.blockchains.withdrawFeeCostL1;
|
||||
withdrawFeeCostL2 = this.props.livepeer.blockchains.withdrawFeeCostL2;
|
||||
l1Block = this.props.livepeer.blockchains.l1block;
|
||||
l2Block = this.props.livepeer.blockchains.l2block;
|
||||
stakeFeeCostL1 = this.props.livepeer.blockchains.stakeFeeCostL1;
|
||||
stakeFeeCostL2 = this.props.livepeer.blockchains.stakeFeeCostL2;
|
||||
commissionFeeCostL1 = this.props.livepeer.blockchains.commissionFeeCostL1;
|
||||
commissionFeeCostL2 = this.props.livepeer.blockchains.commissionFeeCostL2;
|
||||
serviceUriFeeCostL1 = this.props.livepeer.blockchains.serviceUriFeeCostL1;
|
||||
serviceUriFeeCostL2 = this.props.livepeer.blockchains.serviceUriFeeCostL2;
|
||||
let redeemRewardCostL1USD = 0;
|
||||
let redeemRewardCostL2USD = 0;
|
||||
let claimTicketCostL1USD = 0;
|
||||
let claimTicketCostL2USD = 0;
|
||||
let withdrawFeeCostL1USD = 0;
|
||||
let withdrawFeeCostL2USD = 0;
|
||||
let stakeFeeCostL1USD = 0;
|
||||
let stakeFeeCostL2USD = 0;
|
||||
let commissionFeeCostL1USD = 0;
|
||||
let commissionFeeCostL2USD = 0;
|
||||
let serviceUriFeeCostL1USD = 0;
|
||||
let serviceUriFeeCostL2USD = 0;
|
||||
if (l1GasFeeInGwei && ethPrice) {
|
||||
if (redeemRewardCostL1) {
|
||||
redeemRewardCostL1USD = (redeemRewardCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (claimTicketCostL1) {
|
||||
claimTicketCostL1USD = (claimTicketCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (withdrawFeeCostL1) {
|
||||
withdrawFeeCostL1USD = (withdrawFeeCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (stakeFeeCostL1) {
|
||||
stakeFeeCostL1USD = (stakeFeeCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (commissionFeeCostL1) {
|
||||
commissionFeeCostL1USD = (commissionFeeCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (serviceUriFeeCostL1) {
|
||||
serviceUriFeeCostL1USD = (serviceUriFeeCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
}
|
||||
if (l2GasFeeInGwei && ethPrice) {
|
||||
if (redeemRewardCostL2) {
|
||||
redeemRewardCostL2USD = (redeemRewardCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (claimTicketCostL2) {
|
||||
claimTicketCostL2USD = (claimTicketCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (withdrawFeeCostL2) {
|
||||
withdrawFeeCostL2USD = (withdrawFeeCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (stakeFeeCostL2) {
|
||||
stakeFeeCostL2USD = (stakeFeeCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (commissionFeeCostL2) {
|
||||
commissionFeeCostL2USD = (commissionFeeCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (serviceUriFeeCostL2) {
|
||||
serviceUriFeeCostL2USD = (serviceUriFeeCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
}
|
||||
|
||||
let redeemRewardCostL1USD = 0;
|
||||
let redeemRewardCostL2USD = 0;
|
||||
let claimTicketCostL1USD = 0;
|
||||
let claimTicketCostL2USD = 0;
|
||||
let withdrawFeeCostL1USD = 0;
|
||||
let withdrawFeeCostL2USD = 0;
|
||||
let stakeFeeCostL1USD = 0;
|
||||
let stakeFeeCostL2USD = 0;
|
||||
let commissionFeeCostL1USD = 0;
|
||||
let commissionFeeCostL2USD = 0;
|
||||
let serviceUriFeeCostL1USD = 0;
|
||||
let serviceUriFeeCostL2USD = 0;
|
||||
if (l1GasFeeInGwei && ethPrice) {
|
||||
if (redeemRewardCostL1) {
|
||||
redeemRewardCostL1USD = (redeemRewardCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (claimTicketCostL1) {
|
||||
claimTicketCostL1USD = (claimTicketCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (withdrawFeeCostL1) {
|
||||
withdrawFeeCostL1USD = (withdrawFeeCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (stakeFeeCostL1) {
|
||||
stakeFeeCostL1USD = (stakeFeeCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (commissionFeeCostL1) {
|
||||
commissionFeeCostL1USD = (commissionFeeCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (serviceUriFeeCostL1) {
|
||||
serviceUriFeeCostL1USD = (serviceUriFeeCostL1 * ethPrice).toFixed(2);
|
||||
}
|
||||
}
|
||||
if (l2GasFeeInGwei && ethPrice) {
|
||||
if (redeemRewardCostL2) {
|
||||
redeemRewardCostL2USD = (redeemRewardCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (claimTicketCostL2) {
|
||||
claimTicketCostL2USD = (claimTicketCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (withdrawFeeCostL2) {
|
||||
withdrawFeeCostL2USD = (withdrawFeeCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (stakeFeeCostL2) {
|
||||
stakeFeeCostL2USD = (stakeFeeCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (commissionFeeCostL2) {
|
||||
commissionFeeCostL2USD = (commissionFeeCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
if (serviceUriFeeCostL2) {
|
||||
serviceUriFeeCostL2USD = (serviceUriFeeCostL2 * ethPrice).toFixed(2);
|
||||
}
|
||||
}
|
||||
let eventsList = [];
|
||||
if (livepeer.events) {
|
||||
eventsList = livepeer.events;
|
||||
}
|
||||
|
||||
let eventsList = [];
|
||||
if (this.props.livepeer.events) {
|
||||
eventsList = this.props.livepeer.events;
|
||||
}
|
||||
let thisOrchObj;
|
||||
if (livepeer.selectedOrchestrator) {
|
||||
thisOrchObj = livepeer.selectedOrchestrator;
|
||||
}
|
||||
|
||||
let thisOrchObj;
|
||||
if (this.props.livepeer.selectedOrchestrator) {
|
||||
thisOrchObj = this.props.livepeer.selectedOrchestrator;
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={{ width: '100%', height: '100%' }}>
|
||||
<div className="row" style={{ margin: 0, padding: 0, backgroundColor: "rgba(180, 175, 252, 0.80)", boxSizing: "border-box", backdropDilter: "blur(6px)", boxSshadow: "9px 13px 18px 8px rgba(8, 7, 56, 0.692)", position: 'absolute', top: '0px', left: '0px', height: '300px', right: '0px', overflow: 'hidden' }}>
|
||||
<button className="homeButton" onClick={() => {
|
||||
this.setState({ redirectToHome: true });
|
||||
}}>
|
||||
<img alt="" src="livepeer.png" width="100em" height="100em" />
|
||||
</button>
|
||||
<div className="row" style={{ alignItems: 'stretch', height: '100%', flex: 2, padding: '1em' }}>
|
||||
<Orchestrator thisOrchestrator={thisOrchObj} />
|
||||
return (
|
||||
<div style={{ width: '100%', height: '100%' }}>
|
||||
<div className="row" style={{ margin: 0, padding: 0, backgroundColor: "rgba(180, 175, 252, 0.80)", boxSizing: "border-box", backdropDilter: "blur(6px)", boxSshadow: "9px 13px 18px 8px rgba(8, 7, 56, 0.692)", position: 'absolute', top: '0px', left: '0px', height: '300px', right: '0px', overflow: 'hidden' }}>
|
||||
<button className="homeButton" onClick={() => {
|
||||
setRedirectToHome(true);
|
||||
}}>
|
||||
<img alt="" src="livepeer.png" width="100em" height="100em" />
|
||||
</button>
|
||||
<div className="row" style={{ alignItems: 'stretch', height: '100%', flex: 2, padding: '1em' }}>
|
||||
<Orchestrator thisOrchestrator={thisOrchObj} />
|
||||
</div>
|
||||
<div className="stroke metaSidebar" style={{ padding: 0, flex: 1 }}>
|
||||
<div className="row" style={{ margin: 0, padding: 0 }}>
|
||||
<h3 style={{ margin: 0, padding: 0 }}>Smart contract prices</h3>
|
||||
</div>
|
||||
<div className="stroke metaSidebar" style={{ padding: 0, flex: 1 }}>
|
||||
<div className="row" style={{ margin: 0, padding: 0 }}>
|
||||
<h3 style={{ margin: 0, padding: 0 }}>Smart contract prices</h3>
|
||||
</div>
|
||||
<div className="stroke" style={{ margin: 0, padding: 0 }}>
|
||||
<Stat header={"Reward Call"} content={"$" + redeemRewardCostL2USD + " (vs " + redeemRewardCostL1USD + " on L1)"} />
|
||||
<Stat header={"Claim Ticket"} content={"$" + claimTicketCostL2USD + " (vs " + claimTicketCostL1USD + " on L1)"} />
|
||||
<Stat header={"Staking Fees"} content={"$" + stakeFeeCostL2USD + " (vs " + stakeFeeCostL1USD + " on L1)"} />
|
||||
<Stat header={"Change Commission"} content={"$" + commissionFeeCostL2USD + " (vs " + commissionFeeCostL1USD + " on L1)"} />
|
||||
<Stat header={"Change URI"} content={"$" + serviceUriFeeCostL2USD + " (vs " + serviceUriFeeCostL1USD + " on L1)"} />
|
||||
</div>
|
||||
<div className="stroke" style={{ margin: 0, padding: 0 }}>
|
||||
<Stat header={"Reward Call"} content={"$" + redeemRewardCostL2USD + " (vs " + redeemRewardCostL1USD + " on L1)"} />
|
||||
<Stat header={"Claim Ticket"} content={"$" + claimTicketCostL2USD + " (vs " + claimTicketCostL1USD + " on L1)"} />
|
||||
<Stat header={"Staking Fees"} content={"$" + stakeFeeCostL2USD + " (vs " + stakeFeeCostL1USD + " on L1)"} />
|
||||
<Stat header={"Change Commission"} content={"$" + commissionFeeCostL2USD + " (vs " + commissionFeeCostL1USD + " on L1)"} />
|
||||
<Stat header={"Change URI"} content={"$" + serviceUriFeeCostL2USD + " (vs " + serviceUriFeeCostL1USD + " on L1)"} />
|
||||
</div>
|
||||
</div >
|
||||
<EventViewer events={eventsList} setOrchFunction={this.props.getOrchestratorInfo} />
|
||||
</div>
|
||||
</div >
|
||||
);
|
||||
}
|
||||
<EventViewer events={eventsList} prefill={prefill.get('orchAddr')} />
|
||||
</div >
|
||||
);
|
||||
}
|
||||
|
||||
export default connect(
|
||||
mapStateToProps,
|
||||
mapDispatchToProps
|
||||
)(Livepeer);
|
||||
export default Livepeer;
|
||||
@ -1,5 +1,5 @@
|
||||
import * as React from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { connect, batch } from "react-redux";
|
||||
import {
|
||||
getVisitorStats
|
||||
} from "./actions/user";
|
||||
@ -20,20 +20,22 @@ const mapDispatchToProps = dispatch => ({
|
||||
getVisitorStats: () => dispatch(getVisitorStats()),
|
||||
login: () => dispatch(login()),
|
||||
getQuotes: () => dispatch(getQuotes()),
|
||||
getBlockchainData: () => dispatch(getBlockchainData()),
|
||||
getEvents: () => dispatch(getEvents()),
|
||||
getBlockchainData: () => dispatch(getBlockchainData()),
|
||||
getCurrentOrchestratorInfo: () => dispatch(getCurrentOrchestratorInfo())
|
||||
});
|
||||
|
||||
|
||||
class Startup extends React.Component {
|
||||
componentDidMount() {
|
||||
this.props.login();
|
||||
this.props.getVisitorStats();
|
||||
this.props.getQuotes();
|
||||
this.props.getBlockchainData();
|
||||
this.props.getEvents();
|
||||
this.props.getCurrentOrchestratorInfo();
|
||||
batch(() => {
|
||||
this.props.login();
|
||||
this.props.getVisitorStats();
|
||||
this.props.getQuotes();
|
||||
this.props.getBlockchainData();
|
||||
this.props.getEvents();
|
||||
this.props.getCurrentOrchestratorInfo();
|
||||
});
|
||||
}
|
||||
render() {
|
||||
return this.props.children;
|
||||
|
||||
@ -2,6 +2,27 @@ import React from "react";
|
||||
import ScrollContainer from "react-indiana-drag-scroll";
|
||||
import Stat from "./statViewer";
|
||||
|
||||
function updateClipboard(newClip) {
|
||||
navigator.clipboard.writeText(newClip).then(
|
||||
() => {
|
||||
console.log("Copied!");
|
||||
},
|
||||
() => {
|
||||
console.log("Copy failed!");
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
function copyLink(addr) {
|
||||
navigator.permissions
|
||||
.query({ name: "clipboard-write" })
|
||||
.then((result) => {
|
||||
if (result.state === "granted" || result.state === "prompt") {
|
||||
updateClipboard(addr);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const Orchestrator = (obj) => {
|
||||
let rewardCut = 0;
|
||||
let feeCut = 0;
|
||||
@ -41,7 +62,7 @@ const Orchestrator = (obj) => {
|
||||
return (
|
||||
<div className="hostInfo">
|
||||
<div className="strokeSmollLeft" style={{ display: "flex" }}>
|
||||
<div style={{ flexDirection: 'row', display: "flex" }} style={{marginTop: '1em'}}>
|
||||
<div style={{ flexDirection: 'row', display: "flex" }} style={{ marginTop: '1em' }}>
|
||||
<a href={thisUrl}>
|
||||
<h3 style={{ padding: 0, margin: 0 }}>Orchestrator Info</h3>
|
||||
{thisID}
|
||||
@ -52,11 +73,16 @@ const Orchestrator = (obj) => {
|
||||
<Stat header={"Fee Cut"} content={feeCut + "%"} />
|
||||
<Stat header={"Total Stake"} content={totalStake + " LPT"} />
|
||||
<Stat header={"Self Stake"} content={selfStake + " LPT(" + selfStakeRatio + ")%"} />
|
||||
<button className="homeButton" onClick={() => {
|
||||
copyLink(window.location.href + "?orchAddr=0x847791cbf03be716a7fe9dc8c9affe17bd49ae5e");
|
||||
}}>
|
||||
<img alt="" src="clipboard.svg" width="20em" height="20em" />
|
||||
</button>
|
||||
</div>
|
||||
<div className="strokeSmollLeft" style={{ alignItems: 'stretch', flex: 2, marginLeft: '1em', borderLeft: '3px solid rgba(15,15,15,0.05)' }}>
|
||||
<div className="row" style={{marginTop: '1em'}}>
|
||||
<h3 style={{ padding: 0, margin: 0 }}>Current Delegators</h3>
|
||||
</div>
|
||||
<div className="row" style={{ marginTop: '1em' }}>
|
||||
<h3 style={{ padding: 0, margin: 0 }}>Current Delegators</h3>
|
||||
</div>
|
||||
<div className="content-wrapper">
|
||||
<ScrollContainer className="overflow-container" hideScrollbars={false}>
|
||||
<div className="overflow-content" style={{ cursor: 'grab', height: '300px' }}>
|
||||
|
||||
@ -341,6 +341,9 @@ svg {
|
||||
box-shadow: 4px 5px 3px 2px rgba(8, 7, 56, 0.692);
|
||||
backdrop-filter: blur(6px);
|
||||
}
|
||||
.homeButton:active {
|
||||
box-shadow: inset -4px -5px 6px 4px rgba(8, 7, 56, 0.692);
|
||||
}
|
||||
.homeButton:disabled {
|
||||
cursor: default;
|
||||
opacity: 0.7;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user