"use strict";(self.webpackChunkmattermost_webapp=self.webpackChunkmattermost_webapp||[]).push([[9163],{61544(e,t,n){n.r(t),n.d(t,{default:()=>u});var a=n(37270),s=n(7380),i=(n(43617),n(81975),n(93991),n(94985),n(80569),n(71633)),r=n.n(i),l=n(36418),o=n(14778),c=n(81444),d=n(19513);class p extends l.PureComponent{constructor(e){super(e),this.buttonRefs=new Map}getVisibleTabs(){return[...this.props.tabs.filter(e=>!1!==e.display),...this.props.pluginTabs?.filter(e=>!1!==e.display)||[]]}handleClick=(e,t)=>{t.preventDefault(),this.props.updateTab(e.name),t.target.closest(".settings-modal")?.classList.add("display--content")};handleKeyDown=(e,t)=>{if(!(0,d.e)(t,c.Ay.KeyCodes.UP)&&!(0,d.e)(t,c.Ay.KeyCodes.DOWN))return;t.preventDefault();const n=this.getVisibleTabs();if(0===n.length)return;const a=n.findIndex(t=>t.name===e.name);if(-1===a)return;let s;s=(0,d.e)(t,c.Ay.KeyCodes.UP)?a>0?a-1:n.length-1:a<n.length-1?a+1:0;const i=n[s];this.props.updateTab(i.name);const r=this.buttonRefs.get(i.name);r&&r.focus()};renderTab(e){const t=`${e.name}_li`,n=this.props.activeTab===e.name;let a;return a="string"==typeof e.icon?l.createElement("i",{className:e.icon,title:e.iconTitle}):l.createElement("img",{src:e.icon.url,alt:e.iconTitle,className:"icon"}),l.createElement(l.Fragment,{key:t},e.newGroup&&l.createElement("hr",null),l.createElement("button",{"data-testid":`${e.name}-tab-button`,ref:t=>{t?this.buttonRefs.set(e.name,t):this.buttonRefs.delete(e.name)},id:`${e.name}Button`,className:r()("cursor--pointer style--none nav-pills__tab",{active:n}),onClick:this.handleClick.bind(null,e),onKeyDown:this.handleKeyDown.bind(null,e),"aria-label":e.uiName.toLowerCase(),role:"tab","aria-selected":n,tabIndex:n||this.props.isMobileView?0:-1,"aria-controls":`${e.name}Settings`},a,e.uiName))}render(){const e=this.props.tabs.filter(e=>!1!==e.display).map(e=>this.renderTab(e));let t;if(this.props.pluginTabs?.length){const e=this.props.pluginTabs.filter(e=>!1!==e.display);e.length&&(t=l.createElement(l.Fragment,null,l.createElement("hr",null),l.createElement("div",{role:"group","aria-labelledby":"userSettingsModal.pluginPreferences.header"},l.createElement("div",{key:"plugin preferences heading",role:"heading",className:"header","aria-level":3,id:"userSettingsModal_pluginPreferences_header"},l.createElement(o.FormattedMessage,{id:"userSettingsModal.pluginPreferences.header",defaultMessage:"PLUGIN PREFERENCES"})),e.map(e=>this.renderTab(e)))))}return l.createElement("div",{id:"tabList",className:"nav nav-pills nav-stacked",role:"tablist","aria-orientation":"vertical"},l.createElement("div",{role:"group"},e),t)}}const u=(0,a.connect)(function(e){return{isMobileView:(0,s.w3)(e)}})(p)}}]);
//# sourceMappingURL=9163.b3edc141fff3fa1682d9.js.map