Add TTP fees information to timeline view (#5550)

Author: dpaun1985

changelog/add-5376-ttp-timeline-view

@@ -0,0 +1,4 @@
+Significance: minor
+Type: add
+
+Display tap to pay fees in transaction timeline view

client/payment-details/timeline/map-events.js

@@ -415,6 +415,18 @@ export const feeBreakdown = ( event ) => {
 						'Subscription transaction fee: %1$s%%',
 						'woocommerce-payments'
 				  ),
+		'additional-device':
+			0 !== fixedRate
+				? __(
+						/* translators: %1$s% is the fee amount and %2$s is the fixed rate */
+						'Tap to pay transaction fee: %1$s%% + %2$s',
+						'woocommerce-payments'
+				  )
+				: __(
+						/* translators: %1$s% is the fee amount */
+						'Tap to pay transaction fee: %1$s%%',
+						'woocommerce-payments'
+				  ),
 		discount: __( 'Discount', 'woocommerce-payments' ),
 	} );
 

client/payment-details/timeline/test/__snapshots__/map-events.js.snap

@@ -693,6 +693,56 @@ Array [
 ]
 `;
 
+exports[`mapTimelineEvents single currency events in person payments - tap to pay 1`] = `
+Array [
+  Object {
+    "body": Array [],
+    "date": 2020-04-01T14:37:54.000Z,
+    "headline": "Payment status changed to Paid.",
+    "icon": <SyncIcon />,
+  },
+  Object {
+    "body": Array [],
+    "date": 2020-04-01T14:37:54.000Z,
+    "headline": <React.Fragment>
+      $19.19 USD was added to your 
+      <Link
+        href="admin.php?page=wc-admin&path=%2Fpayments%2Fdeposits%2Fdetails&id=dummy_po_5eaada696b281"
+        type="wc-admin"
+      >
+        Apr 2, 2020 deposit
+      </Link>
+      .
+    </React.Fragment>,
+    "icon": <PlusIcon />,
+  },
+  Object {
+    "body": Array [
+      undefined,
+      "Fee (2.6% + $0.20): $-0.61",
+      <ul
+        className="fee-breakdown-list"
+      >
+         
+        <li>
+          Base fee: 2.6% + $0.10
+        </li>
+        <li>
+          Tap to pay transaction fee: 0% + $0.10
+        </li>
+         
+      </ul>,
+      "Net deposit: $19.19 USD",
+    ],
+    "date": 2020-04-01T14:37:54.000Z,
+    "headline": "A payment of $19.80 USD was successfully charged.",
+    "icon": <CheckmarkIcon
+      className="is-success"
+    />,
+  },
+]
+`;
+
 exports[`mapTimelineEvents single currency events should not render fee breakup when fee history is not present 1`] = `
 Array [
   Object {

client/payment-details/timeline/test/map-events.js

@@ -395,6 +395,44 @@ describe( 'mapTimelineEvents', () => {
 				] )
 			).toMatchSnapshot();
 		} );
+
+		test( 'in person payments - tap to pay', () => {
+			expect(
+				mapTimelineEvents( [
+					{
+						amount: 1980,
+						currency: 'USD',
+						datetime: 1585751874,
+						deposit: {
+							arrival_date: 1585838274,
+							id: 'dummy_po_5eaada696b281',
+						},
+						fee: 61,
+						fee_rates: {
+							percentage: 0.026,
+							fixed: 20,
+							fixed_currency: 'USD',
+							history: [
+								{
+									type: 'base',
+									percentage_rate: 0.026,
+									fixed_rate: 10,
+									currency: 'usd',
+								},
+								{
+									type: 'additional',
+									additional_type: 'device',
+									percentage_rate: 0,
+									fixed_rate: 10,
+									currency: 'usd',
+								},
+							],
+						},
+						type: 'captured',
+					},
+				] )
+			).toMatchSnapshot();
+		} );
 	} );
 
 	describe( 'Multi-Currency events', () => {