@things-factory/auth-ui 4.0.43 → 4.1.2

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.
@@ -1,4 +1,6 @@
1
- import '@operato/data-grist'
1
+ import '@operato/data-grist/ox-grist.js'
2
+ import '@operato/data-grist/ox-filters-form.js'
3
+ import '@operato/data-grist/ox-sorters-control.js'
2
4
  import '../../components/create-domain-popup'
3
5
 
4
6
  import gql from 'graphql-tag'
@@ -7,7 +9,7 @@ import { connect } from 'pwa-helpers/connect-mixin'
7
9
 
8
10
  import { i18next, localize } from '@operato/i18n'
9
11
  import { openPopup } from '@operato/layout'
10
- import { CommonButtonStyles, ScrollbarStyles } from '@operato/styles'
12
+ import { CommonButtonStyles, CommonGristStyles, ScrollbarStyles } from '@operato/styles'
11
13
  import { isMobileDevice } from '@operato/utils'
12
14
  import { client, PageView, store } from '@things-factory/shell'
13
15
 
@@ -15,12 +17,14 @@ export class DomainManagement extends connect(store)(localize(i18next)(PageView)
15
17
  static get properties() {
16
18
  return {
17
19
  active: String,
18
- config: Object
20
+ config: Object,
21
+ mode: String
19
22
  }
20
23
  }
21
24
 
22
25
  static get styles() {
23
26
  return [
27
+ CommonGristStyles,
24
28
  ScrollbarStyles,
25
29
  css`
26
30
  :host {
@@ -29,25 +33,16 @@ export class DomainManagement extends connect(store)(localize(i18next)(PageView)
29
33
 
30
34
  overflow: hidden;
31
35
  }
32
-
33
- ox-grist {
34
- overflow-y: auto;
35
- flex: 1;
36
- }
37
-
38
- #filters {
39
- display: flex;
40
- flex-direction: row;
41
- justify-content: space-between;
42
- }
43
-
44
- #filters > * {
45
- padding: var(--padding-default) var(--padding-wide);
46
- }
47
36
  `
48
37
  ]
49
38
  }
50
39
 
40
+ constructor() {
41
+ super()
42
+
43
+ this.mode = isMobileDevice() ? 'LIST' : 'GRID'
44
+ }
45
+
51
46
  get context() {
52
47
  return {
53
48
  title: i18next.t('text.domain management'),
@@ -56,11 +51,6 @@ export class DomainManagement extends connect(store)(localize(i18next)(PageView)
56
51
  title: i18next.t('button.save'),
57
52
  action: this.onUpdateDomains.bind(this),
58
53
  ...CommonButtonStyles.save
59
- },
60
- {
61
- title: i18next.t('button.add'),
62
- action: this.onCreateDomain.bind(this),
63
- ...CommonButtonStyles.add
64
54
  }
65
55
  ]
66
56
  }
@@ -68,13 +58,40 @@ export class DomainManagement extends connect(store)(localize(i18next)(PageView)
68
58
 
69
59
  render() {
70
60
  return html`
71
- <ox-grist
72
- .mode=${isMobileDevice() ? 'LIST' : 'GRID'}
73
- .config=${this.config}
74
- .fetchHandler="${this.fetchHandler.bind(this)}"
75
- >
76
- <div id="filters" slot="headroom">
77
- <ox-filters-form></ox-filters-form>
61
+ <ox-grist .mode=${this.mode} .config=${this.config} .fetchHandler=${this.fetchHandler.bind(this)}>
62
+ <div slot="headroom">
63
+ <div id="filters">
64
+ <ox-filters-form></ox-filters-form>
65
+ </div>
66
+
67
+ <div id="sorters">
68
+ Sort
69
+ <mwc-icon
70
+ @click=${e => {
71
+ const target = e.currentTarget
72
+ this.renderRoot.querySelector('#sorter-control').open({
73
+ right: 0,
74
+ top: target.offsetTop + target.offsetHeight
75
+ })
76
+ }}
77
+ >expand_more</mwc-icon
78
+ >
79
+ <ox-popup id="sorter-control">
80
+ <ox-sorters-control> </ox-sorters-control>
81
+ </ox-popup>
82
+ </div>
83
+
84
+ <div id="modes">
85
+ <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${this.mode == 'GRID'}>grid_on</mwc-icon>
86
+ <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${this.mode == 'LIST'}
87
+ >format_list_bulleted</mwc-icon
88
+ >
89
+ <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${this.mode == 'CARD'}>apps</mwc-icon>
90
+ </div>
91
+
92
+ <div id="add">
93
+ <button><mwc-icon @click=${this.onCreateDomain.bind(this)}>add</mwc-icon></button>
94
+ </div>
78
95
  </div>
79
96
  </ox-grist>
80
97
  `
@@ -112,6 +129,7 @@ export class DomainManagement extends connect(store)(localize(i18next)(PageView)
112
129
  editable: false
113
130
  },
114
131
  filter: 'search',
132
+ sortable: true,
115
133
  width: 200
116
134
  },
117
135
  {
@@ -222,6 +240,7 @@ export class DomainManagement extends connect(store)(localize(i18next)(PageView)
222
240
  })
223
241
 
224
242
  if (!response.errors) {
243
+ this.dataGrist.fetch()
225
244
  return this.showToast(i18next.t('text.updated_successfully'))
226
245
  }
227
246
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@things-factory/auth-ui",
3
- "version": "4.0.43",
3
+ "version": "4.1.2",
4
4
  "main": "dist-server/index.js",
5
5
  "browser": "client/index.js",
6
6
  "things-factory": true,
@@ -30,14 +30,14 @@
30
30
  "@material/mwc-icon-button": "^0.25.3",
31
31
  "@material/mwc-textarea": "^0.25.3",
32
32
  "@material/mwc-textfield": "^0.25.3",
33
- "@operato/data-grist": "^0.3.26",
34
- "@operato/i18n": "^0.3.26",
35
- "@operato/layout": "^0.3.26",
36
- "@operato/lottie-player": "^0.3.26",
37
- "@things-factory/auth-base": "^4.0.43",
38
- "@things-factory/i18n-base": "^4.0.43",
39
- "@things-factory/more-base": "^4.0.43",
33
+ "@operato/data-grist": "^0.3.28",
34
+ "@operato/i18n": "^0.3.28",
35
+ "@operato/layout": "^0.3.28",
36
+ "@operato/lottie-player": "^0.3.28",
37
+ "@things-factory/auth-base": "^4.1.2",
38
+ "@things-factory/i18n-base": "^4.1.2",
39
+ "@things-factory/more-base": "^4.1.2",
40
40
  "clipboard": "^2.0.6"
41
41
  },
42
- "gitHead": "8f2a8008eb61b6efd266412be267186c5059fab6"
42
+ "gitHead": "46164ac6b9b2a15c4ff6af5d83d0435f28fff80a"
43
43
  }