@things-factory/integration-ui 7.0.0-alpha.1 → 7.0.0-alpha.5
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.
- package/client/pages/integration-monitor.ts +9 -15
- package/client/viewparts/scenario-monitor.ts +11 -29
- package/client/viewparts/scenarios-monitor.ts +10 -13
- package/dist-client/pages/integration-monitor.js +9 -15
- package/dist-client/pages/integration-monitor.js.map +1 -1
- package/dist-client/tsconfig.tsbuildinfo +1 -1
- package/dist-client/viewparts/scenario-monitor.js +9 -23
- package/dist-client/viewparts/scenario-monitor.js.map +1 -1
- package/dist-client/viewparts/scenarios-monitor.js +10 -12
- package/dist-client/viewparts/scenarios-monitor.js.map +1 -1
- package/dist-server/tsconfig.tsbuildinfo +1 -1
- package/package.json +3 -3
@@ -9,7 +9,7 @@ import { customElement, property, query } from 'lit/decorators.js'
|
|
9
9
|
|
10
10
|
import { client, subscribe } from '@operato/graphql'
|
11
11
|
import { i18next, localize } from '@operato/i18n'
|
12
|
-
import { PageView } from '@operato/shell'
|
12
|
+
import { PageView, InheritedValueType } from '@operato/shell'
|
13
13
|
import { ScrollbarStyles } from '@operato/styles'
|
14
14
|
|
15
15
|
function IS_SCENARIO_RUNNING(state) {
|
@@ -108,18 +108,9 @@ export class IntegrationMonitor extends localize(i18next)(PageView) {
|
|
108
108
|
|
109
109
|
render() {
|
110
110
|
return html`
|
111
|
-
<integration-summary
|
112
|
-
.pendings=${this.pendings}
|
113
|
-
.scenarios=${this.scenarios}
|
114
|
-
.connections=${this.connections}
|
115
|
-
></integration-summary>
|
111
|
+
<integration-summary .pendings=${this.pendings} .scenarios=${this.scenarios} .connections=${this.connections}></integration-summary>
|
116
112
|
<content>
|
117
|
-
<scenarios-monitor
|
118
|
-
.scenarios=${this.scenarios}
|
119
|
-
.pendings=${this.pendings}
|
120
|
-
.colorIndex=${this.colorIndex || {}}
|
121
|
-
.running=${!!this.active}
|
122
|
-
></scenarios-monitor>
|
113
|
+
<scenarios-monitor .scenarios=${this.scenarios} .pendings=${this.pendings} .colorIndex=${this.colorIndex || {}} .running=${!!this.active}></scenarios-monitor>
|
123
114
|
<connections-monitor .connections=${this.connections}></connections-monitor>
|
124
115
|
</content>
|
125
116
|
`
|
@@ -140,8 +131,8 @@ export class IntegrationMonitor extends localize(i18next)(PageView) {
|
|
140
131
|
async fetchScenarios() {
|
141
132
|
const response = await client.query({
|
142
133
|
query: gql`
|
143
|
-
query {
|
144
|
-
responses: scenarios {
|
134
|
+
query ($inherited: InheritedValueType) {
|
135
|
+
responses: scenarios(inherited: $inherited) {
|
145
136
|
items {
|
146
137
|
id
|
147
138
|
name
|
@@ -173,7 +164,10 @@ export class IntegrationMonitor extends localize(i18next)(PageView) {
|
|
173
164
|
total
|
174
165
|
}
|
175
166
|
}
|
176
|
-
|
167
|
+
`,
|
168
|
+
variables: {
|
169
|
+
inherited: InheritedValueType.Include
|
170
|
+
}
|
177
171
|
})
|
178
172
|
|
179
173
|
var colorIndex = {}
|
@@ -23,7 +23,6 @@ export class ScenarioMonitor extends localize(i18next)(LitElement) {
|
|
23
23
|
:host {
|
24
24
|
display: flex;
|
25
25
|
flex-direction: row;
|
26
|
-
margin: var(--margin-default);
|
27
26
|
|
28
27
|
border: var(--border-dark-color);
|
29
28
|
background-color: var(--theme-white-color);
|
@@ -34,11 +33,11 @@ export class ScenarioMonitor extends localize(i18next)(LitElement) {
|
|
34
33
|
}
|
35
34
|
|
36
35
|
[desc] {
|
36
|
+
flex: 1;
|
37
37
|
position: relative;
|
38
38
|
display: flex;
|
39
39
|
flex-direction: column;
|
40
40
|
padding: var(--padding-default);
|
41
|
-
width: 200px;
|
42
41
|
color: var(--secondary-color);
|
43
42
|
font-size: var(--fontsize-small);
|
44
43
|
}
|
@@ -114,9 +113,15 @@ export class ScenarioMonitor extends localize(i18next)(LitElement) {
|
|
114
113
|
margin: var(--margin-default) 0 0 0;
|
115
114
|
}
|
116
115
|
|
116
|
+
:host([mode='detail']) [desc] {
|
117
|
+
flex: unset;
|
118
|
+
width: 200px;
|
119
|
+
}
|
120
|
+
|
117
121
|
:host([mode='detail']) [desc] [buttons] {
|
118
122
|
display: none;
|
119
123
|
}
|
124
|
+
|
120
125
|
:host([mode='detail']) [buttons] {
|
121
126
|
border-top: none;
|
122
127
|
padding: var(--padding-default);
|
@@ -137,7 +142,6 @@ export class ScenarioMonitor extends localize(i18next)(LitElement) {
|
|
137
142
|
position: relative;
|
138
143
|
margin: var(--margin-default);
|
139
144
|
min-width: 140px;
|
140
|
-
max-width: 180px;
|
141
145
|
border: 1px solid black;
|
142
146
|
border-radius: var(--border-radius);
|
143
147
|
font-size: 12px;
|
@@ -154,21 +158,12 @@ export class ScenarioMonitor extends localize(i18next)(LitElement) {
|
|
154
158
|
@media screen and (max-width: 480px) {
|
155
159
|
:host {
|
156
160
|
margin: var(--margin-narrow);
|
157
|
-
max-width: 46%;
|
158
|
-
}
|
159
|
-
|
160
|
-
:host([mode='detail']) {
|
161
|
-
max-width: initial;
|
162
161
|
}
|
163
162
|
|
164
163
|
[desc] {
|
165
164
|
padding: var(--padding-narrow);
|
166
165
|
}
|
167
166
|
|
168
|
-
:host([mode='detail']) > [desc] {
|
169
|
-
max-width: 125px;
|
170
|
-
}
|
171
|
-
|
172
167
|
[desc] [detail-info] {
|
173
168
|
height: 38px;
|
174
169
|
}
|
@@ -230,17 +225,8 @@ export class ScenarioMonitor extends localize(i18next)(LitElement) {
|
|
230
225
|
<div buttons ?detail=${this.mode == 'detail'}>
|
231
226
|
<mwc-icon-button @click=${e => this.popupLogView(scenario)} icon="text_snippet"></mwc-icon-button>
|
232
227
|
${!scenarioInstance
|
233
|
-
? html` <mwc-icon-button
|
234
|
-
|
235
|
-
@click=${e => this.startScenario(scenario)}
|
236
|
-
></mwc-icon-button>`
|
237
|
-
: html`
|
238
|
-
<mwc-icon-button
|
239
|
-
icon="pause_circle_outline"
|
240
|
-
@click=${e => this.stopScenario(scenario)}
|
241
|
-
stop
|
242
|
-
></mwc-icon-button>
|
243
|
-
`}
|
228
|
+
? html` <mwc-icon-button icon="play_circle_outline" @click=${e => this.startScenario(scenario)}></mwc-icon-button>`
|
229
|
+
: html` <mwc-icon-button icon="pause_circle_outline" @click=${e => this.stopScenario(scenario)} stop></mwc-icon-button> `}
|
244
230
|
</div>
|
245
231
|
`
|
246
232
|
}
|
@@ -268,9 +254,7 @@ export class ScenarioMonitor extends localize(i18next)(LitElement) {
|
|
268
254
|
|
269
255
|
notify({
|
270
256
|
level: 'info',
|
271
|
-
message: `${!IS_SCENARIO_RUNNING(response.data.startScenario.state) ? 'fail' : 'success'} to start instance : ${
|
272
|
-
scenario.name
|
273
|
-
}`
|
257
|
+
message: `${!IS_SCENARIO_RUNNING(response.data.startScenario.state) ? 'fail' : 'success'} to start instance : ${scenario.name}`
|
274
258
|
})
|
275
259
|
}
|
276
260
|
|
@@ -290,9 +274,7 @@ export class ScenarioMonitor extends localize(i18next)(LitElement) {
|
|
290
274
|
|
291
275
|
notify({
|
292
276
|
level: 'info',
|
293
|
-
message: `${IS_SCENARIO_RUNNING(response.data.stopScenario.state) ? 'fail' : 'success'} to stop instance : ${
|
294
|
-
scenario.name
|
295
|
-
}`
|
277
|
+
message: `${IS_SCENARIO_RUNNING(response.data.stopScenario.state) ? 'fail' : 'success'} to stop instance : ${scenario.name}`
|
296
278
|
})
|
297
279
|
}
|
298
280
|
}
|
@@ -8,10 +8,6 @@ import { customElement, property, query } from 'lit/decorators.js'
|
|
8
8
|
import { i18next, localize } from '@operato/i18n'
|
9
9
|
import { ScrollbarStyles } from '@operato/styles'
|
10
10
|
|
11
|
-
function IS_SCENARIO_RUNNING(state) {
|
12
|
-
return state && state !== 'UNLOADED'
|
13
|
-
}
|
14
|
-
|
15
11
|
@customElement('scenarios-monitor')
|
16
12
|
export class ScenariosMonitor extends localize(i18next)(LitElement) {
|
17
13
|
static styles = [
|
@@ -84,12 +80,17 @@ export class ScenariosMonitor extends localize(i18next)(LitElement) {
|
|
84
80
|
[scenarios] [flowbox] {
|
85
81
|
display: flex;
|
86
82
|
flex-direction: column;
|
87
|
-
|
83
|
+
padding: 10px;
|
84
|
+
gap: 12px;
|
88
85
|
}
|
89
86
|
|
90
87
|
[scenarios][mode='brief'] [flowbox] {
|
91
|
-
|
92
|
-
|
88
|
+
overflow: auto;
|
89
|
+
display: grid;
|
90
|
+
|
91
|
+
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
|
92
|
+
grid-auto-rows: max-content;
|
93
|
+
grid-gap: 12px;
|
93
94
|
}
|
94
95
|
|
95
96
|
scenario-monitor {
|
@@ -128,16 +129,12 @@ export class ScenariosMonitor extends localize(i18next)(LitElement) {
|
|
128
129
|
</div>
|
129
130
|
|
130
131
|
<div content>
|
131
|
-
<pending-q-monitor
|
132
|
-
.pendings=${this.pendings}
|
133
|
-
.colorIndex=${this.colorIndex || {}}
|
134
|
-
.running=${this.running}
|
135
|
-
></pending-q-monitor>
|
132
|
+
<pending-q-monitor .pendings=${this.pendings} .colorIndex=${this.colorIndex || {}} .running=${this.running}></pending-q-monitor>
|
136
133
|
|
137
134
|
<div scenarios mode=${mode}>
|
138
135
|
<div flowbox>
|
139
136
|
${scenarios
|
140
|
-
.filter(scenario => scenario.name
|
137
|
+
.filter(scenario => new RegExp(filter, 'i').test(scenario.name))
|
141
138
|
.map(scenario => html`<scenario-monitor .scenario=${scenario} mode=${mode}></scenario-monitor>`)}
|
142
139
|
</div>
|
143
140
|
</div>
|
@@ -8,7 +8,7 @@ import { css, html } from 'lit';
|
|
8
8
|
import { customElement, property } from 'lit/decorators.js';
|
9
9
|
import { client, subscribe } from '@operato/graphql';
|
10
10
|
import { i18next, localize } from '@operato/i18n';
|
11
|
-
import { PageView } from '@operato/shell';
|
11
|
+
import { PageView, InheritedValueType } from '@operato/shell';
|
12
12
|
import { ScrollbarStyles } from '@operato/styles';
|
13
13
|
function IS_SCENARIO_RUNNING(state) {
|
14
14
|
return state && state !== 'UNLOADED';
|
@@ -37,18 +37,9 @@ let IntegrationMonitor = class IntegrationMonitor extends localize(i18next)(Page
|
|
37
37
|
}
|
38
38
|
render() {
|
39
39
|
return html `
|
40
|
-
<integration-summary
|
41
|
-
.pendings=${this.pendings}
|
42
|
-
.scenarios=${this.scenarios}
|
43
|
-
.connections=${this.connections}
|
44
|
-
></integration-summary>
|
40
|
+
<integration-summary .pendings=${this.pendings} .scenarios=${this.scenarios} .connections=${this.connections}></integration-summary>
|
45
41
|
<content>
|
46
|
-
<scenarios-monitor
|
47
|
-
.scenarios=${this.scenarios}
|
48
|
-
.pendings=${this.pendings}
|
49
|
-
.colorIndex=${this.colorIndex || {}}
|
50
|
-
.running=${!!this.active}
|
51
|
-
></scenarios-monitor>
|
42
|
+
<scenarios-monitor .scenarios=${this.scenarios} .pendings=${this.pendings} .colorIndex=${this.colorIndex || {}} .running=${!!this.active}></scenarios-monitor>
|
52
43
|
<connections-monitor .connections=${this.connections}></connections-monitor>
|
53
44
|
</content>
|
54
45
|
`;
|
@@ -68,8 +59,8 @@ let IntegrationMonitor = class IntegrationMonitor extends localize(i18next)(Page
|
|
68
59
|
async fetchScenarios() {
|
69
60
|
const response = await client.query({
|
70
61
|
query: gql `
|
71
|
-
query {
|
72
|
-
responses: scenarios {
|
62
|
+
query ($inherited: InheritedValueType) {
|
63
|
+
responses: scenarios(inherited: $inherited) {
|
73
64
|
items {
|
74
65
|
id
|
75
66
|
name
|
@@ -101,7 +92,10 @@ let IntegrationMonitor = class IntegrationMonitor extends localize(i18next)(Page
|
|
101
92
|
total
|
102
93
|
}
|
103
94
|
}
|
104
|
-
|
95
|
+
`,
|
96
|
+
variables: {
|
97
|
+
inherited: InheritedValueType.Include
|
98
|
+
}
|
105
99
|
});
|
106
100
|
var colorIndex = {};
|
107
101
|
this.scenarios = (response.data.responses.items || []).map(scenario => {
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"integration-monitor.js","sourceRoot":"","sources":["../../client/pages/integration-monitor.ts"],"names":[],"mappings":"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","sourcesContent":["import '../viewparts/monitoring-summary'\nimport '../viewparts/pending-q-monitor'\nimport '../viewparts/scenarios-monitor'\nimport '../viewparts/connections-monitor'\n\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { client, subscribe } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { PageView } from '@operato/shell'\nimport { ScrollbarStyles } from '@operato/styles'\n\nfunction IS_SCENARIO_RUNNING(state) {\n return state && state !== 'UNLOADED'\n}\n\nfunction toColor(string) {\n var hash = 0\n if (string.length === 0) return hash\n for (var i = 0; i < string.length; i++) {\n hash = string.charCodeAt(i) + ((hash << 5) - hash)\n hash = hash & hash\n }\n var color = '#'\n for (var i = 0; i < 3; i++) {\n var value = (hash >> (i * 8)) & 255\n color += ('00' + value.toString(16)).substr(-2)\n }\n return color\n}\n\n@customElement('integration-monitor')\nexport class IntegrationMonitor extends localize(i18next)(PageView) {\n static ScenarioInstanceStatus = ['READY', 'STARTED', 'STOPPED', 'HALTED']\n\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n overflow: hidden;\n background-color: var(--main-section-background-color);\n padding: var(--padding-wide);\n }\n\n integration-summary {\n margin-bottom: var(--margin-wide);\n }\n\n content {\n flex: 1;\n display: flex;\n flex-direction: row;\n\n overflow: hidden;\n }\n\n connections-monitor {\n width: 180px;\n }\n\n scenarios-monitor {\n flex: 1;\n margin: 0 var(--margin-wide) 0 0;\n }\n\n @media screen and (max-width: 480px) {\n :host {\n padding: var(--padding-default);\n }\n integration-summary {\n margin-bottom: var(--margin-default);\n }\n content {\n display: block;\n overflow: auto;\n }\n scenarios-monitor {\n min-height: 350px;\n margin: 0 0 var(--margin-default) 0;\n }\n connections-monitor {\n width: initial;\n }\n }\n `\n ]\n\n @property({ type: Array }) scenarios: any\n @property({ type: Array }) pendings: any\n @property({ type: Array }) connections: any\n @property({ type: Object }) colorIndex: any\n\n scenarioInstanceStateSubscription: any\n scenarioQueueStateSubscription: any\n connectionStateSubscription: any\n\n get context() {\n return {\n title: i18next.t('text.integration monitor'),\n help: 'integration/ui/integration-monitor'\n }\n }\n\n render() {\n return html`\n <integration-summary\n .pendings=${this.pendings}\n .scenarios=${this.scenarios}\n .connections=${this.connections}\n ></integration-summary>\n <content>\n <scenarios-monitor\n .scenarios=${this.scenarios}\n .pendings=${this.pendings}\n .colorIndex=${this.colorIndex || {}}\n .running=${!!this.active}\n ></scenarios-monitor>\n <connections-monitor .connections=${this.connections}></connections-monitor>\n </content>\n `\n }\n\n async pageUpdated(changes) {\n if ('active' in changes) {\n if (this.active) {\n await this.fetchScenarios()\n await this.fetchConnections()\n await this.startSubscribe()\n } else {\n await this.stopSubscribe()\n }\n }\n }\n\n async fetchScenarios() {\n const response = await client.query({\n query: gql`\n query {\n responses: scenarios {\n items {\n id\n name\n description\n active\n state\n schedule\n timezone\n instances {\n instanceName\n scenarioName\n state\n progress {\n rate\n steps\n step\n rounds\n }\n variables\n data\n message\n }\n updater {\n id\n name\n }\n updatedAt\n }\n total\n }\n }\n `\n })\n\n var colorIndex = {}\n this.scenarios = (response.data.responses.items || []).map(scenario => {\n var color = toColor(scenario.id)\n colorIndex[scenario.id] = color\n\n return {\n ...scenario,\n color\n }\n })\n this.colorIndex = colorIndex\n }\n\n async fetchConnections() {\n const response = await client.query({\n query: gql`\n query {\n responses: connections {\n items {\n id\n name\n description\n type\n state\n }\n total\n }\n }\n `\n })\n\n this.connections = response.data.responses.items || []\n // .map(connection => {\n // var color = toColor(scenario.id)\n // colorIndex[scenario.id] = color\n\n // return {\n // ...scenario,\n // color\n // }\n // })\n // this.colorIndex = colorIndex\n }\n\n async startSubscribe() {\n if (this.scenarioInstanceStateSubscription) {\n return\n }\n\n this.scenarioInstanceStateSubscription = await subscribe(\n {\n query: gql`\n subscription {\n scenarioInstanceState {\n instanceName\n scenarioName\n state\n progress {\n rate\n steps\n step\n rounds\n }\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n var { scenarioName, instanceName, state } = data.scenarioInstanceState\n\n this.scenarios = this.scenarios || []\n var scenario = this.scenarios.find(scenario => scenario.name === scenarioName)\n\n if (scenario) {\n var idx = scenario.instances.findIndex(instance => instance.instanceName === instanceName)\n if (idx == -1) {\n if (IS_SCENARIO_RUNNING(state)) {\n scenario.instances.push(data.scenarioInstanceState)\n }\n } else {\n if (!IS_SCENARIO_RUNNING(state)) {\n scenario.instances.splice(idx, 1)\n } else {\n scenario.instances.splice(idx, 1, data.scenarioInstanceState)\n }\n }\n } else {\n this.scenarios = []\n\n await this.stopSubscribe()\n await this.fetchScenarios()\n await this.startSubscribe()\n\n return\n }\n\n /* change object intentionally to force to refresh scenario */\n this.scenarios.splice(this.scenarios.indexOf(scenario), 1, { ...scenario })\n this.scenarios = [...this.scenarios]\n }\n },\n start: subscription => {\n console.log(subscription)\n },\n error: error => {\n console.log(error)\n },\n complete: () => {\n console.log('complete')\n }\n }\n )\n\n this.scenarioQueueStateSubscription = await subscribe(\n {\n query: gql`\n subscription {\n scenarioQueueState {\n queue {\n stuff\n due\n priority\n tag\n }\n }\n }\n `\n },\n {\n next: ({ data }) => {\n if (data) {\n this.pendings = data.scenarioQueueState.queue\n }\n }\n }\n )\n\n this.connectionStateSubscription = await subscribe(\n {\n query: gql`\n subscription {\n connectionState {\n id\n name\n description\n type\n state\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n var state = data.connectionState\n\n this.connections = this.connections || []\n var idx = this.connections.findIndex(connection => connection.id === state.id)\n\n if (idx !== -1) {\n this.connections[idx] = data.connectionState\n this.connections = [...this.connections]\n } else {\n this.connections = [...this.connections, data.connectionState]\n }\n }\n }\n }\n )\n }\n\n async stopSubscribe() {\n await this.scenarioInstanceStateSubscription?.unsubscribe()\n await this.scenarioQueueStateSubscription?.unsubscribe()\n await this.connectionStateSubscription?.unsubscribe()\n\n delete this.scenarioInstanceStateSubscription\n delete this.scenarioQueueStateSubscription\n delete this.connectionStateSubscription\n }\n}\n"]}
|
1
|
+
{"version":3,"file":"integration-monitor.js","sourceRoot":"","sources":["../../client/pages/integration-monitor.ts"],"names":[],"mappings":"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","sourcesContent":["import '../viewparts/monitoring-summary'\nimport '../viewparts/pending-q-monitor'\nimport '../viewparts/scenarios-monitor'\nimport '../viewparts/connections-monitor'\n\nimport gql from 'graphql-tag'\nimport { css, html } from 'lit'\nimport { customElement, property, query } from 'lit/decorators.js'\n\nimport { client, subscribe } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { PageView, InheritedValueType } from '@operato/shell'\nimport { ScrollbarStyles } from '@operato/styles'\n\nfunction IS_SCENARIO_RUNNING(state) {\n return state && state !== 'UNLOADED'\n}\n\nfunction toColor(string) {\n var hash = 0\n if (string.length === 0) return hash\n for (var i = 0; i < string.length; i++) {\n hash = string.charCodeAt(i) + ((hash << 5) - hash)\n hash = hash & hash\n }\n var color = '#'\n for (var i = 0; i < 3; i++) {\n var value = (hash >> (i * 8)) & 255\n color += ('00' + value.toString(16)).substr(-2)\n }\n return color\n}\n\n@customElement('integration-monitor')\nexport class IntegrationMonitor extends localize(i18next)(PageView) {\n static ScenarioInstanceStatus = ['READY', 'STARTED', 'STOPPED', 'HALTED']\n\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n overflow: hidden;\n background-color: var(--main-section-background-color);\n padding: var(--padding-wide);\n }\n\n integration-summary {\n margin-bottom: var(--margin-wide);\n }\n\n content {\n flex: 1;\n display: flex;\n flex-direction: row;\n\n overflow: hidden;\n }\n\n connections-monitor {\n width: 180px;\n }\n\n scenarios-monitor {\n flex: 1;\n margin: 0 var(--margin-wide) 0 0;\n }\n\n @media screen and (max-width: 480px) {\n :host {\n padding: var(--padding-default);\n }\n integration-summary {\n margin-bottom: var(--margin-default);\n }\n content {\n display: block;\n overflow: auto;\n }\n scenarios-monitor {\n min-height: 350px;\n margin: 0 0 var(--margin-default) 0;\n }\n connections-monitor {\n width: initial;\n }\n }\n `\n ]\n\n @property({ type: Array }) scenarios: any\n @property({ type: Array }) pendings: any\n @property({ type: Array }) connections: any\n @property({ type: Object }) colorIndex: any\n\n scenarioInstanceStateSubscription: any\n scenarioQueueStateSubscription: any\n connectionStateSubscription: any\n\n get context() {\n return {\n title: i18next.t('text.integration monitor'),\n help: 'integration/ui/integration-monitor'\n }\n }\n\n render() {\n return html`\n <integration-summary .pendings=${this.pendings} .scenarios=${this.scenarios} .connections=${this.connections}></integration-summary>\n <content>\n <scenarios-monitor .scenarios=${this.scenarios} .pendings=${this.pendings} .colorIndex=${this.colorIndex || {}} .running=${!!this.active}></scenarios-monitor>\n <connections-monitor .connections=${this.connections}></connections-monitor>\n </content>\n `\n }\n\n async pageUpdated(changes) {\n if ('active' in changes) {\n if (this.active) {\n await this.fetchScenarios()\n await this.fetchConnections()\n await this.startSubscribe()\n } else {\n await this.stopSubscribe()\n }\n }\n }\n\n async fetchScenarios() {\n const response = await client.query({\n query: gql`\n query ($inherited: InheritedValueType) {\n responses: scenarios(inherited: $inherited) {\n items {\n id\n name\n description\n active\n state\n schedule\n timezone\n instances {\n instanceName\n scenarioName\n state\n progress {\n rate\n steps\n step\n rounds\n }\n variables\n data\n message\n }\n updater {\n id\n name\n }\n updatedAt\n }\n total\n }\n }\n `,\n variables: {\n inherited: InheritedValueType.Include\n }\n })\n\n var colorIndex = {}\n this.scenarios = (response.data.responses.items || []).map(scenario => {\n var color = toColor(scenario.id)\n colorIndex[scenario.id] = color\n\n return {\n ...scenario,\n color\n }\n })\n this.colorIndex = colorIndex\n }\n\n async fetchConnections() {\n const response = await client.query({\n query: gql`\n query {\n responses: connections {\n items {\n id\n name\n description\n type\n state\n }\n total\n }\n }\n `\n })\n\n this.connections = response.data.responses.items || []\n // .map(connection => {\n // var color = toColor(scenario.id)\n // colorIndex[scenario.id] = color\n\n // return {\n // ...scenario,\n // color\n // }\n // })\n // this.colorIndex = colorIndex\n }\n\n async startSubscribe() {\n if (this.scenarioInstanceStateSubscription) {\n return\n }\n\n this.scenarioInstanceStateSubscription = await subscribe(\n {\n query: gql`\n subscription {\n scenarioInstanceState {\n instanceName\n scenarioName\n state\n progress {\n rate\n steps\n step\n rounds\n }\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n var { scenarioName, instanceName, state } = data.scenarioInstanceState\n\n this.scenarios = this.scenarios || []\n var scenario = this.scenarios.find(scenario => scenario.name === scenarioName)\n\n if (scenario) {\n var idx = scenario.instances.findIndex(instance => instance.instanceName === instanceName)\n if (idx == -1) {\n if (IS_SCENARIO_RUNNING(state)) {\n scenario.instances.push(data.scenarioInstanceState)\n }\n } else {\n if (!IS_SCENARIO_RUNNING(state)) {\n scenario.instances.splice(idx, 1)\n } else {\n scenario.instances.splice(idx, 1, data.scenarioInstanceState)\n }\n }\n } else {\n this.scenarios = []\n\n await this.stopSubscribe()\n await this.fetchScenarios()\n await this.startSubscribe()\n\n return\n }\n\n /* change object intentionally to force to refresh scenario */\n this.scenarios.splice(this.scenarios.indexOf(scenario), 1, { ...scenario })\n this.scenarios = [...this.scenarios]\n }\n },\n start: subscription => {\n console.log(subscription)\n },\n error: error => {\n console.log(error)\n },\n complete: () => {\n console.log('complete')\n }\n }\n )\n\n this.scenarioQueueStateSubscription = await subscribe(\n {\n query: gql`\n subscription {\n scenarioQueueState {\n queue {\n stuff\n due\n priority\n tag\n }\n }\n }\n `\n },\n {\n next: ({ data }) => {\n if (data) {\n this.pendings = data.scenarioQueueState.queue\n }\n }\n }\n )\n\n this.connectionStateSubscription = await subscribe(\n {\n query: gql`\n subscription {\n connectionState {\n id\n name\n description\n type\n state\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n var state = data.connectionState\n\n this.connections = this.connections || []\n var idx = this.connections.findIndex(connection => connection.id === state.id)\n\n if (idx !== -1) {\n this.connections[idx] = data.connectionState\n this.connections = [...this.connections]\n } else {\n this.connections = [...this.connections, data.connectionState]\n }\n }\n }\n }\n )\n }\n\n async stopSubscribe() {\n await this.scenarioInstanceStateSubscription?.unsubscribe()\n await this.scenarioQueueStateSubscription?.unsubscribe()\n await this.connectionStateSubscription?.unsubscribe()\n\n delete this.scenarioInstanceStateSubscription\n delete this.scenarioQueueStateSubscription\n delete this.connectionStateSubscription\n }\n}\n"]}
|