Merge pull request #31496 from overleaf/mj-tutorial-removals

[web] Remove old tutorials

GitOrigin-RevId: 90b6a630084b3b1d592bd4ccced82162f45b8ad3

services/web/Makefile

@@ -704,7 +704,7 @@ tar:
 build_storybook:
 	npm run lezer-latex:generate
 	mkdir -p data/storybook/
-	npm run build-storybook -- --output-dir data/storybook/$(BRANCH_NAME)
+	npm run build-storybook -- --output-dir data/storybook/$(BRANCH_NAME) --loglevel warn --quiet
 
 storybook_index:
 	mkdir -p data/storybook/

services/web/frontend/extracted-translations.json

@@ -681,7 +681,6 @@
   "generate_from_text": "",
   "generate_from_text_or_image": "",
   "generate_latex_from_prompts_and_images": "",
-  "generate_tables_and_equations": "",
   "generate_token": "",
   "generating": "",
   "generic_if_problem_continues_contact_us": "",
@@ -1148,7 +1147,6 @@
   "neither_agree_nor_disagree": "",
   "new_compile_domain_notice": "",
   "new_compiles_in_this_project_will_automatically_use_the_newest_version": "",
-  "new_create_tables_and_equations": "",
   "new_error_logs_make_it_easier_to_find_whats_wrong": "",
   "new_file": "",
   "new_folder": "",
@@ -1425,8 +1423,6 @@
   "quoted_text": "",
   "raw_logs": "",
   "raw_logs_description": "",
-  "react_history_tutorial_content": "",
-  "react_history_tutorial_title": "",
   "reactivate": "",
   "reactivate_add_on_failed": "",
   "reactivate_subscription": "",

services/web/frontend/js/features/history/components/change-list/all-history-list.tsx

@@ -7,12 +7,6 @@ import { isVersionSelected } from '../../utils/history-details'
 import { useUserContext } from '../../../../shared/context/user-context'
 import useDropdownActiveItem from '../../hooks/use-dropdown-active-item'
 import { useHistoryContext } from '../../context/history-context'
-import OLPopover from '@/shared/components/ol/ol-popover'
-import OLOverlay from '@/shared/components/ol/ol-overlay'
-import Close from '@/shared/components/close'
-import { Trans, useTranslation } from 'react-i18next'
-import MaterialIcon from '@/shared/components/material-icon'
-import useTutorial from '@/shared/hooks/promotions/use-tutorial'
 
 function AllHistoryList() {
   const { id: currentUserId } = useUserContext()
@@ -90,127 +84,8 @@ function AllHistoryList() {
     }
   }, [updatesLoadingState])
 
