"use strict";(self.webpackChunk_esome_dev_ppms=self.webpackChunk_esome_dev_ppms||[]).push([[8887],{98887:(n,t,e)=>{e.r(t);var r,a,o,i,c=e(171),d=e(16682),p=e(94430),l=e(56765),s=e(28120),h=e(27805),u=e(77675);function v(n,t,e,r,a,o,i){try{var c=n[o](i),d=c.value}catch(n){return void e(n)}c.done?t(d):Promise.resolve(d).then(r,a)}function g(n){return function(){var t=this,e=arguments;return new Promise((function(r,a){var o=n.apply(t,e);function i(n){v(o,r,a,i,c,"next",n)}function c(n){v(o,r,a,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.$)(u.h)(u.B4)){constructor(){super(...arguments),this.appliances=[]}get context(){return{title:"appliance home",help:"auth/appliance"}}render(){var n=this.appliances||[];return(0,p.dy)(r||(r=b(["\n      <div>\n        <h2>Registered Appliances</h2>\n        <p page-description>\n          What type of appliance are you building?<br />Choose the app type that best suits the audience you’re building\n          for. The appliance type can’t be changed after it’s created.\n        </p>\n        <mwc-button raised @click=",' label="register new appliance"></mwc-button>\n      </div>\n\n      <table>\n        <tr>\n          <th>appliance name</th>\n          <th>API health</th>\n          <th>Installs</th>\n          <th>status</th>\n        </tr>\n        ',"\n      </table>\n    "])),(n=>(0,u.c4)("appliance-register")),n.map((n=>(0,p.dy)(a||(a=b(["\n            <tr>\n              <td>\n                <a href=",">","</a>\n                ",'\n              </td>\n              <td>OK</td>\n              <td class="text-align-center">1</td>\n              <td>draft</td>\n            </tr>\n          '])),"appliance/".concat(n.id),n.name,n.description))))}pageUpdated(){var n=this;return g((function*(){n.active&&(n.appliances=(yield n.fetchAppliances()).items)}))()}fetchAppliances(){return g((function*(){var n=yield h.Lp.query({query:(0,d.ZP)(o||(o=b(["\n        query {\n          appliances {\n            items {\n              id\n              name\n              description\n            }\n            total\n          }\n        }\n      "])))});if(!n.errors)return n.data.appliances}))()}};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      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\n      table {\n        width: 100%;\n        margin: var(--margin-wide) 0;\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        color: var(--secondary-text-color);\n        font: bold 16px var(--theme-font);\n\n        display: block;\n        text-decoration: none;\n      }\n      .text-align-center {\n        text-align: center;\n      }\n      .text-align-right {\n        text-align: right;\n      }\n\n      @media screen and (max-width: 480px) {\n        :host {\n          padding: var(--padding-default);\n        }\n      }\n    "])))],(0,c.gn)([(0,l.Cb)({type:Array}),(0,c.w6)("design:type",Array)],f.prototype,"appliances",void 0),f=(0,c.gn)([(0,l.Mo)("appliance-home")],f)}}]);