@things-factory/oauth2-client 7.0.1-alpha.1 → 7.0.1-alpha.100

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (25) hide show
  1. package/client/pages/oauth2-client/oauth2-client-importer.ts +7 -18
  2. package/client/pages/oauth2-client/oauth2-client-list-page.ts +6 -5
  3. package/client/pages/oauth2-client-register.ts +1 -1
  4. package/client/pages/oauth2-client.ts +3 -2
  5. package/client/pages/oauth2-clients.ts +1 -1
  6. package/dist-client/pages/oauth2-client/oauth2-client-importer.d.ts +2 -1
  7. package/dist-client/pages/oauth2-client/oauth2-client-importer.js +4 -11
  8. package/dist-client/pages/oauth2-client/oauth2-client-importer.js.map +1 -1
  9. package/dist-client/pages/oauth2-client/oauth2-client-list-page.d.ts +1 -1
  10. package/dist-client/pages/oauth2-client/oauth2-client-list-page.js +6 -5
  11. package/dist-client/pages/oauth2-client/oauth2-client-list-page.js.map +1 -1
  12. package/dist-client/pages/oauth2-client-register.d.ts +1 -1
  13. package/dist-client/pages/oauth2-client-register.js +1 -1
  14. package/dist-client/pages/oauth2-client-register.js.map +1 -1
  15. package/dist-client/pages/oauth2-client.d.ts +2 -1
  16. package/dist-client/pages/oauth2-client.js +3 -2
  17. package/dist-client/pages/oauth2-client.js.map +1 -1
  18. package/dist-client/pages/oauth2-clients.js +1 -1
  19. package/dist-client/pages/oauth2-clients.js.map +1 -1
  20. package/dist-client/tsconfig.tsbuildinfo +1 -1
  21. package/dist-server/service/oauth2-client/oauth2-client.js +1 -1
  22. package/dist-server/service/oauth2-client/oauth2-client.js.map +1 -1
  23. package/dist-server/tsconfig.tsbuildinfo +1 -1
  24. package/package.json +4 -4
  25. package/server/service/oauth2-client/oauth2-client.ts +1 -1
@@ -1,3 +1,4 @@
1
+ import '@material/web/icon/icon.js'
1
2
  import '@operato/data-grist'
2
3
 
3
4
  import gql from 'graphql-tag'
@@ -7,9 +8,11 @@ import { property } from 'lit/decorators.js'
7
8
  import { client } from '@operato/graphql'
8
9
  import { i18next } from '@operato/i18n'
9
10
  import { isMobileDevice } from '@operato/utils'
11
+ import { ButtonContainerStyles } from '@operato/styles'
10
12
 
11
13
  export class Oauth2ClientImporter extends LitElement {
12
14
  static styles = [
15
+ ButtonContainerStyles,
13
16
  css`
14
17
  :host {
15
18
  display: flex;
@@ -21,16 +24,6 @@ export class Oauth2ClientImporter extends LitElement {
21
24
  ox-grist {
22
25
  flex: 1;
23
26
  }
24
-
25
- .button-container {
26
- display: flex;
27
- margin-left: auto;
28
- padding: var(--padding-default);
29
- }
30
-
31
- mwc-button {
32
- margin-left: var(--margin-default);
33
- }
34
27
  `
35
28
  ]
36
29
 
@@ -60,21 +53,18 @@ export class Oauth2ClientImporter extends LitElement {
60
53
  ]
61
54
  }
62
55
 
63
-
64
56
  render() {
65
57
  return html`
66
58
  <ox-grist
67
59
  .mode=${isMobileDevice() ? 'LIST' : 'GRID'}
68
60
  .config=${this.columns}
69
- .data=${
70
- {
71
- records: this.oauth2Clients
72
- }
73
- }
61
+ .data=${{
62
+ records: this.oauth2Clients
63
+ }}
74
64
  ></ox-grist>
75
65
 
76
66
  <div class="button-container">
77
- <mwc-button raised @click="${this.save.bind(this)}">${i18next.t('button.save')}</mwc-button>
67
+ <button @click="${this.save.bind(this)}"><md-icon>save</md-icon>${i18next.t('button.save')}</button>
78
68
  </div>
79
69
  `
80
70
  }
@@ -94,4 +84,3 @@ export class Oauth2ClientImporter extends LitElement {
94
84
  this.dispatchEvent(new CustomEvent('imported'))
95
85
  }
96
86
  }
