import{LitElement as t,html as e,css as s}from"lit";import{classMap as a}from"lit/directives/class-map.js";import{iconRemixAlertFill as i}from"./assets/cc-remix.icons.js";import{tileStyles as c}from"./styles/info-tiles.js";import{skeletonStyles as o}from"./styles/skeleton.js";import{ccLink as r,linkStyles as l}from"./templates/cc-link/cc-link.js";import{i18n as n}from"./translation.js";import"./cc-datetime-relative.js";import"./cc-icon.js";const d=[{state:"???????",date:"??????????",action:"????",logsUrl:""},{state:"??????",date:"???????????",action:"????",logsUrl:""}];class m extends t{static get properties(){return{state:{type:Object}}}constructor(){super(),this.state={type:"loading"}}_getStateLabel(t,e){return"OK"===t?n("UNDEPLOY"===e?"cc-tile-deployments.state.stopped":"cc-tile-deployments.state.started"):"FAIL"===t?n("cc-tile-deployments.state.failed"):"CANCELLED"===t?n("cc-tile-deployments.state.cancelled"):t}render(){return e`<div class=tile_title>${n("cc-tile-deployments.title")}</div>${this._renderTileContent()}`}_renderTileContent(){if("error"===this.state.type)return e`<div class=tile_message><div class=error-message><cc-icon .icon=${i} a11y-name=${n("cc-tile-deployments.error.icon-a11y-name")} class=icon-warning></cc-icon><p>${n("cc-tile-deployments.error")}</p></div></div>`;const t="loading"===this.state.type,s="loaded"===this.state.type?this.state.deploymentsInfo:d;return s.length>0?e`<div class=tile_body>${s.map((s=>e`<div class=state data-state=${s.state}><span class=${a({skeleton:t})}>${this._getStateLabel(s.state,s.action)}</span></div><div class=date>${t?e`<span class=skeleton>${s.date}</span>`:""} ${t?"":e`<cc-datetime-relative datetime=${s.date}></cc-datetime-relative>`}</div><div>${r(s.logsUrl,"logs",t)}</div>`))}</div>`:e`<div class=tile_message>${n("cc-tile-deployments.empty")}</div>`}static get styles(){return[c,o,l,s`.tile_body{align-items:start;grid-gap:1em;grid-template-columns:auto auto auto;justify-content:space-between}.state{font-weight:700}.state[data-state=CANCELLED]{color:var(--cc-color-text-warning)}.state[data-state=FAIL]{color:var(--cc-color-text-danger)}.state[data-state=OK]{color:var(--cc-color-text-success)}[title]{cursor:help}.skeleton{background-color:#bbb}.error-message{display:grid;gap:.75em;grid-template-columns:min-content 1fr;text-align:left}.error-message p{margin:0}.icon-warning{align-self:center;color:var(--cc-color-text-warning);--cc-icon-size:1.25em}`]}}window.customElements.define("cc-tile-deployments",m);export{m as CcTileDeployments};
//# sourceMappingURL=cc-tile-deployments.js.map
