diff --git a/src/frontend/src/features/settings/components/SettingsDialogExtended.tsx b/src/frontend/src/features/settings/components/SettingsDialogExtended.tsx
index a67776d0..7018f90d 100644
--- a/src/frontend/src/features/settings/components/SettingsDialogExtended.tsx
+++ b/src/frontend/src/features/settings/components/SettingsDialogExtended.tsx
@@ -11,6 +11,7 @@ import {
RiSettings3Line,
RiSpeakerLine,
RiVideoOnLine,
+ RiEyeLine,
} from '@remixicon/react'
import { AccountTab } from './tabs/AccountTab'
import { NotificationsTab } from './tabs/NotificationsTab'
@@ -22,6 +23,7 @@ import { useRef } from 'react'
import { useMediaQuery } from '@/features/rooms/livekit/hooks/useMediaQuery'
import { SettingsDialogExtendedKey } from '@/features/settings/type'
import { useIsAdminOrOwner } from '@/features/rooms/livekit/hooks/useIsAdminOrOwner'
+import AccessibilityTab from './tabs/AccessibilityTab'
const tabsStyle = css({
maxHeight: '40.625rem', // fixme size copied from meet settings modal
@@ -112,6 +114,11 @@ export const SettingsDialogExtended = (props: SettingsDialogExtended) => {
t(`tabs.${SettingsDialogExtendedKey.TRANSCRIPTION}`)}
)}
+
+
+ {isWideScreen &&
+ t(`tabs.${SettingsDialogExtendedKey.ACCESSIBILITY}`)}
+
@@ -125,6 +132,7 @@ export const SettingsDialogExtended = (props: SettingsDialogExtended) => {
{/* Transcription tab won't be accessible if the tab is not active in the tab list */}
+
diff --git a/src/frontend/src/features/settings/components/tabs/AccessibilityTab.tsx b/src/frontend/src/features/settings/components/tabs/AccessibilityTab.tsx
new file mode 100644
index 00000000..7509a049
--- /dev/null
+++ b/src/frontend/src/features/settings/components/tabs/AccessibilityTab.tsx
@@ -0,0 +1,29 @@
+import { Field, H } from '@/primitives'
+import { TabPanel, TabPanelProps } from '@/primitives/Tabs'
+import { css } from '@/styled-system/css'
+import { useTranslation } from 'react-i18next'
+
+export type AccessibilityTabProps = Pick
+
+export const AccessibilityTab = ({ id }: AccessibilityTabProps) => {
+ const { t } = useTranslation('settings', { keyPrefix: 'tabs' })
+
+ return (
+
+ {t('accessibility')}
+
+
+ )
+}
+
+export default AccessibilityTab
diff --git a/src/frontend/src/features/settings/type.ts b/src/frontend/src/features/settings/type.ts
index 0a1af14f..93428717 100644
--- a/src/frontend/src/features/settings/type.ts
+++ b/src/frontend/src/features/settings/type.ts
@@ -5,4 +5,5 @@ export enum SettingsDialogExtendedKey {
GENERAL = 'general',
NOTIFICATIONS = 'notifications',
TRANSCRIPTION = 'transcription',
+ ACCESSIBILITY = 'accessibility',
}
diff --git a/src/frontend/src/locales/en/settings.json b/src/frontend/src/locales/en/settings.json
index c00f69e8..cb4b5225 100644
--- a/src/frontend/src/locales/en/settings.json
+++ b/src/frontend/src/locales/en/settings.json
@@ -114,6 +114,7 @@
"video": "Video",
"general": "General",
"notifications": "Notifications",
+ "accessibility": "Accessibility",
"transcription": "Transcription"
}
}
diff --git a/src/frontend/src/locales/fr/settings.json b/src/frontend/src/locales/fr/settings.json
index 49e9c16b..d97cb37a 100644
--- a/src/frontend/src/locales/fr/settings.json
+++ b/src/frontend/src/locales/fr/settings.json
@@ -114,6 +114,7 @@
"video": "Vidéo",
"general": "Général",
"notifications": "Notifications",
+ "accessibility": "Accessibilité",
"transcription": "Transcription"
}
}