refactor: update wrapWithIdentifier to support dynamic key generation

- Modified `wrapWithIdentifier` function to accept multiple keys instead of a single `getIdFromRow` function.
- The unique identifier `wrapped_identifier` is now generated by joining the values of the specified keys with a dash (`-`).
- Adapted all usages of `wrapWithIdentifier`

See: BEDS-481

frontend/components/dashboard/table/DashboardTableRewards.vue

@@ -155,10 +155,7 @@ const findNextEpochDuties = (epoch: number) => {
       <template #table>
         <ClientOnly fallback-tag="span">
           <BcTable
-            :data="wrapWithIdentifier(
-              rewards,
-              row => `${row.epoch}-${row.group_id}`,
-            )"
+            :data="wrapWithIdentifier(rewards, 'epoch', 'group_id')"
             data-key="wrapped_identifier"
             :expandable="true"
             class="rewards-table"

frontend/components/notifications/DashboardsTable.vue

@@ -61,10 +61,7 @@ const { overview } = useNotificationsDashboardOverviewStore()
       <template #table>
         <ClientOnly fallback-tag="span">
           <BcTable
-            :data="wrapWithIdentifier(
-              notificationsDashboards,
-              row => `${row.is_account_dashboard}-${row.dashboard_id}-${row.group_id}-${row.epoch}`,
-            )"
+            :data="wrapWithIdentifier(notificationsDashboards, 'is_account_dashboard', 'dashboard_id', 'group_id', 'epoch')"
             data-key="wrapped_identifier"
             :expandable="!colsVisible.notifications"
             :cursor

frontend/utils/wrapWithIdentifier.ts

@@ -5,14 +5,14 @@ import type { ApiPagingResponse } from '~/types/api/common'
  * @param getIdFromRow A function that takes a row and builds a unique identifier
  * @returns The wrapped response
  */
-export function wrapWithIdentifier<T>(response: ApiPagingResponse<T> | undefined, getIdFromRow: (row: T) => string) {
+export function wrapWithIdentifier<T>(response: ApiPagingResponse<T> | undefined, ...keys: (keyof T)[]) {
   if (!response) {
     return
   }
   return {
     data: response.data.map(row => ({
       ...row,
-      wrapped_identifier: getIdFromRow(row),
+      wrapped_identifier: keys.map(key => row[key]).join('-'),
     })),
     paging: response.paging,
   }