diff --git a/services/web/app/views/project/editor/meta.pug b/services/web/app/views/project/editor/meta.pug
index c5efbf5f4c..a4559fa7b7 100644
--- a/services/web/app/views/project/editor/meta.pug
+++ b/services/web/app/views/project/editor/meta.pug
@@ -28,6 +28,7 @@ meta(name="ol-galileoFeatures" data-type="json" content=galileoFeatures)
meta(name="ol-detachRole" data-type="string" content=detachRole)
meta(name="ol-showUpgradePrompt" data-type="boolean" content=showUpgradePrompt)
meta(name="ol-useOpenTelemetry" data-type="boolean" content=useOpenTelemetry)
+meta(name="ol-showSupport", data-type="boolean" content=showSupport)
- var fileActionI18n = ['edited', 'renamed', 'created', 'deleted'].reduce((acc, i) => {acc[i] = translate('file_action_' + i); return acc}, {})
meta(name="ol-fileActionI18n" data-type="json" content=fileActionI18n)
diff --git a/services/web/frontend/extracted-translations.json b/services/web/frontend/extracted-translations.json
index 07dcf47e01..c85d2a25a4 100644
--- a/services/web/frontend/extracted-translations.json
+++ b/services/web/frontend/extracted-translations.json
@@ -135,6 +135,7 @@
"disable_stop_on_first_error": "",
"dismiss": "",
"dismiss_error_popup": "",
+ "documentation": "",
"doesnt_match": "",
"doing_this_allow_log_in_through_institution": "",
"doing_this_allow_log_in_through_institution_2": "",
@@ -269,6 +270,7 @@
"group_plan_with_name_tooltip": "",
"have_an_extra_backup": "",
"headers": "",
+ "help": "",
"hide_outline": "",
"history": "",
"hotkey_add_a_comment": "",
@@ -581,6 +583,7 @@
"sharelatex_beta_program": "",
"show_all_projects": "",
"show_all_uppercase": "",
+ "show_hotkeys": "",
"show_in_code": "",
"show_in_pdf": "",
"show_outline": "",
diff --git a/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu.tsx b/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu.tsx
index 1283ee9f11..afa0cb484b 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/editor-left-menu.tsx
@@ -1,5 +1,6 @@
import DownloadMenu from './download-menu'
import ActionsMenu from './actions-menu'
+import HelpMenu from './help-menu'
import { useLayoutContext } from '../../../shared/context/layout-context'
import classNames from 'classnames'
@@ -14,6 +15,7 @@ export default function EditorLeftMenu() {
>
+
{leftMenuShown ? (
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
diff --git a/services/web/frontend/js/features/editor-left-menu/components/help-contact-us.tsx b/services/web/frontend/js/features/editor-left-menu/components/help-contact-us.tsx
new file mode 100644
index 0000000000..cb924b42c0
--- /dev/null
+++ b/services/web/frontend/js/features/editor-left-menu/components/help-contact-us.tsx
@@ -0,0 +1,24 @@
+import { useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import ContactUsModal from '../../../../../modules/support/frontend/js/components/contact-us-modal'
+import LeftMenuButton from './left-menu-button'
+
+export default function HelpContactUs() {
+ const [showModal, setShowModal] = useState(false)
+ const { t } = useTranslation()
+
+ return (
+ <>
+ setShowModal(true)}
+ icon={{
+ type: 'question',
+ fw: true,
+ }}
+ >
+ {t('contact_us')}
+
+ setShowModal(false)} />
+ >
+ )
+}
diff --git a/services/web/frontend/js/features/editor-left-menu/components/help-documentation.tsx b/services/web/frontend/js/features/editor-left-menu/components/help-documentation.tsx
new file mode 100644
index 0000000000..281159768d
--- /dev/null
+++ b/services/web/frontend/js/features/editor-left-menu/components/help-documentation.tsx
@@ -0,0 +1,21 @@
+import { useTranslation } from 'react-i18next'
+import LeftMenuButton from './left-menu-button'
+
+export default function HelpDocumentation() {
+ const { t } = useTranslation()
+
+ return (
+ <>
+
+ {t('documentation')}
+
+ >
+ )
+}
diff --git a/services/web/frontend/js/features/editor-left-menu/components/help-menu.tsx b/services/web/frontend/js/features/editor-left-menu/components/help-menu.tsx
new file mode 100644
index 0000000000..d5c34e7abd
--- /dev/null
+++ b/services/web/frontend/js/features/editor-left-menu/components/help-menu.tsx
@@ -0,0 +1,31 @@
+import { useTranslation } from 'react-i18next'
+import getMeta from '../../../utils/meta'
+import HelpContactUs from './help-contact-us'
+import HelpDocumentation from './help-documentation'
+import HelpShowHotkeys from './help-show-hotkeys'
+
+export default function HelpMenu() {
+ const { t } = useTranslation()
+ const showSupport = getMeta('ol-showSupport') as boolean | undefined
+
+ return (
+ <>
+ {t('help')}
+
+ -
+
+
+ {showSupport ? (
+ <>
+ -
+
+
+ -
+
+
+ >
+ ) : null}
+
+ >
+ )
+}
diff --git a/services/web/frontend/js/features/editor-left-menu/components/help-show-hotkeys.tsx b/services/web/frontend/js/features/editor-left-menu/components/help-show-hotkeys.tsx
new file mode 100644
index 0000000000..959930624c
--- /dev/null
+++ b/services/web/frontend/js/features/editor-left-menu/components/help-show-hotkeys.tsx
@@ -0,0 +1,32 @@
+import { useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { useProjectContext } from '../../../shared/context/project-context'
+import HotkeysModal from '../../hotkeys-modal/components/hotkeys-modal'
+import LeftMenuButton from './left-menu-button'
+
+export default function HelpShowHotkeys() {
+ const [showModal, setShowModal] = useState(false)
+ const { t } = useTranslation()
+ const { features } = useProjectContext()
+ const isMac = /Mac/.test(window.navigator?.platform)
+
+ return (
+ <>
+ setShowModal(true)}
+ icon={{
+ type: 'keyboard-o',
+ fw: true,
+ }}
+ >
+ {t('show_hotkeys')}
+
+ setShowModal(false)}
+ isMac={isMac}
+ trackChangesVisible={features?.trackChangesVisible}
+ />
+ >
+ )
+}
diff --git a/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx b/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
index 7ae74989bc..f3274a9b9d 100644
--- a/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
+++ b/services/web/frontend/js/features/editor-left-menu/components/left-menu-button.tsx
@@ -9,6 +9,8 @@ type Props = {
}
disabled?: boolean
disabledAccesibilityText?: string
+ type?: 'button' | 'link'
+ href?: string
}
export default function LeftMenuButton({
@@ -17,6 +19,8 @@ export default function LeftMenuButton({
icon,
disabled = false,
disabledAccesibilityText,
+ type = 'button',
+ href,
}: PropsWithChildren) {
if (disabled) {
return (
@@ -30,10 +34,24 @@ export default function LeftMenuButton({
)
}
- return (
-
- )
+ if (type === 'button') {
+ return (
+
+ )
+ } else {
+ return (
+
+
+ {children}
+
+ )
+ }
}