diff --git a/services/web/app/views/project/editor.pug b/services/web/app/views/project/editor.pug index 39553d877a..8add4473f9 100644 --- a/services/web/app/views/project/editor.pug +++ b/services/web/app/views/project/editor.pug @@ -67,7 +67,6 @@ block content .system-message-content | {{htmlContent}} - grammarly-warning(delay=10000) if hasFeature('saas') legacy-editor-warning(delay=10000) diff --git a/services/web/frontend/js/features/source-editor/components/grammarly-warning.tsx b/services/web/frontend/js/features/source-editor/components/grammarly-warning.tsx deleted file mode 100644 index c6bb400d40..0000000000 --- a/services/web/frontend/js/features/source-editor/components/grammarly-warning.tsx +++ /dev/null @@ -1,75 +0,0 @@ -import { useCallback, useEffect, useState } from 'react' -import { Button } from 'react-bootstrap' -import { Nullable } from '../../../../../types/utils' -import customLocalStorage from '../../../infrastructure/local-storage' -import useScopeValue from '../../../shared/hooks/use-scope-value' -import grammarlyExtensionPresent from '../../../shared/utils/grammarly' - -type GrammarlyWarningProps = { - delay: number -} - -export default function GrammarlyWarning({ delay }: GrammarlyWarningProps) { - const [show, setShow] = useState(false) - const [newSourceEditor] = useScopeValue('editor.newSourceEditor') - const grammarly = grammarlyExtensionPresent() - const hasDismissedGrammarlyWarning = customLocalStorage.getItem( - 'editor.has_dismissed_grammarly_warning' - ) - - useEffect(() => { - const showGrammarlyWarning = - !hasDismissedGrammarlyWarning && grammarly && newSourceEditor - - let timeoutID: Nullable - - if (showGrammarlyWarning) { - const timeout = window.setTimeout(() => { - setShow(true) - timeoutID = null - }, delay) - - timeoutID = timeout - } - - return () => { - if (timeoutID) { - clearTimeout(timeoutID) - } - } - }, [grammarly, hasDismissedGrammarlyWarning, newSourceEditor, delay]) - - const handleClose = useCallback(() => { - setShow(false) - customLocalStorage.setItem('editor.has_dismissed_grammarly_warning', true) - }, []) - - if (!show) { - return null - } - - return ( -
- -
- A browser extension, for example Grammarly, may be slowing down - Overleaf.{' '} - - Find out how to avoid this - -
-
- ) -} diff --git a/services/web/frontend/js/features/source-editor/controllers/grammarly-warning-controller.js b/services/web/frontend/js/features/source-editor/controllers/grammarly-warning-controller.js deleted file mode 100644 index a96ae1b581..0000000000 --- a/services/web/frontend/js/features/source-editor/controllers/grammarly-warning-controller.js +++ /dev/null @@ -1,9 +0,0 @@ -import App from '../../../base' -import { react2angular } from 'react2angular' -import { rootContext } from '../../../shared/context/root-context' -import GrammarlyWarning from '../components/grammarly-warning' - -App.component( - 'grammarlyWarning', - react2angular(rootContext.use(GrammarlyWarning), ['delay']) -) diff --git a/services/web/frontend/js/ide.js b/services/web/frontend/js/ide.js index 3358f12d0e..91c4b74cdb 100644 --- a/services/web/frontend/js/ide.js +++ b/services/web/frontend/js/ide.js @@ -65,7 +65,6 @@ import './features/pdf-preview/controllers/pdf-preview-controller' import './features/share-project-modal/controllers/react-share-project-modal-controller' import './features/source-editor/controllers/editor-switch-controller' import './features/source-editor/controllers/cm6-switch-away-survey-controller' -import './features/source-editor/controllers/grammarly-warning-controller' import './features/source-editor/controllers/legacy-editor-warning-controller' import './features/outline/controllers/documentation-button-controller' import './features/history/controllers/history-controller' diff --git a/services/web/frontend/stylesheets/app/editor.less b/services/web/frontend/stylesheets/app/editor.less index 1d0d4146fa..25227a7c95 100644 --- a/services/web/frontend/stylesheets/app/editor.less +++ b/services/web/frontend/stylesheets/app/editor.less @@ -823,7 +823,6 @@ CodeMirror } } -.grammarly-warning, .legacy-editor-warning { width: 500px; diff --git a/services/web/test/frontend/features/source-editor/components/grammarly-warning.test.js b/services/web/test/frontend/features/source-editor/components/grammarly-warning.test.js deleted file mode 100644 index 276408931f..0000000000 --- a/services/web/test/frontend/features/source-editor/components/grammarly-warning.test.js +++ /dev/null @@ -1,142 +0,0 @@ -import sinon from 'sinon' -import fetchMock from 'fetch-mock' -import { expect } from 'chai' -import { fireEvent, screen, waitFor } from '@testing-library/react' -import { renderWithEditorContext } from '../../../helpers/render-with-context' -import GrammarlyWarning from '../../../../../frontend/js/features/source-editor/components/grammarly-warning' -import * as grammarlyModule from '../../../../../frontend/js/shared/utils/grammarly' -import localStorage from '../../../../../frontend/js/infrastructure/local-storage' - -describe('', function () { - let grammarlyStub - - before(function () { - window.metaAttributesCache = new Map() - }) - - beforeEach(function () { - grammarlyStub = sinon.stub(grammarlyModule, 'default') - }) - - afterEach(function () { - window.metaAttributesCache = new Map() - grammarlyStub.restore() - fetchMock.reset() - localStorage.clear() - }) - - it('shows warning when grammarly is available', async function () { - grammarlyStub.returns(true) - - renderWithEditorContext(, { - scope: { - editor: { - newSourceEditor: true, - }, - }, - }) - - await screen.findByText( - 'A browser extension, for example Grammarly, may be slowing down Overleaf.' - ) - await screen.findByRole('button', { name: 'Close' }) - await screen.findByRole('link', { name: 'Find out how to avoid this' }) - }) - - it('does not show warning when grammarly is not available', async function () { - grammarlyStub.returns(false) - - renderWithEditorContext(, { - scope: { - editor: { - newSourceEditor: true, - }, - }, - }) - - await waitFor(() => { - expect( - screen.queryByText( - 'A browser extension, for example Grammarly, may be slowing down Overleaf.' - ) - ).to.not.exist - }) - }) - - it('does not show warning when user has dismissed the warning', async function () { - grammarlyStub.returns(true) - localStorage.setItem('editor.has_dismissed_grammarly_warning', true) - - renderWithEditorContext(, { - scope: { - editor: { - newSourceEditor: true, - }, - }, - }) - - await waitFor(() => { - expect( - screen.queryByText( - 'A browser extension, for example Grammarly, may be slowing down Overleaf.' - ) - ).to.not.exist - }) - }) - - it('does not show warning when user have ace as their preference', async function () { - grammarlyStub.returns(true) - - renderWithEditorContext(, { - scope: { - editor: { - newSourceEditor: false, - }, - }, - }) - - await waitFor(() => { - expect( - screen.queryByText( - 'A browser extension, for example Grammarly, may be slowing down Overleaf.' - ) - ).to.not.exist - }) - }) - - it('hides warning if close button is pressed', async function () { - grammarlyStub.returns(true) - - renderWithEditorContext(, { - scope: { - editor: { - newSourceEditor: true, - }, - }, - }) - - const warningText = - 'A browser extension, for example Grammarly, may be slowing down Overleaf.' - - await screen.findByText(warningText) - - const hasDismissedGrammarlyWarning = localStorage.getItem( - 'editor.has_dismissed_grammarly_warning' - ) - - expect(hasDismissedGrammarlyWarning).to.equal(null) - - const closeButton = screen.getByRole('button', { name: 'Close' }) - fireEvent.click(closeButton) - - expect(screen.queryByText(warningText)).to.not.exist - - await waitFor(() => { - const hasDismissedGrammarlyWarning = localStorage.getItem( - 'editor.has_dismissed_grammarly_warning' - ) - - expect(hasDismissedGrammarlyWarning).to.equal(true) - }) - }) -})