Fix report page border: use full-width and correct last item check

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

Author: Krishna2323

src/components/MoneyRequestReportView/MoneyRequestReportTransactionItem.tsx

@@ -146,7 +146,11 @@ function MoneyRequestReportTransactionItem({
                 }}
                 disabled={isTransactionPendingDelete(transaction)}
                 ref={viewRef}
-                wrapperStyle={[animatedHighlightStyle, styles.userSelectNone]}
+                wrapperStyle={[
+                    animatedHighlightStyle,
+                    styles.userSelectNone,
+                    shouldUseNarrowLayout && !isLastItem && {...styles.borderBottom, borderColor: isSelected ? theme.buttonHoveredBG : theme.border},
+                ]}
             >
                 {({hovered}) => (
                     <TransactionItemRow
@@ -170,7 +174,6 @@ function MoneyRequestReportTransactionItem({
                         }}
                         onArrowRightPress={() => onArrowRightPress?.(transaction.transactionID)}
                         isHover={hovered}
-                        shouldShowBottomBorder={shouldUseNarrowLayout && !isLastItem}
                         nonPersonalAndWorkspaceCards={nonPersonalAndWorkspaceCards}
                     />
                 )}

src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx

@@ -597,7 +597,7 @@ function MoneyRequestReportTransactionList({
                           pendingAction={selectionState.pendingAction}
                           shouldUseNarrowLayout={shouldUseNarrowLayout}
                       />
-                      {group.transactions.map((transaction, index) => (
+                      {group.transactions.map((transaction) => (
                           <MoneyRequestReportTransactionItem
                               key={transaction.transactionID}
                               transaction={transaction}
@@ -616,7 +616,7 @@ function MoneyRequestReportTransactionList({
                               scrollToNewTransaction={transaction.transactionID === newTransactions?.at(0)?.transactionID ? scrollToNewTransaction : undefined}
                               onArrowRightPress={handleArrowRightPress}
                               nonPersonalAndWorkspaceCards={nonPersonalAndWorkspaceCards ?? {}}
-                              isLastItem={index === group.transactions.length - 1}
+                              isLastItem={transaction.transactionID === lastTransactionID}
                           />
                       ))}
                   </View>