-  const {
-    showPopup: showHistoryTutorial,
-    tryShowingPopup: tryShowingHistoryTutorial,
-    hideUntilReload: hideHistoryTutorialUntilReload,
-    completeTutorial: completeHistoryTutorial,
-    checkCompletion: checkHistoryTutorialCompletion,
-  } = useTutorial('react-history-buttons-tutorial', {
-    name: 'react-history-buttons-tutorial',
-  })
-
-  const isMoreThanOneVersion = visibleUpdates.length > 1
-  const [layoutSettled, setLayoutSettled] = useState(false)
-
-  // When there is a paywall and only two version's to compare,
-  // they are not comparable because the one that has a paywall will not have the compare button
-  // so we should not display on-boarding popover in that case
-  const isPaywallAndNonComparable =
-    visibleUpdates.length === 2 && updatesInfo.freeHistoryLimitHit
-
-  useEffect(() => {
-    // wait for the layout to settle before showing popover, to avoid a flash/ instant move
-    if (!layoutSettled) {
-      return
-    }
-    if (
-      !checkHistoryTutorialCompletion() &&
-      isMoreThanOneVersion &&
-      !isPaywallAndNonComparable
-    ) {
-      tryShowingHistoryTutorial()
-    }
-  }, [
-    isMoreThanOneVersion,
-    isPaywallAndNonComparable,
-    layoutSettled,
-    tryShowingHistoryTutorial,
-    checkHistoryTutorialCompletion,
-  ])
-
-  const { t } = useTranslation()
-
-  let popover = null
-
-  // hiding is different from dismissing, as we wont save a full dismissal to the user
-  // meaning the tutorial will show on page reload/ re-navigation
-  const hidePopover = () => {
-    hideHistoryTutorialUntilReload()
-  }
-
-  if (showHistoryTutorial) {
-    popover = (
-      <OLOverlay
-        placement="left-start"
-        show={showHistoryTutorial}
-        rootClose
-        onHide={hidePopover}
-        // using scrollerRef to position the popover in the middle of the viewport
-        target={scrollerRef.current}
-        popperConfig={{
-          modifiers: [
-            {
-              name: 'offset',
-              options: {
-                offset: [10, 10],
-              },
-            },
-          ],
-        }}
-      >
-        <OLPopover
-          id="popover-react-history-tutorial"
-          title={
-            <span>
-              {t('react_history_tutorial_title')}{' '}
-              <Close
-                variant="dark"
-                onDismiss={() =>
-                  completeHistoryTutorial({
-                    event: 'promo-click',
-                    action: 'complete',
-                  })
-                }
-              />
-            </span>
-          }
-          className="dark-themed history-popover"
-        >
-          <Trans
-            i18nKey="react_history_tutorial_content"
-            components={[
-              // eslint-disable-next-line react/jsx-key
-              <MaterialIcon
-                type="align_end"
-                className="history-dropdown-icon-inverted"
-              />,
-              <a href="https://www.overleaf.com/learn/latex/Using_the_History_feature" />, // eslint-disable-line jsx-a11y/anchor-has-content, react/jsx-key
-            ]}
-          />
-        </OLPopover>
-      </OLOverlay>
-    )
-  }
-
-  // give the components time to position before showing popover so we don't get an instant position change
-  useEffect(() => {
-    const timer = window.setTimeout(() => {
-      setLayoutSettled(true)
-    }, 500)
-
-    return () => clearTimeout(timer)
-  }, [setLayoutSettled])
-
-  // resizes can cause the popover to point to the wrong thing, since it changes the horizontal layout of the page
-  useEffect(() => {
-    window.addEventListener('resize', hidePopover)
-    return () => window.removeEventListener('resize', hidePopover)
-  })
-
   return (
     <div ref={scrollerRef} className="history-all-versions-scroller">
-      {popover}
       <div className="history-all-versions-container">
         <div ref={bottomRef} className="history-versions-bottom" />
         {visibleUpdates.map((update, index) => {

services/web/frontend/stylesheets/modules/writefull.scss

@@ -10,27 +10,3 @@
   max-width: 520px;
   text-align: left;
 }
-
-.feature-rebrand-promo-container {
-  z-index: 12;
-  position: absolute;
-  bottom: 15px;
-  right: 15px;
-  background: $bg-dark-primary;
-  color: $content-primary-dark;
-  max-width: 450px;
-}
-
-.feature-rebrand-promo-title-container {
-  display: flex;
-  justify-content: space-between;
-}
-
-.feature-rebrand-promo-title-text {
-  color: white;
-  font-size: 14px;
-}
-
-.feature-rebrand-promo-body {
-  color: white;
-}

services/web/locales/en.json

@@ -880,7 +880,6 @@
   "generate_from_text": "From text",
   "generate_from_text_or_image": "From text or image",
   "generate_latex_from_prompts_and_images": "Generate LaTeX from prompts and images",
-  "generate_tables_and_equations": "Generate tables and equations from text and images. Try it for free in the Overleaf toolbar!",
   "generate_token": "Generate token",
   "generating": "Generating",
   "generic_if_problem_continues_contact_us": "If the problem continues please contact us",
@@ -1483,7 +1482,6 @@
   "neither_agree_nor_disagree": "Neither agree nor disagree",
   "new_compile_domain_notice": "Something might be blocking your browser from accessing Overleaf’s PDF download location, <0>__compilesUserContentDomain__</0>. This could be caused by network blocking or a strict browser plugin rule. Please follow our <1>troubleshooting guide</1>.",
   "new_compiles_in_this_project_will_automatically_use_the_newest_version": "New compiles in this project will automatically use the newest version. <0>Learn how to change compiler settings</0>",
-  "new_create_tables_and_equations": "NEW! <sparkle/> Create tables and equations in seconds",
   "new_error_logs_make_it_easier_to_find_whats_wrong": "New error logs make it easier to find what’s wrong and fix your document, so you can get compiling again.",
   "new_file": "New file",
   "new_folder": "New folder",
@@ -1844,8 +1842,6 @@
   "quoted_text": "Quoted text",
   "raw_logs": "Raw logs",
   "raw_logs_description": "Raw logs from the LaTeX compiler",
-  "react_history_tutorial_content": "To compare a range of versions, use the  <0></0> on the versions you want at the start and end of the range. To add a label or to download a version use the options in the three-dot menu. <1>Learn more about using Overleaf History.</1>",
-  "react_history_tutorial_title": "History actions have a new home",
   "reactivate": "Reactivate",
   "reactivate_add_on_failed": "Something went wrong while reactivating your add-on. Please try again later.",
   "reactivate_subscription": "Reactivate your subscription",

services/web/test/frontend/features/history/components/change-list.spec.tsx

@@ -55,9 +55,6 @@ describe('change list', function () {
     cy.intercept('GET', '/project/*/filetree/diff*', {
       body: { diff: [{ pathname: 'main.tex' }, { pathname: 'name.tex' }] },
     }).as('diff')
-    window.metaAttributesCache.set('ol-inactiveTutorials', [
-      'react-history-buttons-tutorial',
-    ])
   })
 
   describe('toggle switch', function () {