"use strict";(self.webpackChunkmattermost_webapp=self.webpackChunkmattermost_webapp||[]).push([[9163],{61544:(e,t,i)=>{i.r(t),i.d(t,{default:()=>h});var n=i(23453),r=i(7380),a=i(62688),s=i.n(a),l=(i(17046),i(4290),i(71633)),o=i.n(l),u=i(97023),c=i.n(u),d=i(14778),p=i(78451),b=i(19513);function m(e,t,i){return(t=function(e){var t=function(e){if("object"!=typeof e||!e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var i=t.call(e,"string");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e);return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}class g extends c().PureComponent{constructor(e){super(e),m(this,"handleClick",((e,t)=>{var i;t.preventDefault(),this.props.updateTab(e.name),null===(i=t.target.closest(".settings-modal"))||void 0===i||i.classList.add("display--content")})),m(this,"handleKeyDown",((e,t)=>{if(!(0,b.e)(t,p.Ay.KeyCodes.UP)&&!(0,b.e)(t,p.Ay.KeyCodes.DOWN))return;t.preventDefault();const i=this.getVisibleTabs();if(0===i.length)return;const n=i.findIndex((t=>t.name===e.name));if(-1===n)return;let r;r=(0,b.e)(t,p.Ay.KeyCodes.UP)?n>0?n-1:i.length-1:n<i.length-1?n+1:0;const a=i[r];this.props.updateTab(a.name);const s=this.buttonRefs.get(a.name);s&&s.focus()})),this.buttonRefs=new Map}getVisibleTabs(){var e;return[...this.props.tabs.filter((e=>!1!==e.display)),...(null===(e=this.props.pluginTabs)||void 0===e?void 0:e.filter((e=>!1!==e.display)))||[]]}renderTab(e){const t="".concat(e.name,"_li"),i=this.props.activeTab===e.name;let n;return n="string"==typeof e.icon?c().createElement("i",{className:e.icon,title:e.iconTitle}):c().createElement("img",{src:e.icon.url,alt:e.iconTitle,className:"icon"}),c().createElement(c().Fragment,{key:t},e.newGroup&&c().createElement("hr",null),c().createElement("button",{"data-testid":"".concat(e.name,"-tab-button"),ref:t=>{t?this.buttonRefs.set(e.name,t):this.buttonRefs.delete(e.name)},id:"".concat(e.name,"Button"),className:o()("cursor--pointer style--none nav-pills__tab",{active:i}),onClick:this.handleClick.bind(null,e),onKeyDown:this.handleKeyDown.bind(null,e),"aria-label":e.uiName.toLowerCase(),role:"tab","aria-selected":i,tabIndex:i||this.props.isMobileView?0:-1,"aria-controls":"".concat(e.name,"Settings")},n,e.uiName))}render(){var e;const t=this.props.tabs.filter((e=>!1!==e.display)).map((e=>this.renderTab(e)));let i;if(null!==(e=this.props.pluginTabs)&&void 0!==e&&e.length){const e=this.props.pluginTabs.filter((e=>!1!==e.display));e.length&&(i=c().createElement(c().Fragment,null,c().createElement("hr",null),c().createElement("div",{role:"group","aria-labelledby":"userSettingsModal.pluginPreferences.header"},c().createElement("div",{key:"plugin preferences heading",role:"heading",className:"header","aria-level":3,id:"userSettingsModal_pluginPreferences_header"},c().createElement(d.FormattedMessage,{id:"userSettingsModal.pluginPreferences.header",defaultMessage:"PLUGIN PREFERENCES"})),e.map((e=>this.renderTab(e))))))}return c().createElement("div",{id:"tabList",className:"nav nav-pills nav-stacked",role:"tablist","aria-orientation":"vertical"},c().createElement("div",{role:"group"},t),i)}}m(g,"propTypes",{activeTab:s().string,tabs:s().arrayOf(s().shape({icon:s().oneOfType([s().string,s().shape({url:s().string.isRequired})]).isRequired,iconTitle:s().string.isRequired,name:s().string.isRequired,uiName:s().string.isRequired,newGroup:s().bool,display:s().bool})).isRequired,pluginTabs:s().arrayOf(s().shape({icon:s().oneOfType([s().string,s().shape({url:s().string.isRequired})]).isRequired,iconTitle:s().string.isRequired,name:s().string.isRequired,uiName:s().string.isRequired,newGroup:s().bool,display:s().bool})),updateTab:s().func.isRequired,isMobileView:s().bool.isRequired});const h=(0,n.connect)((function(e){return{isMobileView:(0,r.w3)(e)}}))(g)}}]);
//# sourceMappingURL=9163.17aeeb79dfecb11f7c2d.js.map