diff --git a/services/web/frontend/extracted-translations.json b/services/web/frontend/extracted-translations.json
index 35e6dad990..56b5622d93 100644
--- a/services/web/frontend/extracted-translations.json
+++ b/services/web/frontend/extracted-translations.json
@@ -521,6 +521,7 @@
"error": "",
"error_assist": "",
"error_assist_to_help_fixing_latex_errors": "",
+ "error_log": "",
"error_opening_document": "",
"error_opening_document_detail": "",
"error_performing_request": "",
@@ -1394,6 +1395,7 @@
"reverse_x_sort_order": "",
"revert_pending_plan_change": "",
"review": "",
+ "review_panel": "",
"review_panel_comments_and_track_changes": "",
"review_your_peers_work": "",
"reviewer": "",
diff --git a/services/web/frontend/js/features/ide-redesign/components/rail.tsx b/services/web/frontend/js/features/ide-redesign/components/rail.tsx
index 8610f1696e..4ac697aa99 100644
--- a/services/web/frontend/js/features/ide-redesign/components/rail.tsx
+++ b/services/web/frontend/js/features/ide-redesign/components/rail.tsx
@@ -31,58 +31,31 @@ import { RailHelpShowHotkeysModal } from './help/keyboard-shortcuts'
import { RailHelpContactUsModal } from './help/contact-us'
import { HistorySidebar } from '@/features/ide-react/components/history-sidebar'
import DictionarySettingsModal from './settings/editor-settings/dictionary-settings-modal'
+import OLTooltip from '@/features/ui/components/ol/ol-tooltip'
type RailElement = {
icon: AvailableUnfilledIcon
key: RailTabKey
component: ReactElement
indicator?: ReactElement
+ title: string
hide?: boolean
}
type RailActionButton = {
key: string
icon: AvailableUnfilledIcon
+ title: string
action: () => void
}
type RailDropdown = {
key: string
icon: AvailableUnfilledIcon
+ title: string
dropdown: ReactElement
}
type RailAction = RailDropdown | RailActionButton
-const RAIL_TABS: RailElement[] = [
- {
- key: 'file-tree',
- icon: 'description',
- component: ,
- },
- {
- key: 'integrations',
- icon: 'integration_instructions',
- component: ,
- },
- {
- key: 'review-panel',
- icon: 'rate_review',
- component: <>Review panel>,
- },
- {
- key: 'chat',
- icon: 'forum',
- component: ,
- indicator: ,
- hide: !getMeta('ol-chatEnabled'),
- },
- {
- key: 'errors',
- icon: 'report',
- component: ,
- indicator: ,
- },
-]
-
const RAIL_MODALS: {
key: RailModalKey
modalComponentFunction: FC<{ show: boolean }>
@@ -120,20 +93,61 @@ export const RailLayout = () => {
const isHistoryView = view === 'history'
+ const railTabs: RailElement[] = useMemo(
+ () => [
+ {
+ key: 'file-tree',
+ icon: 'description',
+ title: t('file_tree'),
+ component: ,
+ },
+ {
+ key: 'integrations',
+ icon: 'integration_instructions',
+ title: t('integrations'),
+ component: ,
+ },
+ {
+ key: 'review-panel',
+ icon: 'rate_review',
+ title: t('review_panel'),
+ component: <>Review panel>,
+ },
+ {
+ key: 'chat',
+ icon: 'forum',
+ component: ,
+ indicator: ,
+ title: t('chat'),
+ hide: !getMeta('ol-chatEnabled'),
+ },
+ {
+ key: 'errors',
+ icon: 'report',
+ title: t('error_log'),
+ component: ,
+ indicator: ,
+ },
+ ],
+ [t]
+ )
+
const railActions: RailAction[] = useMemo(
() => [
{
key: 'support',
icon: 'help',
+ title: t('help'),
dropdown: ,
},
{
key: 'settings',
icon: 'settings',
+ title: t('settings'),
action: () => setLeftMenuShown(true),
},
],
- [setLeftMenuShown]
+ [setLeftMenuShown, t]
)
const onTabSelect = useCallback(
@@ -143,7 +157,7 @@ export const RailLayout = () => {
} else {
// HACK: Apparently the onSelect event is triggered with href attributes
// from DropdownItems
- if (!RAIL_TABS.some(tab => !tab.hide && tab.key === key)) {
+ if (!railTabs.some(tab => !tab.hide && tab.key === key)) {
// Attempting to open a non-existent tab
return
}
@@ -152,7 +166,7 @@ export const RailLayout = () => {
setIsOpen(true)
}
},
- [setSelectedTab, selectedTab, setIsOpen, togglePane]
+ [setSelectedTab, selectedTab, setIsOpen, togglePane, railTabs]
)
return (
@@ -166,17 +180,18 @@ export const RailLayout = () => {
>
@@ -234,26 +251,38 @@ const RailTab = ({
eventKey,
open,
indicator,
+ title,
}: {
icon: AvailableUnfilledIcon
eventKey: string
open: boolean
indicator?: ReactElement
+ title: string
}) => {
return (
-
- {open ? (
-
- ) : (
-
- )}
- {indicator}
-
+
+ {open ? (
+
+ ) : (
+
+ )}
+ {indicator}
+
+
)
}
@@ -274,25 +303,39 @@ const RailActionElement = ({ action }: { action: RailAction }) => {
if ('dropdown' in action) {
return (
-
- {icon}
-
+
+
+ {icon}
+
+
+
{action.dropdown}
)
} else {
return (
-
+
+
)
}
}
diff --git a/services/web/locales/en.json b/services/web/locales/en.json
index 3a3550a030..13ac572fb5 100644
--- a/services/web/locales/en.json
+++ b/services/web/locales/en.json
@@ -673,6 +673,7 @@
"error": "Error",
"error_assist": "Error Assist",
"error_assist_to_help_fixing_latex_errors": "<0>Error Assist0> for help fixing LaTeX errors",
+ "error_log": "Error log",
"error_opening_document": "Error opening document",
"error_opening_document_detail": "Sorry, something went wrong opening this document. Please try again.",
"error_performing_request": "An error has occurred while performing your request.",
@@ -1849,6 +1850,7 @@
"reverse_x_sort_order": "Reverse __x__ sort order",
"revert_pending_plan_change": "Revert scheduled plan change",
"review": "Review",
+ "review_panel": "Review panel",
"review_panel_comments_and_track_changes": "Review panel – Comments & track changes",
"review_your_peers_work": "Review your peers’ work",
"reviewer": "Reviewer",