@things-factory/notification 6.1.17 → 6.1.22

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 (108) hide show
  1. package/client/{bootstrap.js → bootstrap.ts} +13 -9
  2. package/client/pages/notification/notification-list-page.ts +267 -0
  3. package/client/pages/notification-rule/notification-rule-importer.ts +93 -0
  4. package/client/pages/notification-rule/notification-rule-list-page.ts +395 -0
  5. package/client/route.ts +10 -0
  6. package/client/tsconfig.json +13 -0
  7. package/client/viewparts/notification-badge.ts +58 -0
  8. package/client/viewparts/notification-item.ts +242 -0
  9. package/client/viewparts/notification-list.ts +171 -0
  10. package/client/viewparts/notification-sender.ts +126 -0
  11. package/client/viewparts/{notification-setting-let.js → notification-setting-let.ts} +48 -52
  12. package/dist-client/actions/notification-fcm.d.ts +7 -0
  13. package/dist-client/actions/notification-fcm.js +125 -0
  14. package/dist-client/actions/notification-fcm.js.map +1 -0
  15. package/dist-client/bootstrap.d.ts +1 -0
  16. package/dist-client/bootstrap.js +112 -0
  17. package/dist-client/bootstrap.js.map +1 -0
  18. package/dist-client/index.d.ts +5 -0
  19. package/dist-client/index.js +6 -0
  20. package/dist-client/index.js.map +1 -0
  21. package/dist-client/pages/notification/notification-list-page.d.ts +49 -0
  22. package/dist-client/pages/notification/notification-list-page.js +262 -0
  23. package/dist-client/pages/notification/notification-list-page.js.map +1 -0
  24. package/dist-client/pages/notification-rule/notification-rule-importer.d.ts +22 -0
  25. package/dist-client/pages/notification-rule/notification-rule-importer.js +100 -0
  26. package/dist-client/pages/notification-rule/notification-rule-importer.js.map +1 -0
  27. package/dist-client/pages/notification-rule/notification-rule-list-page.d.ts +62 -0
  28. package/dist-client/pages/notification-rule/notification-rule-list-page.js +380 -0
  29. package/dist-client/pages/notification-rule/notification-rule-list-page.js.map +1 -0
  30. package/dist-client/reducers/notification.d.ts +8 -0
  31. package/dist-client/reducers/notification.js +22 -0
  32. package/dist-client/reducers/notification.js.map +1 -0
  33. package/dist-client/route.d.ts +1 -0
  34. package/dist-client/route.js +11 -0
  35. package/dist-client/route.js.map +1 -0
  36. package/dist-client/tsconfig.tsbuildinfo +1 -0
  37. package/dist-client/viewparts/notification-badge.d.ts +15 -0
  38. package/dist-client/viewparts/notification-badge.js +61 -0
  39. package/dist-client/viewparts/notification-badge.js.map +1 -0
  40. package/dist-client/viewparts/notification-item.d.ts +16 -0
  41. package/dist-client/viewparts/notification-item.js +249 -0
  42. package/dist-client/viewparts/notification-item.js.map +1 -0
  43. package/dist-client/viewparts/notification-list.d.ts +20 -0
  44. package/dist-client/viewparts/notification-list.js +160 -0
  45. package/dist-client/viewparts/notification-list.js.map +1 -0
  46. package/dist-client/viewparts/notification-sender.d.ts +13 -0
  47. package/dist-client/viewparts/notification-sender.js +122 -0
  48. package/dist-client/viewparts/notification-sender.js.map +1 -0
  49. package/dist-client/viewparts/notification-setting-let.d.ts +20 -0
  50. package/dist-client/viewparts/notification-setting-let.js +193 -0
  51. package/dist-client/viewparts/notification-setting-let.js.map +1 -0
  52. package/dist-server/service/index.js +10 -1
  53. package/dist-server/service/index.js.map +1 -1
  54. package/dist-server/service/notification/index.js +6 -3
  55. package/dist-server/service/notification/index.js.map +1 -1
  56. package/dist-server/service/notification/notification-mutation.js +110 -0
  57. package/dist-server/service/notification/notification-mutation.js.map +1 -0
  58. package/dist-server/service/notification/notification-query.js +109 -0
  59. package/dist-server/service/notification/notification-query.js.map +1 -0
  60. package/dist-server/service/notification/notification-subscription.js +45 -0
  61. package/dist-server/service/notification/notification-subscription.js.map +1 -0
  62. package/dist-server/service/notification/notification-type.js +82 -0
  63. package/dist-server/service/notification/notification-type.js.map +1 -0
  64. package/dist-server/service/notification/notification.js +81 -8
  65. package/dist-server/service/notification/notification.js.map +1 -1
  66. package/dist-server/service/notification-rule/event-subscriber.js +21 -0
  67. package/dist-server/service/notification-rule/event-subscriber.js.map +1 -0
  68. package/dist-server/service/notification-rule/index.js +12 -0
  69. package/dist-server/service/notification-rule/index.js.map +1 -0
  70. package/dist-server/service/notification-rule/notification-rule-history.js +146 -0
  71. package/dist-server/service/notification-rule/notification-rule-history.js.map +1 -0
  72. package/dist-server/service/notification-rule/notification-rule-mutation.js +170 -0
  73. package/dist-server/service/notification-rule/notification-rule-mutation.js.map +1 -0
  74. package/dist-server/service/notification-rule/notification-rule-query.js +97 -0
  75. package/dist-server/service/notification-rule/notification-rule-query.js.map +1 -0
  76. package/dist-server/service/notification-rule/notification-rule-type.js +102 -0
  77. package/dist-server/service/notification-rule/notification-rule-type.js.map +1 -0
  78. package/dist-server/service/notification-rule/notification-rule.js +146 -0
  79. package/dist-server/service/notification-rule/notification-rule.js.map +1 -0
  80. package/dist-server/tsconfig.tsbuildinfo +1 -1
  81. package/helps/notification/noti-box.md +160 -0
  82. package/helps/notification/noti-rule.md +160 -0
  83. package/helps/notification/notibox.md +160 -0
  84. package/package.json +15 -12
  85. package/server/service/index.ts +14 -0
  86. package/server/service/notification/index.ts +6 -3
  87. package/server/service/notification/notification-mutation.ts +119 -0
  88. package/server/service/notification/notification-query.ts +70 -0
  89. package/server/service/notification/{notification-resolver.ts → notification-subscription.ts} +4 -4
  90. package/server/service/notification/notification-type.ts +55 -0
  91. package/server/service/notification/notification.ts +87 -14
  92. package/server/service/notification-rule/event-subscriber.ts +20 -0
  93. package/server/service/notification-rule/index.ts +9 -0
  94. package/server/service/notification-rule/notification-rule-history.ts +130 -0
  95. package/server/service/notification-rule/notification-rule-mutation.ts +203 -0
  96. package/server/service/notification-rule/notification-rule-query.ts +62 -0
  97. package/server/service/notification-rule/notification-rule-type.ts +71 -0
  98. package/server/service/notification-rule/notification-rule.ts +125 -0
  99. package/server/tsconfig.json +9 -0
  100. package/things-factory.config.js +7 -1
  101. package/client/viewparts/notification-badge.js +0 -63
  102. package/client/viewparts/notification-item.js +0 -250
  103. package/client/viewparts/notification-list.js +0 -177
  104. package/client/viewparts/notification-sender.js +0 -128
  105. package/tsconfig.json +0 -9
  106. /package/client/actions/{notification-fcm.js → notification-fcm.ts} +0 -0
  107. /package/client/{index.js → index.ts} +0 -0
  108. /package/client/reducers/{notification.js → notification.ts} +0 -0
