From c4d9d12cde28367ec3b52b47dd33821637fa2911 Mon Sep 17 00:00:00 2001
From: Dylan <dylandylan9112@gmail.com>
Date: Fri, 26 Jan 2024 11:46:20 +0700
Subject: [PATCH 1/5] allow member to edit task

---
 .../ReportActionItem/TaskPreview.tsx          | 28 ++-----------------
 src/components/ReportActionItem/TaskView.js   | 21 +-------------
 src/components/TaskHeaderActionButton.tsx     | 13 ++-------
 src/libs/actions/Task.ts                      | 13 ++-------
 src/pages/home/HeaderView.js                  | 16 +----------
 src/pages/home/report/ReportActionItem.js     |  1 -
 src/pages/tasks/TaskAssigneeSelectorModal.js  | 19 +------------
 src/pages/tasks/TaskDescriptionPage.js        | 19 +------------
 src/pages/tasks/TaskTitlePage.js              | 16 +----------
 9 files changed, 12 insertions(+), 134 deletions(-)

diff --git a/src/components/ReportActionItem/TaskPreview.tsx b/src/components/ReportActionItem/TaskPreview.tsx
index cbd166d79d3a..9de95ca0cb3f 100644
--- a/src/components/ReportActionItem/TaskPreview.tsx
+++ b/src/components/ReportActionItem/TaskPreview.tsx
@@ -29,22 +29,14 @@ import * as Task from '@userActions/Task';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
-import type {Policy, Report, ReportAction} from '@src/types/onyx';
+import type {Report, ReportAction} from '@src/types/onyx';
 import {isEmptyObject} from '@src/types/utils/EmptyObject';
 
-type PolicyRole = {
-    /** The role of current user */
-    role: Task.PolicyValue | undefined;
-};
-
 type TaskPreviewOnyxProps = {
     /* Onyx Props */
 
     /* current report of TaskPreview */
     taskReport: OnyxEntry<Report>;
-
-    /** The policy of root parent report */
-    rootParentReportpolicy: OnyxEntry<PolicyRole>;
 };
 
 type TaskPreviewProps = WithCurrentUserPersonalDetailsProps &
@@ -71,17 +63,7 @@ type TaskPreviewProps = WithCurrentUserPersonalDetailsProps &
         checkIfContextMenuActive: () => void;
     };
 
