From 39d1ba7fe0a4a4c5bea54fc4479abe1fe0c31c8a Mon Sep 17 00:00:00 2001
From: Domagoj Kriskovic <dom.kriskovic@overleaf.com>
Date: Mon, 13 Jan 2025 14:32:23 +0100
Subject: [PATCH] Allow rejecting reviewers own track changes (#22793)

* Allow rejecting reviewers own track changes

* reject option only for change authors

GitOrigin-RevId: ecbc5ee9dfe6c468a5df3c1ce7b147561802a8c0
---
 .../components/review-panel-change.tsx        | 91 ++++++++++---------
 1 file changed, 50 insertions(+), 41 deletions(-)

diff --git a/services/web/frontend/js/features/review-panel-new/components/review-panel-change.tsx b/services/web/frontend/js/features/review-panel-new/components/review-panel-change.tsx
index b316898eba..2c1f9175be 100644
--- a/services/web/frontend/js/features/review-panel-new/components/review-panel-change.tsx
+++ b/services/web/frontend/js/features/review-panel-new/components/review-panel-change.tsx
@@ -16,6 +16,7 @@ import { ReviewPanelChangeUser } from './review-panel-change-user'
 import { ReviewPanelEntry } from './review-panel-entry'
 import { useModalsContext } from '@/features/ide-react/context/modals-context'
 import { ExpandableContent } from './review-panel-expandable-content'
+import { useUserContext } from '@/shared/context/user-context'
 
 export const ReviewPanelChange = memo<{
   change: Change<EditOperation>
@@ -44,6 +45,7 @@ export const ReviewPanelChange = memo<{
     const permissions = usePermissionsContext()
     const changesUsers = useChangesUsersContext()
     const { showGenericMessageModal } = useModalsContext()
+    const user = useUserContext()
 
     const [accepting, setAccepting] = useState(false)
 
@@ -70,6 +72,8 @@ export const ReviewPanelChange = memo<{
       return null
     }
 
+    const isChangeAuthor = change.metadata?.user_id === user.id
+
     return (
       <ReviewPanelEntry
         className={classnames('review-panel-entry-change', {
@@ -100,51 +104,56 @@ export const ReviewPanelChange = memo<{
                 {formatTimeBasedOnYear(change.metadata?.ts)}
               </div>
             </div>
-            {editable && permissions.write && (
+            {editable && (
               <div className="review-panel-entry-actions">
-                <OLTooltip
-                  id="accept-change"
-                  overlayProps={{ placement: 'bottom' }}
-                  description={t('accept_change')}
-                  tooltipProps={{ className: 'review-panel-tooltip' }}
-                >
-                  <button
-                    type="button"
-                    className="btn"
-                    onClick={acceptHandler}
-                    tabIndex={0}
+                {permissions.write && (
+                  <OLTooltip
+                    id="accept-change"
+                    overlayProps={{ placement: 'bottom' }}
+                    description={t('accept_change')}
+                    tooltipProps={{ className: 'review-panel-tooltip' }}
                   >
-                    <MaterialIcon
-                      type="check"
-                      className="review-panel-entry-actions-icon"
-                      accessibilityLabel={t('accept_change')}
-                    />
-                  </button>
-                </OLTooltip>
+                    <button
+                      type="button"
+                      className="btn"
+                      onClick={acceptHandler}
+                      tabIndex={0}
+                    >
+                      <MaterialIcon
+                        type="check"
+                        className="review-panel-entry-actions-icon"
+                        accessibilityLabel={t('accept_change')}
+                      />
+                    </button>
+                  </OLTooltip>
+                )}
 
-                <OLTooltip
-                  id="reject-change"
-                  description={t('reject_change')}
-                  overlayProps={{ placement: 'bottom' }}
-                  tooltipProps={{ className: 'review-panel-tooltip' }}
-                >
-                  <button
-                    tabIndex={0}
-                    type="button"
-                    className="btn"
-                    onClick={() =>
-                      aggregate
-                        ? rejectChanges(change.id, aggregate.id)
-                        : rejectChanges(change.id)
-                    }
+                {(permissions.write ||
+                  (permissions.trackedWrite && isChangeAuthor)) && (
+                  <OLTooltip
+                    id="reject-change"
+                    description={t('reject_change')}
+                    overlayProps={{ placement: 'bottom' }}
+                    tooltipProps={{ className: 'review-panel-tooltip' }}
                   >
-                    <MaterialIcon
-                      className="review-panel-entry-actions-icon"
-                      accessibilityLabel={t('reject_change')}
-                      type="close"
-                    />
-                  </button>
-                </OLTooltip>
+                    <button
+                      tabIndex={0}
+                      type="button"
+                      className="btn"
+                      onClick={() =>
+                        aggregate
+                          ? rejectChanges(change.id, aggregate.id)
+                          : rejectChanges(change.id)
+                      }
+                    >
+                      <MaterialIcon
+                        className="review-panel-entry-actions-icon"
+                        accessibilityLabel={t('reject_change')}
+                        type="close"
+                      />
+                    </button>
+                  </OLTooltip>
+                )}
               </div>
             )}
           </div>