"use strict";(self.webpackChunk_esome_dev_ppms=self.webpackChunk_esome_dev_ppms||[]).push([[2085],{22085:(n,t,r)=>{r.r(t);var o,e,a,i,c=r(171),d=r(16682),p=r(94430),l=r(56765),s=r(28120),u=r(27805),v=r(77675);function g(n,t,r,o,e,a,i){try{var c=n[a](i),d=c.value}catch(n){return void r(n)}c.done?t(d):Promise.resolve(d).then(o,e)}function h(n){return function(){var t=this,r=arguments;return new Promise((function(o,e){var a=n.apply(t,r);function i(n){g(a,o,e,i,c,"next",n)}function c(n){g(a,o,e,i,c,"throw",n)}i(void 0)}))}}function b(n,t){return t||(t=n.slice(0)),Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(t)}}))}var f=class extends((0,s.$)(v.h)(v.B4)){constructor(){super(...arguments),this.applications=[]}get context(){return{title:"applications",help:"auth/application"}}render(){var n=this.applications||[];return(0,p.dy)(o||(o=b(["\n      <div>\n        <h2>Registered Applications</h2>\n        <p page-description>\n          What type of app are you building?<br />Choose the app type that best suits the audience you’re building for.\n        </p>\n        <mwc-button\n          raised\n          @click=",'\n          label="register new application"\n        ></mwc-button>\n      </div>\n\n      \x3c!-- <div> --\x3e\n      <table>\n        <tr>\n          <th>app name</th>\n          <th>API health</th>\n          <th>Installs</th>\n          <th>status</th>\n        </tr>\n        ',"\n      </table>\n\n      <mwc-button outlined @click=",' label="bound applications .."></mwc-button>\n      \x3c!-- </div> --\x3e\n    '])),(n=>(0,v.c4)("application-register")),n.map((n=>(0,p.dy)(e||(e=b(["\n            <tr>\n              <td>\n                <a href=",">\n                  <strong>","</strong>\n                  ",'\n                </a>\n              </td>\n              <td>OK</td>\n              <td class="text-align-center">1</td>\n              <td>draft</td>\n            </tr>\n          '])),"application/".concat(n.id),n.name,n.description))),(n=>(0,v.c4)("app-bindings")))}pageUpdated(n,t,r){var o=this;return h((function*(){o.active&&(o.applications=(yield o.fetchApplications()).items)}))()}fetchApplications(){return h((function*(){var n=yield u.Lp.query({query:(0,d.ZP)(a||(a=b(["\n        query {\n          applications {\n            items {\n              id\n              name\n              description\n            }\n            total\n          }\n        }\n      "])))});if(!n.errors)return n.data.applications}))()}};f.styles=[(0,p.iv)(i||(i=b(["\n      :host {\n        background-color: var(--main-section-background-color);\n        padding: var(--padding-wide);\n\n        overflow: auto;\n      }\n\n      [outlined] {\n        float: right;\n        margin-top: var(--margin-default);\n      }\n\n      h2 {\n        margin: var(--title-margin);\n        font: var(--title-font);\n        color: var(--title-text-color);\n      }\n      [page-description] {\n        margin: var(--page-description-margin);\n        font: var(--page-description-font);\n        color: var(--page-description-color);\n      }\n      table {\n        margin: var(--margin-wide) 0;\n        width: 100%;\n        border-collapse: collapse;\n      }\n      tr {\n        background-color: var(--tr-background-color);\n      }\n      tr:nth-child(odd) {\n        background-color: var(--tr-background-odd-color);\n      }\n      tr:hover {\n        background-color: var(--tr-background-hover-color);\n      }\n      th {\n        border-top: var(--th-border-top);\n        border-bottom: var(--td-border-bottom);\n        padding: var(--th-padding);\n\n        font: var(--th-font);\n        color: var(--th-color);\n        text-transform: var(--th-text-transform);\n        text-align: left;\n      }\n      td {\n        padding: var(--td-padding);\n        border-bottom: var(--td-border-bottom);\n        font: var(--td-font);\n        color: var(--td-color);\n      }\n      td a {\n        font: var(--td-font);\n        text-decoration: none;\n        color: var(--theme-black-color);\n      }\n      td a strong {\n        color: var(--secondary-text-color);\n        font: bold 16px var(--theme-font);\n\n        display: block;\n        text-decoration: none;\n      }\n\n      .text-align-center {\n        text-align: center;\n      }\n      .text-align-right {\n        text-align: right;\n      }\n    "])))],(0,c.gn)([(0,l.Cb)({type:Array}),(0,c.w6)("design:type",Array)],f.prototype,"applications",void 0),f=(0,c.gn)([(0,l.Mo)("applications-page")],f)}}]);