import*as i18n from"../../../core/i18n/i18n.js";import*as DataGrid from"../../../ui/components/data_grid/data_grid.js";import*as ComponentHelpers from"../../../ui/components/helpers/helpers.js";import*as LitHtml from"../../../ui/lit-html/lit-html.js";import reportingApiGridStyles from"./reportingApiGrid.css.js";const UIStrings={noEndpointsToDisplay:"No endpoints to display"},str_=i18n.i18n.registerUIStrings("panels/application/components/EndpointsGrid.ts",UIStrings);export const i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_);const{render:render,html:html}=LitHtml;export class EndpointsGrid extends HTMLElement{static litTagName=LitHtml.literal`devtools-resources-endpoints-grid`;#i=this.attachShadow({mode:"open"});#t=new Map;connectedCallback(){this.#i.adoptedStyleSheets=[reportingApiGridStyles],this.#e()}set data(i){this.#t=i.endpoints,this.#e()}#e(){const i={columns:[{id:"origin",title:i18n.i18n.lockedString("Origin"),widthWeighting:30,hideable:!1,visible:!0},{id:"name",title:i18n.i18n.lockedString("Name"),widthWeighting:20,hideable:!1,visible:!0},{id:"url",title:i18n.i18n.lockedString("URL"),widthWeighting:30,hideable:!1,visible:!0}],rows:this.#n()};render(html`
      <div class="reporting-container">
        <div class="reporting-header">${i18n.i18n.lockedString("Endpoints")}</div>
        ${this.#t.size>0?html`
          <${DataGrid.DataGridController.DataGridController.litTagName} .data=${i}>
          </${DataGrid.DataGridController.DataGridController.litTagName}>
        `:html`
          <div class="reporting-placeholder">
            <div>${i18nString(UIStrings.noEndpointsToDisplay)}</div>
          </div>
        `}
      </div>
    `,this.#i,{host:this})}#n(){return Array.from(this.#t).map((([i,t])=>t.map((t=>({cells:[{columnId:"origin",value:i},{columnId:"name",value:t.groupName},{columnId:"url",value:t.url}]}))))).flat()}}ComponentHelpers.CustomElements.defineComponent("devtools-resources-endpoints-grid",EndpointsGrid);