chore: fix failling int test

Merge remote-tracking branch 'origin/develop' into chore/570-loader-component-css-animation-only
fix(governance): vote state update fix (#3023 )
2023-02-28 15:13:31 +01:00 · 2023-02-28 14:43:02 +01:00 · 2023-02-28 12:43:20 +00:00 · 2023-02-28 12:10:21 +00:00 · 2023-02-28 11:58:36 +01:00 · 2023-02-28 11:50:13 +01:00
38 changed files with 625 additions and 291 deletions
@@ -184,9 +184,8 @@ export const MarketDetails = ({
      content: (
        <>
          <p className="text-xs mb-4">
-            {`For liquidity orders count towards a commitment they have to be
-        within either the liquidity or price monitoring bounds (whichever is
-        tighter).`}
+            {`For liquidity orders to count towards a commitment, they must be
+            within the liquidity monitoring bounds.`}
          </p>
          <p className="text-xs mb-4">
            {`The liquidity price range is a ${liquidityPriceRange} difference from the mid
@@ -2761,7 +2761,7 @@
    "tranche_end": "2023-12-05T00:00:00.000Z",
    "total_added": "86666.297",
    "total_removed": "0",
-    "locked_amount": "66660.1864521651085953168",
+    "locked_amount": "66363.3098645820638555771",
    "deposits": [
      {
        "amount": "86666.297",
@@ -2827,7 +2827,7 @@
    "tranche_end": "2023-06-01T00:00:00.000Z",
    "total_added": "2500",
    "total_removed": "0",
-    "locked_amount": "1287.68044744607225",
+    "locked_amount": "1270.50582519332525",
    "deposits": [
      {
        "amount": "2500",
@@ -3214,8 +3214,8 @@
    "tranche_start": "2023-02-01T00:00:00.000Z",
    "tranche_end": "2023-08-01T00:00:00.000Z",
    "total_added": "37500",
-    "total_removed": "3295.491386325",
-    "locked_amount": "32060.042107888275",
+    "total_removed": "3376.096819125",
+    "locked_amount": "31800.99946286065125",
    "deposits": [
      {
        "amount": "7500",
@@ -3234,6 +3234,11 @@
        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
        "tx": "0xe69c28fbcb90092d264d098874523f580e45052a36a71b3f423431e84d4ca074"
      },
+      {
+        "amount": "80.6054328",
+        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
+        "tx": "0x1a73c48a20c37eb5f8214ecb3c1986d0b6a24ae6472533c556ec6c264814abb6"
+      },
      {
        "amount": "142.173112275",
        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
@@ -3288,6 +3293,12 @@
            "tranche_id": 34,
            "tx": "0xe69c28fbcb90092d264d098874523f580e45052a36a71b3f423431e84d4ca074"
          },
+          {
+            "amount": "80.6054328",
+            "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
+            "tranche_id": 34,
+            "tx": "0x1a73c48a20c37eb5f8214ecb3c1986d0b6a24ae6472533c556ec6c264814abb6"
+          },
          {
            "amount": "142.173112275",
            "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
@@ -3326,8 +3337,8 @@
          }
        ],
        "total_tokens": "7500",
-        "withdrawn_tokens": "1020.378203625",
-        "remaining_tokens": "6479.621796375"
+        "withdrawn_tokens": "1100.983636425",
+        "remaining_tokens": "6399.016363575"
      },
      {
        "address": "0x0B4e6fcE839B01ef43DA6F890FAC7B1Afb004600",
@@ -3359,7 +3370,7 @@
    "tranche_end": "2023-12-05T00:00:00.000Z",
    "total_added": "129999.45",
    "total_removed": "0",
-    "locked_amount": "66599.36741953379042928",
+    "locked_amount": "66302.761694482463735865",
    "deposits": [
      {
        "amount": "129999.45",
@@ -3425,7 +3436,7 @@
    "tranche_end": "2023-09-03T00:00:00.000Z",
    "total_added": "62600",
    "total_removed": "0",
-    "locked_amount": "32199.23383434805018",
+    "locked_amount": "31984.79667681380592",
    "deposits": [
      {
        "amount": "10000",
@@ -3618,7 +3629,7 @@
    "tranche_end": "2023-09-17T00:00:00.000Z",
    "total_added": "5000",
    "total_removed": "0",
-    "locked_amount": "2763.604610603755",
+    "locked_amount": "2746.477042110604",
    "deposits": [
      {
        "amount": "5000",
@@ -3829,7 +3840,7 @@
    "tranche_end": "2023-04-05T00:00:00.000Z",
    "total_added": "97499.58",
    "total_removed": "0",
-    "locked_amount": "8549.9770497729426934506",
+    "locked_amount": "8259.0344635706695729506",
    "deposits": [
      {
        "amount": "97499.58",
@@ -3862,7 +3873,7 @@
    "tranche_end": "2023-04-05T00:00:00.000Z",
    "total_added": "135173.4239508",
    "total_removed": "98230.390980249184455396",
-    "locked_amount": "11686.34253508108202110958958",
+    "locked_amount": "11288.674248884641168728801336",
    "deposits": [
      {
        "amount": "135173.4239508",
@@ -3908,7 +3919,7 @@
    "tranche_end": "2023-04-05T00:00:00.000Z",
    "total_added": "32499.86",
    "total_removed": "0",
-    "locked_amount": "3596.8276946333941696698",
+    "locked_amount": "3474.433172927820788048",
    "deposits": [
      {
        "amount": "32499.86",
@@ -3941,7 +3952,7 @@
    "tranche_end": "2023-04-05T00:00:00.000Z",
    "total_added": "10833.29",
    "total_removed": "0",
-    "locked_amount": "1170.7325118133853096759",
+    "locked_amount": "1130.8942826865467812457",
    "deposits": [
      {
        "amount": "10833.29",
@@ -3974,7 +3985,7 @@
    "tranche_end": "2023-04-05T00:00:00.000Z",
    "total_added": "22749.93",
    "total_removed": "4720.860935375",
-    "locked_amount": "4376.4596075425397060448",
+    "locked_amount": "4227.535409358637757934",
    "deposits": [
      {
        "amount": "6500",
@@ -4125,8 +4136,8 @@
    "tranche_start": "2022-11-01T00:00:00.000Z",
    "tranche_end": "2023-05-01T00:00:00.000Z",
    "total_added": "22500",
-    "total_removed": "4832.532899775",
-    "locked_amount": "7799.561176335174675",
+    "total_removed": "4913.13257745",
+    "locked_amount": "7644.13558931859975",
    "deposits": [
      {
        "amount": "7500",
@@ -4145,6 +4156,11 @@
        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
        "tx": "0xe098f85d049dae2f5ab1d8057e7ca1d1a02bc6c95602a8db87e2d78013e236a3"
      },
+      {
+        "amount": "80.599677675",
+        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
+        "tx": "0xe5b0236fdb114d861139db0bdec5bdc26b4e107ff73eb66bc4ba262a003fd872"
+      },
      {
        "amount": "142.17311235",
        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
@@ -4254,6 +4270,12 @@
            "tranche_id": 33,
            "tx": "0xe098f85d049dae2f5ab1d8057e7ca1d1a02bc6c95602a8db87e2d78013e236a3"
          },
+          {
+            "amount": "80.599677675",
+            "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
+            "tranche_id": 33,
+            "tx": "0xe5b0236fdb114d861139db0bdec5bdc26b4e107ff73eb66bc4ba262a003fd872"
+          },
          {
            "amount": "142.17311235",
            "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
@@ -4364,8 +4386,8 @@
          }
        ],
        "total_tokens": "7500",
-        "withdrawn_tokens": "4832.532899775",
-        "remaining_tokens": "2667.467100225"
+        "withdrawn_tokens": "4913.13257745",
+        "remaining_tokens": "2586.86742255"
      },
      {
        "address": "0x2539b51EbDE65a75672aBcfE9439a706a99D18D1",
@@ -4390,7 +4412,7 @@
    "tranche_end": "2023-06-02T00:00:00.000Z",
    "total_added": "1939928.38",
    "total_removed": "928642.9598472029154",
-    "locked_amount": "503547.66972674586634472",
+    "locked_amount": "496902.418486694568232482",
    "deposits": [
      {
        "amount": "1852091.69",
@@ -36770,7 +36792,7 @@
    "tranche_end": "2023-06-05T00:00:00.000Z",
    "total_added": "3732368.4671",
    "total_removed": "615950.831401702010493",
-    "locked_amount": "798278.776421275325414380233",
+    "locked_amount": "788067.33889606523904645906",
    "deposits": [
      {
        "amount": "1998.95815",
@@ -38118,8 +38140,8 @@
    "tranche_start": "2022-06-05T00:00:00.000Z",
    "tranche_end": "2023-12-05T00:00:00.000Z",
    "total_added": "15870102.715470999700000001",
-    "total_removed": "579941.15446796566514452",
-    "locked_amount": "8130332.8724344144040666925862118737483104",
+    "total_removed": "582201.49676312452960452",
+    "locked_amount": "8094123.7706069735612090126362156915950257",
    "deposits": [
      {
        "amount": "16249.93",
@@ -38633,6 +38655,21 @@
        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
        "tx": "0x2d99d4051c6ac81037db1eebf0f86b335ed9d1957f281134d07da192644a6a8c"
      },
+      {
+        "amount": "1468.73477394015521",
+        "user": "0xe3eB4CF43C072658401996b71D43eE26E573562D",
+        "tx": "0x525f9427c131bc2fdea7f556d16b7781faaa41e09c7735d1c02d1f7585cc49ab"
+      },
+      {
+        "amount": "373.300310898565875",
+        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
+        "tx": "0x9e97de704d81fdca889591198e04f05367514f11f4a1eddcbd6363aadb861955"
+      },
+      {
+        "amount": "418.307210320143375",
+        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
+        "tx": "0x1438fbbc780cb382033855d295fa2511deed15cd64506a62ae4e3cfe82b3678e"
+      },
      {
        "amount": "535.4042378778335",
        "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
@@ -40408,6 +40445,18 @@
            "tranche_id": 2,
            "tx": "0x2d99d4051c6ac81037db1eebf0f86b335ed9d1957f281134d07da192644a6a8c"
          },
+          {
+            "amount": "373.300310898565875",
+            "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
+            "tranche_id": 2,
+            "tx": "0x9e97de704d81fdca889591198e04f05367514f11f4a1eddcbd6363aadb861955"
+          },
+          {
+            "amount": "418.307210320143375",
+            "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
+            "tranche_id": 2,
+            "tx": "0x1438fbbc780cb382033855d295fa2511deed15cd64506a62ae4e3cfe82b3678e"
+          },
          {
            "amount": "535.4042378778335",
            "user": "0x20CD77B9FC2f1fEDfb6F184E25f7127BFE991C8b",
@@ -41622,8 +41671,8 @@
          }
        ],
        "total_tokens": "259998.8875",
-        "withdrawn_tokens": "126575.552865965027",
-        "remaining_tokens": "133423.334634034973"
+        "withdrawn_tokens": "127367.16038718373625",
+        "remaining_tokens": "132631.72711281626375"
      },
      {
        "address": "0x89051CAb67Bc7F8CC44F7e270c6EDaf1EC57676c",
@@ -41844,6 +41893,12 @@
          }
        ],
        "withdrawals": [
+          {
+            "amount": "1468.73477394015521",
+            "user": "0xe3eB4CF43C072658401996b71D43eE26E573562D",
+            "tranche_id": 2,
+            "tx": "0x525f9427c131bc2fdea7f556d16b7781faaa41e09c7735d1c02d1f7585cc49ab"
+          },
          {
            "amount": "1640.93679110232897",
            "user": "0xe3eB4CF43C072658401996b71D43eE26E573562D",
@@ -42086,8 +42141,8 @@
          }
        ],
        "total_tokens": "150551.801",
-        "withdrawn_tokens": "71968.00074341356817",
-        "remaining_tokens": "78583.80025658643183"
+        "withdrawn_tokens": "73436.73551735372338",
+        "remaining_tokens": "77115.06548264627662"
      },
      {
        "address": "0x4d982Ab0823fD2f48e934a7be2bb0a5374a26148",
@@ -43860,8 +43915,8 @@
    "tranche_start": "2021-11-05T00:00:00.000Z",
    "tranche_end": "2023-05-05T00:00:00.000Z",
    "total_added": "14597706.0446472999",
-    "total_removed": "5576016.212508497282613906",
-    "locked_amount": "1784426.168875606617258788877936648",
+    "total_removed": "5577113.077460725181649906",
+    "locked_amount": "1750998.157265811220227145011388614",
    "deposits": [
      {
        "amount": "129284.449",
@@ -44080,6 +44135,16 @@
        "user": "0x4Aa3c35F6CC2d507E5C18205ee57099A4C80B19b",
        "tx": "0xb4d9a135d2cfa85e52b9bb68a09ffaecde4ae4d1fab95e6f44d4dd902e2a45c9"
      },
+      {
+        "amount": "517.32707939510889525",
+        "user": "0x4Aa3c35F6CC2d507E5C18205ee57099A4C80B19b",
+        "tx": "0x07f42fed87b386a135f1b3be72112768a812687d6751cfd74e287ed3af3c16b7"
+      },
+      {
+        "amount": "579.53787283279014075",
+        "user": "0x4Aa3c35F6CC2d507E5C18205ee57099A4C80B19b",
+        "tx": "0x904f971f68cc70ba987688b8b26bcbd4e16ab1964b095de013e364f3ae7530c6"
+      },
      {
        "amount": "800.792718381487871",
        "user": "0x4Aa3c35F6CC2d507E5C18205ee57099A4C80B19b",
@@ -47047,6 +47112,18 @@
            "tranche_id": 3,
            "tx": "0xb4d9a135d2cfa85e52b9bb68a09ffaecde4ae4d1fab95e6f44d4dd902e2a45c9"
          },
+          {
+            "amount": "517.32707939510889525",
+            "user": "0x4Aa3c35F6CC2d507E5C18205ee57099A4C80B19b",
+            "tranche_id": 3,
+            "tx": "0x07f42fed87b386a135f1b3be72112768a812687d6751cfd74e287ed3af3c16b7"
+          },
+          {
+            "amount": "579.53787283279014075",
+            "user": "0x4Aa3c35F6CC2d507E5C18205ee57099A4C80B19b",
+            "tranche_id": 3,
+            "tx": "0x904f971f68cc70ba987688b8b26bcbd4e16ab1964b095de013e364f3ae7530c6"
+          },
          {
            "amount": "800.792718381487871",
            "user": "0x4Aa3c35F6CC2d507E5C18205ee57099A4C80B19b",
@@ -49563,8 +49640,8 @@
          }
        ],
        "total_tokens": "359123.469575",
-        "withdrawn_tokens": "314913.2361779904076005",
-        "remaining_tokens": "44210.2333970095923995"
+        "withdrawn_tokens": "316010.1011302183066365",
+        "remaining_tokens": "43113.3684447816933635"
      },
      {
        "address": "0xBdd412797c1B78535Afc5F71503b91fAbD0160fB",
@@ -50907,8 +50984,8 @@
    "tranche_start": "2021-10-05T00:00:00.000Z",
    "tranche_end": "2023-04-05T00:00:00.000Z",
    "total_added": "5778205.3912159303",
-    "total_removed": "3055768.040200763217391295",
-    "locked_amount": "388134.167902190321713268137737088",
+    "total_removed": "3063522.787392713967070295",
+    "locked_amount": "374926.558344229352055062527996886",
    "deposits": [
      {
        "amount": "552496.6455",
@@ -51052,6 +51129,11 @@
      }
    ],
    "withdrawals": [
+      {
+        "amount": "7754.747191950749679",
+        "user": "0xafa64cCa337eFEE0AD827F6C2684e69275226e90",
+        "tx": "0xb1d21b6f9cce4bfaf8870592e4cbc7a40f1ca7c13cd7c8c8bb1defeb49bc31b8"
+      },
      {
        "amount": "990.74735267405816",
        "user": "0xBc934494675a6ceB639B9EfEe5b9C0f017D35a75",
@@ -52595,6 +52677,12 @@
          }
        ],
        "withdrawals": [
+          {
+            "amount": "7754.747191950749679",
+            "user": "0xafa64cCa337eFEE0AD827F6C2684e69275226e90",
+            "tranche_id": 4,
+            "tx": "0xb1d21b6f9cce4bfaf8870592e4cbc7a40f1ca7c13cd7c8c8bb1defeb49bc31b8"
+          },
          {
            "amount": "4961.957448767374506",
            "user": "0xafa64cCa337eFEE0AD827F6C2684e69275226e90",
@@ -52843,8 +52931,8 @@
          }
        ],
        "total_tokens": "331498.5873",
-        "withdrawn_tokens": "301699.732563421740393",
-        "remaining_tokens": "29798.854736578259607"
+        "withdrawn_tokens": "309454.479755372490072",
+        "remaining_tokens": "22044.107544627509928"
      },
      {
        "address": "0x16da609341ed67750A8BCC5AAa2005471006Cd77",
@@ -52946,8 +53034,8 @@
    "tranche_start": "2022-06-05T00:00:00.000Z",
    "tranche_end": "2023-06-05T00:00:00.000Z",
    "total_added": "472355.6199999996",
-    "total_removed": "34416.2282090650685",
-    "locked_amount": "126491.83527997644210121089142566",
+    "total_removed": "34799.2735287010685",
+    "locked_amount": "124873.77463304148219969237087774",
    "deposits": [
      {
        "amount": "3000",
@@ -59581,6 +59669,16 @@
        "user": "0x7708B79e2bc3b7ab816E66aF33A8c9385f0FcA4b",
        "tx": "0x1c5bff9afd9ddc3c385d5a089f9784606b0bac24e59dba9f16e1445e52a9c41b"
      },
+      {
+        "amount": "191.524581432",
+        "user": "0x256274a216e0a349dC18cae08Ca45631176AF437",
+        "tx": "0xdc17c6673a771c209d6a3f8aaf89d12289034073da28c19047ff704b1fbf4fe2"
+      },
+      {
+        "amount": "191.520738204",
+        "user": "0xB3ae40b11af91BbD456022Bd42B4f36A8C0AEA9D",
+        "tx": "0x7d1caeef005902492763cabe888b5dc76fd9f224520323ac30c1927ae91a1778"
+      },
      {
        "amount": "57.900076104",
        "user": "0x96d882E908C06cD697Ea07266Fb8D14ae129A50b",
@@ -81490,6 +81588,12 @@
          }
        ],
        "withdrawals": [
+          {
+            "amount": "191.520738204",
+            "user": "0xB3ae40b11af91BbD456022Bd42B4f36A8C0AEA9D",
+            "tranche_id": 5,
+            "tx": "0x7d1caeef005902492763cabe888b5dc76fd9f224520323ac30c1927ae91a1778"
+          },
          {
            "amount": "102.196144088",
            "user": "0xB3ae40b11af91BbD456022Bd42B4f36A8C0AEA9D",
@@ -81498,8 +81602,8 @@
          }
        ],
        "total_tokens": "400",
-        "withdrawn_tokens": "102.196144088",
-        "remaining_tokens": "297.803855912"
+        "withdrawn_tokens": "293.716882292",
+        "remaining_tokens": "106.283117708"
      },
      {
        "address": "0x256274a216e0a349dC18cae08Ca45631176AF437",
@@ -81512,6 +81616,12 @@
          }
        ],
        "withdrawals": [
+          {
+            "amount": "191.524581432",
+            "user": "0x256274a216e0a349dC18cae08Ca45631176AF437",
+            "tranche_id": 5,
+            "tx": "0xdc17c6673a771c209d6a3f8aaf89d12289034073da28c19047ff704b1fbf4fe2"
+          },
          {
            "amount": "102.190930996",
            "user": "0x256274a216e0a349dC18cae08Ca45631176AF437",
@@ -81520,8 +81630,8 @@
          }
        ],
        "total_tokens": "400",
-        "withdrawn_tokens": "102.190930996",
-        "remaining_tokens": "297.809069004"
+        "withdrawn_tokens": "293.715512428",
+        "remaining_tokens": "106.284487572"
      },
      {
        "address": "0xB0473C4FeBd722a6d7eE561329d3134030318132",
@@ -0,0 +1,111 @@
+.pre-loader {
+  display: flex;
+  width: 100%;
+  min-height: 100vh;
+  justify-content: center;
+  align-items: center;
+}
+.pre-loader .loader-item {
+  width: 10px;
+  height: 10px;
+  background: #000;
+}
+.pre-loader .pre-loader-center {
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+}
+.pre-loader .pre-loader-wrapper {
+  width: 50px;
+  height: 50px;
+  display: flex;
+  flex-wrap: wrap;
+}
+.pre-loader .loader-item:nth-child(0) {
+  animation-delay: 0ms;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:first-child {
+  animation-delay: -50ms;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(2) {
+  animation-delay: 0.2s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(3) {
+  animation-delay: -0.6s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(4) {
+  animation-delay: 0.4s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(5) {
+  animation-delay: -0.5s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(6) {
+  animation-delay: 0.3s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(7) {
+  animation-delay: -1.4s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(8) {
+  animation-delay: 2s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(9) {
+  animation-delay: -0.9s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(10) {
+  animation-delay: 1.5s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(11) {
+  animation-delay: -0.55s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(12) {
+  animation-delay: 1.2s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(13) {
+  animation-delay: -0.65s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(14) {
+  animation-delay: 0.7s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(15) {
+  animation-delay: -3.75s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(16) {
+  animation-delay: 1.6s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item {
+  animation: flickering 0.4s linear infinite alternate;
+}
+@keyframes flickering {
+  0% {
+    opacity: 1;
+  }
+  25% {
+    opacity: 1;
+  }
+  26% {
+    opacity: 0;
+  }
+  to {
+    opacity: 0;
+  }
+}
+html.dark .pre-loader .loader-item {
+  background: #fff;
+}
@@ -0,0 +1,9 @@
+(function () {
+  var storedTheme = window.localStorage.getItem('theme');
+  if (
+    storedTheme === 'dark' ||
+    (!storedTheme && window.matchMedia('(prefers-color-scheme: dark)').matches)
+  ) {
+    document.documentElement.classList.add('dark');
+  }
+})();
@@ -5,6 +5,7 @@ import { VoteValue } from '@vegaprotocol/types';
 import { useEffect, useState } from 'react';
 import { useUserVoteQuery } from './__generated__/Vote';
 import { removePaginationWrapper } from '@vegaprotocol/react-helpers';
+import type { FinalizedVote } from '@vegaprotocol/governance';

 export enum VoteState {
  NotCast = 'NotCast',
@@ -21,25 +22,14 @@ export type Vote = {
  party: { id: string };
 };

-export type Votes = Array<Vote | null>;
-
-export function getUserVote(pubkey: string, yesVotes?: Votes, noVotes?: Votes) {
-  const yesVote = yesVotes?.find((v) => v && v.party.id === pubkey);
-  const noVote = noVotes?.find((v) => v && v.party.id === pubkey);
-  if (yesVote) {
-    return yesVote;
-  } else if (noVote) {
-    return noVote;
-  } else {
-    return null;
-  }
-}
-
 /**
 * Finds the status of a users given vote in a given proposal and provides
 * a function to send a vote transaction to your wallet
 */
-export function useUserVote(proposalId: string | null | undefined) {
+export function useUserVote(
+  proposalId: string | null | undefined,
+  finalizedVote?: FinalizedVote | null
+) {
  const { pubKey } = useVegaWallet();
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const [timeout, setTimeoutValue] = useState<any>(null);
@@ -50,10 +40,27 @@ export function useUserVote(proposalId: string | null | undefined) {
    variables: { partyId: pubKey || '' },
    skip: !pubKey || !proposalId,
  });
+  const [userVote, setUserVote] = useState<FinalizedVote | undefined>(
+    undefined
+  );

-  const userVote = removePaginationWrapper(
-    data?.party?.votesConnection?.edges
-  ).find(({ proposalId: pId }) => proposalId === pId);
+  useEffect(() => {
+    if (finalizedVote?.vote.value) {
+      setUserVote(finalizedVote);
+    } else if (data?.party?.votesConnection?.edges) {
+      // This sets the vote (if any) when the user first loads the page
+      setUserVote(
+        removePaginationWrapper(data?.party?.votesConnection?.edges).find(
+          ({ proposalId: pId }) => proposalId === pId
+        )
+      );
+    }
+  }, [
+    finalizedVote?.vote.value,
+    data?.party?.votesConnection?.edges,
+    finalizedVote,
+    proposalId,
+  ]);

  // If user vote changes update the vote state
  useEffect(() => {
@@ -22,6 +22,8 @@ describe('Vote buttons', () => {
              minVoterBalance={null}
              spamProtectionMinTokens={null}
              currentStakeAvailable={new BigNumber(1)}
+              dialog={() => <div>Blah</div>}
+              submit={() => Promise.resolve()}
            />
          </VegaWalletContext.Provider>
        </MockedProvider>
@@ -43,6 +45,8 @@ describe('Vote buttons', () => {
              minVoterBalance={null}
              spamProtectionMinTokens={null}
              currentStakeAvailable={new BigNumber(1)}
+              dialog={() => <div>Blah</div>}
+              submit={() => Promise.resolve()}
            />
          </VegaWalletContext.Provider>
        </MockedProvider>
@@ -75,6 +79,8 @@ describe('Vote buttons', () => {
              minVoterBalance={null}
              spamProtectionMinTokens={null}
              currentStakeAvailable={new BigNumber(1)}
+              dialog={() => <div>Blah</div>}
+              submit={() => Promise.resolve()}
            />
          </VegaWalletContext.Provider>
        </MockedProvider>
@@ -97,6 +103,8 @@ describe('Vote buttons', () => {
              minVoterBalance={null}
              spamProtectionMinTokens={null}
              currentStakeAvailable={new BigNumber(0)}
+              dialog={() => <div>Blah</div>}
+              submit={() => Promise.resolve()}
            />
          </VegaWalletContext.Provider>
        </MockedProvider>
@@ -120,6 +128,8 @@ describe('Vote buttons', () => {
              minVoterBalance="2000000000000000000"
              spamProtectionMinTokens="1000000000000000000"
              currentStakeAvailable={new BigNumber(1)}
+              dialog={() => <div>Blah</div>}
+              submit={() => Promise.resolve()}
            />
          </VegaWalletContext.Provider>
        </MockedProvider>
@@ -145,6 +155,8 @@ describe('Vote buttons', () => {
              minVoterBalance="2000000000000000000"
              spamProtectionMinTokens="1000000000000000000"
              currentStakeAvailable={new BigNumber(10)}
+              dialog={() => <div>Blah</div>}
+              submit={() => Promise.resolve()}
            />
          </VegaWalletContext.Provider>
        </MockedProvider>
@@ -167,6 +179,8 @@ describe('Vote buttons', () => {
              minVoterBalance="2000000000000000000"
              spamProtectionMinTokens="1000000000000000000"
              currentStakeAvailable={new BigNumber(10)}
+              dialog={() => <div>Blah</div>}
+              submit={() => Promise.resolve()}
            />
          </VegaWalletContext.Provider>
        </MockedProvider>
@@ -4,7 +4,6 @@ import { useTranslation } from 'react-i18next';
 import { useVegaWallet, useVegaWalletDialogStore } from '@vegaprotocol/wallet';
 import { AsyncRenderer, Button, ButtonLink } from '@vegaprotocol/ui-toolkit';
 import { addDecimal, toBigNum } from '@vegaprotocol/react-helpers';
-import { useVoteSubmit } from '@vegaprotocol/governance';
 import { ProposalState, VoteValue } from '@vegaprotocol/types';
 import {
  AppStateActionType,
@@ -16,6 +15,7 @@ import { VoteState } from './use-user-vote';
 import { ProposalMinRequirements, ProposalUserAction } from '../shared';
 import { VoteTransactionDialog } from './vote-transaction-dialog';
 import { useVoteButtonsQuery } from './__generated__/Stake';
+import type { DialogProps } from '@vegaprotocol/wallet';

 interface VoteButtonsContainerProps {
  voteState: VoteState | null;
@@ -24,6 +24,8 @@ interface VoteButtonsContainerProps {
  proposalState: ProposalState;
  minVoterBalance: string | null;
  spamProtectionMinTokens: string | null;
+  submit: (voteValue: VoteValue, proposalId: string | null) => Promise<void>;
+  dialog: (props: DialogProps) => JSX.Element;
  className?: string;
 }

@@ -62,11 +64,12 @@ export const VoteButtons = ({
  currentStakeAvailable,
  minVoterBalance,
  spamProtectionMinTokens,
+  submit,
+  dialog: Dialog,
 }: VoteButtonsProps) => {
  const { t } = useTranslation();
  const { appDispatch } = useAppState();
  const { pubKey } = useVegaWallet();
-  const { submit, Dialog } = useVoteSubmit();
  const { openVegaWalletDialog } = useVegaWalletDialogStore((store) => ({
    openVegaWalletDialog: store.openVegaWalletDialog,
  }));
@@ -2,7 +2,7 @@ import { useTranslation } from 'react-i18next';
 import { formatDistanceToNow } from 'date-fns';
 import { useVegaWallet } from '@vegaprotocol/wallet';
 import { ProposalState } from '@vegaprotocol/types';
-import { VoteProgress } from '@vegaprotocol/governance';
+import { useVoteSubmit, VoteProgress } from '@vegaprotocol/governance';
 import { formatNumber } from '../../../../lib/format-number';
 import { ConnectToVega } from '../../../../components/connect-to-vega';
 import { useVoteInformation } from '../../hooks';
@@ -44,7 +44,8 @@ export const VoteDetails = ({
  } = useVoteInformation({ proposal });

  const { t } = useTranslation();
-  const { voteState, voteDatetime } = useUserVote(proposal?.id);
+  const { submit, Dialog, finalizedVote } = useVoteSubmit();
+  const { voteState, voteDatetime } = useUserVote(proposal?.id, finalizedVote);
  const defaultDecimals = 2;
  const daysLeft = t('daysLeft', {
    daysLeft: formatDistanceToNow(new Date(proposal?.terms.closingDatetime)),
@@ -188,6 +189,8 @@ export const VoteDetails = ({
                minVoterBalance={minVoterBalance}
                spamProtectionMinTokens={spamProtectionMinTokens}
                className="flex"
+                submit={submit}
+                dialog={Dialog}
              />
            )}
          </section>
@@ -50,10 +50,11 @@ const DisplayReward = ({
    >
      <button>
        <div className="flex flex-col items-start">
-          <span>{formatNumber(toBigNum(reward, decimals))}</span>
+          <span>{formatNumber(toBigNum(reward, decimals), 4)}</span>
          {percentageOfTotal && (
            <span className="text-vega-dark-300">
-              ({formatNumber(toBigNum(percentageOfTotal, 4)).toString()}%)
+              ({formatNumber(percentageOfTotal, 4).toString()}
+              %)
            </span>
          )}
        </div>
@@ -8,7 +8,7 @@ describe('generateEpochIndividualRewardsList', () => {
    amount: '100',
    percentageOfTotal: '0.1',
    receivedAt: new Date(),
-    asset: { id: 'usd', symbol: 'USD' },
+    asset: { id: 'usd', symbol: 'USD', name: 'USD' },
    party: { id: 'blah' },
    epoch: { id: '1' },
  };
@@ -18,7 +18,7 @@ describe('generateEpochIndividualRewardsList', () => {
    amount: '50',
    percentageOfTotal: '0.05',
    receivedAt: new Date(),
-    asset: { id: 'eur', symbol: 'EUR' },
+    asset: { id: 'eur', symbol: 'EUR', name: 'EUR' },
    party: { id: 'blah' },
    epoch: { id: '2' },
  };
@@ -28,7 +28,7 @@ describe('generateEpochIndividualRewardsList', () => {
    amount: '200',
    percentageOfTotal: '0.2',
    receivedAt: new Date(),
-    asset: { id: 'gbp', symbol: 'GBP' },
+    asset: { id: 'gbp', symbol: 'GBP', name: 'GBP' },
    party: { id: 'blah' },
    epoch: { id: '2' },
  };
@@ -38,7 +38,7 @@ describe('generateEpochIndividualRewardsList', () => {
    amount: '100',
    percentageOfTotal: '0.1',
    receivedAt: new Date(),
-    asset: { id: 'usd', symbol: 'USD' },
+    asset: { id: 'usd', symbol: 'USD', name: 'USD' },
    party: { id: 'blah' },
    epoch: { id: '1' },
  };
@@ -48,7 +48,7 @@ describe('generateEpochIndividualRewardsList', () => {
    amount: '50',
    percentageOfTotal: '0.05',
    receivedAt: new Date(),
-    asset: { id: 'eur', symbol: 'EUR' },
+    asset: { id: 'eur', symbol: 'EUR', name: 'EUR' },
    party: { id: 'blah' },
    epoch: { id: '2' },
  };
@@ -134,20 +134,20 @@ describe('generateEpochIndividualRewardsList', () => {
        epoch: '2',
        rewards: [
          {
-            asset: 'EUR',
-            totalAmount: '50',
+            asset: 'GBP',
+            totalAmount: '200',
            rewardTypes: {
              [AccountType.ACCOUNT_TYPE_FEES_INFRASTRUCTURE]: {
                amount: '0',
                percentageOfTotal: '0',
              },
              [AccountType.ACCOUNT_TYPE_FEES_LIQUIDITY]: {
-                amount: '0',
-                percentageOfTotal: '0',
+                amount: '200',
+                percentageOfTotal: '0.2',
              },
              [AccountType.ACCOUNT_TYPE_GLOBAL_REWARD]: {
-                amount: '50',
-                percentageOfTotal: '0.05',
+                amount: '0',
+                percentageOfTotal: '0',
              },
              [AccountType.ACCOUNT_TYPE_REWARD_MAKER_PAID_FEES]: {
                amount: '0',
@@ -164,21 +164,21 @@ describe('generateEpochIndividualRewardsList', () => {
            },
          },
          {
-            asset: 'GBP',
-            totalAmount: '200',
+            asset: 'EUR',
+            totalAmount: '50',
            rewardTypes: {
              [AccountType.ACCOUNT_TYPE_FEES_INFRASTRUCTURE]: {
                amount: '0',
                percentageOfTotal: '0',
              },
              [AccountType.ACCOUNT_TYPE_FEES_LIQUIDITY]: {
-                amount: '200',
-                percentageOfTotal: '0.2',
-              },
-              [AccountType.ACCOUNT_TYPE_GLOBAL_REWARD]: {
                amount: '0',
                percentageOfTotal: '0',
              },
+              [AccountType.ACCOUNT_TYPE_GLOBAL_REWARD]: {
+                amount: '50',
+                percentageOfTotal: '0.05',
+              },
              [AccountType.ACCOUNT_TYPE_REWARD_MAKER_PAID_FEES]: {
                amount: '0',
                percentageOfTotal: '0',
@@ -33,7 +33,7 @@ export const generateEpochIndividualRewardsList = (
  // We take the rewards and aggregate them by epoch and asset.
  const epochIndividualRewards = rewards.reduce((map, reward) => {
    const epochId = reward.epoch.id;
-    const assetName = reward.asset.symbol;
+    const assetName = reward.asset.name;
    const rewardType = reward.rewardType;
    const amount = reward.amount;
    const percentageOfTotal = reward.percentageOfTotal;
@@ -70,6 +70,12 @@ export const generateEpochIndividualRewardsList = (
      '0'
    );

+    if (epoch) {
+      epoch.rewards = epoch.rewards.sort((a, b) => {
+        return new BigNumber(b.totalAmount).comparedTo(a.totalAmount);
+      });
+    }
+
    return map;
  }, new Map<string, EpochIndividualReward>());

@@ -5,6 +5,7 @@ import type {
 import { removePaginationWrapper } from '@vegaprotocol/react-helpers';
 import { RowAccountTypes } from '../shared-rewards-table-assets/shared-rewards-table-assets';
 import type { AccountType } from '@vegaprotocol/types';
+import { BigNumber } from '../../../lib/bignumber';

 interface EpochSummaryWithNamedReward extends EpochRewardSummaryFieldsFragment {
  name: string;
@@ -120,7 +121,9 @@ export const generateEpochTotalRewardsList = (

      return {
        epoch: epochSummaries[0].epoch,
-        assetRewards,
+        assetRewards: assetRewards.sort((a, b) => {
+          return new BigNumber(b.totalAmount).comparedTo(a.totalAmount);
+        }),
      };
    });

@@ -3,6 +3,7 @@ fragment RewardFields on Reward {
  asset {
    id
    symbol
+    name
  }
  party {
    id
@@ -3,7 +3,7 @@ import * as Types from '@vegaprotocol/types';
 import { gql } from '@apollo/client';
 import * as Apollo from '@apollo/client';
 const defaultOptions = {} as const;
-export type RewardFieldsFragment = { __typename?: 'Reward', rewardType: Types.AccountType, amount: string, percentageOfTotal: string, receivedAt: any, asset: { __typename?: 'Asset', id: string, symbol: string }, party: { __typename?: 'Party', id: string }, epoch: { __typename?: 'Epoch', id: string } };
+export type RewardFieldsFragment = { __typename?: 'Reward', rewardType: Types.AccountType, amount: string, percentageOfTotal: string, receivedAt: any, asset: { __typename?: 'Asset', id: string, symbol: string, name: string }, party: { __typename?: 'Party', id: string }, epoch: { __typename?: 'Epoch', id: string } };

 export type DelegationFieldsFragment = { __typename?: 'Delegation', amount: string, epoch: number };

@@ -13,7 +13,7 @@ export type RewardsQueryVariables = Types.Exact<{
 }>;


-export type RewardsQuery = { __typename?: 'Query', party?: { __typename?: 'Party', id: string, rewardsConnection?: { __typename?: 'RewardsConnection', edges?: Array<{ __typename?: 'RewardEdge', node: { __typename?: 'Reward', rewardType: Types.AccountType, amount: string, percentageOfTotal: string, receivedAt: any, asset: { __typename?: 'Asset', id: string, symbol: string }, party: { __typename?: 'Party', id: string }, epoch: { __typename?: 'Epoch', id: string } } } | null> | null } | null, delegationsConnection?: { __typename?: 'DelegationsConnection', edges?: Array<{ __typename?: 'DelegationEdge', node: { __typename?: 'Delegation', amount: string, epoch: number } } | null> | null } | null } | null, epoch: { __typename?: 'Epoch', id: string, timestamps: { __typename?: 'EpochTimestamps', start?: any | null, end?: any | null, expiry?: any | null } } };
+export type RewardsQuery = { __typename?: 'Query', party?: { __typename?: 'Party', id: string, rewardsConnection?: { __typename?: 'RewardsConnection', edges?: Array<{ __typename?: 'RewardEdge', node: { __typename?: 'Reward', rewardType: Types.AccountType, amount: string, percentageOfTotal: string, receivedAt: any, asset: { __typename?: 'Asset', id: string, symbol: string, name: string }, party: { __typename?: 'Party', id: string }, epoch: { __typename?: 'Epoch', id: string } } } | null> | null } | null, delegationsConnection?: { __typename?: 'DelegationsConnection', edges?: Array<{ __typename?: 'DelegationEdge', node: { __typename?: 'Delegation', amount: string, epoch: number } } | null> | null } | null } | null, epoch: { __typename?: 'Epoch', id: string, timestamps: { __typename?: 'EpochTimestamps', start?: any | null, end?: any | null, expiry?: any | null } } };

 export type EpochRewardSummaryFieldsFragment = { __typename?: 'EpochRewardSummary', epoch: number, assetId: string, amount: string, rewardType: Types.AccountType };

@@ -37,6 +37,7 @@ export const RewardFieldsFragmentDoc = gql`
  asset {
    id
    symbol
+    name
  }
  party {
    id
@@ -126,18 +126,11 @@ describe('market info is displayed', { tags: '@smoke' }, () => {
  });

  it('price monitoring trigger displayed', () => {
-    cy.getByTestId(marketTitle).contains('Price monitoring trigger 1').click();
-
-    validateMarketDataRow(0, 'Horizon Secs', '43,200');
-    validateMarketDataRow(1, 'Probability', '1');
-    validateMarketDataRow(2, 'Auction Extension Secs', '600');
-  });
-
-  it('price monitoring bound displayed', () => {
-    cy.getByTestId(marketTitle).contains('Price monitoring bound 1').click();
-
-    validateMarketDataRow(0, 'Min Valid Price', '6.54701 ');
-    validateMarketDataRow(1, 'Max Valid Price', '7.97323 ');
+    cy.getByTestId(marketTitle).contains('Price monitoring bounds 1').click();
+    cy.get('p.col-span-1').contains('100% probability of trading');
+    cy.get('p.col-span-1').contains('Within 43,200 seconds');
+    validateMarketDataRow(0, 'Highest Price', '7.97323 ');
+    validateMarketDataRow(1, 'Lowest Price', '6.54701 ');
    validateMarketDataRow(2, 'Reference Price', '7.22625 ');
  });

@@ -9,11 +9,15 @@ export const Preloader = () => {
            display: block;
            width: 100%;
            height: 100%;
+            margin: 0;
          }
+           html.dark body{
+             background: #000;
+           }
        `}
      </style>
      <div className="pre-loader">
-        <Loader forceTheme="light" preloader />
+        <Loader />
      </div>
    </>
  );
@@ -22,7 +22,6 @@ import {
  useInitializeEnv,
 } from '@vegaprotocol/environment';
 import './styles.css';
-import './gen-styles.scss';
 import { useGlobalStore, usePageTitleStore } from '../stores';
 import { Footer } from '../components/footer';
 import { useMemo, useState } from 'react';
@@ -19,12 +19,13 @@ export default function Document() {
          type="image/x-icon"
          href="https://static.vega.xyz/favicon.ico"
        />
+        <script src="/theme-setter.js" type="text/javascript" async />
        {['1', 'true'].includes(process.env['NX_USE_ENV_OVERRIDES'] || '') ? (
          /* eslint-disable-next-line @next/next/no-sync-scripts */
          <script src="/assets/env-config.js" type="text/javascript" />
        ) : null}
      </Head>
-      <body className="font-alpha">
+      <body className="font-alpha dark:bg-black dark:text-white">
        <Main />
        <NextScript />
      </body>
@@ -4,17 +4,10 @@
  min-height: 100vh;
  justify-content: center;
  align-items: center;
-
-  @for $i from 0 through 16 {
-    .loader-item:nth-child(#{$i}) {
-      @if $i % 2 == 0 {
-        animation-delay: #{$i * 50 * random(5)}ms;
-        animation-direction: reverse;
-      } @else {
-        animation-delay: #{$i * -50 * random(5)}ms;
-        animation-direction: alternate;
-      }
-    }
+  .loader-item {
+    width: 10px;
+    height: 10px;
+    background: black;
  }
  .pre-loader-center {
    align-items: center;
@@ -27,24 +20,39 @@
    display: flex;
    flex-wrap: wrap;
  }
+  @for $i from 0 through 16 {
+    .loader-item:nth-child(#{$i}) {
+      @if $i % 2 == 0 {
+        animation-delay: #{$i * 50 * random(5)}ms;
+        animation-direction: reverse;
+      } @else {
+        animation-delay: #{$i * -50 * random(5)}ms;
+        animation-direction: alternate;
+      }
+    }
+  }
  .loader-item {
-    width: 10px;
-    height: 10px;
-    background: black;
-    animation: flickering 0.4s steps(2, jump-none) alternate infinite;
+    animation: flickering 0.4s linear alternate infinite;
+  }
+  @keyframes flickering {
+    0% {
+      opacity: 1;
+    }
+    25% {
+      opacity: 1;
+    }
+    26% {
+      opacity: 0;
+    }
+    100% {
+      opacity: 0;
+    }
  }
 }
-@keyframes flickering {
-  0% {
-    opacity: 1;
-  }
-  25% {
-    opacity: 1;
-  }
-  26% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 0;
+html.dark {
+  .pre-loader {
+    .loader-item {
+      background: white;
+    }
  }
 }
@@ -5,73 +5,10 @@
  justify-content: center;
  align-items: center;
 }
-.pre-loader .loader-item:nth-child(0) {
-  animation-delay: 0ms;
-  animation-direction: reverse;
-}
-.pre-loader .loader-item:first-child {
-  animation-delay: -0.2s;
-  animation-direction: alternate;
-}
-.pre-loader .loader-item:nth-child(2) {
-  animation-delay: 0.1s;
-  animation-direction: reverse;
-}
-.pre-loader .loader-item:nth-child(3) {
-  animation-delay: -0.15s;
-  animation-direction: alternate;
-}
-.pre-loader .loader-item:nth-child(4) {
-  animation-delay: 1s;
-  animation-direction: reverse;
-}
-.pre-loader .loader-item:nth-child(5) {
-  animation-delay: -0.25s;
-  animation-direction: alternate;
-}
-.pre-loader .loader-item:nth-child(6) {
-  animation-delay: 0.3s;
-  animation-direction: reverse;
-}
-.pre-loader .loader-item:nth-child(7) {
-  animation-delay: -1.05s;
-  animation-direction: alternate;
-}
-.pre-loader .loader-item:nth-child(8) {
-  animation-delay: 0.8s;
-  animation-direction: reverse;
-}
-.pre-loader .loader-item:nth-child(9) {
-  animation-delay: -0.9s;
-  animation-direction: alternate;
-}
-.pre-loader .loader-item:nth-child(10) {
-  animation-delay: 0.5s;
-  animation-direction: reverse;
-}
-.pre-loader .loader-item:nth-child(11) {
-  animation-delay: -2.75s;
-  animation-direction: alternate;
-}
-.pre-loader .loader-item:nth-child(12) {
-  animation-delay: 2.4s;
-  animation-direction: reverse;
-}
-.pre-loader .loader-item:nth-child(13) {
-  animation-delay: -0.65s;
-  animation-direction: alternate;
-}
-.pre-loader .loader-item:nth-child(14) {
-  animation-delay: 0.7s;
-  animation-direction: reverse;
-}
-.pre-loader .loader-item:nth-child(15) {
-  animation-delay: -3s;
-  animation-direction: alternate;
-}
-.pre-loader .loader-item:nth-child(16) {
-  animation-delay: 2.4s;
-  animation-direction: reverse;
+.pre-loader .loader-item {
+  width: 10px;
+  height: 10px;
+  background: #000;
 }
 .pre-loader .pre-loader-center {
  align-items: center;
@@ -84,11 +21,81 @@
  display: flex;
  flex-wrap: wrap;
 }
+@media (prefers-color-scheme: light) {
+  .pre-loader .loader-item {
+    background: #000;
+  }
+}
+.pre-loader .loader-item:nth-child(0) {
+  animation-delay: 0ms;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:first-child {
+  animation-delay: -50ms;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(2) {
+  animation-delay: 0.2s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(3) {
+  animation-delay: -0.6s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(4) {
+  animation-delay: 0.4s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(5) {
+  animation-delay: -0.5s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(6) {
+  animation-delay: 0.3s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(7) {
+  animation-delay: -1.4s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(8) {
+  animation-delay: 2s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(9) {
+  animation-delay: -0.9s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(10) {
+  animation-delay: 1.5s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(11) {
+  animation-delay: -0.55s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(12) {
+  animation-delay: 1.2s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(13) {
+  animation-delay: -0.65s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(14) {
+  animation-delay: 0.7s;
+  animation-direction: reverse;
+}
+.pre-loader .loader-item:nth-child(15) {
+  animation-delay: -3.75s;
+  animation-direction: alternate;
+}
+.pre-loader .loader-item:nth-child(16) {
+  animation-delay: 1.6s;
+  animation-direction: reverse;
+}
 .pre-loader .loader-item {
-  width: 10px;
-  height: 10px;
-  background: #000;
-  animation: flickering 0.4s steps(2, jump-none) infinite alternate;
+  animation: flickering 0.4s linear infinite alternate;
 }
@keyframes flickering {
  0% {
@@ -104,3 +111,6 @@
    opacity: 0;
  }
 }
+html.dark .pre-loader .loader-item {
+  background: #fff;
+}
@@ -0,0 +1,9 @@
+(function () {
+  var storedTheme = window.localStorage.getItem('theme');
+  if (
+    storedTheme === 'dark' ||
+    (!storedTheme && window.matchMedia('(prefers-color-scheme: dark)').matches)
+  ) {
+    document.documentElement.classList.add('dark');
+  }
+})();
@@ -98,7 +98,7 @@ export const AssetDetailsDialog = ({
      }}
    >
      {content}
-      <p className="text-sm mb-4">
+      <p className="text-sm my-4">
        {t(
          'There is 1 unit of the settlement asset (%s) to every 1 quote unit.',
          [assetSymbol]
@@ -12,7 +12,7 @@ export const DealTicketButton = ({ disabled, variant }: Props) => {
  const { pubKey, isReadOnly } = useVegaWallet();
  const isDisabled = !pubKey || isReadOnly || disabled;
  return (
-    <div className="mb-4">
+    <div className="mb-2">
      <Button
        variant={variant}
        fill
@@ -31,7 +31,7 @@ export const DealTicketFeeDetails = ({
    <div>
      {details.map(({ label, value, labelDescription, symbol }) => (
        <div
-          key={label}
+          key={typeof label === 'string' ? label : 'value-dropdown'}
          className="text-xs mt-2 flex justify-between items-center gap-4 flex-wrap"
        >
          <div>
@@ -38,7 +38,7 @@ export const DealTicketLimitAmount = ({
  };

  return (
-    <div className="mb-6">
+    <div className="mb-2">
      <div className="flex items-center gap-4">
        <div className="flex-1">
          <FormGroup
@@ -29,9 +29,9 @@ export const DealTicketMarketAmount = ({
    : undefined;

  return (
-    <div className="mb-6">
+    <div className="mb-2">
      <div className="flex items-end gap-4 mb-2">
-        <div className="flex-1 text-sm">Size</div>
+        <div className="flex-1 text-sm">{t('Size')}</div>
        <div />
        <div className="flex-2 text-sm text-right">
          {isMarketInAuction(marketData.marketTradingMode) && (
@@ -307,7 +307,7 @@ const SummaryMessage = memo(
    );
    if (isReadOnly) {
      return (
-        <div className="mb-4">
+        <div className="mb-2">
          <InputError testId="dealticket-error-message-summary">
            {
              'You need to connect your own wallet to start trading on this market'
@@ -318,7 +318,7 @@ const SummaryMessage = memo(
    }
    if (!pubKey) {
      return (
-        <div className="mb-4">
+        <div className="mb-2">
          <Notification
            testId={'deal-ticket-connect-wallet'}
            intent={Intent.Warning}
@@ -343,7 +343,7 @@ const SummaryMessage = memo(
    }
    if (errorMessage === SummaryValidationType.NoCollateral) {
      return (
-        <div className="mb-4">
+        <div className="mb-2">
          <ZeroBalanceError
            asset={market.tradableInstrument.instrument.product.settlementAsset}
            onClickCollateral={onClickCollateral}
@@ -356,7 +356,7 @@ const SummaryMessage = memo(
    // submission render that first
    if (errorMessage) {
      return (
-        <div className="mb-4">
+        <div className="mb-2">
          <InputError testId="dealticket-error-message-summary">
            {errorMessage}
          </InputError>
@@ -368,7 +368,7 @@ const SummaryMessage = memo(
    // balance render the margin warning, but still allow submission
    if (balanceError) {
      return (
-        <div className="mb-4">
+        <div className="mb-2">
          <MarginWarning balance={balance} margin={margin} asset={asset} />;
        </div>
      );
@@ -383,7 +383,7 @@ const SummaryMessage = memo(
      ].includes(marketData.marketTradingMode)
    ) {
      return (
-        <div className="mb-4">
+        <div className="mb-2">
          <Notification
            intent={Intent.Warning}
            testId={'dealticket-warning-auction'}
@@ -5,6 +5,8 @@ import { useVoteEvent } from './use-vote-event';
 import type { VoteValue } from '@vegaprotocol/types';
 import type { VoteEventFieldsFragment } from './__generated__/VoteSubsciption';

+export type FinalizedVote = VoteEventFieldsFragment;
+
 export const useVoteSubmit = () => {
  const { pubKey } = useVegaWallet();
  const { send, transaction, setComplete, Dialog } = useVegaTransaction();
@@ -145,7 +145,7 @@ export const Info = ({ market, onSelect }: InfoProps) => {
            }}
            decimalPlaces={market.decimalPlaces}
          />
-          <p className="text-xs">
+          <p className="text-xs mt-4">
            {t(
              'There is 1 unit of the settlement asset (%s) to every 1 quote unit (%s).',
              [assetSymbol, quoteUnit]
@@ -249,7 +249,7 @@ export const Info = ({ market, onSelect }: InfoProps) => {
            dtClassName="text-black dark:text-white text-ui !px-0 !font-normal"
            ddClassName="text-black dark:text-white text-ui !px-0 !font-normal max-w-full"
          />
-          <p className="text-xs">
+          <p className="text-xs mt-4">
            {t(
              'There is 1 unit of the settlement asset (%s) to every 1 quote unit (%s).',
              [assetSymbol, quoteUnit]
@@ -309,27 +309,40 @@ export const Info = ({ market, onSelect }: InfoProps) => {
      ),
    },
    ...(market.priceMonitoringSettings?.parameters?.triggers || []).map(
-      (trigger, i) => ({
-        title: t(`Price monitoring trigger ${i + 1}`),
-        content: <MarketInfoTable data={trigger} />,
-      })
+      (trigger, i) => {
+        const bounds = market.data?.priceMonitoringBounds?.[i];
+        return {
+          title: t(`Price monitoring bounds ${i + 1}`),
+          content: (
+            <div className="text-xs">
+              <div className="grid grid-cols-2 text-xs mb-4">
+                <p className="col-span-1">
+                  {t('%s% probability of trading', [
+                    formatNumber(trigger.probability * 100),
+                  ])}
+                </p>
+                <p className="col-span-1 text-right">
+                  {t('Within %s seconds', [formatNumber(trigger.horizonSecs)])}
+                </p>
+              </div>
+              <div className="pl-2 pb-0 text-xs border-l-2">
+                {bounds && (
+                  <MarketInfoTable
+                    data={{
+                      highestPrice: bounds.maxValidPrice,
+                      lowestPrice: bounds.minValidPrice,
+                      referencePrice: bounds.referencePrice,
+                    }}
+                    decimalPlaces={assetDecimals}
+                    assetSymbol={quoteUnit}
+                  />
+                )}
+              </div>
+            </div>
+          ),
+        };
+      }
    ),
-    ...(market.data?.priceMonitoringBounds || []).map((trigger, i) => ({
-      title: t(`Price monitoring bound ${i + 1}`),
-      content: (
-        <>
-          <MarketInfoTable
-            data={trigger}
-            decimalPlaces={market.decimalPlaces}
-            omits={['referencePrice', '__typename']}
-          />
-          <MarketInfoTable
-            data={{ referencePrice: trigger.referencePrice }}
-            decimalPlaces={assetDecimals}
-          />
-        </>
-      ),
-    })),
    {
      title: t('Liquidity monitoring parameters'),
      content: (
@@ -369,37 +382,38 @@ export const Info = ({ market, onSelect }: InfoProps) => {
      content: (
        <>
          <p className="text-xs mb-4">
-            {`For liquidity orders count towards a commitment they have to be
-            within either the liquidity or price monitoring bounds (whichever is
-            tighter).`}
+            {`For liquidity orders to count towards a commitment, they must be
+            within the liquidity monitoring bounds.`}
          </p>
          <p className="text-xs mb-4">
            {`The liquidity price range is a ${liquidityPriceRange} difference from the mid
            price.`}
          </p>
-          <MarketInfoTable
-            data={{
-              liquidityPriceRange: `${liquidityPriceRange} of mid price`,
-              lowestPrice:
-                market.data?.midPrice &&
-                `${addDecimalsFormatNumber(
-                  new BigNumber(1)
-                    .minus(market.lpPriceRange)
-                    .times(market.data.midPrice)
-                    .toString(),
-                  market.decimalPlaces
-                )} ${quoteUnit}`,
-              highestPrice:
-                market.data?.midPrice &&
-                `${addDecimalsFormatNumber(
-                  new BigNumber(1)
-                    .plus(market.lpPriceRange)
-                    .times(market.data.midPrice)
-                    .toString(),
-                  market.decimalPlaces
-                )} ${quoteUnit}`,
-            }}
-          ></MarketInfoTable>
+          <div className="pl-2 pb-0 text-xs border-l-2">
+            <MarketInfoTable
+              data={{
+                liquidityPriceRange: `${liquidityPriceRange} of mid price`,
+                lowestPrice:
+                  market.data?.midPrice &&
+                  `${addDecimalsFormatNumber(
+                    new BigNumber(1)
+                      .minus(market.lpPriceRange)
+                      .times(market.data.midPrice)
+                      .toString(),
+                    market.decimalPlaces
+                  )} ${quoteUnit}`,
+                highestPrice:
+                  market.data?.midPrice &&
+                  `${addDecimalsFormatNumber(
+                    new BigNumber(1)
+                      .plus(market.lpPriceRange)
+                      .times(market.data.midPrice)
+                      .toString(),
+                    market.decimalPlaces
+                  )} ${quoteUnit}`,
+              }}
+            ></MarketInfoTable>
+          </div>
        </>
      ),
    },
@@ -6,6 +6,7 @@ import {
  formatNumber,
  formatNumberPercentage,
  isNumeric,
+  toDecimal,
  toNumberParts,
 } from './number';

@@ -197,3 +198,20 @@ describe('compactNumber', () => {
    }
  );
 });
+
+describe('toDecimal', () => {
+  it.each([
+    { v: 0, o: '1' },
+    { v: 1, o: '0.1' },
+    { v: 2, o: '0.01' },
+    { v: 3, o: '0.001' },
+    { v: 4, o: '0.0001' },
+    { v: 5, o: '0.00001' },
+    { v: 6, o: '0.000001' },
+    { v: 7, o: '0.0000001' },
+    { v: 8, o: '0.00000001' },
+    { v: 9, o: '0.000000001' },
+  ])('formats with toNumber given number correctly', ({ v, o }) => {
+    expect(toDecimal(v)).toStrictEqual(o);
+  });
+});
@@ -1,4 +1,4 @@
 {
  "name": "@vegaprotocol/ui-toolkit",
-  "version": "0.0.1"
+  "version": "0.7.0"
 }
@@ -20,7 +20,7 @@ export const FormGroup = ({
  labelAlign = 'left',
  hideLabel = false,
 }: FormGroupProps) => {
-  const wrapperClasses = classNames('relative mb-6', className);
+  const wrapperClasses = classNames('relative mb-2', className);
  const labelClasses = classNames('block mb-2 text-sm', {
    'text-right': labelAlign === 'right',
    'sr-only': hideLabel,
@@ -24,11 +24,7 @@ export const KeyValueTable = ({
  return (
    <React.Fragment>
      {title && <TitleTag className={`text-xl my-2`}>{title}</TitleTag>}
-      <div
-        data-testid="key-value-table"
-        {...rest}
-        className={classNames('mb-4', className)}
-      >
+      <div data-testid="key-value-table" {...rest} className={className}>
        <div>
          {children &&
            React.Children.map(
@@ -0,0 +1,28 @@
+@for $i from 0 through 16 {
+  .loader-item:nth-child(#{$i}) {
+    @if $i % 2 == 0 {
+      animation-delay: #{$i * 50 * random(5)}ms;
+      animation-direction: reverse;
+    } @else {
+      animation-delay: #{$i * -50 * random(5)}ms;
+      animation-direction: alternate;
+    }
+  }
+}
+.loader-item {
+  animation: flickering 0.4s linear alternate infinite;
+}
+@keyframes flickering {
+  0% {
+    opacity: 1;
+  }
+  25% {
+    opacity: 1;
+  }
+  26% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 0;
+  }
+}
@@ -1,5 +1,6 @@
 import classNames from 'classnames';
-import { useEffect, useMemo, useState } from 'react';
+import { useMemo } from 'react';
+import styles from './loader.module.scss';

 const pseudoRandom = (seed: number) => {
  let value = seed;
@@ -12,27 +13,10 @@ const pseudoRandom = (seed: number) => {
 export interface LoaderProps {
  size?: 'small' | 'large';
  forceTheme?: 'dark' | 'light';
-  preloader?: boolean;
 }

-export const Loader = ({
-  size = 'large',
-  forceTheme,
-  preloader,
-}: LoaderProps) => {
-  const [, forceRender] = useState(false);
-
-  useEffect(() => {
-    const interval = preloader
-      ? undefined
-      : setInterval(() => {
-          forceRender((x) => !x);
-        }, 100);
-
-    return () => clearInterval(interval);
-  }, [preloader]);
-
-  const itemClasses = classNames('loader-item', {
+export const Loader = ({ size = 'large', forceTheme }: LoaderProps) => {
+  const itemClasses = classNames('loader-item', styles['loader-item'], {
    'dark:bg-white bg-black': !forceTheme,
    'bg-white': forceTheme === 'dark',
    'bg-black': forceTheme === 'light',
@@ -50,7 +50,7 @@ export const Nav = ({
  title,
 }: NavbarProps) => {
  const themeWrapperClasses = classNames(
-    'w-full overflow-y-hidden overflow-x-auto md:overflow-x-hidden font-alpha calt lg:text-lg',
+    'w-full overflow-y-hidden overflow-x-auto md:overflow-x-hidden font-alpha lg:text-lg',
    {
      dark: navbarTheme === 'dark',
    }
@@ -155,7 +155,7 @@ export const Toast = ({
        'w-[320px] rounded-md overflow-hidden',
        'shadow-[8px_8px_16px_0_rgba(0,0,0,0.4)]',
        'text-black dark:text-white',
-        'font-alpha calt text-[14px] leading-[19px]',
+        'font-alpha text-[14px] leading-[19px]',
        // background
        {
          'bg-vega-light-100 dark:bg-vega-dark-100 ': intent === Intent.None,
@@ -14,7 +14,7 @@
    "vegacapsule": "vegacapsule network bootstrap --config-path=../frontend-monorepo/vegacapsule/config.hcl"
  },
  "engines": {
-    "node": ">=16.14.0"
+    "node": ">=16.15.1"
  },
  "private": true,
  "dependencies": {
Author	SHA1	Message	Date
maciek	01f2b04e7b	chore: fix failling int test	2023-02-28 15:13:31 +01:00
maciek	6d6258e39e	Merge remote-tracking branch 'origin/develop' into chore/570-loader-component-css-animation-only	2023-02-28 14:43:02 +01:00
Sam Keen	d87adfd7d5	fix(governance): vote state update fix (#3023 )	2023-02-28 12:43:20 +00:00
dexturr	7364abbbf2	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-02-28 12:10:21 +00:00
maciek	14b9c23701	Merge remote-tracking branch 'origin/develop' into chore/570-loader-component-css-animation-only	2023-02-28 11:58:36 +01:00
maciek	ec89883dec	chore: loader no rerender version only, early resolving choosen theme	2023-02-28 11:50:13 +01:00
Ciaran McGhie	1bd56c9bdb	chore(ci): bump ui-toolkit version to 0.7.0 (#2961 )	2023-02-28 10:13:51 +00:00
Sam Keen	a985bc7317	fix(governance): some fixes and tweaks for the rewards tables (#3009 )	2023-02-28 10:07:51 +00:00
dexturr	1cab9abfd5	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-02-28 06:08:01 +00:00
dexturr	26a82ab2ab	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-02-28 00:17:25 +00:00
Matthew Russell	69a0830e80	fix(ui-toolkit): remove calt from nav and toasts (#3020 )	2023-02-27 15:21:17 -08:00
m.ray	4eb6e09bd4	fix(trading): condense deal ticket & market info price range snags (#3012 )	2023-02-27 18:04:13 +00:00
Maciek	a02100b079	chore(ui-toolkit): revert: loader no rerender version only	2023-02-27 07:51:50 -08:00
Maciek	4bb78e9891	chore(ui-toolkit): loader no rerender version only (#3011 )	2023-02-27 16:44:48 +01:00
dexturr	79f360dc24	chore: update tranches Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>	2023-02-27 12:10:43 +00:00
maciek	e3b2ee12e6	chore: loader no rerender version only	2023-02-27 12:13:37 +01:00