fix: use unique identifiers in pectra table rows

Author: enzo-bitfly

frontend/components/dashboard/table/DashboardTableClConsolidations.vue

@@ -53,12 +53,11 @@ const setSearch = (value?: string) => {
           expandable
           :row-class="(row: VDBConsolidationsClTableRow) =>
             row.status === 'queued' ? 'dashboard-table-cl-consolidations__row--grayed-out' : ''"
-          data-key="source"
+          data-key="id"
           :selected-sort="query?.sort"
           :cursor="query?.cursor"
           :page-size="query?.limit"
-          table-class="
-          dashboard-table-cl-consolidations"
+          table-class="dashboard-table-cl-consolidations"
           @set-cursor="setCursor"
           @sort="onSort"
           @set-page-size="setPageSize"

frontend/components/dashboard/table/DashboardTableClDeposits.vue

@@ -54,6 +54,8 @@ const tableData = computed(() => {
       {
         amount: clDepositsTotalAmount?.data.total_amount,
         isTotalAmountRow: true,
+        slot: -1, // used for identifier
+        slot_index: -1, // used for identifier
       },
       ...clDeposits.data,
     ],
@@ -115,7 +117,7 @@ const {
     <template #table>
       <ClientOnly fallback-tag="span">
         <BcTable
-          :data="tableData"
+          :data="addIdentifier(tableData, 'slot', 'slot_index')"
           data-key="identifier"
           expandable
           table-class="dashboard-table-cl-deposits"

frontend/components/dashboard/table/DashboardTableClWithdrawals.vue

@@ -57,6 +57,8 @@ const tableData = computed(() => {
       {
         amount: clWithdrawalsTotalAmount?.data.total_amount,
         isTotalAmountRow: true,
+        slot: -1, // used for identifier
+        slot_index: -1, // used for identifier
       },
       ...clWithdrawals.data,
     ],
@@ -85,10 +87,10 @@ const getGroupName = (groupId: number) => {
     <template #table>
       <ClientOnly fallback-tag="span">
         <BcTable
-          :data="tableData"
+          :data="addIdentifier(tableData, 'slot', 'slot_index')"
           expandable
           table-class="dashboard-table-cl-withdrawals"
-          data-key="public_key"
+          data-key="identifier"
           :selected-sort="query?.sort"
           :row-class="(row: VDBWithdrawalsElTableRow) => row.status === 'queued' ? 'grayed-out-row' : ''"
           :is-row-expandable="(row: VDBWithdrawalsElTableRow) => row.index !== undefined"

frontend/components/dashboard/table/DashboardTableElConsolidations.vue

@@ -57,7 +57,7 @@ const setSearch = (value?: string) => {
     <template #table>
       <ClientOnly fallback-tag="span">
         <BcTable
-          :data="elConsolidations"
+          :data="addIdentifier(elConsolidations, 'block_queued', 'tx_index_queued', 'itx_index_queued')"
           expandable
           :row-class="(row: VDBConsolidationsElTableRow) => row.status === 'queued' ? 'grayed-out-row' : ''"
           data-key="identifier"

frontend/components/dashboard/table/DashboardTableElWithdrawals.vue

@@ -55,7 +55,10 @@ const tableData = computed(() => {
     data: [
       {
         amount: elWithdrawalsTotalAmount?.data.total_amount,
+        block_queued: -1, // used for identifier
         isTotalAmountRow: true,
+        itx_index_queued: -1, // used for identifier
+        tx_index_queued: -1, // used for identifier
       },
       ...elWithdrawals.data,
     ],
@@ -84,10 +87,10 @@ const getGroupName = (groupId: number) => {
     <template #table>
       <ClientOnly fallback-tag="span">
         <BcTable
-          :data="tableData"
+          :data="addIdentifier(tableData, 'block_queued', 'tx_index_queued', 'itx_index_queued')"
           expandable
           table-class="dashboard-table-el-withdrawals"
-          data-key="timestamp_queued"
+          data-key="identifier"
           :selected-sort="query?.sort"
           :row-class="(row: VDBWithdrawalsElTableRow) => row.status === 'queued' ? 'grayed-out-row' : ''"
           :is-row-expandable="(row: VDBWithdrawalsElTableRow) => row.index !== undefined"