From d492512d9e842009eee8253224fecaee1070e964 Mon Sep 17 00:00:00 2001
From: David <33458145+davidmcpowell@users.noreply.github.com>
Date: Tue, 22 Apr 2025 13:07:06 +0100
Subject: [PATCH] Merge pull request #24878 from
overleaf/mj-editor-redesign-experiment
[web] Move editor redesign to labs experiment
GitOrigin-RevId: 5f11ff29a6c392ff6e448a16450e2e65a2574097
---
.../web/frontend/extracted-translations.json | 2 ++
.../ide-redesign/components/labs-widget.tsx | 32 +++++++++++++++++++
.../ide-redesign/images/labs-icon.svg | 4 +++
.../ide-redesign/utils/new-editor-utils.ts | 6 ++--
services/web/frontend/js/utils/labs-utils.ts | 2 +-
services/web/locales/en.json | 2 ++
6 files changed, 43 insertions(+), 5 deletions(-)
create mode 100644 services/web/frontend/js/features/ide-redesign/components/labs-widget.tsx
create mode 100644 services/web/frontend/js/features/ide-redesign/images/labs-icon.svg
diff --git a/services/web/frontend/extracted-translations.json b/services/web/frontend/extracted-translations.json
index d31318c61e..0b09d21471 100644
--- a/services/web/frontend/extracted-translations.json
+++ b/services/web/frontend/extracted-translations.json
@@ -46,6 +46,7 @@
"access_denied": "",
"access_edit_your_projects": "",
"access_levels_changed": "",
+ "access_your_favourite_features_faster_with_our_new_streamlined_editor": "",
"account_billed_manually": "",
"account_has_been_link_to_institution_account": "",
"account_has_past_due_invoice_change_plan_warning": "",
@@ -1048,6 +1049,7 @@
"new_look_and_placement_of_the_settings": "",
"new_name": "",
"new_navigation_introducing_left_hand_side_rail_and_top_menus": "",
+ "new_overleaf_editor": "",
"new_password": "",
"new_project": "",
"new_subscription_will_be_billed_immediately": "",
diff --git a/services/web/frontend/js/features/ide-redesign/components/labs-widget.tsx b/services/web/frontend/js/features/ide-redesign/components/labs-widget.tsx
new file mode 100644
index 0000000000..6b9cc657b5
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/components/labs-widget.tsx
@@ -0,0 +1,32 @@
+import { useState } from 'react'
+import LabsExperimentWidget from '../../../shared/components/labs/labs-experiments-widget'
+import { isInExperiment } from '@/utils/labs-utils'
+import { useTranslation } from 'react-i18next'
+import labsIcon from '../images/labs-icon.svg'
+
+const EditorRedesignLabsWidget = ({
+ labsProgram,
+ setErrorMessage,
+}: {
+ labsProgram: boolean
+ setErrorMessage: (err: string) => void
+}) => {
+ const { t } = useTranslation()
+ const [optedIn, setOptedIn] = useState(isInExperiment('editor-redesign'))
+ return (
+ }
+ labsEnabled={labsProgram}
+ setErrorMessage={setErrorMessage}
+ optedIn={optedIn}
+ setOptedIn={setOptedIn}
+ title={t('new_overleaf_editor')}
+ />
+ )
+}
+
+export default EditorRedesignLabsWidget
diff --git a/services/web/frontend/js/features/ide-redesign/images/labs-icon.svg b/services/web/frontend/js/features/ide-redesign/images/labs-icon.svg
new file mode 100644
index 0000000000..f26bd28bfb
--- /dev/null
+++ b/services/web/frontend/js/features/ide-redesign/images/labs-icon.svg
@@ -0,0 +1,4 @@
+
diff --git a/services/web/frontend/js/features/ide-redesign/utils/new-editor-utils.ts b/services/web/frontend/js/features/ide-redesign/utils/new-editor-utils.ts
index 5dbffab7d5..ecd492cd5f 100644
--- a/services/web/frontend/js/features/ide-redesign/utils/new-editor-utils.ts
+++ b/services/web/frontend/js/features/ide-redesign/utils/new-editor-utils.ts
@@ -1,9 +1,7 @@
import { useUserSettingsContext } from '@/shared/context/user-settings-context'
-import { isSplitTestEnabled } from '@/utils/splitTestUtils'
+import { isInExperiment } from '@/utils/labs-utils'
-// TODO: For now we're using the feature flag, but eventually we'll read this
-// from labs.
-export const canUseNewEditor = () => isSplitTestEnabled('editor-redesign')
+export const canUseNewEditor = () => isInExperiment('editor-redesign')
export const useIsNewEditorEnabled = () => {
const { userSettings } = useUserSettingsContext()
diff --git a/services/web/frontend/js/utils/labs-utils.ts b/services/web/frontend/js/utils/labs-utils.ts
index 9ac34e588c..1cfabafd87 100644
--- a/services/web/frontend/js/utils/labs-utils.ts
+++ b/services/web/frontend/js/utils/labs-utils.ts
@@ -2,7 +2,7 @@ import getMeta from './meta'
// Should be `never` when no experiments are active. Otherwise it should be a
// union of active experiment names e.g. `'experiment1' | 'experiment2'`
-export type ActiveExperiment = never
+export type ActiveExperiment = 'editor-redesign'
export const isInExperiment = (experiment: ActiveExperiment): boolean => {
const experiments = getMeta('ol-labsExperiments')
diff --git a/services/web/locales/en.json b/services/web/locales/en.json
index 908f3033a6..ffe692c8c3 100644
--- a/services/web/locales/en.json
+++ b/services/web/locales/en.json
@@ -52,6 +52,7 @@
"access_denied": "Access Denied",
"access_edit_your_projects": "Access and edit your projects",
"access_levels_changed": "Access levels changed",
+ "access_your_favourite_features_faster_with_our_new_streamlined_editor": "Access your favourite features faster with our new, streamlined editor.",
"account": "Account",
"account_already_managed": "Your account is already managed.",
"account_billed_manually": "Account billed manually",
@@ -1376,6 +1377,7 @@
"new_look_and_placement_of_the_settings": "New look and placement of the settings",
"new_name": "New Name",
"new_navigation_introducing_left_hand_side_rail_and_top_menus": "New navigation - introducing left-hand side rail and top menus",
+ "new_overleaf_editor": "New Overleaf editor",
"new_password": "New password",
"new_project": "New Project",
"new_snippet_project": "Untitled",