From 8c809872141780d15a511552207cf664d947d3c4 Mon Sep 17 00:00:00 2001
From: Ana Margarida Silva <ana.margarida.silva@callstack.com>
Date: Thu, 5 Oct 2023 14:16:43 +0100
Subject: [PATCH] feat: show submit button in Report preview for open/draft
 reports

---
 .../ReportActionItem/ReportPreview.js          | 18 ++++++++++++++++--
 src/languages/en.ts                            |  1 +
 src/languages/es.ts                            |  1 +
 src/libs/ReportUtils.js                        |  9 +++++++++
 src/libs/actions/IOU.js                        |  3 +++
 5 files changed, 30 insertions(+), 2 deletions(-)

diff --git a/src/components/ReportActionItem/ReportPreview.js b/src/components/ReportActionItem/ReportPreview.js
index a79cfd315b12..e530041ae9e0 100644
--- a/src/components/ReportActionItem/ReportPreview.js
+++ b/src/components/ReportActionItem/ReportPreview.js
@@ -4,8 +4,9 @@ import {View} from 'react-native';
 import PropTypes from 'prop-types';
 import {withOnyx} from 'react-native-onyx';
 import lodashGet from 'lodash/get';
-import Text from '../Text';
+import Button from '../Button';
 import Icon from '../Icon';
+import Text from '../Text';
 import * as Expensicons from '../Icon/Expensicons';
 import styles from '../../styles/styles';
 import reportActionPropTypes from '../../pages/home/report/reportActionPropTypes';
@@ -20,6 +21,7 @@ import * as CurrencyUtils from '../../libs/CurrencyUtils';
 import * as ReportUtils from '../../libs/ReportUtils';
 import Navigation from '../../libs/Navigation/Navigation';
 import ROUTES from '../../ROUTES';
+import useLocalize from '../../hooks/useLocalize';
 import SettlementButton from '../SettlementButton';
 import * as IOU from '../../libs/actions/IOU';
 import refPropTypes from '../refPropTypes';
@@ -105,6 +107,8 @@ const defaultProps = {
 };
 
 function ReportPreview(props) {
+    const {translate} = useLocalize();
+
     const managerID = props.iouReport.managerID || 0;
     const isCurrentUserManager = managerID === lodashGet(props.session, 'accountID');
     const reportTotal = ReportUtils.getMoneyRequestTotal(props.iouReport);
@@ -113,6 +117,7 @@ function ReportPreview(props) {
     const iouCanceled = ReportUtils.isArchivedRoom(props.chatReport);
     const numberOfRequests = ReportActionUtils.getNumberOfMoneyRequests(props.action);
     const moneyRequestComment = lodashGet(props.action, 'childLastMoneyRequestComment', '');
+    const isReportDraft = ReportUtils.isReportDraft(props.iouReport);
 
     const transactionsWithReceipts = ReportUtils.getTransactionsWithReceipts(props.iouReportID);
     const numberOfScanningReceipts = _.filter(transactionsWithReceipts, (transaction) => TransactionUtils.isReceiptBeingScanned(transaction)).length;
@@ -164,7 +169,7 @@ function ReportPreview(props) {
     const bankAccountRoute = ReportUtils.getBankAccountRoute(props.chatReport);
     const shouldShowSettlementButton = ReportUtils.isControlPolicyExpenseChat(props.chatReport)
         ? props.policy.role === CONST.POLICY.ROLE.ADMIN && ReportUtils.isReportApproved(props.iouReport) && !iouSettled && !iouCanceled
-        : !_.isEmpty(props.iouReport) && isCurrentUserManager && !iouSettled && !iouCanceled && !props.iouReport.isWaitingOnBankAccount && reportTotal !== 0;
+        : !_.isEmpty(props.iouReport) && isCurrentUserManager && !isReportDraft && !iouSettled && !iouCanceled && !props.iouReport.isWaitingOnBankAccount && reportTotal !== 0;
 
     return (
         <View style={[styles.chatItemMessage, ...props.containerStyles]}>
@@ -232,6 +237,15 @@ function ReportPreview(props) {
                                 style={[styles.requestPreviewBox]}
                             />
                         )}
+                        {isReportDraft && (
+                            <Button
+                                success
+                                medium
+                                text={translate('common.submit')}
+                                style={[styles.requestPreviewBox]}
+                                onPress={() => IOU.submitReport(props.iouReport)}
+                            />
+                        )}
                     </View>
                 </View>
             </PressableWithoutFeedback>
diff --git a/src/languages/en.ts b/src/languages/en.ts
index 389faa4a696b..6f1cbb332568 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -108,6 +108,7 @@ export default {
         resend: 'Resend',
         save: 'Save',
         saveChanges: 'Save changes',
+        submit: 'Submit',
         rotate: 'Rotate',
         zoom: 'Zoom',
         password: 'Password',
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 50ca3e5b23bc..791456dd99f3 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -98,6 +98,7 @@ export default {
         resend: 'Reenviar',
         save: 'Guardar',
         saveChanges: 'Guardar cambios',
+        submit: 'Enviar',
         rotate: 'Rotar',
         zoom: 'Zoom',
         password: 'Contraseña',
diff --git a/src/libs/ReportUtils.js b/src/libs/ReportUtils.js
index 4f91135d80a8..32cd86c4da84 100644
--- a/src/libs/ReportUtils.js
+++ b/src/libs/ReportUtils.js
@@ -3796,6 +3796,14 @@ function getIOUReportActionDisplayMessage(reportAction) {
     return displayMessage;
 }
 
+/**
+ * @param {Object} report
+ * @returns {Boolean}
+ */
+function isReportDraft(report) {
+    return lodashGet(report, 'stateNum') === CONST.REPORT.STATE_NUM.OPEN && lodashGet(report, 'statusNum') === CONST.REPORT.STATUS.OPEN;
+}
+
 export {
     getReportParticipantsTitle,
     isReportMessageAttachment,
@@ -3940,4 +3948,5 @@ export {
     hasMissingSmartscanFields,
     getIOUReportActionDisplayMessage,
     isWaitingForTaskCompleteFromAssignee,
+    isReportDraft,
 };
diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index b6f193ceeef4..e5969c74167d 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -2302,6 +2302,8 @@ function navigateToNextPage(iou, iouType, report, path = '') {
     Navigation.navigate(ROUTES.MONEY_REQUEST_PARTICIPANTS.getRoute(iouType));
 }
 
+function submitReport() {}
+
 export {
     createDistanceRequest,
     editMoneyRequest,
@@ -2332,4 +2334,5 @@ export {
     navigateToNextPage,
     updateDistanceRequest,
     replaceReceipt,
+    submitReport,
 };