From 476c528c41c97c867cda9f0b1d3131b3c32fa505 Mon Sep 17 00:00:00 2001
From: Nagesh Pai <4162931+nagpai@users.noreply.github.com>
Date: Wed, 11 Dec 2024 10:22:41 +0530
Subject: [PATCH] Payouts: Rename 'Bank reference key' to 'Bank reference ID'
 for consistency (#9900)

Co-authored-by: Nagesh Pai <nagesh.pai@automattic.com>
---
 changelog/update-1-5316-rename-bank-reference-id       | 4 ++++
 client/deposits/list/index.tsx                         | 8 ++++----
 client/deposits/list/test/__snapshots__/index.tsx.snap | 8 ++++----
 client/deposits/list/test/index.tsx                    | 2 +-
 client/types/deposits.d.ts                             | 2 +-
 5 files changed, 14 insertions(+), 10 deletions(-)
 create mode 100644 changelog/update-1-5316-rename-bank-reference-id

diff --git a/changelog/update-1-5316-rename-bank-reference-id b/changelog/update-1-5316-rename-bank-reference-id
new file mode 100644
index 00000000000..0a2841c0ad9
--- /dev/null
+++ b/changelog/update-1-5316-rename-bank-reference-id
@@ -0,0 +1,4 @@
+Significance: minor
+Type: update
+
+Change 'Bank reference key' label to 'Bank reference ID' in Payouts list column for consistency.
diff --git a/client/deposits/list/index.tsx b/client/deposits/list/index.tsx
index b74c14bca61..1ac643d31dc 100644
--- a/client/deposits/list/index.tsx
+++ b/client/deposits/list/index.tsx
@@ -98,9 +98,9 @@ const getColumns = ( sortByDate?: boolean ): DepositsTableHeader[] => [
 		isLeftAligned: true,
 	},
 	{
-		key: 'bankReferenceKey',
-		label: __( 'Bank reference key', 'woocommerce-payments' ),
-		screenReaderLabel: __( 'Bank reference key', 'woocommerce-payments' ),
+		key: 'bankReferenceId',
+		label: __( 'Bank reference ID', 'woocommerce-payments' ),
+		screenReaderLabel: __( 'Bank reference ID', 'woocommerce-payments' ),
 	},
 ];
 
@@ -170,7 +170,7 @@ export const DepositsList = (): JSX.Element => {
 				value: deposit.bankAccount,
 				display: clickable( deposit.bankAccount ),
 			},
-			bankReferenceKey: {
+			bankReferenceId: {
 				value: deposit.bank_reference_key,
 				display: clickable( deposit.bank_reference_key ?? 'N/A' ),
 			},
diff --git a/client/deposits/list/test/__snapshots__/index.tsx.snap b/client/deposits/list/test/__snapshots__/index.tsx.snap
index 9e15ae2f735..07945cd0c64 100644
--- a/client/deposits/list/test/__snapshots__/index.tsx.snap
+++ b/client/deposits/list/test/__snapshots__/index.tsx.snap
@@ -321,12 +321,12 @@ exports[`Deposits list renders correctly a single deposit 1`] = `
                     <span
                       aria-hidden="true"
                     >
-                      Bank reference key
+                      Bank reference ID
                     </span>
                     <span
                       class="screen-reader-text"
                     >
-                      Bank reference key
+                      Bank reference ID
                     </span>
                   </th>
                 </tr>
@@ -1009,12 +1009,12 @@ exports[`Deposits list renders correctly with multiple currencies 1`] = `
                     <span
                       aria-hidden="true"
                     >
-                      Bank reference key
+                      Bank reference ID
                     </span>
                     <span
                       class="screen-reader-text"
                     >
-                      Bank reference key
+                      Bank reference ID
                     </span>
                   </th>
                 </tr>
diff --git a/client/deposits/list/test/index.tsx b/client/deposits/list/test/index.tsx
index 628dc670346..8eb1c3b9f78 100644
--- a/client/deposits/list/test/index.tsx
+++ b/client/deposits/list/test/index.tsx
@@ -290,7 +290,7 @@ describe( 'Deposits list', () => {
 				'Amount',
 				'Status',
 				'"Bank account"',
-				'"Bank reference key"',
+				'"Bank reference ID"',
 			];
 
 			const csvContent = mockDownloadCSVFile.mock.calls[ 0 ][ 1 ];
diff --git a/client/types/deposits.d.ts b/client/types/deposits.d.ts
index 29ebb263977..9bc5ed4a8f5 100644
--- a/client/types/deposits.d.ts
+++ b/client/types/deposits.d.ts
@@ -9,7 +9,7 @@ export interface DepositsTableHeader extends TableCardColumn {
 		| 'amount'
 		| 'status'
 		| 'bankAccount'
-		| 'bankReferenceKey';
+		| 'bankReferenceId';
 	cellClassName?: string;
 }