feat(trading): highlight row and update data on pinned asset

Signed-off-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

apps/static/src/assets/mainnet-tranches.json

@@ -3,9 +3,9 @@
     "tranche_id": 54,
     "tranche_start": "2023-04-06T00:00:00.000Z",
     "tranche_end": "2023-05-06T00:00:00.000Z",
-    "total_added": "1584",
+    "total_added": "1953",
     "total_removed": "0",
-    "locked_amount": "1584",
+    "locked_amount": "1953",
     "deposits": [
       {
         "amount": "111",
@@ -46,6 +46,16 @@
         "amount": "132",
         "user": "0x9E53F72210479BF46aE7ABF77c48B0d611b3c3dB",
         "tx": "0xcb0f255003872ac506798efa97744868e11ceab2f2f03d96da605d8674f783f6"
+      },
+      {
+        "amount": "60",
+        "user": "0xC0f02AA8bA8b509D223C9De6108AFA1C03f03341",
+        "tx": "0x19c8c84527958b114d5b42103f3778f02fe725bfc07e22cba32c4b7be9c8dcab"
+      },
+      {
+        "amount": "309",
+        "user": "0x21770cCAb229Bd1509609fFFa35bEB16b73A657c",
+        "tx": "0xf6467d54c2de5c5d21fd3ac174ac6bf51b6fc675cf81dedcb143679f28caa46a"
       }
     ],
     "withdrawals": [],
@@ -169,6 +179,36 @@
         "total_tokens": "132",
         "withdrawn_tokens": "0",
         "remaining_tokens": "132"
+      },
+      {
+        "address": "0xC0f02AA8bA8b509D223C9De6108AFA1C03f03341",
+        "deposits": [
+          {
+            "amount": "60",
+            "user": "0xC0f02AA8bA8b509D223C9De6108AFA1C03f03341",
+            "tranche_id": 54,
+            "tx": "0x19c8c84527958b114d5b42103f3778f02fe725bfc07e22cba32c4b7be9c8dcab"
+          }
+        ],
+        "withdrawals": [],
+        "total_tokens": "60",
+        "withdrawn_tokens": "0",
+        "remaining_tokens": "60"
+      },
+      {
+        "address": "0x21770cCAb229Bd1509609fFFa35bEB16b73A657c",
+        "deposits": [
+          {
+            "amount": "309",
+            "user": "0x21770cCAb229Bd1509609fFFa35bEB16b73A657c",
+            "tranche_id": 54,
+            "tx": "0xf6467d54c2de5c5d21fd3ac174ac6bf51b6fc675cf81dedcb143679f28caa46a"
+          }
+        ],
+        "withdrawals": [],
+        "total_tokens": "309",
+        "withdrawn_tokens": "0",
+        "remaining_tokens": "309"
       }
     ]
   },
@@ -277,7 +317,7 @@
     "tranche_end": "2023-04-06T00:00:00.000Z",
     "total_added": "14099",
     "total_removed": "22.78816420236",
