diff --git a/src/components/ReportActionItem/TaskPreview.tsx b/src/components/ReportActionItem/TaskPreview.tsx index f6f436cbd51e..2ea295d16143 100644 --- a/src/components/ReportActionItem/TaskPreview.tsx +++ b/src/components/ReportActionItem/TaskPreview.tsx @@ -75,7 +75,8 @@ function TaskPreview({taskReportID, action, contextMenuAnchor, chatReportID, che ? taskReport?.stateNum === CONST.REPORT.STATE_NUM.APPROVED && taskReport.statusNum === CONST.REPORT.STATUS_NUM.APPROVED : action?.childStateNum === CONST.REPORT.STATE_NUM.APPROVED && action?.childStatusNum === CONST.REPORT.STATUS_NUM.APPROVED; const taskTitle = Str.htmlEncode(TaskUtils.getTaskTitleFromReport(taskReport, action?.childReportName ?? '')); - const taskAssigneeAccountID = Task.getTaskAssigneeAccountID(taskReport) ?? action?.childManagerAccountID ?? -1; + const taskAssigneeAccountID = Task.getTaskAssigneeAccountID(taskReport) ?? action?.childManagerAccountID ?? CONST.DEFAULT_NUMBER_ID; + const taskOwnerAccountID = taskReport?.ownerAccountID ?? action?.actorAccountID ?? CONST.DEFAULT_NUMBER_ID; const hasAssignee = taskAssigneeAccountID > 0; const personalDetails = usePersonalDetails(); const avatar = personalDetails?.[taskAssigneeAccountID]?.avatar ?? Expensicons.FallbackAvatar; @@ -106,12 +107,12 @@ function TaskPreview({taskReportID, action, contextMenuAnchor, chatReportID, che { if (isTaskCompleted) { - Task.reopenTask(taskReport); + Task.reopenTask(taskReport, taskReportID); } else { - Task.completeTask(taskReport); + Task.completeTask(taskReport, taskReportID); } })} accessibilityLabel={translate('task.task')} diff --git a/src/components/ReportActionItem/TaskView.tsx b/src/components/ReportActionItem/TaskView.tsx index 2b0dc9387927..7901426b33e0 100644 --- a/src/components/ReportActionItem/TaskView.tsx +++ b/src/components/ReportActionItem/TaskView.tsx @@ -10,8 +10,7 @@ import OfflineWithFeedback from '@components/OfflineWithFeedback'; import {usePersonalDetails} from '@components/OnyxProvider'; import PressableWithSecondaryInteraction from '@components/PressableWithSecondaryInteraction'; import Text from '@components/Text'; -import withCurrentUserPersonalDetails from '@components/withCurrentUserPersonalDetails'; -import type {WithCurrentUserPersonalDetailsProps} from '@components/withCurrentUserPersonalDetails'; +import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails'; import useLocalize from '@hooks/useLocalize'; import useStyleUtils from '@hooks/useStyleUtils'; import useThemeStyles from '@hooks/useThemeStyles'; @@ -27,27 +26,28 @@ import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; import type {Report} from '@src/types/onyx'; -type TaskViewProps = WithCurrentUserPersonalDetailsProps & { +type TaskViewProps = { /** The report currently being looked at */ report: Report; }; -function TaskView({report, ...props}: TaskViewProps) { +function TaskView({report}: TaskViewProps) { const styles = useThemeStyles(); const StyleUtils = useStyleUtils(); + const currentUserPersonalDetails = useCurrentUserPersonalDetails(); + const personalDetails = usePersonalDetails(); useEffect(() => { Task.setTaskReport(report); }, [report]); - const personalDetails = usePersonalDetails(); const taskTitle = convertToLTR(report.reportName ?? ''); const assigneeTooltipDetails = ReportUtils.getDisplayNamesWithTooltips( OptionsListUtils.getPersonalDetailsForAccountIDs(report.managerID ? [report.managerID] : [], personalDetails), false, ); - const isCompleted = ReportUtils.isCompletedTaskReport(report); const isOpen = ReportUtils.isOpenTaskReport(report); - const canModifyTask = Task.canModifyTask(report, props.currentUserPersonalDetails.accountID); - const canActionTask = Task.canActionTask(report, props.currentUserPersonalDetails.accountID); + const isCompleted = ReportUtils.isCompletedTaskReport(report); + const canModifyTask = Task.canModifyTask(report, currentUserPersonalDetails.accountID); + const canActionTask = Task.canActionTask(report, currentUserPersonalDetails.accountID); const disableState = !canModifyTask; const isDisableInteractive = !canModifyTask || !isOpen; const {translate} = useLocalize(); @@ -77,10 +77,10 @@ function TaskView({report, ...props}: TaskViewProps) { styles.ph5, styles.pv2, StyleUtils.getButtonBackgroundColorStyle(getButtonState(hovered, pressed, false, disableState, !isDisableInteractive), true), - isDisableInteractive && !disableState && styles.cursorDefault, + isDisableInteractive && styles.cursorDefault, ]} - disabled={disableState} accessibilityLabel={taskTitle || translate('task.task')} + disabled={isDisableInteractive} > {({pressed}) => ( @@ -104,7 +104,7 @@ function TaskView({report, ...props}: TaskViewProps) { containerBorderRadius={8} caretSize={16} accessibilityLabel={taskTitle || translate('task.task')} - disabled={!canModifyTask || !canActionTask} + disabled={!canActionTask} /> - {isOpen && ( + {!isDisableInteractive && ( Navigation.navigate(ROUTES.REPORT_DESCRIPTION.getRoute(report.reportID, Navigation.getReportRHPActiveRoute()))} - shouldShowRightIcon={isOpen} + shouldShowRightIcon={!isDisableInteractive} disabled={disableState} wrapperStyle={[styles.pv2, styles.taskDescriptionMenuItem]} shouldGreyOutWhenDisabled={false} numberOfLinesTitle={0} interactive={!isDisableInteractive} + shouldUseDefaultCursorWhenDisabled /> @@ -153,23 +154,25 @@ function TaskView({report, ...props}: TaskViewProps) { avatarSize={CONST.AVATAR_SIZE.SMALLER} titleStyle={styles.assigneeTextStyle} onPress={() => Navigation.navigate(ROUTES.TASK_ASSIGNEE.getRoute(report.reportID, Navigation.getReportRHPActiveRoute()))} - shouldShowRightIcon={isOpen} + shouldShowRightIcon={!isDisableInteractive} disabled={disableState} wrapperStyle={[styles.pv2]} isSmallAvatarSubscriptMenu shouldGreyOutWhenDisabled={false} interactive={!isDisableInteractive} titleWithTooltips={assigneeTooltipDetails} + shouldUseDefaultCursorWhenDisabled /> ) : ( Navigation.navigate(ROUTES.TASK_ASSIGNEE.getRoute(report.reportID, Navigation.getReportRHPActiveRoute()))} - shouldShowRightIcon={isOpen} + shouldShowRightIcon={!isDisableInteractive} disabled={disableState} wrapperStyle={[styles.pv2]} shouldGreyOutWhenDisabled={false} interactive={!isDisableInteractive} + shouldUseDefaultCursorWhenDisabled /> )} @@ -180,4 +183,4 @@ function TaskView({report, ...props}: TaskViewProps) { TaskView.displayName = 'TaskView'; -export default withCurrentUserPersonalDetails(TaskView); +export default TaskView; diff --git a/src/components/TaskHeaderActionButton.tsx b/src/components/TaskHeaderActionButton.tsx index 3841d559311f..dd2ba54c2f6d 100644 --- a/src/components/TaskHeaderActionButton.tsx +++ b/src/components/TaskHeaderActionButton.tsx @@ -1,30 +1,25 @@ import React from 'react'; import {View} from 'react-native'; -import type {OnyxEntry} from 'react-native-onyx'; -import {withOnyx} from 'react-native-onyx'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import * as ReportUtils from '@libs/ReportUtils'; import * as TaskUtils from '@libs/TaskUtils'; import * as Session from '@userActions/Session'; import * as Task from '@userActions/Task'; -import ONYXKEYS from '@src/ONYXKEYS'; +import CONST from '@src/CONST'; import type * as OnyxTypes from '@src/types/onyx'; import Button from './Button'; +import {useSession} from './OnyxProvider'; -type TaskHeaderActionButtonOnyxProps = { - /** Current user session */ - session: OnyxEntry; -}; - -type TaskHeaderActionButtonProps = TaskHeaderActionButtonOnyxProps & { +type TaskHeaderActionButtonProps = { /** The report currently being looked at */ report: OnyxTypes.Report; }; -function TaskHeaderActionButton({report, session}: TaskHeaderActionButtonProps) { +function TaskHeaderActionButton({report}: TaskHeaderActionButtonProps) { const {translate} = useLocalize(); const styles = useThemeStyles(); + const session = useSession(); if (!ReportUtils.canWriteInReport(report)) { return null; @@ -34,7 +29,7 @@ function TaskHeaderActionButton({report, session}: TaskHeaderActionButtonProps)