97
-
@@ -89,7 +89,7 @@ export class Oauth2ClientListPage extends connect(store)(localize(i18next)(Scope
89
89
 
90
90
  <div id="sorters">
91
91
  Sort
92
- <mwc-icon
92
+ <md-icon
93
93
  @click=${e => {
94
94
  const target = e.currentTarget
95
95
  this.sortersControl.open({
@@ -97,7 +97,7 @@ export class Oauth2ClientListPage extends connect(store)(localize(i18next)(Scope
97
97
  top: target.offsetTop + target.offsetHeight
98
98
  })
99
99
  }}
100
- >expand_more</mwc-icon
100
+ >expand_more</md-icon
101
101
  >
102
102
  <ox-popup id="sorter-control">
103
103
  <ox-sorters-control> </ox-sorters-control>
@@ -105,9 +105,10 @@ export class Oauth2ClientListPage extends connect(store)(localize(i18next)(Scope
105
105
  </div>
106
106
 
107
107
  <div id="modes">
108
- <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</mwc-icon>
109
- <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</mwc-icon>
110
- <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>
108
+ <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>
109
+ <md-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</md-icon>
110
+ <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>
111
+ </div>
111
112
  </div>
112
113
  </div>
113
114
  </ox-grist>
@@ -14,7 +14,7 @@ export class Oauth2ClientRegister extends connect(store)(PageView) {
14
14
  :host {
15
15
  display: flex;
16
16
  flex-direction: column;
17
- background-color: var(--main-section-background-color);
17
+ background-color: var(--md-sys-color-background);
18
18
  padding: var(--padding-wide);
19
19
 
20
20
  position: relative;
@@ -1,3 +1,4 @@
1
+ import '@material/web/icon/icon.js'
1
2
  import '@operato/help/ox-help-icon.js'
2
3
 
3
4
  import Clipboard from 'clipboard'
@@ -48,7 +49,7 @@ export class Oauth2Client extends connect(store)(PageView) {
48
49
  overflow-y: auto;
49
50
  position: relative;
50
51
 
51
- background-color: var(--main-section-background-color);
52
+ background-color: var(--md-sys-color-background);
52
53
  padding: var(--padding-wide);
53
54
  }
54
55
  h2 {
@@ -208,7 +209,7 @@ export class Oauth2Client extends connect(store)(PageView) {
208
209
 
209
210
  return html`
210
211
  <div>
211
- <h2><mwc-icon>apps</mwc-icon>&nbsp;${oauth2Client.name || ''}</h2>
212
+ <h2><md-icon>apps</md-icon>&nbsp;${oauth2Client.name || ''}</h2>
212
213
  <p page-description>${oauth2Client.description || ''}</p>
213
214
  </div>
214
215
 
@@ -14,7 +14,7 @@ class Oauth2Clients extends connect(store)(PageView) {
14
14
  :host {
15
15
  display: flex;
16
16
  flex-direction: column;
17
- background-color: var(--main-section-background-color);
17
+ background-color: var(--md-sys-color-background);
18
18
  padding: var(--padding-wide);
19
19
 
20
20
  overflow: auto;
@@ -1,3 +1,4 @@
1
+ import '@material/web/icon/icon.js';
1
2
  import '@operato/data-grist';
2
3
  import { LitElement } from 'lit';
3
4
  export declare class Oauth2ClientImporter extends LitElement {
@@ -17,6 +18,6 @@ export declare class Oauth2ClientImporter extends LitElement {
17
18
  width: number;
18
19
  }[];
19
20
  };
20
- render(): import("lit-html").TemplateResult<1>;
21
+ render(): import("lit").TemplateResult<1>;
21
22
  save(): Promise<void>;
22
23
  }
@@ -1,4 +1,5 @@
1
1
  import { __decorate, __metadata } from "tslib";
2
+ import '@material/web/icon/icon.js';
2
3
  import '@operato/data-grist';
3
4
  import gql from 'graphql-tag';
4
5
  import { css, html, LitElement } from 'lit';
@@ -6,6 +7,7 @@ import { property } from 'lit/decorators.js';
6
7
  import { client } from '@operato/graphql';
7
8
  import { i18next } from '@operato/i18n';
8
9
  import { isMobileDevice } from '@operato/utils';
10
+ import { ButtonContainerStyles } from '@operato/styles';
9
11
  export class Oauth2ClientImporter extends LitElement {
10
12
  constructor() {
11
13
  super(...arguments);
@@ -46,7 +48,7 @@ export class Oauth2ClientImporter extends LitElement {
46
48
  ></ox-grist>
47
49
 
48
50
  <div class="button-container">
49
- <mwc-button raised @click="${this.save.bind(this)}">${i18next.t('button.save')}</mwc-button>
51
+ <button @click="${this.save.bind(this)}"><md-icon>save</md-icon>${i18next.t('button.save')}</button>
50
52
  </div>
51
53
  `;
52
54
  }
@@ -66,6 +68,7 @@ export class Oauth2ClientImporter extends LitElement {
66
68
  }
67
69
  }
68
70
  Oauth2ClientImporter.styles = [
71
+ ButtonContainerStyles,
69
72
  css `
70
73
  :host {
71
74
  display: flex;
@@ -77,16 +80,6 @@ Oauth2ClientImporter.styles = [
77
80
  ox-grist {
78
81
  flex: 1;
79
82
  }
80
-
81
- .button-container {
82
- display: flex;
83
- margin-left: auto;
84
- padding: var(--padding-default);
85
- }
86
-
87
- mwc-button {
88
- margin-left: var(--margin-default);
89
- }
90
83
  `
91
84
  ];
92
85
  __decorate([
@@ -1 +1 @@
1
- {"version":3,"file":"oauth2-client-importer.js","sourceRoot":"","sources":["../../../client/pages/oauth2-client/oauth2-client-importer.ts"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAA;AAE5B,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE5C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,MAAM,OAAO,oBAAqB,SAAQ,UAAU;IAApD;;QA0B6B,kBAAa,GAAU,EAAE,CAAA;QACxB,YAAO,GAAG;YACpC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,EAAE;YACzC,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;YAC9B,OAAO,EAAE;gBACP;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,MAAM;oBACZ,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;oBAC/B,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,aAAa;oBACnB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC;oBACtC,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,QAAQ;oBACd,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC;oBACjC,KAAK,EAAE,EAAE;iBACV;aACF;SACF,CAAA;IAmCH,CAAC;IAhCC,MAAM;QACJ,OAAO,IAAI,CAAA;;gBAEC,cAAc,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;kBAChC,IAAI,CAAC,OAAO;gBAEpB;YACE,OAAO,EAAE,IAAI,CAAC,aAAa;SAE/B;;;;qCAI6B,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC;;KAEjF,CAAA;IACH,CAAC;IAED,KAAK,CAAC,IAAI;;QACR,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;YACnC,QAAQ,EAAE,GAAG,CAAA;;;;OAIZ;YACD,SAAS,EAAE,EAAE,aAAa,EAAE,IAAI,CAAC,aAAa,EAAE;SACjD,CAAC,CAAA;QAEF,IAAI,MAAA,QAAQ,CAAC,MAAM,0CAAE,MAAM;YAAE,OAAM;QAEnC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,UAAU,CAAC,CAAC,CAAA;IACjD,CAAC;;AAnFM,2BAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;KAqBF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;2DAA0B;AACpD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;qDAuB1B","sourcesContent":["import '@operato/data-grist'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { isMobileDevice } from '@operato/utils'\n\nexport class Oauth2ClientImporter extends LitElement {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n }\n\n ox-grist {\n flex: 1;\n }\n\n .button-container {\n display: flex;\n margin-left: auto;\n padding: var(--padding-default);\n }\n\n mwc-button {\n margin-left: var(--margin-default);\n }\n `\n ]\n\n @property({ type: Array }) oauth2Clients: any[] = []\n @property({ type: Object }) columns = {\n list: { fields: ['name', 'description'] },\n pagination: { infinite: true },\n columns: [\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n width: 150\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n width: 200\n },\n {\n type: 'checkbox',\n name: 'active',\n header: i18next.t('field.active'),\n width: 60\n }\n ]\n }\n\n\n render() {\n return html`\n <ox-grist\n .mode=${isMobileDevice() ? 'LIST' : 'GRID'}\n .config=${this.columns}\n .data=${\n { \n records: this.oauth2Clients \n }\n }\n ></ox-grist>\n\n <div class=\"button-container\">\n <mwc-button raised @click=\"${this.save.bind(this)}\">${i18next.t('button.save')}</mwc-button>\n </div>\n `\n }\n\n async save() {\n const response = await client.mutate({\n mutation: gql`\n mutation importOauth2Clients($oauth2Clients: [Oauth2ClientPatch!]!) {\n importOauth2Clients(oauth2Clients: $oauth2Clients)\n }\n `,\n variables: { oauth2Clients: this.oauth2Clients }\n })\n\n if (response.errors?.length) return\n\n this.dispatchEvent(new CustomEvent('imported'))\n }\n}\n\n"]}
1
+ {"version":3,"file":"oauth2-client-importer.js","sourceRoot":"","sources":["../../../client/pages/oauth2-client/oauth2-client-importer.ts"],"names":[],"mappings":";AAAA,OAAO,4BAA4B,CAAA;AACnC,OAAO,qBAAqB,CAAA;AAE5B,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE5C,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AAEvD,MAAM,OAAO,oBAAqB,SAAQ,UAAU;IAApD;;QAiB6B,kBAAa,GAAU,EAAE,CAAA;QACxB,YAAO,GAAG;YACpC,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC,EAAE;YACzC,UAAU,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE;YAC9B,OAAO,EAAE;gBACP;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,MAAM;oBACZ,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;oBAC/B,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,aAAa;oBACnB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC;oBACtC,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,QAAQ;oBACd,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC;oBACjC,KAAK,EAAE,EAAE;iBACV;aACF;SACF,CAAA;IAgCH,CAAC;IA9BC,MAAM;QACJ,OAAO,IAAI,CAAA;;gBAEC,cAAc,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;kBAChC,IAAI,CAAC,OAAO;gBACd;YACN,OAAO,EAAE,IAAI,CAAC,aAAa;SAC5B;;;;0BAIiB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,4BAA4B,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC;;KAE7F,CAAA;IACH,CAAC;IAED,KAAK,CAAC,IAAI;;QACR,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;YACnC,QAAQ,EAAE,GAAG,CAAA;;;;OAIZ;YACD,SAAS,EAAE,EAAE,aAAa,EAAE,IAAI,CAAC,aAAa,EAAE;SACjD,CAAC,CAAA;QAEF,IAAI,MAAA,QAAQ,CAAC,MAAM,0CAAE,MAAM;YAAE,OAAM;QAEnC,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,UAAU,CAAC,CAAC,CAAA;IACjD,CAAC;;AAvEM,2BAAM,GAAG;IACd,qBAAqB;IACrB,GAAG,CAAA;;;;;;;;;;;KAWF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;2DAA0B;AACpD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;qDAuB1B","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/data-grist'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { property } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next } from '@operato/i18n'\nimport { isMobileDevice } from '@operato/utils'\nimport { ButtonContainerStyles } from '@operato/styles'\n\nexport class Oauth2ClientImporter extends LitElement {\n static styles = [\n ButtonContainerStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: #fff;\n }\n\n ox-grist {\n flex: 1;\n }\n `\n ]\n\n @property({ type: Array }) oauth2Clients: any[] = []\n @property({ type: Object }) columns = {\n list: { fields: ['name', 'description'] },\n pagination: { infinite: true },\n columns: [\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n width: 150\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n width: 200\n },\n {\n type: 'checkbox',\n name: 'active',\n header: i18next.t('field.active'),\n width: 60\n }\n ]\n }\n\n render() {\n return html`\n <ox-grist\n .mode=${isMobileDevice() ? 'LIST' : 'GRID'}\n .config=${this.columns}\n .data=${{\n records: this.oauth2Clients\n }}\n ></ox-grist>\n\n <div class=\"button-container\">\n <button @click=\"${this.save.bind(this)}\"><md-icon>save</md-icon>${i18next.t('button.save')}</button>\n </div>\n `\n }\n\n async save() {\n const response = await client.mutate({\n mutation: gql`\n mutation importOauth2Clients($oauth2Clients: [Oauth2ClientPatch!]!) {\n importOauth2Clients(oauth2Clients: $oauth2Clients)\n }\n `,\n variables: { oauth2Clients: this.oauth2Clients }\n })\n\n if (response.errors?.length) return\n\n this.dispatchEvent(new CustomEvent('imported'))\n }\n}\n"]}
@@ -40,7 +40,7 @@ export declare class Oauth2ClientListPage extends Oauth2ClientListPage_base {
40
40
  handler: (records: any) => Promise<void>;
41
41
  };
42
42
  };
43
- render(): import("lit-html").TemplateResult<1>;
43
+ render(): import("lit").TemplateResult<1>;
44
44
  pageInitialized(lifecycle: any): Promise<void>;
45
45
  pageUpdated(changes: any, lifecycle: any): Promise<void>;
46
46
  fetchHandler({ page, limit, sortings, filters }: FetchOption): Promise<{
@@ -52,7 +52,7 @@ let Oauth2ClientListPage = class Oauth2ClientListPage extends connect(store)(loc
52
52
 
53
53
  <div id="sorters">
54
54
  Sort
55
- <mwc-icon
55
+ <md-icon
56
56
  @click=${e => {
57
57
  const target = e.currentTarget;
58
58
  this.sortersControl.open({
@@ -60,7 +60,7 @@ let Oauth2ClientListPage = class Oauth2ClientListPage extends connect(store)(loc
60
60
  top: target.offsetTop + target.offsetHeight
61
61
  });
62
62
  }}
63
- >expand_more</mwc-icon
63
+ >expand_more</md-icon
64
64
  >
65
65
  <ox-popup id="sorter-control">
66
66
  <ox-sorters-control> </ox-sorters-control>
@@ -68,9 +68,10 @@ let Oauth2ClientListPage = class Oauth2ClientListPage extends connect(store)(loc
68
68
  </div>
69
69
 
70
70
  <div id="modes">
71
- <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</mwc-icon>
72
- <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</mwc-icon>
73
- <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>
71
+ <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>
72
+ <md-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</md-icon>
73
+ <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>
74
+ </div>
74
75
  </div>
75
76
  </div>
76
77
  </ox-grist>
@@ -1 +1 @@
1
- {"version":3,"file":"oauth2-client-list-page.js","sourceRoot":"","sources":["../../../client/pages/oauth2-client/oauth2-client-list-page.ts"],"names":[],"mappings":";AAAA,OAAO,qBAAqB,CAAA;AAE5B,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AACxF,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAA;AAChD,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAA;AAC/B,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAClE,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAgB,SAAS,EAA+B,MAAM,qBAAqB,CAAA;AAC1F,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AACnD,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAA;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C,OAAO,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAA;AACnD,OAAO,GAAG,MAAM,aAAa,CAAA;AAE7B,OAAO,EAAE,oBAAoB,EAAE,MAAM,0BAA0B,CAAA;AAGxD,IAAM,oBAAoB,GAA1B,MAAM,oBAAqB,SAAQ,OAAO,CAAC,KAAK,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,mBAAmB,CAAC,QAAQ,CAAC,CAAC,CAAC;IAAnG;;QA4BuB,SAAI,GAA6B,cAAc,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAA;IAqRjG,CAAC;IA5RC,MAAM,KAAK,cAAc;QACvB,OAAO;YACL,wBAAwB,EAAE,oBAAoB;SAC/C,CAAA;IACH,CAAC;IAQD,IAAI,OAAO;QACT,OAAO;YACL,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,0BAA0B,CAAC;YAC5C,IAAI,EAAE,6BAA6B;YACnC,OAAO,EAAE;gCAEL,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,EAC/B,MAAM,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,IACxC,kBAAkB,CAAC,IAAI;gCAG1B,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC,EACjC,MAAM,EAAE,IAAI,CAAC,mBAAmB,CAAC,IAAI,CAAC,IAAI,CAAC,IACxC,kBAAkB,CAAC,MAAM;aAE/B;YACD,UAAU,EAAE;gBACV,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,0BAA0B,CAAC;gBAC3C,IAAI,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC;aACpC;YACD,UAAU,EAAE;gBACV,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC;aACvC;SACF,CAAA;IACH,CAAC;IAED,MAAM;QACJ,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAA;QAE9D,OAAO,IAAI,CAAA;wBACS,IAAI,YAAY,IAAI,CAAC,WAAW,kBAAkB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC;;;;;;;;;uBAS/E,CAAC,CAAC,EAAE;YACX,MAAM,MAAM,GAAG,CAAC,CAAC,aAAa,CAAA;YAC9B,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC;gBACvB,KAAK,EAAE,CAAC;gBACR,GAAG,EAAE,MAAM,CAAC,SAAS,GAAG,MAAM,CAAC,YAAY;aAC5C,CAAC,CAAA;QACJ,CAAC;;;;;;;;;+BASgB,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,YAAY,IAAI,IAAI,MAAM;+BACpD,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,YAAY,IAAI,IAAI,MAAM;+BACpD,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,YAAY,IAAI,IAAI,MAAM;;;;KAI9E,CAAA;IACH,CAAC;IAED,KAAK,CAAC,eAAe,CAAC,SAAc;QAClC,IAAI,CAAC,WAAW,GAAG;YACjB,IAAI,EAAE;gBACJ,MAAM,EAAE,CAAC,MAAM,EAAE,aAAa,CAAC;gBAC/B,OAAO,EAAE,CAAC,QAAQ,EAAE,WAAW,CAAC;aACjC;YACD,OAAO,EAAE;gBACP,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,UAAU,EAAE;gBAC1C,EAAE,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAE,cAAc,EAAE,QAAQ,EAAE,IAAI,EAAE;gBAC9D;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,MAAM;oBACZ,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,YAAY,CAAC;oBAC/B,MAAM,EAAE;wBACN,QAAQ,EAAE,IAAI;qBACf;oBACD,MAAM,EAAE,QAAQ;oBAChB,QAAQ,EAAE,IAAI;oBACd,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,QAAQ;oBACd,IAAI,EAAE,aAAa;oBACnB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC;oBACtC,MAAM,EAAE;wBACN,QAAQ,EAAE,IAAI;qBACf;oBACD,MAAM,EAAE,QAAQ;oBAChB,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,QAAQ;oBACd,KAAK,EAAE,IAAI;oBACX,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC;oBACjC,MAAM,EAAE;wBACN,QAAQ,EAAE,IAAI;qBACf;oBACD,MAAM,EAAE,IAAI;oBACZ,QAAQ,EAAE,IAAI;oBACd,KAAK,EAAE,EAAE;iBACV;gBACD;oBACE,IAAI,EAAE,iBAAiB;oBACvB,IAAI,EAAE,SAAS;oBACf,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,eAAe,CAAC;oBAClC,MAAM,EAAE;wBACN,QAAQ,EAAE,KAAK;qBAChB;oBACD,QAAQ,EAAE,IAAI;oBACd,KAAK,EAAE,GAAG;iBACX;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,IAAI,EAAE,WAAW;oBACjB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,kBAAkB,CAAC;oBACrC,MAAM,EAAE;wBACN,QAAQ,EAAE,KAAK;qBAChB;oBACD,QAAQ,EAAE,IAAI;oBACd,KAAK,EAAE,GAAG;iBACX;aACF;YACD,IAAI,EAAE;gBACJ,UAAU,EAAE;oBACV,QAAQ,EAAE,IAAI;iBACf;aACF;YACD,OAAO,EAAE;gBACP;oBACE,IAAI,EAAE,MAAM;iBACb;aACF;SACF,CAAA;IACH,CAAC;IAED,KAAK,CAAC,WAAW,CAAC,OAAY,EAAE,SAAc;QAC5C,IAAI,IAAI,CAAC,MAAM,EAAE;YACf,yDAAyD;SAC1D;IACH,CAAC;IAED,KAAK,CAAC,YAAY,CAAC,EAAE,IAAI,GAAG,CAAC,EAAE,KAAK,GAAG,GAAG,EAAE,QAAQ,GAAG,EAAE,EAAE,OAAO,GAAG,EAAE,EAAe;QACpF,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;OAiBT;YACD,SAAS,EAAE;gBACT,OAAO;gBACP,UAAU,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE;gBAC3B,QAAQ;aACT;SACF,CAAC,CAAA;QAEF,OAAO;YACL,KAAK,EAAE,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,IAAI,CAAC;YACzC,OAAO,EAAE,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,IAAI,EAAE;SAC7C,CAAA;IACH,CAAC;IAED,KAAK,CAAC,mBAAmB;QACvB,IAAI,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,gBAAgB,EAAE,EAAE,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE;YACzE,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA;YACxD,IAAI,GAAG,IAAI,GAAG,CAAC,MAAM,GAAG,CAAC,EAAE;gBACzB,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;oBACnC,QAAQ,EAAE,GAAG,CAAA;;;;WAIZ;oBACD,SAAS,EAAE;wBACT,GAAG;qBACJ;iBACF,CAAC,CAAA;gBAEF,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE;oBACpB,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;oBAClB,MAAM,CAAC;wBACL,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,0BAA0B,EAAE,EAAE,CAAC,EAAE,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,EAAE,CAAC;qBAChF,CAAC,CAAA;iBACH;aACF;SACF;IACH,CAAC;IAED,KAAK,CAAC,mBAAmB;QACvB,IAAI,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAA;QACrC,IAAI,OAAO,IAAI,OAAO,CAAC,MAAM,EAAE;YAC7B,OAAO,GAAG,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;gBAC5B,IAAI,UAAU,GAAQ,KAAK,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,EAAE,CAAA;gBACtD,MAAM,WAAW,GAAG,KAAK,CAAC,eAAe,CAAA;gBACzC,KAAK,IAAI,GAAG,IAAI,WAAW,EAAE;oBAC3B,UAAU,CAAC,GAAG,CAAC,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC,KAAK,CAAA;iBACzC;gBACD,UAAU,CAAC,MAAM,GAAG,KAAK,CAAC,SAAS,CAAA;gBAEnC,OAAO,UAAU,CAAA;YACnB,CAAC,CAAC,CAAA;YAEF,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;gBACnC,QAAQ,EAAE,GAAG,CAAA;;;;;;SAMZ;gBACD,SAAS,EAAE;oBACT,OAAO;iBACR;aACF,CAAC,CAAA;YAEF,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE;gBACpB,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;aACnB;SACF;IACH,CAAC;IAED,KAAK,CAAC,aAAa;QACjB,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,OAAO,CAAA;QACrG,MAAM,cAAc,GAAG,IAAI,GAAG,CAAC,CAAC,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,QAAQ,CAAC,CAAC,CAAA;QAEvE,OAAO,aAAa,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE;YACtC,IAAI,OAAO,GAAG,EAAE,CAAA;YAChB,KAAK,MAAM,KAAK,IAAI,cAAc,EAAE;gBAClC,OAAO,CAAC,KAAK,CAAC,GAAG,YAAY,CAAC,KAAK,CAAC,CAAA;aACrC;YAED,OAAO,OAAO,CAAA;QAChB,CAAC,CAAC,CAAA;IACJ,CAAC;IAED,KAAK,CAAC,aAAa,CAAC,OAAO;QACzB,MAAM,KAAK,GAAG,SAAS,CACrB,IAAI,CAAA;;2BAEiB,OAAO;sBACZ,GAAG,EAAE;YACf,OAAO,CAAC,IAAI,EAAE,CAAA;YACd,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;QACpB,CAAC;;OAEJ,EACD;YACE,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC,4BAA4B,CAAC;SAC/C,CACF,CAAA;QAED,KAAK,CAAC,QAAQ,GAAG,GAAG,EAAE;YACpB,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE,CAAA;QACpB,CAAC,CAAA;IACH,CAAC;;AA/SM,2BAAM,GAAG;IACd,eAAe;IACf,iBAAiB;IACjB,GAAG,CAAA;;;;;;;;;;;;;;KAcF;CACF,CAAA;AAQD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;yDAAiB;AAC5C;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;kDAAoE;AAE/F;IAAC,KAAK,CAAC,UAAU,CAAC;8BAAiB,SAAS;mDAAA;AAC5C;IAAC,KAAK,CAAC,iBAAiB,CAAC;8BAA0B,OAAO;4DAAA;AA/B/C,oBAAoB;IADhC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,oBAAoB,CAiThC;SAjTY,oBAAoB","sourcesContent":["import '@operato/data-grist'\n\nimport { CommonButtonStyles, CommonGristStyles, ScrollbarStyles } from '@operato/styles'\nimport { PageView, store } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { ColumnConfig, DataGrist, FetchOption, SortersControl } from '@operato/data-grist'\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { notify, openPopup } from '@operato/layout'\nimport { OxPopup } from '@operato/popup'\nimport { isMobileDevice } from '@operato/utils'\n\nimport { connect } from 'pwa-helpers/connect-mixin'\nimport gql from 'graphql-tag'\n\nimport { Oauth2ClientImporter } from './oauth2-client-importer'\n\n@customElement('oauth2-client-list-page')\nexport class Oauth2ClientListPage extends connect(store)(localize(i18next)(ScopedElementsMixin(PageView))) {\n static styles = [\n ScrollbarStyles,\n CommonGristStyles,\n css`\n :host {\n display: flex;\n\n width: 100%;\n\n --grid-record-emphasized-background-color: #8b0000;\n --grid-record-emphasized-color: #ff6b6b;\n }\n\n ox-grist {\n overflow-y: auto;\n flex: 1;\n }\n `\n ]\n\n static get scopedElements() {\n return {\n 'oauth2-client-importer': Oauth2ClientImporter\n }\n }\n\n @property({ type: Object }) gristConfig: any\n @property({ type: String }) mode: 'CARD' | 'GRID' | 'LIST' = isMobileDevice() ? 'CARD' : 'GRID'\n\n @query('ox-grist') private grist!: DataGrist\n @query('#sorter-control') private sortersControl!: OxPopup\n\n get context() {\n return {\n title: i18next.t('title.oauth2-client list'),\n help: 'oauth2-client/oauth2-client',\n actions: [\n {\n title: i18next.t('button.save'),\n action: this._updateOauth2Client.bind(this),\n ...CommonButtonStyles.save\n },\n {\n title: i18next.t('button.delete'),\n action: this._deleteOauth2Client.bind(this),\n ...CommonButtonStyles.delete\n }\n ],\n exportable: {\n name: i18next.t('title.oauth2-client list'),\n data: this.exportHandler.bind(this)\n },\n importable: {\n handler: this.importHandler.bind(this)\n }\n }\n }\n\n render() {\n const mode = this.mode || (isMobileDevice() ? 'CARD' : 'GRID')\n\n return html`\n <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>\n <div slot=\"headroom\">\n <div id=\"filters\">\n <ox-filters-form autofocus></ox-filters-form>\n </div>\n\n <div id=\"sorters\">\n Sort\n <mwc-icon\n @click=${e => {\n const target = e.currentTarget\n this.sortersControl.open({\n right: 0,\n top: target.offsetTop + target.offsetHeight\n })\n }}\n >expand_more</mwc-icon\n >\n <ox-popup id=\"sorter-control\">\n <ox-sorters-control> </ox-sorters-control>\n </ox-popup>\n </div>\n\n <div id=\"modes\">\n <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</mwc-icon>\n <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</mwc-icon>\n <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>\n </div>\n </div>\n </ox-grist>\n `\n }\n\n async pageInitialized(lifecycle: any) {\n this.gristConfig = {\n list: {\n fields: ['name', 'description'],\n details: ['active', 'updatedAt']\n },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n record: {\n editable: true\n },\n filter: 'search',\n sortable: true,\n width: 150\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n record: {\n editable: true\n },\n filter: 'search',\n width: 200\n },\n {\n type: 'checkbox',\n name: 'active',\n label: true,\n header: i18next.t('field.active'),\n record: {\n editable: true\n },\n filter: true,\n sortable: true,\n width: 60\n },\n {\n type: 'resource-object',\n name: 'updater',\n header: i18next.t('field.updater'),\n record: {\n editable: false\n },\n sortable: true,\n width: 120\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: i18next.t('field.updated_at'),\n record: {\n editable: false\n },\n sortable: true,\n width: 180\n }\n ],\n rows: {\n selectable: {\n multiple: true\n }\n },\n sorters: [\n {\n name: 'name'\n }\n ]\n }\n }\n\n async pageUpdated(changes: any, lifecycle: any) {\n if (this.active) {\n // do something here when this page just became as active\n }\n }\n\n async fetchHandler({ page = 1, limit = 100, sortings = [], filters = [] }: FetchOption) {\n const response = await client.query({\n query: gql`\n query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {\n responses: oauth2Clients(filters: $filters, pagination: $pagination, sortings: $sortings) {\n items {\n id\n name\n description\n active\n updater {\n id\n name\n }\n updatedAt\n }\n total\n }\n }\n `,\n variables: {\n filters,\n pagination: { page, limit },\n sortings\n }\n })\n\n return {\n total: response.data.responses.total || 0,\n records: response.data.responses.items || []\n }\n }\n\n async _deleteOauth2Client() {\n if (confirm(i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }))) {\n const ids = this.grist.selected.map(record => record.id)\n if (ids && ids.length > 0) {\n const response = await client.mutate({\n mutation: gql`\n mutation ($ids: [String!]!) {\n deleteOauth2Clients(ids: $ids)\n }\n `,\n variables: {\n ids\n }\n })\n\n if (!response.errors) {\n this.grist.fetch()\n notify({\n message: i18next.t('text.info_x_successfully', { x: i18next.t('text.delete') })\n })\n }\n }\n }\n }\n\n async _updateOauth2Client() {\n let patches = this.grist.dirtyRecords\n if (patches && patches.length) {\n patches = patches.map(patch => {\n let patchField: any = patch.id ? { id: patch.id } : {}\n const dirtyFields = patch.__dirtyfields__\n for (let key in dirtyFields) {\n patchField[key] = dirtyFields[key].after\n }\n patchField.cuFlag = patch.__dirty__\n\n return patchField\n })\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($patches: [Oauth2ClientPatch!]!) {\n updateMultipleOauth2Client(patches: $patches) {\n name\n }\n }\n `,\n variables: {\n patches\n }\n })\n\n if (!response.errors) {\n this.grist.fetch()\n }\n }\n }\n\n async exportHandler() {\n const exportTargets = this.grist.selected.length ? this.grist.selected : this.grist.dirtyData.records\n const targetFieldSet = new Set(['id', 'name', 'description', 'active'])\n\n return exportTargets.map(oauth2Client => {\n let tempObj = {}\n for (const field of targetFieldSet) {\n tempObj[field] = oauth2Client[field]\n }\n\n return tempObj\n })\n }\n\n async importHandler(records) {\n const popup = openPopup(\n html`\n <oauth2-client-importer\n .oauth2Clients=${records}\n @imported=${() => {\n history.back()\n this.grist.fetch()\n }}\n ></oauth2-client-importer>\n `,\n {\n backdrop: true,\n size: 'large',\n title: i18next.t('title.import oauth2-client')\n }\n )\n\n popup.onclosed = () => {\n this.grist.fetch()\n }\n }\n}\n"]}
1
+ {"version":3,"file":"oauth2-client-list-page.js","sourceRoot":"","sources":["../../../client/pages/oauth2-client/oauth2-client-list-page.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/data-grist'\n\nimport { CommonButtonStyles, CommonGristStyles, ScrollbarStyles } from '@operato/styles'\nimport { PageView, store } from '@operato/shell'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { ColumnConfig, DataGrist, FetchOption, SortersControl } from '@operato/data-grist'\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { notify, openPopup } from '@operato/layout'\nimport { OxPopup } from '@operato/popup'\nimport { isMobileDevice } from '@operato/utils'\n\nimport { connect } from 'pwa-helpers/connect-mixin'\nimport gql from 'graphql-tag'\n\nimport { Oauth2ClientImporter } from './oauth2-client-importer'\n\n@customElement('oauth2-client-list-page')\nexport class Oauth2ClientListPage extends connect(store)(localize(i18next)(ScopedElementsMixin(PageView))) {\n static styles = [\n ScrollbarStyles,\n CommonGristStyles,\n css`\n :host {\n display: flex;\n\n width: 100%;\n\n --grid-record-emphasized-background-color: #8b0000;\n --grid-record-emphasized-color: #ff6b6b;\n }\n\n ox-grist {\n overflow-y: auto;\n flex: 1;\n }\n `\n ]\n\n static get scopedElements() {\n return {\n 'oauth2-client-importer': Oauth2ClientImporter\n }\n }\n\n @property({ type: Object }) gristConfig: any\n @property({ type: String }) mode: 'CARD' | 'GRID' | 'LIST' = isMobileDevice() ? 'CARD' : 'GRID'\n\n @query('ox-grist') private grist!: DataGrist\n @query('#sorter-control') private sortersControl!: OxPopup\n\n get context() {\n return {\n title: i18next.t('title.oauth2-client list'),\n help: 'oauth2-client/oauth2-client',\n actions: [\n {\n title: i18next.t('button.save'),\n action: this._updateOauth2Client.bind(this),\n ...CommonButtonStyles.save\n },\n {\n title: i18next.t('button.delete'),\n action: this._deleteOauth2Client.bind(this),\n ...CommonButtonStyles.delete\n }\n ],\n exportable: {\n name: i18next.t('title.oauth2-client list'),\n data: this.exportHandler.bind(this)\n },\n importable: {\n handler: this.importHandler.bind(this)\n }\n }\n }\n\n render() {\n const mode = this.mode || (isMobileDevice() ? 'CARD' : 'GRID')\n\n return html`\n <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>\n <div slot=\"headroom\">\n <div id=\"filters\">\n <ox-filters-form autofocus></ox-filters-form>\n </div>\n\n <div id=\"sorters\">\n Sort\n <md-icon\n @click=${e => {\n const target = e.currentTarget\n this.sortersControl.open({\n right: 0,\n top: target.offsetTop + target.offsetHeight\n })\n }}\n >expand_more</md-icon\n >\n <ox-popup id=\"sorter-control\">\n <ox-sorters-control> </ox-sorters-control>\n </ox-popup>\n </div>\n\n <div id=\"modes\">\n <md-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</md-icon>\n <md-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</md-icon>\n <md-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</md-icon>\n </div>\n </div>\n </div>\n </ox-grist>\n `\n }\n\n async pageInitialized(lifecycle: any) {\n this.gristConfig = {\n list: {\n fields: ['name', 'description'],\n details: ['active', 'updatedAt']\n },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'string',\n name: 'name',\n header: i18next.t('field.name'),\n record: {\n editable: true\n },\n filter: 'search',\n sortable: true,\n width: 150\n },\n {\n type: 'string',\n name: 'description',\n header: i18next.t('field.description'),\n record: {\n editable: true\n },\n filter: 'search',\n width: 200\n },\n {\n type: 'checkbox',\n name: 'active',\n label: true,\n header: i18next.t('field.active'),\n record: {\n editable: true\n },\n filter: true,\n sortable: true,\n width: 60\n },\n {\n type: 'resource-object',\n name: 'updater',\n header: i18next.t('field.updater'),\n record: {\n editable: false\n },\n sortable: true,\n width: 120\n },\n {\n type: 'datetime',\n name: 'updatedAt',\n header: i18next.t('field.updated_at'),\n record: {\n editable: false\n },\n sortable: true,\n width: 180\n }\n ],\n rows: {\n selectable: {\n multiple: true\n }\n },\n sorters: [\n {\n name: 'name'\n }\n ]\n }\n }\n\n async pageUpdated(changes: any, lifecycle: any) {\n if (this.active) {\n // do something here when this page just became as active\n }\n }\n\n async fetchHandler({ page = 1, limit = 100, sortings = [], filters = [] }: FetchOption) {\n const response = await client.query({\n query: gql`\n query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {\n responses: oauth2Clients(filters: $filters, pagination: $pagination, sortings: $sortings) {\n items {\n id\n name\n description\n active\n updater {\n id\n name\n }\n updatedAt\n }\n total\n }\n }\n `,\n variables: {\n filters,\n pagination: { page, limit },\n sortings\n }\n })\n\n return {\n total: response.data.responses.total || 0,\n records: response.data.responses.items || []\n }\n }\n\n async _deleteOauth2Client() {\n if (confirm(i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }))) {\n const ids = this.grist.selected.map(record => record.id)\n if (ids && ids.length > 0) {\n const response = await client.mutate({\n mutation: gql`\n mutation ($ids: [String!]!) {\n deleteOauth2Clients(ids: $ids)\n }\n `,\n variables: {\n ids\n }\n })\n\n if (!response.errors) {\n this.grist.fetch()\n notify({\n message: i18next.t('text.info_x_successfully', { x: i18next.t('text.delete') })\n })\n }\n }\n }\n }\n\n async _updateOauth2Client() {\n let patches = this.grist.dirtyRecords\n if (patches && patches.length) {\n patches = patches.map(patch => {\n let patchField: any = patch.id ? { id: patch.id } : {}\n const dirtyFields = patch.__dirtyfields__\n for (let key in dirtyFields) {\n patchField[key] = dirtyFields[key].after\n }\n patchField.cuFlag = patch.__dirty__\n\n return patchField\n })\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($patches: [Oauth2ClientPatch!]!) {\n updateMultipleOauth2Client(patches: $patches) {\n name\n }\n }\n `,\n variables: {\n patches\n }\n })\n\n if (!response.errors) {\n this.grist.fetch()\n }\n }\n }\n\n async exportHandler() {\n const exportTargets = this.grist.selected.length ? this.grist.selected : this.grist.dirtyData.records\n const targetFieldSet = new Set(['id', 'name', 'description', 'active'])\n\n return exportTargets.map(oauth2Client => {\n let tempObj = {}\n for (const field of targetFieldSet) {\n tempObj[field] = oauth2Client[field]\n }\n\n return tempObj\n })\n }\n\n async importHandler(records) {\n const popup = openPopup(\n html`\n <oauth2-client-importer\n .oauth2Clients=${records}\n @imported=${() => {\n history.back()\n this.grist.fetch()\n }}\n ></oauth2-client-importer>\n `,\n {\n backdrop: true,\n size: 'large',\n title: i18next.t('title.import oauth2-client')\n }\n )\n\n popup.onclosed = () => {\n this.grist.fetch()\n }\n }\n}\n"]}
@@ -14,7 +14,7 @@ export declare class Oauth2ClientRegister extends Oauth2ClientRegister_base {
14
14
  get context(): {
15
15
  title: string;
16
16
  };
17
- render(): import("lit-html").TemplateResult<1>;
17
+ render(): import("lit").TemplateResult<1>;
18
18
  createOauth2Client(e: any): Promise<void>;
19
19
  pageUpdated(changes: any, lifecycle: any, before: any): Promise<void>;
20
20
  }
@@ -100,7 +100,7 @@ Oauth2ClientRegister.styles = [
100
100
  :host {
101
101
  display: flex;
102
102
  flex-direction: column;
103
- background-color: var(--main-section-background-color);
103
+ background-color: var(--md-sys-color-background);
104
104
  padding: var(--padding-wide);
105
105
 
106
106
  position: relative;
@@ -1 +1 @@
1
- {"version":3,"file":"oauth2-client-register.js","sourceRoot":"","sources":["../../client/pages/oauth2-client-register.ts"],"names":[],"mappings":"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","sourcesContent":["import gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { client } from '@operato/graphql'\nimport { notify } from '@operato/layout'\nimport { navigate, PageView, store } from '@operato/shell'\n\n@customElement('oauth2-client-register')\nexport class Oauth2ClientRegister extends connect(store)(PageView) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n background-color: var(--main-section-background-color);\n padding: var(--padding-wide);\n\n position: relative;\n\n overflow: auto;\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 [icon] {\n position: absolute;\n top: 10px;\n right: 10px;\n\n max-width: 80px;\n }\n [icon] img {\n max-width: 100%;\n max-height: 100%;\n }\n\n :host * {\n display: block;\n }\n label {\n font: var(--label-font);\n color: var(--label-color);\n text-transform: var(--label-text-transform);\n }\n input,\n select {\n border: var(--border-dark-color);\n border-radius: var(--border-radius);\n margin: var(--input-margin);\n padding: var(--input-padding);\n font: var(--input-font);\n\n flex: 1;\n }\n select:focus,\n input:focus {\n outline: none;\n }\n\n [field-2column] {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-gap: 15px;\n }\n [field] {\n display: flex;\n flex-direction: column;\n }\n [grid-span] {\n grid-column: span 2;\n }\n @media screen and (max-width: 480px) {\n [field] {\n grid-column: span 2;\n }\n }\n `\n ]\n\n @property({ type: Object }) application: any\n @property({ type: String }) _icon?: string\n\n @query('form') form!: HTMLFormElement\n\n get context() {\n return {\n title: `oauth2 client registration`\n }\n }\n\n render() {\n return html`\n <h2>Register new oauth2 client</h2>\n <p page-description>You can register new oauth2 client here</p>\n\n ${this._icon\n ? html`\n <div icon>\n <img src=${this._icon} />\n </div>\n `\n : html``}\n\n <form>\n <div field-2column>\n <div field grid-span>\n <label for=\"name\">name</label>\n <input type=\"text\" id=\"name\" name=\"name\" />\n </div>\n\n <div field grid-span>\n <label for=\"description\">description</label>\n <input type=\"text\" id=\"description\" name=\"description\" />\n </div>\n\n <div field grid-span>\n <label for=\"icon\">icon</label>\n <input type=\"text\" id=\"icon\" name=\"icon\" @change=${e => (this._icon = e.target.value)} />\n </div>\n\n <div field grid-span>\n <label for=\"client-id\">client id</label>\n <input type=\"text\" id=\"client-id\" name=\"clientId\" />\n The client identifier issued to the client during the application registration process.\n </div>\n\n <div field grid-span>\n <label for=\"client-secret\">client secret</label>\n <input type=\"text\" id=\"client-secret\" name=\"clientSecret\" />\n The client secret issued to the client during the application registration process.\n </div>\n </div>\n\n <mwc-button raised @click=${this.createOauth2Client.bind(this)}>register</mwc-button>\n </form>\n `\n }\n\n async createOauth2Client(e) {\n e.preventDefault()\n\n const formData = new FormData(this.form)\n\n const oauth2Client = Array.from(formData.entries()).reduce((oauth2Client, [key, value]) => {\n oauth2Client[key] = value\n return oauth2Client\n }, {})\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($oauth2Client: NewOauth2Client!) {\n createOauth2Client(oauth2Client: $oauth2Client) {\n id\n }\n }\n `,\n variables: {\n oauth2Client\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'create oauth2 client fail'\n })\n } else {\n const id = response.data.createOauth2Client.id\n navigate(`oauth2-client/${id}`)\n }\n }\n\n async pageUpdated(changes, lifecycle, before) {\n if (this.active) {\n this.form.reset()\n }\n }\n}\n"]}
1
+ {"version":3,"file":"oauth2-client-register.js","sourceRoot":"","sources":["../../client/pages/oauth2-client-register.ts"],"names":[],"mappings":"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","sourcesContent":["import gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { client } from '@operato/graphql'\nimport { notify } from '@operato/layout'\nimport { navigate, PageView, store } from '@operato/shell'\n\n@customElement('oauth2-client-register')\nexport class Oauth2ClientRegister extends connect(store)(PageView) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n background-color: var(--md-sys-color-background);\n padding: var(--padding-wide);\n\n position: relative;\n\n overflow: auto;\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 [icon] {\n position: absolute;\n top: 10px;\n right: 10px;\n\n max-width: 80px;\n }\n [icon] img {\n max-width: 100%;\n max-height: 100%;\n }\n\n :host * {\n display: block;\n }\n label {\n font: var(--label-font);\n color: var(--label-color);\n text-transform: var(--label-text-transform);\n }\n input,\n select {\n border: var(--border-dark-color);\n border-radius: var(--border-radius);\n margin: var(--input-margin);\n padding: var(--input-padding);\n font: var(--input-font);\n\n flex: 1;\n }\n select:focus,\n input:focus {\n outline: none;\n }\n\n [field-2column] {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-gap: 15px;\n }\n [field] {\n display: flex;\n flex-direction: column;\n }\n [grid-span] {\n grid-column: span 2;\n }\n @media screen and (max-width: 480px) {\n [field] {\n grid-column: span 2;\n }\n }\n `\n ]\n\n @property({ type: Object }) application: any\n @property({ type: String }) _icon?: string\n\n @query('form') form!: HTMLFormElement\n\n get context() {\n return {\n title: `oauth2 client registration`\n }\n }\n\n render() {\n return html`\n <h2>Register new oauth2 client</h2>\n <p page-description>You can register new oauth2 client here</p>\n\n ${this._icon\n ? html`\n <div icon>\n <img src=${this._icon} />\n </div>\n `\n : html``}\n\n <form>\n <div field-2column>\n <div field grid-span>\n <label for=\"name\">name</label>\n <input type=\"text\" id=\"name\" name=\"name\" />\n </div>\n\n <div field grid-span>\n <label for=\"description\">description</label>\n <input type=\"text\" id=\"description\" name=\"description\" />\n </div>\n\n <div field grid-span>\n <label for=\"icon\">icon</label>\n <input type=\"text\" id=\"icon\" name=\"icon\" @change=${e => (this._icon = e.target.value)} />\n </div>\n\n <div field grid-span>\n <label for=\"client-id\">client id</label>\n <input type=\"text\" id=\"client-id\" name=\"clientId\" />\n The client identifier issued to the client during the application registration process.\n </div>\n\n <div field grid-span>\n <label for=\"client-secret\">client secret</label>\n <input type=\"text\" id=\"client-secret\" name=\"clientSecret\" />\n The client secret issued to the client during the application registration process.\n </div>\n </div>\n\n <mwc-button raised @click=${this.createOauth2Client.bind(this)}>register</mwc-button>\n </form>\n `\n }\n\n async createOauth2Client(e) {\n e.preventDefault()\n\n const formData = new FormData(this.form)\n\n const oauth2Client = Array.from(formData.entries()).reduce((oauth2Client, [key, value]) => {\n oauth2Client[key] = value\n return oauth2Client\n }, {})\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($oauth2Client: NewOauth2Client!) {\n createOauth2Client(oauth2Client: $oauth2Client) {\n id\n }\n }\n `,\n variables: {\n oauth2Client\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'create oauth2 client fail'\n })\n } else {\n const id = response.data.createOauth2Client.id\n navigate(`oauth2-client/${id}`)\n }\n }\n\n async pageUpdated(changes, lifecycle, before) {\n if (this.active) {\n this.form.reset()\n }\n }\n}\n"]}
@@ -1,3 +1,4 @@
1
+ import '@material/web/icon/icon.js';
1
2
  import '@operato/help/ox-help-icon.js';
2
3
  import { PageView } from '@operato/shell';
3
4
  declare const Oauth2Client_base: (new (...args: any[]) => {
@@ -21,7 +22,7 @@ export declare class Oauth2Client extends Oauth2Client_base {
21
22
  text: any;
22
23
  };
23
24
  };
24
- render(): import("lit-html").TemplateResult<1>;
25
+ render(): import("lit").TemplateResult<1>;
25
26
  updated(changes: any): void;
26
27
  firstUpdated(): void;
27
28
  pageUpdated(changes: any, lifecycle: any, before: any): Promise<void>;
@@ -1,4 +1,5 @@
1
1
  import { __asyncGenerator, __await, __decorate, __metadata } from "tslib";
2
+ import '@material/web/icon/icon.js';
2
3
  import '@operato/help/ox-help-icon.js';
3
4
  import Clipboard from 'clipboard';
4
5
  import gql from 'graphql-tag';
@@ -49,7 +50,7 @@ let Oauth2Client = class Oauth2Client extends connect(store)(PageView) {
49
50
  var oauth2Client = this.oauth2Client || {};
50
51
  return html `
51
52
  <div>
52
- <h2><mwc-icon>apps</mwc-icon>&nbsp;${oauth2Client.name || ''}</h2>
53
+ <h2><md-icon>apps</md-icon>&nbsp;${oauth2Client.name || ''}</h2>
53
54
  <p page-description>${oauth2Client.description || ''}</p>
54
55
  </div>
55
56
 
@@ -427,7 +428,7 @@ Oauth2Client.styles = [
427
428
  overflow-y: auto;
428
429
  position: relative;
429
430
 
430
- background-color: var(--main-section-background-color);
431
+ background-color: var(--md-sys-color-background);
431
432
  padding: var(--padding-wide);
432
433
  }
433
434
  h2 {
@@ -1 +1 @@
1
- {"version":3,"file":"oauth2-client.js","sourceRoot":"","sources":["../../client/pages/oauth2-client.ts"],"names":[],"mappings":"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","sourcesContent":["import '@operato/help/ox-help-icon.js'\n\nimport Clipboard from 'clipboard'\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, property, query, queryAll } from 'lit/decorators.js'\nimport { asyncReplace } from 'lit/directives/async-replace.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { client } from '@operato/graphql'\nimport { notify } from '@operato/layout'\nimport { navigate, PageView, store } from '@operato/shell'\nimport { sleep } from '@operato/utils'\n\nconst OAUTH2CLIENT = `\nid\nname\ndescription\nicon\ngrantType\nclientId\nclientSecret\ncallbackUrl\nauthUrl\naccessTokenUrl\nwebhook\nusername\npassword\ncodeChallengeMethod\ncodeVerifier\nscopes\naccessToken\nrefreshToken\njwtToken\nexpires\ntokenType\nupdatedAt\ncreatedAt\n`\n\n@customElement('oauth2-client')\nexport class Oauth2Client extends connect(store)(PageView) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n position: relative;\n\n background-color: var(--main-section-background-color);\n padding: var(--padding-wide);\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 [icon] {\n position: absolute;\n top: 10px;\n right: 10px;\n max-width: 80px;\n }\n [icon] img {\n max-width: 100%;\n max-height: 100%;\n }\n\n [button-primary] {\n background-color: var(--button-primary-background-color);\n border: var(--button-border);\n border-radius: var(--button-border-radius);\n margin: var(--button-margin);\n padding: var(--button-primary-padding);\n color: var(--button-primary-color);\n font: var(--button-primary-font);\n text-transform: var(--button-text-transform);\n\n text-decoration: none;\n }\n [button-primary]:hover {\n background-color: var(--button-primary-active-background-color);\n box-shadow: var(--button-active-box-shadow);\n }\n label {\n font: var(--label-font);\n color: var(--label-color);\n text-transform: var(--label-text-transform);\n }\n input,\n select {\n border: var(--border-dark-color);\n border-radius: var(--border-radius);\n margin: var(--input-margin);\n padding: var(--input-padding);\n font: var(--input-font);\n\n flex: 1;\n }\n select:focus,\n input:focus,\n button {\n outline: none;\n }\n form {\n max-width: var(--content-container-max-width);\n }\n [fieldset-container] {\n background-color: var(--theme-white-color);\n margin: var(--margin-wide) 0 var(--margin-default) 0;\n padding: var(--padding-default);\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow);\n }\n [fieldset-container] fieldset {\n margin: 0;\n margin-top: -15px;\n }\n fieldset {\n border-radius: var(--border-radius);\n border: var(--border-dark-color);\n margin: var(--fieldset-margin);\n padding: var(--fieldset-padding);\n }\n legend {\n padding: var(--legend-padding);\n font-weight: bold;\n color: var(--legend-color);\n }\n [field-2column] {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-gap: 15px;\n }\n [field] {\n display: flex;\n flex-direction: column;\n position: relative;\n }\n [grid-span] {\n grid-column: span 2;\n }\n button,\n input[type='submit'],\n [button-in-field] {\n background-color: var(--button-background-color);\n border: var(--button-border);\n border-radius: var(--button-border-radius);\n padding: var(--button-padding);\n color: var(--button-color);\n font: var(--button-font);\n text-transform: var(--button-text-transform);\n\n margin: var(--margin-default) 0 var(--margin-default) var(--margin-default);\n float: right;\n text-decoration: none;\n }\n button:hover,\n input[type='submit']:hover {\n border: var(--button-activ-border);\n box-shadow: var(--button-active-box-shadow);\n }\n [button-in-field] {\n border-radius: 0 var(--button-border-radius) var(--button-border-radius) 0;\n position: absolute;\n top: 12px;\n right: 0;\n max-height: 36px;\n }\n [input-hint] {\n font: var(--input-hint-font);\n color: var(--input-hint-color);\n }\n @media screen and (max-width: 480px) {\n [field] {\n grid-column: span 2;\n }\n }\n `\n ]\n\n @property({ type: Object }) oauth2Client: any\n @property({ type: String }) _grantType?: string\n\n @query('form') form!: HTMLFormElement\n @queryAll('[clipboard-copy]') copybuttons\n\n private clipboard?: Clipboard\n private _icon?: string\n\n get context() {\n return {\n title: {\n icon: 'apps',\n text: this.oauth2Client?.name\n }\n }\n }\n\n render() {\n var oauth2Client = this.oauth2Client || {}\n\n return html`\n <div>\n <h2><mwc-icon>apps</mwc-icon>&nbsp;${oauth2Client.name || ''}</h2>\n <p page-description>${oauth2Client.description || ''}</p>\n </div>\n\n <div icon>\n <img src=${oauth2Client.icon}>\n </div>\n\n <form>\n <div fieldset-container>\n <fieldset>\n <legend>oauth2 client</legend>\n <div field-2column>\n <div field grid-span>\n <label for='name'>name</label>\n <input type='text' id=\"name\" name=\"name\" .value=${oauth2Client.name || ''}>\n </div>\n\n <div field grid-span>\n <label for='description'>description</label>\n <input type='text' id=\"description\" name=\"description\" .value=${oauth2Client.description || ''}>\n </div>\n\n <div field grid-span>\n <label for='icon'>icon</label>\n <input type='text' id=\"icon\" name=\"icon\" \n @change=${e => (this._icon = e.target.value)} \n .value=${oauth2Client.icon || ''}\n >\n </div>\n </div>\n </fieldset>\n </div>\n\n <div fieldset-container>\n <fieldset>\n <legend>authorization</legend>\n <div field-2column>\n <div field grid-span>\n <label for='grant-type'>grant type\n <ox-help-icon topic='/oauth2-client/grant-type'></ox-help-icon>\n </label>\n <select type='text' id=\"grant-type\" name=\"grantType\" .value=${oauth2Client.grantType || 'code'} \n @change=${e => (this._grantType = e.target.value)}>\n <option></option>\n <option value='code'>Authorization Code Grant</option>\n <option value='jwt'>JWT As Authorization Grant</option>\n <option value='owner'>Resource Owner Password Credentials Grant</option>\n <option value='credentials'>Client Credentials Grant</option>\n </select>\n </div>\n\n <div field grid-span>\n <label for='auth-url'>auth url</label>\n <input type='text' id=\"auth-url\" name=\"authUrl\" .value=${oauth2Client.authUrl || ''}>\n <div input-hint>The endpoint for authorization server. This is used to get the authorization code.</div>\n </div>\n\n <div field grid-span>\n <label for='access-token-url'>access token url</label>\n <input type='text' id=\"access-token-url\" name=\"accessTokenUrl\" .value=${\n oauth2Client.accessTokenUrl || ''\n }>\n <div input-hint>The endpoint for authentication server. This is used to exchange the authorization code for an access token.</div>\n </div>\n\n <div field grid-span>\n <label for='callback-url'>callback url</label>\n <input type='text' id=\"callback-url\" name=\"callbackUrl\" .value=${oauth2Client.callbackUrl || ''}>\n <div input-hint>This is the callback url that you will be redirected to, after your application is authorized.\n This is used to extract the authorization code or access token.\n Normally, this callback url should match the one you use during the application registration process.\n If you leave this field empty, default callback url(${\n location.origin\n }/oauth2-client/callback</label>) will be used.</div>\n </div>\n \n <div field grid-span>\n <label for='client-id'>client id</label>\n <input type='text' id=\"client-id\" name=\"clientId\" .value=${oauth2Client.clientId || ''}>\n <div input-hint>The client identifier issued to the client during the application registration process.</div>\n </div>\n\n <div field grid-span>\n <label for='client-secret'>client secret</label>\n <input type='text' id=\"client-secret\" name=\"clientSecret\" .value=${oauth2Client.clientSecret || ''}>\n <div input-hint>The client secret issued to the client during the application registration process.</div>\n </div>\n\n ${\n this._grantType == 'owner'\n ? html`\n <div field grid-span>\n <label for=\"username\">user name</label>\n <input type=\"text\" id=\"username\" name=\"username\" .value=${oauth2Client.username || ''} />\n </div>\n\n <div field grid-span>\n <label for=\"password\">password</label>\n <input type=\"password\" id=\"password\" name=\"password\" .value=${oauth2Client.password || ''} />\n </div>\n `\n : html``\n }\n\n ${\n this._grantType == 'jwt'\n ? html`\n <div field grid-span>\n <label for=\"jwt-token\">jwt-token</label>\n <input type=\"text\" id=\"jwt-token\" name=\"jwtToken\" .value=${oauth2Client.jwtToken || ''} />\n <div input-hint>The JWT Bearer Token for JWT As Authorization Grant</div>\n </div>\n `\n : html``\n }\n\n <!-- code PKCE grant type not supported yet\n <div field grid-span>\n <label for='code-challenge-method'>code challenge method</label>\n <select type='text' id=\"code-challenge-method\" name=\"codeChallengeMethod\" .value=${\n oauth2Client.codeChallengeMethod\n }>\n <option></option>\n <option>SHA-256</option>\n <option>Plain</option>\n </select>\n <div input-hint>Algorithm used for generating the code challenge</div>\n </div>\n\n <div field grid-span>\n <label for='code-verifier'>code verifier\n <ox-help-icon topic='/oauth2-client/code-verifier'></ox-help-icon>\n </label>\n <input type='text' id=\"code-verifier\" name=\"codeVerifier\" .value=${oauth2Client.codeVerifier || ''}>\n <div input-hint>A random, 43-128 character string used to connect the authorization request to the token request.\n Uses the following characters: [A-Z]/[a-z]/[0-9]/\"-\"/\".\"/\"_\"/\"~\".</div>\n </div>\n -->\n \n <div field grid-span>\n <label for='scopes'>scopes</label>\n <input type='text' id=\"scopes\" name=\"scopes\" .value=${oauth2Client.scopes || ''}>\n <div input-hint>The scopes of the access request. It may have multiple space-delimited values.</div>\n </div>\n </div>\n </fieldset>\n </div>\n\n <div fieldset-container>\n <fieldset>\n <div field grid-span>\n <label for='token-type'>token type</label>\n <input type='text' id=\"token-type\" .value=${oauth2Client.tokenType || ''} readonly>\n <div input-hint>Added to the authorization header before the access token.</div>\n </div>\n\n <legend>access token</legend>\n <div field-2column>\n <div field grid-span>\n <label for=\"access-token\">access token</label>\n <input id=\"access-token\" type=\"text\" .value=${oauth2Client.accessToken || ''} readonly />\n <button button-in-field clipboard-copy @click=${e => e.preventDefault()}>copy</button>\n ${\n oauth2Client.expires\n ? html`<div input-hint>\n expired in ${new Date(Number(oauth2Client.expires))} :\n ${asyncReplace(this.expTimer(oauth2Client.expires))}\n </div>`\n : html``\n }\n </div>\n\n <div field grid-span>\n <label for=\"refresh-token\">refresh token</label>\n <input id=\"refresh-token\" type=\"text\" .value=${oauth2Client.refreshToken || ''} readonly />\n <button button-in-field clipboard-copy @click=${e => e.preventDefault()}>copy</button>\n </div>\n </div>\n </fieldset>\n </div>\n\n <button @click=${e => this.deleteOauth2Client(e)}>delete this app</button>\n <button @click=${async e => {\n e.preventDefault()\n await this.updateOauth2Client()\n await this.generateOauth2AccessToken()\n }}>get new access token</button>\n <button @click=${async e => {\n e.preventDefault()\n await this.updateOauth2Client()\n await this.refreshOauth2AccessToken()\n }} ?disabled=${!oauth2Client.refreshToken}>refresh access token</button>\n <input type=\"submit\" value=\"update\" @click=${async e => {\n e.preventDefault()\n await this.updateOauth2Client()\n }}>\n </form>\n `\n }\n\n updated(changes) {\n if (changes.has('oauth2Client')) {\n this._grantType = this.oauth2Client?.grantType\n }\n }\n\n firstUpdated() {\n this.clipboard = new Clipboard(this.copybuttons, {\n target: (trigger => trigger.parentElement.querySelector('input')) as any\n })\n }\n\n async pageUpdated(changes, lifecycle, before) {\n if (this.active) {\n await this.fetchOauth2Client()\n }\n }\n\n async *expTimer(exp) {\n const DAY = 24 * 60 * 60\n const HOUR = 60 * 60\n const MIN = 60\n\n while (this.active) {\n var remain = Math.floor((Number(exp) - Date.now()) / 1000)\n const days = Math.floor(remain / DAY)\n remain -= days * DAY\n const hours = Math.floor(remain / HOUR)\n remain -= hours * HOUR\n const mins = Math.floor(remain / MIN)\n const secs = remain - mins * MIN\n\n yield `${days} days ${hours} hours ${mins} mins ${secs} seconds remain`\n\n await sleep(1000)\n }\n }\n\n async fetchOauth2Client() {\n const response = await client.query({\n query: gql`\n query($id: String!) {\n oauth2Client(id: $id) {\n ${OAUTH2CLIENT}\n }\n }\n `,\n variables: {\n id: this.lifecycle.resourceId\n }\n })\n\n this.oauth2Client = response.data.oauth2Client\n }\n\n async updateOauth2Client() {\n const formData = new FormData(this.form)\n\n const patch = Array.from(formData.entries()).reduce((patch, [key, value]) => {\n patch[key] = value\n return patch\n }, {})\n\n const id = this.lifecycle.resourceId\n\n const response = await client.mutate({\n mutation: gql`\n mutation($id: String!, $patch: Oauth2ClientPatch!) {\n updateOauth2Client(id: $id, patch: $patch) {\n ${OAUTH2CLIENT}\n }\n }\n `,\n variables: {\n id,\n patch\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'update oauth2 client fail'\n })\n } else {\n this.oauth2Client = response.data.updateOauth2Client\n }\n }\n\n async deleteOauth2Client(e) {\n e.preventDefault()\n\n const id = this.lifecycle.resourceId\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n deleteOauth2Client(id: $id)\n }\n `,\n variables: {\n id\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'delete oauth2 client fail'\n })\n } else {\n navigate('oauth2-clients')\n }\n }\n\n async generateOauth2AccessToken() {\n const id = this.lifecycle.resourceId\n\n if (this.oauth2Client.grantType == 'code') {\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n getOauth2AuthUrl(id: $id)\n }\n `,\n variables: {\n id: this.lifecycle.resourceId\n }\n })\n\n if (!response.errors) {\n location.href = response.data.getOauth2AuthUrl\n } else {\n notify({\n level: 'error',\n message: 'getting application access token fail'\n })\n }\n } else {\n const response = await client.mutate({\n mutation: gql`\n mutation($id: String!) {\n getOauth2AccessToken(id: $id) {\n ${OAUTH2CLIENT}\n }\n }\n `,\n variables: {\n id: this.lifecycle.resourceId\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'getting application access token fail'\n })\n } else {\n this.oauth2Client = response.data.getOauth2AccessToken\n notify({\n level: 'info',\n message: 'got application access token successfully'\n })\n }\n }\n }\n\n async refreshOauth2AccessToken() {\n const id = this.lifecycle.resourceId\n\n const response = await client.mutate({\n mutation: gql`\n mutation($id: String!) {\n refreshOauth2AccessToken(id: $id) {\n ${OAUTH2CLIENT}\n }\n }\n `,\n variables: {\n id: this.lifecycle.resourceId\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'getting application access token fail'\n })\n } else {\n this.oauth2Client = response.data.refreshOauth2AccessToken\n notify({\n level: 'info',\n message: 'got application access token successfully'\n })\n }\n }\n}\n"]}
1
+ {"version":3,"file":"oauth2-client.js","sourceRoot":"","sources":["../../client/pages/oauth2-client.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\nimport '@operato/help/ox-help-icon.js'\n\nimport Clipboard from 'clipboard'\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, property, query, queryAll } from 'lit/decorators.js'\nimport { asyncReplace } from 'lit/directives/async-replace.js'\nimport { connect } from 'pwa-helpers/connect-mixin.js'\n\nimport { client } from '@operato/graphql'\nimport { notify } from '@operato/layout'\nimport { navigate, PageView, store } from '@operato/shell'\nimport { sleep } from '@operato/utils'\n\nconst OAUTH2CLIENT = `\nid\nname\ndescription\nicon\ngrantType\nclientId\nclientSecret\ncallbackUrl\nauthUrl\naccessTokenUrl\nwebhook\nusername\npassword\ncodeChallengeMethod\ncodeVerifier\nscopes\naccessToken\nrefreshToken\njwtToken\nexpires\ntokenType\nupdatedAt\ncreatedAt\n`\n\n@customElement('oauth2-client')\nexport class Oauth2Client extends connect(store)(PageView) {\n static styles = [\n css`\n :host {\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n position: relative;\n\n background-color: var(--md-sys-color-background);\n padding: var(--padding-wide);\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 [icon] {\n position: absolute;\n top: 10px;\n right: 10px;\n max-width: 80px;\n }\n [icon] img {\n max-width: 100%;\n max-height: 100%;\n }\n\n [button-primary] {\n background-color: var(--button-primary-background-color);\n border: var(--button-border);\n border-radius: var(--button-border-radius);\n margin: var(--button-margin);\n padding: var(--button-primary-padding);\n color: var(--button-primary-color);\n font: var(--button-primary-font);\n text-transform: var(--button-text-transform);\n\n text-decoration: none;\n }\n [button-primary]:hover {\n background-color: var(--button-primary-active-background-color);\n box-shadow: var(--button-active-box-shadow);\n }\n label {\n font: var(--label-font);\n color: var(--label-color);\n text-transform: var(--label-text-transform);\n }\n input,\n select {\n border: var(--border-dark-color);\n border-radius: var(--border-radius);\n margin: var(--input-margin);\n padding: var(--input-padding);\n font: var(--input-font);\n\n flex: 1;\n }\n select:focus,\n input:focus,\n button {\n outline: none;\n }\n form {\n max-width: var(--content-container-max-width);\n }\n [fieldset-container] {\n background-color: var(--theme-white-color);\n margin: var(--margin-wide) 0 var(--margin-default) 0;\n padding: var(--padding-default);\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow);\n }\n [fieldset-container] fieldset {\n margin: 0;\n margin-top: -15px;\n }\n fieldset {\n border-radius: var(--border-radius);\n border: var(--border-dark-color);\n margin: var(--fieldset-margin);\n padding: var(--fieldset-padding);\n }\n legend {\n padding: var(--legend-padding);\n font-weight: bold;\n color: var(--legend-color);\n }\n [field-2column] {\n display: grid;\n grid-template-columns: 1fr 1fr;\n grid-gap: 15px;\n }\n [field] {\n display: flex;\n flex-direction: column;\n position: relative;\n }\n [grid-span] {\n grid-column: span 2;\n }\n button,\n input[type='submit'],\n [button-in-field] {\n background-color: var(--button-background-color);\n border: var(--button-border);\n border-radius: var(--button-border-radius);\n padding: var(--button-padding);\n color: var(--button-color);\n font: var(--button-font);\n text-transform: var(--button-text-transform);\n\n margin: var(--margin-default) 0 var(--margin-default) var(--margin-default);\n float: right;\n text-decoration: none;\n }\n button:hover,\n input[type='submit']:hover {\n border: var(--button-activ-border);\n box-shadow: var(--button-active-box-shadow);\n }\n [button-in-field] {\n border-radius: 0 var(--button-border-radius) var(--button-border-radius) 0;\n position: absolute;\n top: 12px;\n right: 0;\n max-height: 36px;\n }\n [input-hint] {\n font: var(--input-hint-font);\n color: var(--input-hint-color);\n }\n @media screen and (max-width: 480px) {\n [field] {\n grid-column: span 2;\n }\n }\n `\n ]\n\n @property({ type: Object }) oauth2Client: any\n @property({ type: String }) _grantType?: string\n\n @query('form') form!: HTMLFormElement\n @queryAll('[clipboard-copy]') copybuttons\n\n private clipboard?: Clipboard\n private _icon?: string\n\n get context() {\n return {\n title: {\n icon: 'apps',\n text: this.oauth2Client?.name\n }\n }\n }\n\n render() {\n var oauth2Client = this.oauth2Client || {}\n\n return html`\n <div>\n <h2><md-icon>apps</md-icon>&nbsp;${oauth2Client.name || ''}</h2>\n <p page-description>${oauth2Client.description || ''}</p>\n </div>\n\n <div icon>\n <img src=${oauth2Client.icon}>\n </div>\n\n <form>\n <div fieldset-container>\n <fieldset>\n <legend>oauth2 client</legend>\n <div field-2column>\n <div field grid-span>\n <label for='name'>name</label>\n <input type='text' id=\"name\" name=\"name\" .value=${oauth2Client.name || ''}>\n </div>\n\n <div field grid-span>\n <label for='description'>description</label>\n <input type='text' id=\"description\" name=\"description\" .value=${oauth2Client.description || ''}>\n </div>\n\n <div field grid-span>\n <label for='icon'>icon</label>\n <input type='text' id=\"icon\" name=\"icon\" \n @change=${e => (this._icon = e.target.value)} \n .value=${oauth2Client.icon || ''}\n >\n </div>\n </div>\n </fieldset>\n </div>\n\n <div fieldset-container>\n <fieldset>\n <legend>authorization</legend>\n <div field-2column>\n <div field grid-span>\n <label for='grant-type'>grant type\n <ox-help-icon topic='/oauth2-client/grant-type'></ox-help-icon>\n </label>\n <select type='text' id=\"grant-type\" name=\"grantType\" .value=${oauth2Client.grantType || 'code'} \n @change=${e => (this._grantType = e.target.value)}>\n <option></option>\n <option value='code'>Authorization Code Grant</option>\n <option value='jwt'>JWT As Authorization Grant</option>\n <option value='owner'>Resource Owner Password Credentials Grant</option>\n <option value='credentials'>Client Credentials Grant</option>\n </select>\n </div>\n\n <div field grid-span>\n <label for='auth-url'>auth url</label>\n <input type='text' id=\"auth-url\" name=\"authUrl\" .value=${oauth2Client.authUrl || ''}>\n <div input-hint>The endpoint for authorization server. This is used to get the authorization code.</div>\n </div>\n\n <div field grid-span>\n <label for='access-token-url'>access token url</label>\n <input type='text' id=\"access-token-url\" name=\"accessTokenUrl\" .value=${\n oauth2Client.accessTokenUrl || ''\n }>\n <div input-hint>The endpoint for authentication server. This is used to exchange the authorization code for an access token.</div>\n </div>\n\n <div field grid-span>\n <label for='callback-url'>callback url</label>\n <input type='text' id=\"callback-url\" name=\"callbackUrl\" .value=${oauth2Client.callbackUrl || ''}>\n <div input-hint>This is the callback url that you will be redirected to, after your application is authorized.\n This is used to extract the authorization code or access token.\n Normally, this callback url should match the one you use during the application registration process.\n If you leave this field empty, default callback url(${\n location.origin\n }/oauth2-client/callback</label>) will be used.</div>\n </div>\n \n <div field grid-span>\n <label for='client-id'>client id</label>\n <input type='text' id=\"client-id\" name=\"clientId\" .value=${oauth2Client.clientId || ''}>\n <div input-hint>The client identifier issued to the client during the application registration process.</div>\n </div>\n\n <div field grid-span>\n <label for='client-secret'>client secret</label>\n <input type='text' id=\"client-secret\" name=\"clientSecret\" .value=${oauth2Client.clientSecret || ''}>\n <div input-hint>The client secret issued to the client during the application registration process.</div>\n </div>\n\n ${\n this._grantType == 'owner'\n ? html`\n <div field grid-span>\n <label for=\"username\">user name</label>\n <input type=\"text\" id=\"username\" name=\"username\" .value=${oauth2Client.username || ''} />\n </div>\n\n <div field grid-span>\n <label for=\"password\">password</label>\n <input type=\"password\" id=\"password\" name=\"password\" .value=${oauth2Client.password || ''} />\n </div>\n `\n : html``\n }\n\n ${\n this._grantType == 'jwt'\n ? html`\n <div field grid-span>\n <label for=\"jwt-token\">jwt-token</label>\n <input type=\"text\" id=\"jwt-token\" name=\"jwtToken\" .value=${oauth2Client.jwtToken || ''} />\n <div input-hint>The JWT Bearer Token for JWT As Authorization Grant</div>\n </div>\n `\n : html``\n }\n\n <!-- code PKCE grant type not supported yet\n <div field grid-span>\n <label for='code-challenge-method'>code challenge method</label>\n <select type='text' id=\"code-challenge-method\" name=\"codeChallengeMethod\" .value=${\n oauth2Client.codeChallengeMethod\n }>\n <option></option>\n <option>SHA-256</option>\n <option>Plain</option>\n </select>\n <div input-hint>Algorithm used for generating the code challenge</div>\n </div>\n\n <div field grid-span>\n <label for='code-verifier'>code verifier\n <ox-help-icon topic='/oauth2-client/code-verifier'></ox-help-icon>\n </label>\n <input type='text' id=\"code-verifier\" name=\"codeVerifier\" .value=${oauth2Client.codeVerifier || ''}>\n <div input-hint>A random, 43-128 character string used to connect the authorization request to the token request.\n Uses the following characters: [A-Z]/[a-z]/[0-9]/\"-\"/\".\"/\"_\"/\"~\".</div>\n </div>\n -->\n \n <div field grid-span>\n <label for='scopes'>scopes</label>\n <input type='text' id=\"scopes\" name=\"scopes\" .value=${oauth2Client.scopes || ''}>\n <div input-hint>The scopes of the access request. It may have multiple space-delimited values.</div>\n </div>\n </div>\n </fieldset>\n </div>\n\n <div fieldset-container>\n <fieldset>\n <div field grid-span>\n <label for='token-type'>token type</label>\n <input type='text' id=\"token-type\" .value=${oauth2Client.tokenType || ''} readonly>\n <div input-hint>Added to the authorization header before the access token.</div>\n </div>\n\n <legend>access token</legend>\n <div field-2column>\n <div field grid-span>\n <label for=\"access-token\">access token</label>\n <input id=\"access-token\" type=\"text\" .value=${oauth2Client.accessToken || ''} readonly />\n <button button-in-field clipboard-copy @click=${e => e.preventDefault()}>copy</button>\n ${\n oauth2Client.expires\n ? html`<div input-hint>\n expired in ${new Date(Number(oauth2Client.expires))} :\n ${asyncReplace(this.expTimer(oauth2Client.expires))}\n </div>`\n : html``\n }\n </div>\n\n <div field grid-span>\n <label for=\"refresh-token\">refresh token</label>\n <input id=\"refresh-token\" type=\"text\" .value=${oauth2Client.refreshToken || ''} readonly />\n <button button-in-field clipboard-copy @click=${e => e.preventDefault()}>copy</button>\n </div>\n </div>\n </fieldset>\n </div>\n\n <button @click=${e => this.deleteOauth2Client(e)}>delete this app</button>\n <button @click=${async e => {\n e.preventDefault()\n await this.updateOauth2Client()\n await this.generateOauth2AccessToken()\n }}>get new access token</button>\n <button @click=${async e => {\n e.preventDefault()\n await this.updateOauth2Client()\n await this.refreshOauth2AccessToken()\n }} ?disabled=${!oauth2Client.refreshToken}>refresh access token</button>\n <input type=\"submit\" value=\"update\" @click=${async e => {\n e.preventDefault()\n await this.updateOauth2Client()\n }}>\n </form>\n `\n }\n\n updated(changes) {\n if (changes.has('oauth2Client')) {\n this._grantType = this.oauth2Client?.grantType\n }\n }\n\n firstUpdated() {\n this.clipboard = new Clipboard(this.copybuttons, {\n target: (trigger => trigger.parentElement.querySelector('input')) as any\n })\n }\n\n async pageUpdated(changes, lifecycle, before) {\n if (this.active) {\n await this.fetchOauth2Client()\n }\n }\n\n async *expTimer(exp) {\n const DAY = 24 * 60 * 60\n const HOUR = 60 * 60\n const MIN = 60\n\n while (this.active) {\n var remain = Math.floor((Number(exp) - Date.now()) / 1000)\n const days = Math.floor(remain / DAY)\n remain -= days * DAY\n const hours = Math.floor(remain / HOUR)\n remain -= hours * HOUR\n const mins = Math.floor(remain / MIN)\n const secs = remain - mins * MIN\n\n yield `${days} days ${hours} hours ${mins} mins ${secs} seconds remain`\n\n await sleep(1000)\n }\n }\n\n async fetchOauth2Client() {\n const response = await client.query({\n query: gql`\n query($id: String!) {\n oauth2Client(id: $id) {\n ${OAUTH2CLIENT}\n }\n }\n `,\n variables: {\n id: this.lifecycle.resourceId\n }\n })\n\n this.oauth2Client = response.data.oauth2Client\n }\n\n async updateOauth2Client() {\n const formData = new FormData(this.form)\n\n const patch = Array.from(formData.entries()).reduce((patch, [key, value]) => {\n patch[key] = value\n return patch\n }, {})\n\n const id = this.lifecycle.resourceId\n\n const response = await client.mutate({\n mutation: gql`\n mutation($id: String!, $patch: Oauth2ClientPatch!) {\n updateOauth2Client(id: $id, patch: $patch) {\n ${OAUTH2CLIENT}\n }\n }\n `,\n variables: {\n id,\n patch\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'update oauth2 client fail'\n })\n } else {\n this.oauth2Client = response.data.updateOauth2Client\n }\n }\n\n async deleteOauth2Client(e) {\n e.preventDefault()\n\n const id = this.lifecycle.resourceId\n\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n deleteOauth2Client(id: $id)\n }\n `,\n variables: {\n id\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'delete oauth2 client fail'\n })\n } else {\n navigate('oauth2-clients')\n }\n }\n\n async generateOauth2AccessToken() {\n const id = this.lifecycle.resourceId\n\n if (this.oauth2Client.grantType == 'code') {\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n getOauth2AuthUrl(id: $id)\n }\n `,\n variables: {\n id: this.lifecycle.resourceId\n }\n })\n\n if (!response.errors) {\n location.href = response.data.getOauth2AuthUrl\n } else {\n notify({\n level: 'error',\n message: 'getting application access token fail'\n })\n }\n } else {\n const response = await client.mutate({\n mutation: gql`\n mutation($id: String!) {\n getOauth2AccessToken(id: $id) {\n ${OAUTH2CLIENT}\n }\n }\n `,\n variables: {\n id: this.lifecycle.resourceId\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'getting application access token fail'\n })\n } else {\n this.oauth2Client = response.data.getOauth2AccessToken\n notify({\n level: 'info',\n message: 'got application access token successfully'\n })\n }\n }\n }\n\n async refreshOauth2AccessToken() {\n const id = this.lifecycle.resourceId\n\n const response = await client.mutate({\n mutation: gql`\n mutation($id: String!) {\n refreshOauth2AccessToken(id: $id) {\n ${OAUTH2CLIENT}\n }\n }\n `,\n variables: {\n id: this.lifecycle.resourceId\n }\n })\n\n if (response.errors) {\n notify({\n level: 'error',\n message: 'getting application access token fail'\n })\n } else {\n this.oauth2Client = response.data.refreshOauth2AccessToken\n notify({\n level: 'info',\n message: 'got application access token successfully'\n })\n }\n }\n}\n"]}
@@ -90,7 +90,7 @@ Oauth2Clients.styles = [
90
90
  :host {
91
91
  display: flex;
92
92
  flex-direction: column;
93
- background-color: var(--main-section-background-color);
93
+ background-color: var(--md-sys-color-background);
94
94
  padding: var(--padding-wide);
95
95
 
96
96
  overflow: auto;