azure-devops-ui
Version:
React components for building web UI in Azure DevOps
1 lines • 4.4 kB
JavaScript
import{__extends}from"tslib";import"../../CommonImports";import"../../Core/core.css";import"./IdentityCard.css";import*as React from"react";import*as Resources from"../../Resources.Persona";import{format}from"../../Core/Util/String";import{Button}from"../../Button";import{Persona}from"../Persona/Persona";import{PersonaSize}from"../Persona/Persona.Props";var OrganizationCard=function(e){function t(){var r=null!==e&&e.apply(this,arguments)||this;return r.createManagerChainIdentityElements=function(){var e=r.props.managerList?r.props.managerList.map(function(e){var t={imageUrl:e.image,primaryText:e.displayName||"",secondaryText:e.jobTitle||"",tertiaryText:e.department||""};return React.createElement("div",{className:"bolt-identity-card-persona-list-row flex-row flex-grow scroll-hidden",key:e.entityId+e.signInAddress},React.createElement(Button,{"aria-label":e.displayName,className:"bolt-identity-card-persona-list-element profile-card-tab-element flex-row text-ellipsis",onClick:function(){r.props.onClickEntity&&r.props.onClickEntity(e)},subtle:!0},React.createElement(Persona,{size:PersonaSize.size40,identity:e,imageUrlResolver:r.props.imageUrlResolver}),React.createElement("div",{className:"flex-column flex-grow bolt-identity-card-name text-ellipsis"},React.createElement("div",{className:"text-left text-ellipsis"},t.primaryText),""===t.secondaryText?void 0:React.createElement("div",{className:"text-left text-ellipsis"},t.secondaryText))))}):[],t={imageUrl:r.props.identity.image,primaryText:r.props.identity.displayName,secondaryText:r.props.identity.jobTitle,tertiaryText:r.props.identity.department};return e.push(React.createElement("div",{className:"bolt-identity-card-persona-list-row flex-row flex-grow",key:r.props.identity.entityId+r.props.identity.signInAddress},React.createElement(Button,{className:"bolt-identity-card-persona-list-element profile-card-tab-element flex-row flex-shrink text-ellipsis","aria-label":r.props.identity.displayName,onClick:function(){r.props.onClickEntity&&r.props.onClickEntity(r.props.identity)},subtle:!0},React.createElement(Persona,{size:PersonaSize.size40,identity:r.props.identity,imageUrlResolver:r.props.imageUrlResolver}),React.createElement("div",{className:"flex-column flex-grow bolt-identity-card-name text-ellipsis"},React.createElement("div",{className:"text-left text-ellipsis"},t.primaryText),""===t.secondaryText?void 0:React.createElement("div",{className:"text-left text-ellipsis"},t.secondaryText))))),e},r.createDirectReportsIdentityElements=function(){return r.props.directReportList?r.props.directReportList.map(function(e){var t={imageUrl:e.image,primaryText:e.displayName||"",secondaryText:e.jobTitle||"",tertiaryText:e.department||""};return React.createElement("div",{className:"bolt-identity-card-persona-list-row flex-row flex-grow",key:e.entityId+e.signInAddress},React.createElement(Button,{className:"bolt-identity-card-persona-list-element profile-card-tab-element flex-row text-ellipsis","aria-label":e.displayName,onClick:function(){r.props.onClickEntity&&r.props.onClickEntity(e)},subtle:!0},React.createElement(Persona,{size:PersonaSize.size40,identity:e,imageUrlResolver:r.props.imageUrlResolver}),React.createElement("div",{className:"flex-column flex-grow bolt-identity-card-name text-ellipsis"},React.createElement("div",{className:"text-left text-ellipsis"},t.primaryText),""===t.secondaryText?void 0:React.createElement("div",{className:"text-left text-ellipsis"},t.secondaryText))))}):[]},r}return __extends(t,e),t.prototype.render=function(){var e=this.createManagerChainIdentityElements(),t=this.createDirectReportsIdentityElements();return React.createElement("div",{className:"bolt-identity-contact-card-organization-card-wrapper bolt-identity-card-content"},React.createElement("div",{className:"bolt-identity-organization-card-content v-scroll-auto h-scroll-hidden"},React.createElement("div",{className:"bolt-identity-organization-card-header-wrapper"},Resources.IdentityCardOrganization," "),React.createElement("div",{className:"bolt-identity-organization-card-manager-chain-wrapper"},e),0<t.length&&React.createElement("div",{className:"bolt-identity-organization-card-direct-reports-wrapper"},format(Resources.IdentityCardReportingTo,this.props.identity.displayName,this.props.directReportList?this.props.directReportList.length:0),t)))},t}(React.Component);export{OrganizationCard};