Merge pull request #4675 from overleaf/msm-fix-review-button-ce

Remove Track Changes button in CE

GitOrigin-RevId: 7e682ea9cce8d23ba0fffc95cfb379588f0fd42e

services/web/frontend/js/features/editor-navigation-toolbar/components/editor-navigation-toolbar-root.js

@@ -8,6 +8,9 @@ import { useProjectContext } from '../../../shared/context/project-context'
 
 const projectContextPropTypes = {
   name: PropTypes.string.isRequired,
+  features: PropTypes.shape({
+    trackChangesVisible: PropTypes.bool,
+  }).isRequired,
 }
 
 const editorContextPropTypes = {
@@ -41,7 +44,10 @@ const EditorNavigationToolbarRoot = React.memo(
     openDoc,
     openShareProjectModal,
   }) {
-    const { name: projectName } = useProjectContext(projectContextPropTypes)
+    const {
+      name: projectName,
+      features: { trackChangesVisible },
+    } = useProjectContext(projectContextPropTypes)
 
     const {
       cobranding,
@@ -132,6 +138,7 @@ const EditorNavigationToolbarRoot = React.memo(
         pdfViewIsOpen={view === 'pdf'}
         pdfButtonIsVisible={pdfLayout === 'flat'}
         togglePdfView={togglePdfView}
+        trackChangesVisible={trackChangesVisible}
       />
     )
   }

services/web/frontend/js/features/editor-navigation-toolbar/components/toolbar-header.js

@@ -36,8 +36,11 @@ const ToolbarHeader = React.memo(function ToolbarHeader({
   pdfViewIsOpen,
   pdfButtonIsVisible,
   togglePdfView,
+  trackChangesVisible,
 }) {
   const shouldDisplayPublishButton = hasPublishPermissions && PublishButton
+  const shouldDisplayTrackChangesButton =
+    trackChangesVisible && !isRestrictedTokenMember
 
   return (
     <header className="toolbar toolbar-header toolbar-with-labels">
@@ -64,7 +67,7 @@ const ToolbarHeader = React.memo(function ToolbarHeader({
       <div className="toolbar-right">
         <OnlineUsersWidget onlineUsers={onlineUsers} goToUser={goToUser} />
 
-        {!isRestrictedTokenMember && (
+        {shouldDisplayTrackChangesButton && (
           <TrackChangesToggleButton
             onClick={toggleReviewPanelOpen}
             disabled={historyIsOpen}
@@ -114,6 +117,7 @@ ToolbarHeader.propTypes = {
   pdfViewIsOpen: PropTypes.bool,
   pdfButtonIsVisible: PropTypes.bool,
   togglePdfView: PropTypes.func.isRequired,
+  trackChangesVisible: PropTypes.bool,
 }
 
 export default ToolbarHeader

services/web/frontend/js/shared/context/project-context.js

@@ -21,8 +21,8 @@ ProjectContext.Provider.propTypes = {
     ),
     features: PropTypes.shape({
       collaborators: PropTypes.number,
-      compileGroup: PropTypes.oneOf(['alpha', 'standard', 'priority'])
-        .isRequired,
+      compileGroup: PropTypes.oneOf(['alpha', 'standard', 'priority']),
+      trackChangesVisible: PropTypes.bool,
     }),
     publicAccesLevel: PropTypes.string,
     tokens: PropTypes.shape({
@@ -60,7 +60,7 @@ export function ProjectProvider({ children }) {
 
   // when the provider is created the project is still not added to the Angular scope.
   // Name is also populated to prevent errors in existing React components
-  const value = project || { _id: window.project_id, name: '' }
+  const value = project || { _id: window.project_id, name: '', features: {} }
 
   return (
     <ProjectContext.Provider value={value}>{children}</ProjectContext.Provider>

services/web/test/frontend/features/editor-navigation-toolbar/components/toolbar-header.test.js

@@ -17,6 +17,7 @@ describe('<ToolbarHeader />', function () {
     openShareModal: () => {},
     togglePdfView: () => {},
     hasPublishPermissions: true,
+    trackChangesVisible: true,
   }
 
   describe('cobranding logo', function () {
@@ -69,6 +70,15 @@ describe('<ToolbarHeader />', function () {
       render(<ToolbarHeader {...props} />)
       expect(screen.queryByText('Review')).to.not.exist
     })
+
+    it('is not displayed when "trackChangesVisible" prop is set to false', function () {
+      const props = {
+        ...defaultProps,
+        trackChangesVisible: false,
+      }
+      render(<ToolbarHeader {...props} />)
+      expect(screen.queryByText('Review')).to.not.exist
+    })
   })
 
   describe('History toggle button', function () {