[MM-61588]: Fixed the keyboard interactivity of tablist and added appropriate ARIA properties (#29592)

* [MA-9]: Fixed the keyboard interactivity of tablist and added appropriate ARIA properties

* [MA-9]: Review Fixes: Added aria-level attribute to plugin preferences heading

* [MA-9]: Fixed failing e2e test case

* [MA-9]: Fixed styling in mobile view and fixed failing e2e test cases

* [MA-9]: Minor Refactoring

---------

Co-authored-by: Mattermost Build <build@mattermost.com>

e2e-tests/cypress/tests/integration/channels/accessibility/accessibility_account_settings_spec.js

@@ -212,7 +212,7 @@ describe('Verify Accessibility Support in different sections in Settings and Pro
         // * Verify image alt in profile image
         cy.get('.profile-img').should('have.attr', 'alt', 'profile image');
 
-        cy.get('#generalSettings').then((el) => {
+        cy.get('#profileSettings').then((el) => {
             if (el.find('.profile-img__remove').length > 0) {
                 cy.findByTestId('removeSettingPicture').click();
                 cy.uiSave();

e2e-tests/playwright/support/ui/components/channels/settings/settings_modal.ts

@@ -15,7 +15,7 @@ export default class SettingsModal {
         this.container = container;
 
         this.notificationsSettingsTab = container.locator('#notificationsButton');
-        this.notificationsSettings = new NotificationsSettings(container.locator('#notificationSettings'));
+        this.notificationsSettings = new NotificationsSettings(container.locator('#notificationsSettings'));
     }
 
     async toBeVisible() {