From 8933756aeaee26ba166402028695a54283241d90 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20V=C3=A9lez?= <pablovv2012@gmail.com>
Date: Thu, 14 Nov 2024 23:36:17 +0100
Subject: [PATCH] MM-61303 - fix accesibility issues with feature scheduled
 messages (#29247)

* MM-61303 - fix tab accesibility for core-menu-options

* add tabindex options and autofocus for tabs component

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
---
 .../send_button/send_post_options/core_menu_options.tsx       | 2 ++
 webapp/channels/src/components/drafts/drafts.tsx              | 1 +
 webapp/channels/src/components/tabs/tab/index.tsx             | 4 +++-
 webapp/channels/src/components/tabs/tabs/index.tsx            | 1 +
 4 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/webapp/channels/src/components/advanced_text_editor/send_button/send_post_options/core_menu_options.tsx b/webapp/channels/src/components/advanced_text_editor/send_button/send_post_options/core_menu_options.tsx
index 4bd2a99d78..c36126f651 100644
--- a/webapp/channels/src/components/advanced_text_editor/send_button/send_post_options/core_menu_options.tsx
+++ b/webapp/channels/src/components/advanced_text_editor/send_button/send_post_options/core_menu_options.tsx
@@ -122,6 +122,7 @@ function CoreMenuOptions({handleOnSelect, channelId}: Props) {
                 />
             }
             className='core-menu-options'
+            autoFocus={true}
             {...extraProps}
         />
     );
@@ -158,6 +159,7 @@ function CoreMenuOptions({handleOnSelect, channelId}: Props) {
                 />
             }
             className='core-menu-options'
+            autoFocus={now.weekday === 5 || now.weekday === 6}
             {...extraProps}
         />
     );
diff --git a/webapp/channels/src/components/drafts/drafts.tsx b/webapp/channels/src/components/drafts/drafts.tsx
index 42ce18578d..dde295c903 100644
--- a/webapp/channels/src/components/drafts/drafts.tsx
+++ b/webapp/channels/src/components/drafts/drafts.tsx
@@ -164,6 +164,7 @@ function Drafts({
                         title={draftTabHeading}
                         unmountOnExit={false}
                         tabClassName='drafts_tab'
+                        tabIndex={0}
                     >
                         <DraftList
                             drafts={drafts}
diff --git a/webapp/channels/src/components/tabs/tab/index.tsx b/webapp/channels/src/components/tabs/tab/index.tsx
index 96f25b1712..ed7e3ab6dc 100644
--- a/webapp/channels/src/components/tabs/tab/index.tsx
+++ b/webapp/channels/src/components/tabs/tab/index.tsx
@@ -10,15 +10,17 @@ type Props = {
     title?: React.ReactNode | undefined;
     unmountOnExit?: boolean | undefined;
     tabClassName?: string | undefined;
+    tabIndex?: number;
 }
 
-export default function Tab({children, title, unmountOnExit, tabClassName, eventKey}: Props) {
+export default function Tab({children, title, unmountOnExit, tabClassName, eventKey, tabIndex = -1}: Props) {
     return (
         <ReactBootstrapTab
             eventKey={eventKey}
             title={title}
             unmountOnExit={unmountOnExit}
             tabClassName={tabClassName}
+            tabIndex={tabIndex}
         >
             {children}
         </ReactBootstrapTab>
diff --git a/webapp/channels/src/components/tabs/tabs/index.tsx b/webapp/channels/src/components/tabs/tabs/index.tsx
index 49fa96d99d..cec1b4c9b0 100644
--- a/webapp/channels/src/components/tabs/tabs/index.tsx
+++ b/webapp/channels/src/components/tabs/tabs/index.tsx
@@ -35,6 +35,7 @@ export default function Tabs({
             onSelect={onSelect}
             className={classNames('tabs', className)}
             mountOnEnter={mountOnEnter}
+            autoFocus={true}
         >
             {children}
         </ReactBootstrapTabs>