import*as i18n from"../i18n/i18n.js";import*as SDK from"../sdk/sdk.js";import*as LitHtml from"../third_party/lit-html/lit-html.js";import*as Components from"../ui/components/components.js";import*as UI from"../ui/ui.js";import{ApplicationPanelTreeElement}from"./ApplicationPanelTreeElement.js";const UIStrings={trustTokens:"Trust Tokens",issuer:"Issuer",storedTokenCount:"Stored token count",allStoredTrustTokensAvailableIn:"All stored Trust Tokens available in this browser instance.",noTrustTokensStored:"No Trust Tokens are currently stored."},str_=i18n.i18n.registerUIStrings("resources/TrustTokensView.ts",UIStrings),i18nString=i18n.i18n.getLocalizedString.bind(void 0,str_),REFRESH_INTERVAL_MS=1e3;export class TrustTokensTreeElement extends ApplicationPanelTreeElement{constructor(t){super(t,i18nString(UIStrings.trustTokens),!1);const e=UI.Icon.Icon.create("mediumicon-database","resource-tree-item");this.setLeadingIcons([e])}get itemURL(){return"trustTokens://"}onselect(t){return super.onselect(t),this.view||(this.view=new TrustTokensViewWidgetWrapper),this.showView(this.view),!1}}class TrustTokensViewWidgetWrapper extends UI.ThrottledWidget.ThrottledWidget{constructor(){super(!1,1e3),this.trustTokensView=new TrustTokensView,this.contentElement.appendChild(this.trustTokensView),this.update()}async doUpdate(){const t=SDK.SDKModel.TargetManager.instance().mainTarget();if(!t)return;const{tokens:e}=await t.storageAgent().invoke_getTrustTokens();this.trustTokensView.data={tokens:e},this.update()}}export class TrustTokensView extends HTMLElement{constructor(){super(...arguments),this.shadow=this.attachShadow({mode:"open"}),this.tokens=[]}connectedCallback(){this.render()}set data(t){this.tokens=t.tokens,this.render()}render(){LitHtml.render(LitHtml.html`
      <style>
        :host {
          padding: 20px;
        }

        .heading {
          font-size: 15px;
        }

        devtools-data-grid-controller {
          border: 1px solid var(--color-details-hairline);
          margin-top: 20px;
        }

        .info-icon {
          vertical-align: text-bottom;
          height: 14px;
        }

        .no-tt-message {
          margin-top: 20px;
        }
      </style>
      <div>
        <span class="heading">Trust Tokens</span>
        <devtools-icon class="info-icon" title=${i18nString(UIStrings.allStoredTrustTokensAvailableIn)}
          .data=${{iconName:"ic_info_black_18dp",color:"var(--color-link)",width:"14px"}}>
        </devtools-icon>
        ${this.renderGridOrNoDataMessage()}
      </div>
    `,this.shadow)}renderGridOrNoDataMessage(){if(0===this.tokens.length)return LitHtml.html`<div class="no-tt-message">${i18nString(UIStrings.noTrustTokensStored)}</div>`;const t={columns:[{id:"issuer",title:i18nString(UIStrings.issuer),widthWeighting:2,hideable:!1,visible:!0,sortable:!0},{id:"count",title:i18nString(UIStrings.storedTokenCount),widthWeighting:1,hideable:!1,visible:!0,sortable:!0}],rows:this.buildRowsFromTokens(),initialSort:{columnId:"issuer",direction:"ASC"}};return LitHtml.html`
      <devtools-data-grid-controller .data=${t}></devtools-data-grid-controller>
    `}buildRowsFromTokens(){return this.tokens.filter((t=>t.count>0)).map((t=>({cells:[{columnId:"issuer",value:removeTrailingSlash(t.issuerOrigin)},{columnId:"count",value:t.count}]})))}}function removeTrailingSlash(t){return t.replace(/\/$/,"")}customElements.define("devtools-trust-tokens-storage-view",TrustTokensView);