-    "locked_amount": "9775.8699107676210698",
+    "locked_amount": "9661.8419321236560201",
     "deposits": [
       {
         "amount": "30",
@@ -2970,7 +3010,7 @@
     "tranche_end": "2023-12-05T00:00:00.000Z",
     "total_added": "86666.297",
     "total_removed": "0",
-    "locked_amount": "62802.0961944541744214653",
+    "locked_amount": "62742.5653305014227458322",
     "deposits": [
       {
         "amount": "86666.297",
@@ -3036,7 +3076,7 @@
     "tranche_end": "2023-06-01T00:00:00.000Z",
     "total_added": "2500",
     "total_removed": "0",
-    "locked_amount": "1064.48587581400075",
+    "locked_amount": "1061.0419528388279",
     "deposits": [
       {
         "amount": "2500",
@@ -3157,7 +3197,7 @@
     "tranche_end": "2023-09-01T00:00:00.000Z",
     "total_added": "17500",
     "total_removed": "0",
-    "locked_amount": "16120.4076401469395",
+    "locked_amount": "16096.562216938406",
     "deposits": [
       {
         "amount": "12500",
@@ -3424,7 +3464,7 @@
     "tranche_end": "2023-08-01T00:00:00.000Z",
     "total_added": "37500",
     "total_removed": "3992.79801615",
-    "locked_amount": "28693.62674570288625",
+    "locked_amount": "28641.68249309392125",
     "deposits": [
       {
         "amount": "7500",
@@ -3667,7 +3707,7 @@
     "tranche_end": "2023-12-05T00:00:00.000Z",
     "total_added": "129999.45",
     "total_removed": "0",
-    "locked_amount": "62744.797183739481485052",
+    "locked_amount": "62685.32063420962698783",
     "deposits": [
       {
         "amount": "129999.45",
@@ -3733,7 +3773,7 @@
     "tranche_end": "2023-09-03T00:00:00.000Z",
     "total_added": "62600",
     "total_removed": "0",
-    "locked_amount": "29412.49367706747522",
+    "locked_amount": "29369.4938926940675",
     "deposits": [
       {
         "amount": "10000",
@@ -3926,7 +3966,7 @@
     "tranche_end": "2023-09-17T00:00:00.000Z",
     "total_added": "5000",
     "total_removed": "0",
-    "locked_amount": "2541.021530948757",
+    "locked_amount": "2537.5870433789955",
     "deposits": [
       {
         "amount": "5000",
@@ -4137,7 +4177,7 @@
     "tranche_end": "2023-04-05T00:00:00.000Z",
     "total_added": "97499.58",
     "total_removed": "0",
-    "locked_amount": "4769.0027179179875744514",
+    "locked_amount": "4710.6617633204070597198",
     "deposits": [
       {
         "amount": "97499.58",
@@ -4170,7 +4210,7 @@
     "tranche_end": "2023-04-05T00:00:00.000Z",
     "total_added": "135173.4239508",
     "total_removed": "98230.390980249184455396",
-    "locked_amount": "6518.4033814222176646361931672",
+    "locked_amount": "6438.661368632949971761627068",
     "deposits": [
       {
         "amount": "135173.4239508",
@@ -4216,7 +4256,7 @@
     "tranche_end": "2023-04-05T00:00:00.000Z",
     "total_added": "32499.86",
     "total_removed": "0",
-    "locked_amount": "2006.2370871562641268176",
+    "locked_amount": "1981.6940550514561848378",
     "deposits": [
       {
         "amount": "32499.86",
@@ -4249,7 +4289,7 @@
     "tranche_end": "2023-04-05T00:00:00.000Z",
     "total_added": "10833.29",
     "total_removed": "0",
-    "locked_amount": "653.010703805487814995",
+    "locked_amount": "645.0221850153186508169",
     "deposits": [
       {
         "amount": "10833.29",
@@ -4282,7 +4322,7 @@
     "tranche_end": "2023-04-05T00:00:00.000Z",
     "total_added": "22749.93",
     "total_removed": "4720.860935375",
-    "locked_amount": "2441.0998581315436582191",
+    "locked_amount": "2411.2369906904462045688",
     "deposits": [
       {
         "amount": "6500",
@@ -4434,7 +4474,7 @@
     "tranche_end": "2023-05-01T00:00:00.000Z",
     "total_added": "22500",
     "total_removed": "5529.83377455",
-    "locked_amount": "5779.71195902394075",
+    "locked_amount": "5748.545407458562875",
     "deposits": [
       {
         "amount": "7500",
@@ -4797,7 +4837,7 @@
     "tranche_end": "2023-06-02T00:00:00.000Z",
     "total_added": "1939928.38",
     "total_removed": "928642.9598472029154",
-    "locked_amount": "417188.6231006399309246128",
+    "locked_amount": "415856.0911191723405912036",
     "deposits": [
       {
         "amount": "1852091.69",
@@ -38296,7 +38336,7 @@
     "tranche_end": "2023-06-05T00:00:00.000Z",
     "total_added": "3732368.4671",
     "total_removed": "700133.348465855088393",
-    "locked_amount": "665574.988783539092352126032",
+    "locked_amount": "663527.351066384228910556434",
     "deposits": [
       {
         "amount": "1998.95815",
@@ -39678,7 +39718,7 @@
     "tranche_end": "2023-12-05T00:00:00.000Z",
     "total_added": "15870102.715470999700000001",
     "total_removed": "803126.94523812819680452",
-    "locked_amount": "7659773.76186853928704096963886072002784536",
+    "locked_amount": "7652512.9699944152867709421977719941727494",
     "deposits": [
       {
         "amount": "16249.93",
@@ -45805,7 +45845,7 @@
     "tranche_end": "2023-05-05T00:00:00.000Z",
     "total_added": "14597706.0446472999",
     "total_removed": "5735873.982235800798313006",
-    "locked_amount": "1350009.002549479199448998084455602",
+    "locked_amount": "1343305.885851882198669540276611904",
     "deposits": [
       {
         "amount": "129284.449",
@@ -53149,7 +53189,7 @@
     "tranche_end": "2023-04-05T00:00:00.000Z",
     "total_added": "5778205.3912159303",
     "total_removed": "3362269.76579626473241024",
-    "locked_amount": "216493.318153589487100687138655917",
+    "locked_amount": "213844.8762062568204908693499834718",
     "deposits": [
       {
         "amount": "552496.6455",
@@ -55255,7 +55295,7 @@
     "tranche_end": "2023-06-05T00:00:00.000Z",
     "total_added": "472355.6199999996",
     "total_removed": "37672.6965943910685",
-    "locked_amount": "105464.16156158729024788626382548",
+    "locked_amount": "105139.701660507879035050669406412",
     "deposits": [
       {
         "amount": "3000",

apps/trading-e2e/src/integration/market-info.cy.ts

@@ -7,6 +7,10 @@ const externalLink = 'external-link';
 const accordionContent = 'accordion-content';
 
 describe('market info is displayed', { tags: '@smoke' }, () => {
+  beforeEach(() => {
+    cy.mockTradingPage();
+  });
+
   before(() => {
     cy.mockTradingPage();
     cy.mockSubscription();

libs/accounts/src/lib/accounts-manager.tsx

@@ -10,7 +10,8 @@ import type { AccountFields } from './accounts-data-provider';
 import { aggregatedAccountsDataProvider } from './accounts-data-provider';
 import type { PinnedAsset } from './accounts-table';
 import { AccountTable } from './accounts-table';
-import type { RowHeightParams } from 'ag-grid-community';
+import type { RowClassParams, RowHeightParams } from 'ag-grid-community';
+import classNames from 'classnames';
 
 interface AccountManagerProps {
   partyId: string;
@@ -30,11 +31,15 @@ export const AccountManager = ({
   pinnedAsset,
 }: AccountManagerProps) => {
   const gridRef = useRef<AgGridReact | null>(null);
-  const variables = useMemo(() => ({ partyId }), [partyId]);
+  const variables = useMemo(
+    () => ({ partyId, pinnedAsset }),
+    [partyId, pinnedAsset]
+  );
   const { data, loading, error, reload } = useDataProvider({
     dataProvider: aggregatedAccountsDataProvider,
     variables,
   });
+
   const setId = useCallback(
     (data: AccountFields) => ({
       ...data,
@@ -51,11 +56,24 @@ export const AccountManager = ({
     (params: RowHeightParams) => (params.node.rowPinned ? 32 : 22),
     []
   );
+
+  const getRowClass = useCallback(
+    ({ data: rowData }: RowClassParams) => {
+      const currentPinnedAssetRow = data?.find(
+        (row) => row.asset.id === pinnedAsset?.id
+      );
+      const shouldHighlight =
+        rowData?.asset.id === pinnedAsset?.id && currentPinnedAssetRow;
+      return classNames({ '!bg-vega-yellow !text-black': shouldHighlight });
+    },
+    [pinnedAsset?.id, data]
+  );
+
   return (
     <div className="relative h-full">
       <AccountTable
         ref={gridRef}
-        rowData={error ? [] : data}
+        rowData={error ? [] : data ?? []}
         onClickAsset={onClickAsset}
         onClickDeposit={onClickDeposit}
         onClickWithdraw={onClickWithdraw}
@@ -63,6 +81,7 @@ export const AccountManager = ({
         suppressLoadingOverlay
         suppressNoRowsOverlay
         pinnedAsset={pinnedAsset}
+        getRowClass={getRowClass}
         getRowHeight={getRowHeight}
         {...bottomPlaceholderProps}
       />

libs/accounts/src/lib/accounts-table.tsx

@@ -91,11 +91,10 @@ export const AccountTable = forwardRef<AgGridReact, AccountTableProps>(
   ({ onClickAsset, onClickWithdraw, onClickDeposit, ...props }, ref) => {
     const [openBreakdown, setOpenBreakdown] = useState(false);
     const [row, setRow] = useState<AccountFields>();
-    const pinnedAssetId = props.pinnedAsset?.id;
 
     const pinnedAssetRow = useMemo(() => {
       const currentPinnedAssetRow = props.rowData?.find(
-        (row) => row.asset.id === pinnedAssetId
+        (row) => row.asset.id === props.pinnedAsset?.id
       );
       if (!currentPinnedAssetRow) {
         if (props.pinnedAsset) {
@@ -109,7 +108,7 @@ export const AccountTable = forwardRef<AgGridReact, AccountTableProps>(
         }
       }
       return undefined;
-    }, [pinnedAssetId, props.pinnedAsset, props.rowData]);
+    }, [props.pinnedAsset, props.rowData]);
 
     return (
       <>
@@ -245,7 +244,7 @@ export const AccountTable = forwardRef<AgGridReact, AccountTableProps>(
                 if (!data) return null;
                 else {
                   if (
-                    data.asset.id === pinnedAssetId &&
+                    data.asset.id === props.pinnedAsset?.id &&
                     new BigNumber(data.total).isLessThanOrEqualTo(0)
                   ) {
                     return (

nx.json

@@ -23,7 +23,8 @@
           "echo $NX_TENDERMINT_URL",
           "echo $NX_TENDERMINT_WEBSOCKET_URL",
           "echo $NX_USE_ENV_OVERRIDES",
-          "echo $NX_ETHEREUM_PROVIDER_URL"
+          "echo $NX_ETHEREUM_PROVIDER_URL",
+          "echo %NX_VEGA_CONFIG_URL"
         ]
       }
     }