@@ -0,0 +1,112 @@
1
+ import gql from 'graphql-tag';
2
+ import { notify } from '@operato/layout';
3
+ import { auth } from '@things-factory/auth-base/dist-client';
4
+ import { i18next } from '@operato/i18n';
5
+ import { notificationStore, route, store } from '@operato/shell';
6
+ import { subscribe as graphqlSubscribe } from '@operato/graphql';
7
+ import { subscribe, unsubscribe, UPDATE_NOTIFICATION } from './actions/notification-fcm';
8
+ import notification from './reducers/notification';
9
+ var graphqlSubscription;
10
+ export default async function bootstrap() {
11
+ /* initialize reducers */
12
+ store.addReducers({ notification });
13
+ async function onnotification(notification) {
14
+ store.dispatch((async (dispatch) => {
15
+ if (notification) {
16
+ await notificationStore.add(notification);
17
+ await notificationStore.limit();
18
+ }
19
+ const history = await notificationStore.getAll();
20
+ dispatch({
21
+ type: UPDATE_NOTIFICATION,
22
+ history: [...history]
23
+ });
24
+ }));
25
+ }
26
+ auth.on('presignout', async () => {
27
+ try {
28
+ await unsubscribe();
29
+ await notificationStore.clear();
30
+ }
31
+ catch (err) {
32
+ console.warn(err);
33
+ }
34
+ });
35
+ auth.on('profile', async ({ credential }) => {
36
+ try {
37
+ await subscribe();
38
+ }
39
+ catch (err) {
40
+ console.warn(err);
41
+ }
42
+ /*
43
+ * subscription graphql notifications
44
+ */
45
+ var query = gql `
46
+ subscription notification($subjects: [String!]) {
47
+ notification(subjects: $subjects) {
48
+ subject
49
+ type
50
+ title
51
+ body
52
+ url
53
+ image
54
+ timestamp
55
+ }
56
+ }
57
+ `;
58
+ graphqlSubscription = await graphqlSubscribe({
59
+ query,
60
+ variables: {
61
+ subjects: ['info', 'warn', 'error', 'reload']
62
+ }
63
+ }, {
64
+ next({ data }) {
65
+ const { notification } = data || {};
66
+ onnotification(Object.assign({ timestamp: Date.now() }, notification));
67
+ }
68
+ });
69
+ });
70
+ /* subscription web-push notification */
71
+ const channel = new BroadcastChannel('notification');
72
+ channel.addEventListener('message', async ({ data }) => {
73
+ const { type } = data || {};
74
+ switch (type) {
75
+ case 'notificationclick':
76
+ const { action, notification } = data;
77
+ // TODO how to follow action with notification.data
78
+ notification.url && route(notification.url);
79
+ break;
80
+ case 'show-reload-snackbar':
81
+ notify({
82
+ level: 'info',
83
+ message: i18next.t('text.the application has been updated'),
84
+ option: {
85
+ action: {
86
+ label: i18next.t('button.reload'),
87
+ callback: () => window.location.reload()
88
+ },
89
+ timer: -1
90
+ }
91
+ });
92
+ break;
93
+ case 'notification':
94
+ default:
95
+ onnotification();
96
+ }
97
+ });
98
+ document.addEventListener('notify', (event) => {
99
+ let { message, level, ex = '', option = {} } = event.detail;
100
+ const title = message.split(' .\n')[0];
101
+ if (level === 'error') {
102
+ onnotification({
103
+ timestamp: Date.now(),
104
+ type: 'ERROR',
105
+ title,
106
+ body: ex ? ex.message : message
107
+ });
108
+ }
109
+ });
110
+ await onnotification();
111
+ }
112
+ //# sourceMappingURL=bootstrap.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"bootstrap.js","sourceRoot":"","sources":["../client/bootstrap.ts"],"names":[],"mappings":"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","sourcesContent":["import gql from 'graphql-tag'\n\nimport { notify } from '@operato/layout'\nimport { auth } from '@things-factory/auth-base/dist-client'\nimport { i18next } from '@operato/i18n'\nimport { notificationStore, route, store } from '@operato/shell'\nimport { subscribe as graphqlSubscribe } from '@operato/graphql'\n\nimport { subscribe, unsubscribe, UPDATE_NOTIFICATION } from './actions/notification-fcm'\nimport notification from './reducers/notification'\n\nvar graphqlSubscription: any\n\nexport default async function bootstrap() {\n /* initialize reducers */\n store.addReducers({ notification })\n\n async function onnotification(notification?: any) {\n store.dispatch((async dispatch => {\n if (notification) {\n await notificationStore.add(notification)\n await notificationStore.limit()\n }\n\n const history = await notificationStore.getAll()\n\n dispatch({\n type: UPDATE_NOTIFICATION,\n history: [...history]\n })\n }) as any)\n }\n\n auth.on('presignout', async () => {\n try {\n await unsubscribe()\n await notificationStore.clear()\n } catch (err) {\n console.warn(err)\n }\n })\n\n auth.on('profile', async ({ credential }) => {\n try {\n await subscribe()\n } catch (err) {\n console.warn(err)\n }\n\n /*\n * subscription graphql notifications\n */\n var query = gql`\n subscription notification($subjects: [String!]) {\n notification(subjects: $subjects) {\n subject\n type\n title\n body\n url\n image\n timestamp\n }\n }\n `\n\n graphqlSubscription = await graphqlSubscribe(\n {\n query,\n variables: {\n subjects: ['info', 'warn', 'error', 'reload']\n }\n },\n {\n next({ data }) {\n const { notification } = data || {}\n onnotification({\n timestamp: Date.now(),\n ...notification\n })\n }\n }\n )\n })\n\n /* subscription web-push notification */\n const channel = new BroadcastChannel('notification')\n channel.addEventListener('message', async ({ data }) => {\n const { type } = data || {}\n\n switch (type) {\n case 'notificationclick':\n const { action, notification } = data\n\n // TODO how to follow action with notification.data\n notification.url && route(notification.url)\n break\n\n case 'show-reload-snackbar':\n notify({\n level: 'info',\n message: i18next.t('text.the application has been updated'),\n option: {\n action: {\n label: i18next.t('button.reload'),\n callback: () => window.location.reload()\n },\n timer: -1\n }\n })\n break\n\n case 'notification':\n default:\n onnotification()\n }\n })\n\n document.addEventListener('notify', (event: Event) => {\n let { message, level, ex = '', option = {} } = (event as CustomEvent).detail\n const title = message.split(' .\\n')[0]\n\n if (level === 'error') {\n onnotification({\n timestamp: Date.now(),\n type: 'ERROR',\n title,\n body: ex ? ex.message : message\n })\n }\n })\n\n await onnotification()\n}\n"]}
@@ -0,0 +1,5 @@
1
+ export * from './viewparts/notification-badge';
2
+ export * from './viewparts/notification-list';
3
+ export * from './viewparts/notification-setting-let';
4
+ export * from './viewparts/notification-sender';
5
+ export * from './actions/notification-fcm';
@@ -0,0 +1,6 @@
1
+ export * from './viewparts/notification-badge';
2
+ export * from './viewparts/notification-list';
3
+ export * from './viewparts/notification-setting-let';
4
+ export * from './viewparts/notification-sender';
5
+ export * from './actions/notification-fcm';
6
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../client/index.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAA;AAC9C,cAAc,+BAA+B,CAAA;AAC7C,cAAc,sCAAsC,CAAA;AACpD,cAAc,iCAAiC,CAAA;AAE/C,cAAc,4BAA4B,CAAA","sourcesContent":["export * from './viewparts/notification-badge'\nexport * from './viewparts/notification-list'\nexport * from './viewparts/notification-setting-let'\nexport * from './viewparts/notification-sender'\n\nexport * from './actions/notification-fcm'\n"]}
@@ -0,0 +1,49 @@
1
+ import '@operato/data-grist';
2
+ import { PageView } from '@operato/shell';
3
+ import { FetchOption } from '@operato/data-grist';
4
+ declare const NotificationListPage_base: (new (...args: any[]) => {
5
+ _storeUnsubscribe: import("redux").Unsubscribe;
6
+ connectedCallback(): void;
7
+ disconnectedCallback(): void;
8
+ stateChanged(_state: unknown): void;
9
+ readonly isConnected: boolean;
10
+ }) & (new (...args: any[]) => import("lit").LitElement) & typeof PageView & import("@open-wc/dedupe-mixin").Constructor<import("@open-wc/scoped-elements/types/src/types").ScopedElementsHost>;
11
+ export declare class NotificationListPage extends NotificationListPage_base {
12
+ static styles: import("lit").CSSResult[];
13
+ gristConfig: any;
14
+ mode: 'CARD' | 'GRID' | 'LIST';
15
+ private grist;
16
+ private sortersControl;
17
+ get context(): {
18
+ search: {
19
+ handler: (search: string) => void;
20
+ placeholder: string;
21
+ value: string;
22
+ };
23
+ filter: {
24
+ handler: () => void;
25
+ };
26
+ help: string;
27
+ actions: {
28
+ icon: string;
29
+ emphasis: {
30
+ raised: boolean;
31
+ outlined: boolean;
32
+ dense: boolean;
33
+ danger: boolean;
34
+ };
35
+ title: string;
36
+ action: () => Promise<void>;
37
+ }[];
38
+ };
39
+ render(): import("lit-html").TemplateResult<1>;
40
+ pageInitialized(lifecycle: any): Promise<void>;
41
+ pageUpdated(changes: any, lifecycle: any): Promise<void>;
42
+ fetchHandler({ page, limit, sortings, filters }: FetchOption): Promise<{
43
+ total: any;
44
+ records: any;
45
+ }>;
46
+ _deleteNotification(): Promise<void>;
47
+ _updateNotification(): Promise<void>;
48
+ }
49
+ export {};
@@ -0,0 +1,262 @@
1
+ import { __decorate, __metadata } from "tslib";
2
+ import '@operato/data-grist';
3
+ import { CommonButtonStyles, CommonGristStyles, ScrollbarStyles } from '@operato/styles';
4
+ import { PageView, store } from '@operato/shell';
5
+ import { css, html } from 'lit';
6
+ import { customElement, property, query } from 'lit/decorators.js';
7
+ import { ScopedElementsMixin } from '@open-wc/scoped-elements';
8
+ import { DataGrist } from '@operato/data-grist';
9
+ import { client } from '@operato/graphql';
10
+ import { i18next, localize } from '@operato/i18n';
11
+ import { notify } from '@operato/layout';
12
+ import { OxPopup } from '@operato/popup';
13
+ import { isMobileDevice } from '@operato/utils';
14
+ import { connect } from 'pwa-helpers/connect-mixin';
15
+ import gql from 'graphql-tag';
16
+ let NotificationListPage = class NotificationListPage extends connect(store)(localize(i18next)(ScopedElementsMixin(PageView))) {
17
+ constructor() {
18
+ super(...arguments);
19
+ this.mode = isMobileDevice() ? 'CARD' : 'GRID';
20
+ }
21
+ get context() {
22
+ return {
23
+ search: {
24
+ handler: (search) => {
25
+ this.grist.searchText = search;
26
+ },
27
+ placeholder: i18next.t('title.notification list'),
28
+ value: this.grist.searchText
29
+ },
30
+ filter: {
31
+ handler: () => {
32
+ this.grist.toggleHeadroom();
33
+ }
34
+ },
35
+ help: 'notification/notification',
36
+ actions: [
37
+ Object.assign({ title: i18next.t('button.save'), action: this._updateNotification.bind(this) }, CommonButtonStyles.save),
38
+ Object.assign({ title: i18next.t('button.delete'), action: this._deleteNotification.bind(this) }, CommonButtonStyles.delete)
39
+ ]
40
+ };
41
+ }
42
+ render() {
43
+ const mode = this.mode || (isMobileDevice() ? 'CARD' : 'GRID');
44
+ return html `
45
+ <ox-grist .mode=${mode} .config=${this.gristConfig} .fetchHandler=${this.fetchHandler.bind(this)}>
46
+ <div slot="headroom">
47
+ <div id="filters">
48
+ <ox-filters-form autofocus></ox-filters-form>
49
+ </div>
50
+
51
+ <div id="sorters">
52
+ Sort
53
+ <mwc-icon
54
+ @click=${e => {
55
+ const target = e.currentTarget;
56
+ this.sortersControl.open({
57
+ right: 0,
58
+ top: target.offsetTop + target.offsetHeight
59
+ });
60
+ }}
61
+ >expand_more</mwc-icon
62
+ >
63
+ <ox-popup id="sorter-control">
64
+ <ox-sorters-control> </ox-sorters-control>
65
+ </ox-popup>
66
+ </div>
67
+
68
+ <div id="modes">
69
+ <mwc-icon @click=${() => (this.mode = 'GRID')} ?active=${mode == 'GRID'}>grid_on</mwc-icon>
70
+ <mwc-icon @click=${() => (this.mode = 'LIST')} ?active=${mode == 'LIST'}>format_list_bulleted</mwc-icon>
71
+ <mwc-icon @click=${() => (this.mode = 'CARD')} ?active=${mode == 'CARD'}>apps</mwc-icon>
72
+ </div>
73
+ </div>
74
+ </ox-grist>
75
+ `;
76
+ }
77
+ async pageInitialized(lifecycle) {
78
+ this.gristConfig = {
79
+ list: {
80
+ fields: ['title', 'body'],
81
+ details: ['state', 'updatedAt']
82
+ },
83
+ columns: [
84
+ { type: 'gutter', gutterName: 'sequence' },
85
+ { type: 'gutter', gutterName: 'row-selector', multiple: true },
86
+ {
87
+ type: 'string',
88
+ name: 'title',
89
+ header: i18next.t('field.title'),
90
+ record: {
91
+ editable: false
92
+ },
93
+ filter: 'search',
94
+ sortable: true,
95
+ width: 150
96
+ },
97
+ {
98
+ type: 'string',
99
+ name: 'body',
100
+ header: i18next.t('field.body'),
101
+ record: {
102
+ editable: false
103
+ },
104
+ filter: 'search',
105
+ width: 200
106
+ },
107
+ {
108
+ type: 'checkbox',
109
+ name: 'state',
110
+ label: true,
111
+ header: i18next.t('field.state'),
112
+ record: {
113
+ editable: true
114
+ },
115
+ filter: true,
116
+ sortable: true,
117
+ width: 60
118
+ },
119
+ {
120
+ type: 'datetime',
121
+ name: 'createdAt',
122
+ header: i18next.t('field.created_at'),
123
+ record: {
124
+ editable: false
125
+ },
126
+ sortable: true,
127
+ width: 180
128
+ }
129
+ ],
130
+ rows: {
131
+ selectable: {
132
+ multiple: true
133
+ }
134
+ },
135
+ sorters: [
136
+ {
137
+ name: 'createdAt',
138
+ desc: true
139
+ }
140
+ ]
141
+ };
142
+ }
143
+ async pageUpdated(changes, lifecycle) {
144
+ if (this.active) {
145
+ // do something here when this page just became as active
146
+ }
147
+ }
148
+ async fetchHandler({ page = 1, limit = 100, sortings = [], filters = [] }) {
149
+ const response = await client.query({
150
+ query: gql `
151
+ query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {
152
+ responses: notiBoxes(filters: $filters, pagination: $pagination, sortings: $sortings) {
153
+ items {
154
+ id
155
+ title
156
+ body
157
+ state
158
+ createdAt
159
+ }
160
+ total
161
+ }
162
+ }
163
+ `,
164
+ variables: {
165
+ filters,
166
+ pagination: { page, limit },
167
+ sortings
168
+ }
169
+ });
170
+ return {
171
+ total: response.data.responses.total || 0,
172
+ records: response.data.responses.items || []
173
+ };
174
+ }
175
+ async _deleteNotification() {
176
+ if (confirm(i18next.t('text.sure_to_x', { x: i18next.t('text.delete') }))) {
177
+ const ids = this.grist.selected.map(record => record.id);
178
+ if (ids && ids.length > 0) {
179
+ const response = await client.mutate({
180
+ mutation: gql `
181
+ mutation ($ids: [String!]!) {
182
+ deleteNotificationes(ids: $ids)
183
+ }
184
+ `,
185
+ variables: {
186
+ ids
187
+ }
188
+ });
189
+ if (!response.errors) {
190
+ this.grist.fetch();
191
+ notify({
192
+ message: i18next.t('text.info_x_successfully', { x: i18next.t('text.delete') })
193
+ });
194
+ }
195
+ }
196
+ }
197
+ }
198
+ async _updateNotification() {
199
+ let patches = this.grist.dirtyRecords;
200
+ if (patches && patches.length) {
201
+ patches = patches.map(patch => {
202
+ let patchField = patch.id ? { id: patch.id } : {};
203
+ const dirtyFields = patch.__dirtyfields__;
204
+ for (let key in dirtyFields) {
205
+ patchField[key] = dirtyFields[key].after;
206
+ }
207
+ patchField.cuFlag = patch.__dirty__;
208
+ return patchField;
209
+ });
210
+ const response = await client.mutate({
211
+ mutation: gql `
212
+ mutation ($patches: [NotificationPatch!]!) {
213
+ updateMultipleNotification(patches: $patches) {
214
+ name
215
+ }
216
+ }
217
+ `,
218
+ variables: {
219
+ patches
220
+ }
221
+ });
222
+ if (!response.errors) {
223
+ this.grist.fetch();
224
+ }
225
+ }
226
+ }
227
+ };
228
+ NotificationListPage.styles = [
229
+ ScrollbarStyles,
230
+ CommonGristStyles,
231
+ css `
232
+ :host {
233
+ display: flex;
234
+
235
+ width: 100%;
236
+
237
+ --grid-record-emphasized-background-color: red;
238
+ --grid-record-emphasized-color: yellow;
239
+ }
240
+ `
241
+ ];
242
+ __decorate([
243
+ property({ type: Object }),
244
+ __metadata("design:type", Object)
245
+ ], NotificationListPage.prototype, "gristConfig", void 0);
246
+ __decorate([
247
+ property({ type: String }),
248
+ __metadata("design:type", String)
249
+ ], NotificationListPage.prototype, "mode", void 0);
250
+ __decorate([
251
+ query('ox-grist'),
252
+ __metadata("design:type", DataGrist)
253
+ ], NotificationListPage.prototype, "grist", void 0);
254
+ __decorate([
255
+ query('#sorter-control'),
256
+ __metadata("design:type", OxPopup)
257
+ ], NotificationListPage.prototype, "sortersControl", void 0);
258
+ NotificationListPage = __decorate([
259
+ customElement('notification-list-page')
260
+ ], NotificationListPage);
261
+ export { NotificationListPage };
262
+ //# sourceMappingURL=notification-list-page.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"notification-list-page.js","sourceRoot":"","sources":["../../../client/pages/notification/notification-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 } 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\n@customElement('notification-list-page')\nexport class NotificationListPage 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: red;\n --grid-record-emphasized-color: yellow;\n }\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 search: {\n handler: (search: string) => {\n this.grist.searchText = search\n },\n placeholder: i18next.t('title.notification list'),\n value: this.grist.searchText\n },\n filter: {\n handler: () => {\n this.grist.toggleHeadroom()\n }\n },\n help: 'notification/notification',\n actions: [\n {\n title: i18next.t('button.save'),\n action: this._updateNotification.bind(this),\n ...CommonButtonStyles.save\n },\n {\n title: i18next.t('button.delete'),\n action: this._deleteNotification.bind(this),\n ...CommonButtonStyles.delete\n }\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: ['title', 'body'],\n details: ['state', 'updatedAt']\n },\n columns: [\n { type: 'gutter', gutterName: 'sequence' },\n { type: 'gutter', gutterName: 'row-selector', multiple: true },\n {\n type: 'string',\n name: 'title',\n header: i18next.t('field.title'),\n record: {\n editable: false\n },\n filter: 'search',\n sortable: true,\n width: 150\n },\n {\n type: 'string',\n name: 'body',\n header: i18next.t('field.body'),\n record: {\n editable: false\n },\n filter: 'search',\n width: 200\n },\n {\n type: 'checkbox',\n name: 'state',\n label: true,\n header: i18next.t('field.state'),\n record: {\n editable: true\n },\n filter: true,\n sortable: true,\n width: 60\n },\n {\n type: 'datetime',\n name: 'createdAt',\n header: i18next.t('field.created_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: 'createdAt',\n desc: true\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: notiBoxes(filters: $filters, pagination: $pagination, sortings: $sortings) {\n items {\n id\n title\n body\n state\n createdAt\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 _deleteNotification() {\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 deleteNotificationes(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 _updateNotification() {\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: [NotificationPatch!]!) {\n updateMultipleNotification(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"]}
@@ -0,0 +1,22 @@
1
+ import '@operato/data-grist';
2
+ import { LitElement } from 'lit';
3
+ export declare class NotificationRuleImporter extends LitElement {
4
+ static styles: import("lit").CSSResult[];
5
+ notificationRules: any[];
6
+ columns: {
7
+ list: {
8
+ fields: string[];
9
+ };
10
+ pagination: {
11
+ infinite: boolean;
12
+ };
13
+ columns: {
14
+ type: string;
15
+ name: string;
16
+ header: string;
17
+ width: number;
18
+ }[];
19
+ };
20
+ render(): import("lit-html").TemplateResult<1>;
21
+ save(): Promise<void>;
22
+ }
@@ -0,0 +1,100 @@
1
+ import { __decorate, __metadata } from "tslib";
2
+ import '@operato/data-grist';
3
+ import gql from 'graphql-tag';
4
+ import { css, html, LitElement } from 'lit';
5
+ import { property } from 'lit/decorators.js';
6
+ import { client } from '@operato/graphql';
7
+ import { i18next } from '@operato/i18n';
8
+ import { isMobileDevice } from '@operato/utils';
9
+ export class NotificationRuleImporter extends LitElement {
10
+ constructor() {
11
+ super(...arguments);
12
+ this.notificationRules = [];
13
+ this.columns = {
14
+ list: { fields: ['name', 'description'] },
15
+ pagination: { infinite: true },
16
+ columns: [
17
+ {
18
+ type: 'string',
19
+ name: 'name',
20
+ header: i18next.t('field.name'),
21
+ width: 150
22
+ },
23
+ {
24
+ type: 'string',
25
+ name: 'description',
26
+ header: i18next.t('field.description'),
27
+ width: 200
28
+ },
29
+ {
30
+ type: 'checkbox',
31
+ name: 'active',
32
+ header: i18next.t('field.active'),
33
+ width: 60
34
+ }
35
+ ]
36
+ };
37
+ }
38
+ render() {
39
+ return html `
40
+ <ox-grist
41
+ .mode=${isMobileDevice() ? 'LIST' : 'GRID'}
42
+ .config=${this.columns}
43
+ .data=${{
44
+ records: this.notificationRules
45
+ }}
46
+ ></ox-grist>
47
+
48
+ <div class="button-container">
49
+ <mwc-button raised @click="${this.save.bind(this)}">${i18next.t('button.save')}</mwc-button>
50
+ </div>
51
+ `;
52
+ }
53
+ async save() {
54
+ var _a;
55
+ const response = await client.mutate({
56
+ mutation: gql `
57
+ mutation importNotificationRules($notificationRules: [NotificationRulePatch!]!) {
58
+ importNotificationRules(notificationRules: $notificationRules)
59
+ }
60
+ `,
61
+ variables: { notificationRules: this.notificationRules }
62
+ });
63
+ if ((_a = response.errors) === null || _a === void 0 ? void 0 : _a.length)
64
+ return;
65
+ this.dispatchEvent(new CustomEvent('imported'));
66
+ }
67
+ }
68
+ NotificationRuleImporter.styles = [
69
+ css `
70
+ :host {
71
+ display: flex;
72
+ flex-direction: column;
73
+
74
+ background-color: #fff;
75
+ }
76
+
77
+ ox-grist {
78
+ flex: 1;
79
+ }
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
+ `
91
+ ];
92
+ __decorate([
93
+ property({ type: Array }),
94
+ __metadata("design:type", Array)
95
+ ], NotificationRuleImporter.prototype, "notificationRules", void 0);
96
+ __decorate([
97
+ property({ type: Object }),
98
+ __metadata("design:type", Object)
99
+ ], NotificationRuleImporter.prototype, "columns", void 0);
100
+ //# sourceMappingURL=notification-rule-importer.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"notification-rule-importer.js","sourceRoot":"","sources":["../../../client/pages/notification-rule/notification-rule-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,wBAAyB,SAAQ,UAAU;IAAxD;;QA0B6B,sBAAiB,GAAU,EAAE,CAAA;QAC5B,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,iBAAiB;SAChC;;;;qCAI4B,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,iBAAiB,EAAE,IAAI,CAAC,iBAAiB,EAAE;SACzD,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;;AAhFM,+BAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;KAqBF;CACF,CAAA;AAED;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;mEAA8B;AACxD;IAAC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;yDAuB1B","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 NotificationRuleImporter 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 }) notificationRules: 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.notificationRules\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 importNotificationRules($notificationRules: [NotificationRulePatch!]!) {\n importNotificationRules(notificationRules: $notificationRules)\n }\n `,\n variables: { notificationRules: this.notificationRules }\n })\n\n if (response.errors?.length) return\n\n this.dispatchEvent(new CustomEvent('imported'))\n }\n}\n"]}