-function TaskPreview({
-    taskReport,
-    taskReportID,
-    action,
-    contextMenuAnchor,
-    chatReportID,
-    checkIfContextMenuActive,
-    currentUserPersonalDetails,
-    rootParentReportpolicy,
-    isHovered = false,
-}: TaskPreviewProps) {
+function TaskPreview({taskReport, taskReportID, action, contextMenuAnchor, chatReportID, checkIfContextMenuActive, currentUserPersonalDetails, isHovered = false}: TaskPreviewProps) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
     const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT;
@@ -124,7 +106,7 @@ function TaskPreview({
                         style={[styles.mr2]}
                         containerStyle={[styles.taskCheckbox]}
                         isChecked={isTaskCompleted}
-                        disabled={!Task.canModifyTask(taskReport, currentUserPersonalDetails.accountID, rootParentReportpolicy?.role)}
+                        disabled={!Task.canModifyTask(taskReport, currentUserPersonalDetails.accountID)}
                         onPress={Session.checkIfActionIsAllowed(() => {
                             if (isTaskCompleted) {
                                 Task.reopenTask(taskReport);
@@ -152,9 +134,5 @@ export default withCurrentUserPersonalDetails(
         taskReport: {
             key: ({taskReportID}) => `${ONYXKEYS.COLLECTION.REPORT}${taskReportID}`,
         },
-        rootParentReportpolicy: {
-            key: ({policyID}) => `${ONYXKEYS.COLLECTION.POLICY}${policyID ?? '0'}`,
-            selector: (policy: Policy | null) => ({role: policy?.role}),
-        },
     })(TaskPreview),
 );
diff --git a/src/components/ReportActionItem/TaskView.js b/src/components/ReportActionItem/TaskView.js
index 7f7b177136ed..bb8945495018 100644
--- a/src/components/ReportActionItem/TaskView.js
+++ b/src/components/ReportActionItem/TaskView.js
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import React, {useEffect} from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
-import _ from 'underscore';
 import Checkbox from '@components/Checkbox';
 import Hoverable from '@components/Hoverable';
 import Icon from '@components/Icon';
@@ -37,12 +36,6 @@ const propTypes = {
     /** The report currently being looked at */
     report: reportPropTypes.isRequired,
 
-    /** The policy of root parent report */
-    policy: PropTypes.shape({
-        /** The role of current user */
-        role: PropTypes.string,
-    }),
-
     /** Whether we should display the horizontal rule below the component */
     shouldShowHorizontalRule: PropTypes.bool.isRequired,
 
@@ -51,10 +44,6 @@ const propTypes = {
     ...withCurrentUserPersonalDetailsPropTypes,
 };
 
-const defaultProps = {
-    policy: {},
-};
-
 function TaskView(props) {
     const styles = useThemeStyles();
     const StyleUtils = useStyleUtils();
@@ -66,7 +55,7 @@ function TaskView(props) {
     const assigneeTooltipDetails = ReportUtils.getDisplayNamesWithTooltips(OptionsListUtils.getPersonalDetailsForAccountIDs([props.report.managerID], props.personalDetails), false);
     const isCompleted = ReportUtils.isCompletedTaskReport(props.report);
     const isOpen = ReportUtils.isOpenTaskReport(props.report);
-    const canModifyTask = Task.canModifyTask(props.report, props.currentUserPersonalDetails.accountID, lodashGet(props.policy, 'role', ''));
+    const canModifyTask = Task.canModifyTask(props.report, props.currentUserPersonalDetails.accountID);
     const disableState = !canModifyTask;
     const isDisableInteractive = !canModifyTask || !isOpen;
     const personalDetails = usePersonalDetails() || CONST.EMPTY_OBJECT;
@@ -199,7 +188,6 @@ function TaskView(props) {
 }
 
 TaskView.propTypes = propTypes;
-TaskView.defaultProps = defaultProps;
 TaskView.displayName = 'TaskView';
 
 export default compose(
@@ -210,12 +198,5 @@ export default compose(
         personalDetails: {
             key: ONYXKEYS.PERSONAL_DETAILS_LIST,
         },
-        policy: {
-            key: ({report}) => {
-                const rootParentReport = ReportUtils.getRootParentReport(report);
-                return `${ONYXKEYS.COLLECTION.POLICY}${rootParentReport ? rootParentReport.policyID : '0'}`;
-            },
-            selector: (policy) => _.pick(policy, ['role']),
-        },
     }),
 )(TaskView);
diff --git a/src/components/TaskHeaderActionButton.tsx b/src/components/TaskHeaderActionButton.tsx
index d39f03c5aad4..2d964f58c253 100644
--- a/src/components/TaskHeaderActionButton.tsx
+++ b/src/components/TaskHeaderActionButton.tsx
@@ -14,9 +14,6 @@ import Button from './Button';
 type TaskHeaderActionButtonOnyxProps = {
     /** Current user session */
     session: OnyxEntry<OnyxTypes.Session>;
-
-    /** The policy of root parent report */
-    policy: OnyxEntry<OnyxTypes.Policy>;
 };
 
 type TaskHeaderActionButtonProps = TaskHeaderActionButtonOnyxProps & {
@@ -24,7 +21,7 @@ type TaskHeaderActionButtonProps = TaskHeaderActionButtonOnyxProps & {
     report: OnyxTypes.Report;
 };
 
-function TaskHeaderActionButton({report, session, policy}: TaskHeaderActionButtonProps) {
+function TaskHeaderActionButton({report, session}: TaskHeaderActionButtonProps) {
     const {translate} = useLocalize();
     const styles = useThemeStyles();
 
@@ -32,7 +29,7 @@ function TaskHeaderActionButton({report, session, policy}: TaskHeaderActionButto
         <View style={[styles.flexRow, styles.alignItemsCenter, styles.justifyContentEnd]}>
             <Button
                 success
-                isDisabled={!Task.canModifyTask(report, session?.accountID ?? 0, policy?.role)}
+                isDisabled={!Task.canModifyTask(report, session?.accountID ?? 0)}
                 medium
                 text={translate(ReportUtils.isCompletedTaskReport(report) ? 'task.markAsIncomplete' : 'task.markAsComplete')}
                 onPress={Session.checkIfActionIsAllowed(() => (ReportUtils.isCompletedTaskReport(report) ? Task.reopenTask(report) : Task.completeTask(report)))}
@@ -48,10 +45,4 @@ export default withOnyx<TaskHeaderActionButtonProps, TaskHeaderActionButtonOnyxP
     session: {
         key: ONYXKEYS.SESSION,
     },
-    policy: {
-        key: ({report}) => {
-            const rootParentReport = ReportUtils.getRootParentReport(report);
-            return `${ONYXKEYS.COLLECTION.POLICY}${rootParentReport ? rootParentReport.policyID : '0'}`;
-        },
-    },
 })(TaskHeaderActionButton);
diff --git a/src/libs/actions/Task.ts b/src/libs/actions/Task.ts
index b2f6b57f390a..891d6759b878 100644
--- a/src/libs/actions/Task.ts
+++ b/src/libs/actions/Task.ts
@@ -919,7 +919,7 @@ function getTaskOwnerAccountID(taskReport: OnyxEntry<OnyxTypes.Report>): number
 /**
  * Check if you're allowed to modify the task - anyone that has write access to the report can modify the task
  */
-function canModifyTask(taskReport: OnyxEntry<OnyxTypes.Report>, sessionAccountID: number, policyRole: PolicyValue | undefined): boolean {
+function canModifyTask(taskReport: OnyxEntry<OnyxTypes.Report>, sessionAccountID: number): boolean {
     if (ReportUtils.isCanceledTaskReport(taskReport)) {
         return false;
     }
@@ -928,16 +928,7 @@ function canModifyTask(taskReport: OnyxEntry<OnyxTypes.Report>, sessionAccountID
         return true;
     }
 
-    const parentReport = ReportUtils.getParentReport(taskReport);
-
-    if (policyRole && !isEmptyObject(parentReport) && (ReportUtils.isChatRoom(parentReport) || ReportUtils.isPolicyExpenseChat(parentReport)) && policyRole !== CONST.POLICY.ROLE.ADMIN) {
-        return false;
-    }
-
-    // If you don't have access to the task report (maybe haven't opened it yet), check if you can access the parent report
-    // - If the parent report is an #admins only room
-    // - If you are a policy admin
-    return !isEmptyObject(parentReport) && ReportUtils.isAllowedToComment(parentReport);
+    return ReportUtils.isAllowedToComment(taskReport);
 }
 
 function clearTaskErrors(reportID: string) {
diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js
index 2a98a50552be..06c8f4e14e3b 100644
--- a/src/pages/home/HeaderView.js
+++ b/src/pages/home/HeaderView.js
@@ -59,12 +59,6 @@ const propTypes = {
         accountID: PropTypes.number,
     }),
 
-    /** The policy of root parent report */
-    rootParentReportPolicy: PropTypes.shape({
-        /** The role of current user */
-        role: PropTypes.string,
-    }),
-
     /** The current policy of the report */
     policy: PropTypes.shape({
         /** The policy name */
@@ -87,7 +81,6 @@ const defaultProps = {
         accountID: 0,
     },
     policy: {},
-    rootParentReportPolicy: {},
 };
 
 function HeaderView(props) {
@@ -122,7 +115,7 @@ function HeaderView(props) {
     // these users via alternative means. It is possible to request a call with Concierge so we leave the option for them.
     const threeDotMenuItems = [];
     if (isTaskReport && !isCanceledTaskReport) {
-        const canModifyTask = Task.canModifyTask(props.report, props.session.accountID, lodashGet(props.rootParentReportPolicy, 'role', ''));
+        const canModifyTask = Task.canModifyTask(props.report, props.session.accountID);
 
         // Task is marked as completed
         if (ReportUtils.isCompletedTaskReport(props.report) && canModifyTask) {
@@ -347,12 +340,5 @@ export default memo(
             key: ({report}) => `${ONYXKEYS.COLLECTION.POLICY}${report ? report.policyID : '0'}`,
             selector: (policy) => _.pick(policy, ['name', 'avatar', 'pendingAction']),
         },
-        rootParentReportPolicy: {
-            key: ({report}) => {
-                const rootParentReport = ReportUtils.getRootParentReport(report);
-                return `${ONYXKEYS.COLLECTION.POLICY}${rootParentReport ? rootParentReport.policyID : '0'}`;
-            },
-            selector: (policy) => _.pick(policy, ['role']),
-        },
     })(HeaderView),
 );
diff --git a/src/pages/home/report/ReportActionItem.js b/src/pages/home/report/ReportActionItem.js
index 80fb341a2cf8..dc6d23de445f 100644
--- a/src/pages/home/report/ReportActionItem.js
+++ b/src/pages/home/report/ReportActionItem.js
@@ -363,7 +363,6 @@ function ReportActionItem(props) {
                 <ReportPreview
                     iouReportID={ReportActionsUtils.getIOUReportIDFromReportActionPreview(props.action)}
                     chatReportID={props.report.reportID}
-                    policyID={props.report.policyID}
                     containerStyles={props.displayAsGroup ? [] : [styles.mt2]}
                     action={props.action}
                     isHovered={hovered}
diff --git a/src/pages/tasks/TaskAssigneeSelectorModal.js b/src/pages/tasks/TaskAssigneeSelectorModal.js
index 1a526a9cdd9b..fac795c996b0 100644
--- a/src/pages/tasks/TaskAssigneeSelectorModal.js
+++ b/src/pages/tasks/TaskAssigneeSelectorModal.js
@@ -57,12 +57,6 @@ const propTypes = {
         report: reportPropTypes,
     }),
 
-    /** The policy of root parent report */
-    rootParentReportPolicy: PropTypes.shape({
-        /** The role of current user */
-        role: PropTypes.string,
-    }),
-
     ...withLocalizePropTypes,
 };
 
@@ -72,7 +66,6 @@ const defaultProps = {
     session: {},
     route: {},
     task: {},
-    rootParentReportPolicy: {},
 };
 
 function TaskAssigneeSelectorModal(props) {
@@ -209,7 +202,7 @@ function TaskAssigneeSelectorModal(props) {
     );
 
     const isOpen = ReportUtils.isOpenTaskReport(report);
-    const canModifyTask = Task.canModifyTask(report, props.currentUserPersonalDetails.accountID, lodashGet(props.rootParentReportPolicy, 'role', ''));
+    const canModifyTask = Task.canModifyTask(report, props.currentUserPersonalDetails.accountID);
     const isTaskNonEditable = ReportUtils.isTaskReport(report) && (!canModifyTask || !isOpen);
 
     return (
@@ -264,14 +257,4 @@ export default compose(
             key: ONYXKEYS.SESSION,
         },
     }),
-    withOnyx({
-        rootParentReportPolicy: {
-            key: ({reports, route}) => {
-                const report = reports[`${ONYXKEYS.COLLECTION.REPORT}${route.params?.reportID || '0'}`];
-                const rootParentReport = ReportUtils.getRootParentReport(report);
-                return `${ONYXKEYS.COLLECTION.POLICY}${rootParentReport ? rootParentReport.policyID : '0'}`;
-            },
-            selector: (policy) => _.pick(policy, ['role']),
-        },
-    }),
 )(TaskAssigneeSelectorModal);
diff --git a/src/pages/tasks/TaskDescriptionPage.js b/src/pages/tasks/TaskDescriptionPage.js
index 3a6999d4408a..c5dab0dc2f94 100644
--- a/src/pages/tasks/TaskDescriptionPage.js
+++ b/src/pages/tasks/TaskDescriptionPage.js
@@ -1,11 +1,8 @@
 import {useFocusEffect} from '@react-navigation/native';
 import ExpensiMark from 'expensify-common/lib/ExpensiMark';
-import lodashGet from 'lodash/get';
-import PropTypes from 'prop-types';
 import React, {useCallback, useRef} from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
-import _ from 'underscore';
 import FullPageNotFoundView from '@components/BlockingViews/FullPageNotFoundView';
 import FormProvider from '@components/Form/FormProvider';
 import InputWrapper from '@components/Form/InputWrapper';
@@ -31,19 +28,12 @@ const propTypes = {
     /** The report currently being looked at */
     report: reportPropTypes,
 
-    /** The policy of parent report */
-    rootParentReportPolicy: PropTypes.shape({
-        /** The role of current user */
-        role: PropTypes.string,
-    }),
-
     /* Onyx Props */
     ...withLocalizePropTypes,
 };
 
 const defaultProps = {
     report: {},
-    rootParentReportPolicy: {},
 };
 
 const parser = new ExpensiMark();
@@ -74,7 +64,7 @@ function TaskDescriptionPage(props) {
     const focusTimeoutRef = useRef(null);
 
     const isOpen = ReportUtils.isOpenTaskReport(props.report);
-    const canModifyTask = Task.canModifyTask(props.report, props.currentUserPersonalDetails.accountID, lodashGet(props.rootParentReportPolicy, 'role', ''));
+    const canModifyTask = Task.canModifyTask(props.report, props.currentUserPersonalDetails.accountID);
     const isTaskNonEditable = ReportUtils.isTaskReport(props.report) && (!canModifyTask || !isOpen);
 
     useFocusEffect(
@@ -148,12 +138,5 @@ export default compose(
         report: {
             key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.reportID}`,
         },
-        rootParentReportPolicy: {
-            key: ({report}) => {
-                const rootParentReport = ReportUtils.getRootParentReport(report);
-                return `${ONYXKEYS.COLLECTION.POLICY}${rootParentReport ? rootParentReport.policyID : '0'}`;
-            },
-            selector: (policy) => _.pick(policy, ['role']),
-        },
     }),
 )(TaskDescriptionPage);
diff --git a/src/pages/tasks/TaskTitlePage.js b/src/pages/tasks/TaskTitlePage.js
index 9b393a8a2374..2ca10f0b396d 100644
--- a/src/pages/tasks/TaskTitlePage.js
+++ b/src/pages/tasks/TaskTitlePage.js
@@ -26,19 +26,12 @@ const propTypes = {
     /** The report currently being looked at */
     report: reportPropTypes,
 
-    /** The policy of parent report */
-    rootParentReportPolicy: PropTypes.shape({
-        /** The role of current user */
-        role: PropTypes.string,
-    }),
-
     /* Onyx Props */
     ...withLocalizePropTypes,
 };
 
 const defaultProps = {
     report: {},
-    rootParentReportPolicy: {},
 };
 
 function TaskTitlePage(props) {
@@ -79,7 +72,7 @@ function TaskTitlePage(props) {
 
     const inputRef = useRef(null);
     const isOpen = ReportUtils.isOpenTaskReport(props.report);
-    const canModifyTask = Task.canModifyTask(props.report, props.currentUserPersonalDetails.accountID, lodashGet(props.rootParentReportPolicy, 'role', ''));
+    const canModifyTask = Task.canModifyTask(props.report, props.currentUserPersonalDetails.accountID);
     const isTaskNonEditable = ReportUtils.isTaskReport(props.report) && (!canModifyTask || !isOpen);
 
     return (
@@ -139,12 +132,5 @@ export default compose(
         report: {
             key: ({route}) => `${ONYXKEYS.COLLECTION.REPORT}${route.params.reportID}`,
         },
-        rootParentReportPolicy: {
-            key: ({report}) => {
-                const rootParentReport = ReportUtils.getRootParentReport(report);
-                return `${ONYXKEYS.COLLECTION.POLICY}${rootParentReport ? rootParentReport.policyID : '0'}`;
-            },
-            selector: (policy) => _.pick(policy, ['role']),
-        },
     }),
 )(TaskTitlePage);

From d72bd88692f559a8289ebc842c1ab1261ffc9bbb Mon Sep 17 00:00:00 2001
From: Dylan <dylandylan9112@gmail.com>
Date: Fri, 26 Jan 2024 11:55:53 +0700
Subject: [PATCH 2/5] fix lint

---
 src/pages/tasks/TaskTitlePage.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/pages/tasks/TaskTitlePage.js b/src/pages/tasks/TaskTitlePage.js
index 2ca10f0b396d..9b3d28a0d032 100644
--- a/src/pages/tasks/TaskTitlePage.js
+++ b/src/pages/tasks/TaskTitlePage.js
@@ -1,5 +1,3 @@
-import lodashGet from 'lodash/get';
-import PropTypes from 'prop-types';
 import React, {useCallback, useRef} from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';

From a4e5fbaf085f9dfa406748d6e5a4ea17db89fc6b Mon Sep 17 00:00:00 2001
From: Dylan <dylandylan9112@gmail.com>
Date: Wed, 31 Jan 2024 09:38:14 +0700
Subject: [PATCH 3/5] fix lint

---
 src/components/ReportActionItem/TaskView.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ReportActionItem/TaskView.tsx b/src/components/ReportActionItem/TaskView.tsx
index 414bd70155f0..bdcc4d01b1a8 100644
--- a/src/components/ReportActionItem/TaskView.tsx
+++ b/src/components/ReportActionItem/TaskView.tsx
@@ -28,7 +28,7 @@ import * as Task from '@userActions/Task';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
 import ROUTES from '@src/ROUTES';
-import type {PersonalDetailsList, Policy, Report} from '@src/types/onyx';
+import type {PersonalDetailsList, Report} from '@src/types/onyx';
 
 type TaskViewOnyxProps = {
     /** All of the personal details for everyone */

From 2876149805546bee3eef64bab87fe4a8fa9bd671 Mon Sep 17 00:00:00 2001
From: Dylan <dylandylan9112@gmail.com>
Date: Thu, 1 Feb 2024 20:42:09 +0700
Subject: [PATCH 4/5] add condition for safe

---
 src/libs/actions/Task.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/actions/Task.ts b/src/libs/actions/Task.ts
index 3e491b45db7f..72a50c7d0ff8 100644
--- a/src/libs/actions/Task.ts
+++ b/src/libs/actions/Task.ts
@@ -885,7 +885,7 @@ function canModifyTask(taskReport: OnyxEntry<OnyxTypes.Report>, sessionAccountID
         return true;
     }
 
-    return ReportUtils.isAllowedToComment(taskReport);
+    return !isEmptyObject(taskReport) && ReportUtils.isAllowedToComment(taskReport);
 }
 
 function clearTaskErrors(reportID: string) {

From 9e1ce5c7c72180ebe870b0e1d54c112073a870e2 Mon Sep 17 00:00:00 2001
From: Dylan <dylandylan9112@gmail.com>
Date: Sat, 3 Feb 2024 00:52:33 +0700
Subject: [PATCH 5/5] remove props

---
 src/pages/home/report/ReportActionItem.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/home/report/ReportActionItem.js b/src/pages/home/report/ReportActionItem.js
index a04489ca3f6f..0c1ea79faaff 100644
--- a/src/pages/home/report/ReportActionItem.js
+++ b/src/pages/home/report/ReportActionItem.js
@@ -364,6 +364,7 @@ function ReportActionItem(props) {
                 <ReportPreview
                     iouReportID={ReportActionsUtils.getIOUReportIDFromReportActionPreview(props.action)}
                     chatReportID={props.report.reportID}
+                    policyID={props.report.policyID}
                     containerStyles={props.displayAsGroup ? [] : [styles.mt2]}
                     action={props.action}
                     isHovered={hovered}
@@ -385,7 +386,6 @@ function ReportActionItem(props) {
                     <TaskPreview
                         taskReportID={props.action.originalMessage.taskReportID.toString()}
                         chatReportID={props.report.reportID}
-                        policyID={ReportUtils.getRootParentReport(props.report).policyID}
                         action={props.action}
                         isHovered={hovered}
                         contextMenuAnchor={popoverAnchorRef}