@c8y/ng1-modules 1021.81.0 → 1022.4.2

package/core/ui/properties/propertySelector.html

@@ -1,35 +1,170 @@
-<div class="form-group m-b-8">
-  <label>{{ 'Properties' | translate }}</label>
-  <div class="d-flex">
-    <div class="m-l-auto m-r-16">
-      <a
-        title="{{ 'Add property' | translate }}"
-        class="btn btn-default btn-xs"
-        data-ng-click="addProperty()"
+<fieldset class="c8y-fieldset">
+  <legend>{{ 'Properties' | translate }}</legend>
+  <table class="table table-vertical-middle table-condensed" style="table-layout: fixed;">
+    <colgroup>
+      <col style="width: 5%" />
+      <col style="width: 7%" />
+      <col style="width: 28%" />
+      <col style="width: 28%" />
+      <col
+        ng-if="showRenderType()"
+        style="width: 28%"
+      />
+      <col style="width: 5%" />
+    </colgroup>
+    <thead>
+      <th></th>
+      <th>
+        <span>{{ 'Show' | translate }}</span>
+      </th>
+      <th>
+        <span>{{ 'Label' | translate }}</span>
+      </th>
+      <th>
+        <span>{{ 'Property' | translate }}</span>
+      </th>
+      <th
+        ng-if="showRenderType()"
       >
-        <i c8y-icon="plus"></i>
-        {{ 'Add property' | translate }}
-      </a>
-    </div>
-    <div class="dropdown" ng-hide="hideActions" uib-dropdown>
+        <span>{{ 'Render type' | translate }}</span>
+      </th>
+      <th></th>
+    </thead>
+
+    <tbody
+      ui-sortable="{handle: '.handle', stop: onPropertiesOrderChanged}"
+      ng-model="properties"
+    >
+      <tr
+        class="property"
+        ng-repeat="property in properties"
+      >
+        <td
+          class="handle"
+        >
+          <i
+            c8y-icon="bars"
+            style="cursor: move"
+          ></i>
+        </td>
+        <td>
+          <label
+            class="c8y-checkbox"
+            title="{{ 'Show' | translate }}"
+          >
+            <input
+              type="checkbox"
+              ng-change="updateOptions()"
+              ng-model="property.__active"
+            />
+            <span></span>
+          </label>
+        </td>
+        <td>
+          <input
+            class="form-control property-label input-sm"
+            data-ng-model="property.label"
+          />
+        </td>
+        <td>
+          <button
+            class="btn btn-xs btn-default"
+            aria-label="{{ 'Configure computed property' | translate }}"
+            uib-tooltip="{{ 'Configure computed property' | translate }}"
+            tooltip-popup-delay="500"
+            tooltip-append-to-body="true"
+            type="button"
+            ng-show="!!property.configSchema"
+            ng-click="configComputeProperty(property)"
+          >
+            <i c8y-icon="bolt"></i>
+            {{ displayKeyPath(property.keyPath) }}
+          </button>
+          <span
+            class="text-truncate"
+            title="{{ displayKeyPath(property.keyPath) }}"
+            ng-hide="!!property.configSchema"
+          >
+            {{ displayKeyPath(property.keyPath) }}
+          </span>
+        </td>
+        <td
+          ng-if="showRenderType()"
+        >
+          <div class="input-group d-flex">
+            <div class="c8y-select-wrapper">
+              <select
+                class="form-control input-sm"
+                name="renderType"
+                ng-disabled="property.isAction"
+                ng-model="property.renderType"
+                ng-options="render.name as render.humanName | translate for render in renderTypes"
+              ></select>
+            </div>
+            <span class="m-l-4">
+              <button
+                class="btn btn-xs pull-right"
+                ng-class="{
+                  'btn-danger': !property.renderConfig,
+                  'btn-default': property.renderConfig
+                }"
+                title="{{ 'Config renderer' | translate }}"
+                type="button"
+                ng-click="configRenderer(property)"
+                ng-show="rendererHasConfig(property.renderType)"
+              >
+                <i c8y-icon="sliders"></i>
+              </button>
+            </span>
+          </div>
+        </td>
+        <td>
+          <button
+            class="btn btn-dot btn-dot--danger showOnHover pull-right"
+            title="{{ 'Delete property' | translate }}"
+            type="button"
+            ng-click="removeProperty(property)"
+          >
+            <i c8y-icon="minus-circle"></i>
+          </button>
+        </td>
+      </tr>
+    </tbody>
+  </table>
+  <div class="m-t-16 m-b-16 d-flex gap-8 a-i-center">
+    <a
+      class="btn btn-default btn-sm"
+      title="{{ 'Add property' | translate }}"
+      data-ng-click="addProperty()"
+    >
+      <i c8y-icon="plus-circle"></i>
+      {{ 'Add property' | translate }}
+    </a>
+    <div
+      class="dropdown"
+      ng-hide="hideActions"
+      uib-dropdown
+    >
       <button
-        class="btn btn-default btn-xs dropdown-toggle c8y-dropdown"
-        type="button"
+        class="btn btn-default btn-sm dropdown-toggle c8y-dropdown"
         title="{{ 'Add action' | translate }}"
+        aria-haspopup="true"
+        type="button"
         data-cy="property-selector--add-action"
         uib-dropdown-toggle
-        aria-haspopup="true"
       >
-        <i c8y-icon="plus"></i>
         {{ 'Add action' | translate }}
+        <span class="caret"></span>
       </button>
-      <ul class="dropdown-menu dropdown-menu-right m-t-8" uib-dropdown-menu>
+      <ul
+        class="dropdown-menu dropdown-menu-right m-t-8"
+        uib-dropdown-menu
+      >
         <li ng-repeat="action in actions">
           <button
-            class="btn btn-link"
+            title="{{ action.config.label | translate }}"
             type="button"
             data-cy="property-selector--{{ action.config.label }}"
-            title="{{ action.config.label | translate }}"
             ng-click="addAction(action)"
           >
             {{ action.config.label | translate }}
@@ -38,94 +173,6 @@
       </ul>
     </div>
   </div>
-</div>
+</fieldset>
 
-<table class="table table-vertical-middle form-group">
-  <thead>
-    <th style="width: 5%"></th>
-    <th style="width: 5%">
-      <label>{{ 'Show' | translate }}</label>
-    </th>
-    <th style="width: 28%">
-      <label>{{ 'Label' | translate }}</label>
-    </th>
-    <th style="width: 28%">
-      <label>{{ 'Property' | translate }}</label>
-    </th>
-    <th style="width: 28%" ng-if="showRenderType()">
-      <label>{{ 'Render type' | translate }}</label>
-    </th>
-    <th style="width: 5%"></th>
-  </thead>
-
-  <tbody ui-sortable="{handle: '.handle', stop: onPropertiesOrderChanged}" ng-model="properties">
-    <tr class="property" ng-repeat="property in properties">
-      <td style="width: 5%" class="handle">
-        <i c8y-icon="bars" style="cursor: move"></i>
-      </td>
-      <td style="width: 5%">
-        <input type="checkbox" ng-change="updateOptions()" ng-model="property.__active" />
-      </td>
-      <td style="width: 28%">
-        <input class="form-control property-label" data-ng-model="property.label" />
-      </td>
-      <td style="width: 28%">
-        <button
-          class="btn btn-xs btn-default"
-          type="button"
-          aria-label="{{ 'Configure computed property' | translate }}"
-          uib-tooltip="{{ 'Configure computed property' | translate }}"
-          tooltip-popup-delay="500"
-          tooltip-append-to-body="true"
-          ng-show="!!property.configSchema"
-          ng-click="configComputeProperty(property)"
-        >
-          <i c8y-icon="bolt"></i>
-          {{ displayKeyPath(property.keyPath) }}
-        </button>
-        <span ng-hide="!!property.configSchema">{{ displayKeyPath(property.keyPath) }}</span>
-      </td>
-      <td style="width: 28%" ng-if="showRenderType()">
-        <div class="input-group d-flex">
-          <div class="c8y-select-wrapper">
-            <select
-              class="form-control"
-              name="renderType"
-              ng-disabled="property.isAction"
-              ng-model="property.renderType"
-              ng-options="render.name as render.humanName | translate for render in renderTypes"
-            >
-              <span></span>
-            </select>
-          </div>
-          <span class="m-l-4">
-            <button
-              class="btn btn-xs pull-right"
-              type="button"
-              title="{{ 'Config renderer' | translate }}"
-              ng-click="configRenderer(property)"
-              ng-show="rendererHasConfig(property.renderType)"
-              ng-class="{
-                'btn-danger': !property.renderConfig,
-                'btn-default': property.renderConfig
-              }"
-            >
-              <i c8y-icon="sliders"></i>
-            </button>
-          </span>
-        </div>
-      </td>
-      <td style="width: 5%">
-        <button
-          class="btn btn-dot btn-dot--danger showOnHover pull-right"
-          type="button"
-          title="{{ 'Delete property' | translate }}"
-          ng-click="removeProperty(property)"
-        >
-          <i c8y-icon="times"></i>
-        </button>
-      </td>
-    </tr>
-  </tbody>
-</table>
 <ng-form name="propertiesHiddenForm"></ng-form>

package/core/ui/services/measurementsReport.js

@@ -1 +1 @@
-function _typeof(t){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function _regeneratorRuntime(){_regeneratorRuntime=function(){return a};var u,a={},t=Object.prototype,s=t.hasOwnProperty,l=Object.defineProperty||function(t,e,r){t[e]=r.value},e="function"==typeof Symbol?Symbol:{},n=e.iterator||"@@iterator",r=e.asyncIterator||"@@asyncIterator",o=e.toStringTag||"@@toStringTag";function i(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{i({},"")}catch(u){i=function(t,e,r){return t[e]=r}}function c(t,e,r,n){var o,i,a,c,e=e&&e.prototype instanceof m?e:m,e=Object.create(e.prototype),n=new R(n||[]);return l(e,"_invoke",{value:(o=t,i=r,a=n,c=h,function(t,e){if(c===d)throw Error("Generator is already running");if(c===y){if("throw"===t)throw e;return{value:u,done:!0}}for(a.method=t,a.arg=e;;){var r=a.delegate;if(r){r=function t(e,r){var n=r.method,o=e.iterator[n];if(o===u)return r.delegate=null,"throw"===n&&e.iterator.return&&(r.method="return",r.arg=u,t(e,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),v;n=f(o,e.iterator,r.arg);if("throw"===n.type)return r.method="throw",r.arg=n.arg,r.delegate=null,v;o=n.arg;return o?o.done?(r[e.resultName]=o.value,r.next=e.nextLoc,"return"!==r.method&&(r.method="next",r.arg=u),r.delegate=null,v):o:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,v)}(r,a);if(r){if(r===v)continue;return r}}if("next"===a.method)a.sent=a._sent=a.arg;else if("throw"===a.method){if(c===h)throw c=y,a.arg;a.dispatchException(a.arg)}else"return"===a.method&&a.abrupt("return",a.arg);c=d;r=f(o,i,a);if("normal"===r.type){if(c=a.done?y:p,r.arg===v)continue;return{value:r.arg,done:a.done}}"throw"===r.type&&(c=y,a.method="throw",a.arg=r.arg)}})}),e}function f(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}a.wrap=c;var h="suspendedStart",p="suspendedYield",d="executing",y="completed",v={};function m(){}function g(){}function w(){}var e={},b=(i(e,n,function(){return this}),Object.getPrototypeOf),b=b&&b(b(F([]))),_=(b&&b!==t&&s.call(b,n)&&(e=b),w.prototype=m.prototype=Object.create(e));function E(t){["next","throw","return"].forEach(function(e){i(t,e,function(t){return this._invoke(e,t)})})}function x(a,c){var e;l(this,"_invoke",{value:function(r,n){function t(){return new c(function(t,e){!function e(t,r,n,o){var i,t=f(a[t],a,r);if("throw"!==t.type)return(r=(i=t.arg).value)&&"object"==_typeof(r)&&s.call(r,"__await")?c.resolve(r.__await).then(function(t){e("next",t,n,o)},function(t){e("throw",t,n,o)}):c.resolve(r).then(function(t){i.value=t,n(i)},function(t){return e("throw",t,n,o)});o(t.arg)}(r,n,t,e)})}return e=e?e.then(t,t):t()}})}function L(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function S(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function R(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(L,this),this.reset(!0)}function F(e){if(e||""===e){var r,t=e[n];if(t)return t.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length))return r=-1,(t=function t(){for(;++r<e.length;)if(s.call(e,r))return t.value=e[r],t.done=!1,t;return t.value=u,t.done=!0,t}).next=t}throw new TypeError(_typeof(e)+" is not iterable")}return l(_,"constructor",{value:g.prototype=w,configurable:!0}),l(w,"constructor",{value:g,configurable:!0}),g.displayName=i(w,o,"GeneratorFunction"),a.isGeneratorFunction=function(t){t="function"==typeof t&&t.constructor;return!!t&&(t===g||"GeneratorFunction"===(t.displayName||t.name))},a.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,w):(t.__proto__=w,i(t,o,"GeneratorFunction")),t.prototype=Object.create(_),t},a.awrap=function(t){return{__await:t}},E(x.prototype),i(x.prototype,r,function(){return this}),a.AsyncIterator=x,a.async=function(t,e,r,n,o){void 0===o&&(o=Promise);var i=new x(c(t,e,r,n),o);return a.isGeneratorFunction(e)?i:i.next().then(function(t){return t.done?t.value:i.next()})},E(_),i(_,o,"Generator"),i(_,n,function(){return this}),i(_,"toString",function(){return"[object Generator]"}),a.keys=function(t){var e,r=Object(t),n=[];for(e in r)n.push(e);return n.reverse(),function t(){for(;n.length;){var e=n.pop();if(e in r)return t.value=e,t.done=!1,t}return t.done=!0,t}},a.values=F,R.prototype={constructor:R,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=u,this.done=!1,this.delegate=null,this.method="next",this.arg=u,this.tryEntries.forEach(S),!t)for(var e in this)"t"===e.charAt(0)&&s.call(this,e)&&!isNaN(+e.slice(1))&&(this[e]=u)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(r){if(this.done)throw r;var n=this;function t(t,e){return i.type="throw",i.arg=r,n.next=t,e&&(n.method="next",n.arg=u),!!e}for(var e=this.tryEntries.length-1;0<=e;--e){var o=this.tryEntries[e],i=o.completion;if("root"===o.tryLoc)return t("end");if(o.tryLoc<=this.prev){var a=s.call(o,"catchLoc"),c=s.call(o,"finallyLoc");if(a&&c){if(this.prev<o.catchLoc)return t(o.catchLoc,!0);if(this.prev<o.finallyLoc)return t(o.finallyLoc)}else if(a){if(this.prev<o.catchLoc)return t(o.catchLoc,!0)}else{if(!c)throw Error("try statement without catch or finally");if(this.prev<o.finallyLoc)return t(o.finallyLoc)}}}},abrupt:function(t,e){for(var r=this.tryEntries.length-1;0<=r;--r){var n=this.tryEntries[r];if(n.tryLoc<=this.prev&&s.call(n,"finallyLoc")&&this.prev<n.finallyLoc){var o=n;break}}var i=(o=o&&("break"===t||"continue"===t)&&o.tryLoc<=e&&e<=o.finallyLoc?null:o)?o.completion:{};return i.type=t,i.arg=e,o?(this.method="next",this.next=o.finallyLoc,v):this.complete(i)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),v},finish:function(t){for(var e=this.tryEntries.length-1;0<=e;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),S(r),v}},catch:function(t){for(var e=this.tryEntries.length-1;0<=e;--e){var r,n,o=this.tryEntries[e];if(o.tryLoc===t)return"throw"===(r=o.completion).type&&(n=r.arg,S(o)),n}throw Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:F(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=u),v}},a}function asyncGeneratorStep(t,e,r,n,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}function _asyncToGenerator(c){return function(){var t=this,a=arguments;return new Promise(function(e,r){var n=c.apply(t,a);function o(t){asyncGeneratorStep(n,e,r,o,i,"next",t)}function i(t){asyncGeneratorStep(n,e,r,o,i,"throw",t)}o(void 0)})}}(()=>{function t(c,u,s,l,f,h,p,d,o){var y=this;this.downloadReportForDevice=function(t,e,r,n){e=_.get(e,"id",e),r=_(r).map(_.partial(y.createPairFromSeries,e)).value();return new y.Downloader(t,n,r).start()},this.downloadReportForDatapoints=function(e,t,r){var n=_(t).filter(function(t){return!0===t.__active}).map(y.getDpRequestParams).value();return n.length?o.current().then(function(t){return o.hasRole(t,"ROLE_MEASUREMENT_READ")?new y.Downloader(e,r,n).start():c.reject(new Error(h("Could not download the report. You need this global permission to download reports: Measurements Read.")))}):c.reject(new Error(h("At least 1 data point must be selected")))},this.createPairFromSeries=function(t,e){return{source:t,fragmentType:e}},this.getDpRequestParams=function(t){return{source:t.__target.id,valueFragmentType:t.fragment,valueFragmentSeries:t.series}},this.generateFileName=function(t,e){if(_.isEmpty(t.source&&e)||_.isEmpty(t.valueFragmentType||t.fragmentType))throw new Error("Unable to generate a file name for given data");var r=t.valueFragmentType?[t.valueFragmentType,t.valueFragmentSeries].join("."):t.fragmentType;return[t.source,r,e].join(".")},this.Downloader=function(r,n,t){var o=this,e=_.uniqBy(t,function(t){return JSON.stringify(t)});function i(){return(i=_asyncToGenerator(_regeneratorRuntime().mark(function t(r){var n,o,e;return _regeneratorRuntime().wrap(function(t){for(;;)switch(t.prev=t.next){case 0:if(n=c.defer(),403!==r.status)t.next=14;else{if(r.data instanceof Blob)return t.next=5,d.detail(r.config.params.source);t.next=11}break;case 5:o=t.sent,(e=new FileReader).addEventListener("loadend",function(t){try{var e=JSON.parse(_.get(t,"srcElement.result"));n.resolve({type:"danger",text:p.getString('Could not download data for "{{name}}": access denied.',o.data),detailedData:e})}catch(t){n.resolve(a(r))}}),e.readAsText(r.data),t.next=12;break;case 11:n.resolve(a(r));case 12:t.next=15;break;case 14:n.resolve({type:"danger",text:h("An error occurred. Please try again later."),detailedData:r});case 15:return t.abrupt("return",n.promise);case 16:case"end":return t.stop()}},t)}))).apply(this,arguments)}function a(t){return{text:h("Access denied."),type:"danger",detailedData:t}}this.downloadReports=function(){var t=_(e).map(o.downloadReportForDpRequestParams).value();return c.all(t).then(o.onDownloads)},this.start=function(){return l({templateUrl:":::PLUGIN_PATH:::/ui/views/measurementsReport.html",title:h("Generating report"),controller:["$scope","$timeout",function(r,n){r.completed=0,r.total=e.length,r.reportFileName="report.zip",r.close=function(){var t,e;void 0!==window.navigator.msSaveBlob?(t=r.blob,window.navigator.msSaveBlob(t,r.reportFileName)):(e=r.url,n(function(){window.URL.revokeObjectURL(e)},5e3)),r.$close()},o.scope=r,o.downloadReports()}]})},this.downloadReportForDpRequestParams=function(e,t){t=o.getFilter(e,t);return u.list(t,r).then(function(t){return o.onDownload(e,t)}).catch(function(t){return o.onDownloadError(t)})},this.onDownload=function(t,e){return o.scope.completed+=1,e.name=y.generateFileName(t,r.name),e},this.onDownloadError=function(t){return t.async?(o.scope.completed+=1,c.resolve(null)):(o.displayError(t),c.resolve(void 0))},this.displayError=function(t){!function(){return i.apply(this,arguments)}(t).then(f.add)},this.onDownloads=function(t){var t=t.filter(function(t){return void 0!==t}),e=t.filter(_.identity),t=t.length-e.length;return 0<t&&(t=p.getPlural(t,"You will get a CSV/Excel file for 1 series via email.","You will get CSV/Excel files for {{$count}} series via email.",{}),f.success(t)),0===e.length?c.when():s.zipFiles(e).then(function(t){o.scope.blob=t,o.scope.url=window.URL.createObjectURL(t)})},this.getFilter=function(t,e){e=_.isArray(n)?n[e]:n;return _.merge({},e,t)}}}t.$inject=["$q","c8yMeasurements","c8yZip","c8yModal","c8yAlert","gettext","gettextCatalog","c8yInventory","c8yUser"],angular.module("c8y.ui").service("MeasurementsReportSvc",t)})();
+function _regenerator(){var g,e="function"==typeof Symbol?Symbol:{},r=e.iterator||"@@iterator",t=e.toStringTag||"@@toStringTag";function n(e,r,t,n){var o,a,i,c,u,s,l,f,d,r=r&&r.prototype instanceof m?r:m,r=Object.create(r.prototype);return _regeneratorDefine2(r,"_invoke",(o=e,a=t,l=n||[],f=!1,d={p:s=0,n:0,v:g,a:p,f:p.bind(g,4),d:function(e,r){return i=e,c=0,u=g,d.n=r,v}},function(e,r,t){if(1<s)throw TypeError("Generator is already running");for(f&&1===r&&p(r,t),c=r,u=t;(y=c<2?g:u)||!f;){i||(c?c<3?(1<c&&(d.n=-1),p(c,u)):d.n=u:d.v=u);try{if(s=2,i){if(y=i[e=c?e:"next"]){if(!(y=y.call(i,u)))throw TypeError("iterator result is not an object");if(!y.done)return y;u=y.value,c<2&&(c=0)}else 1===c&&(y=i.return)&&y.call(i),c<2&&(u=TypeError("The iterator does not provide a '"+e+"' method"),c=1);i=g}else if((y=(f=d.n<0)?u:o.call(a,d))!==v)break}catch(e){i=g,c=1,u=e}finally{s=1}}return{value:y,done:f}}),!0),r;function p(e,r){for(c=e,u=r,y=0;!f&&s&&!t&&y<l.length;y++){var t,n=l[y],o=d.p,a=n[2];3<e?(t=a===r)&&(u=n[(c=n[4])?5:c=3],n[4]=n[5]=g):n[0]<=o&&((t=e<2&&o<n[1])?(c=0,d.v=r,d.n=n[1]):o<a&&(t=e<3||n[0]>r||a<r)&&(n[4]=e,n[5]=r,d.n=a,c=0))}if(t||1<e)return v;throw f=!0,r}}var v={};function m(){}function o(){}function a(){}var y=Object.getPrototypeOf,e=[][r]?y(y([][r]())):(_regeneratorDefine2(y={},r,function(){return this}),y),i=a.prototype=m.prototype=Object.create(e);function c(e){return Object.setPrototypeOf?Object.setPrototypeOf(e,a):(e.__proto__=a,_regeneratorDefine2(e,t,"GeneratorFunction")),e.prototype=Object.create(i),e}return _regeneratorDefine2(i,"constructor",o.prototype=a),_regeneratorDefine2(a,"constructor",o),_regeneratorDefine2(a,t,o.displayName="GeneratorFunction"),_regeneratorDefine2(i),_regeneratorDefine2(i,t,"Generator"),_regeneratorDefine2(i,r,function(){return this}),_regeneratorDefine2(i,"toString",function(){return"[object Generator]"}),(_regenerator=function(){return{w:n,m:c}})()}function _regeneratorDefine2(e,r,t,n){var o=Object.defineProperty;try{o({},"",{})}catch(e){o=0}(_regeneratorDefine2=function(e,r,t,n){r?o?o(e,r,{value:t,enumerable:!n,configurable:!n,writable:!n}):e[r]=t:((n=function(r,t){_regeneratorDefine2(e,r,function(e){return this._invoke(r,t,e)})})("next",0),n("throw",1),n("return",2))})(e,r,t,n)}function asyncGeneratorStep(e,r,t,n,o,a,i){try{var c=e[a](i),u=c.value}catch(e){return void t(e)}c.done?r(u):Promise.resolve(u).then(n,o)}function _asyncToGenerator(c){return function(){var e=this,i=arguments;return new Promise(function(r,t){var n=c.apply(e,i);function o(e){asyncGeneratorStep(n,r,t,o,a,"next",e)}function a(e){asyncGeneratorStep(n,r,t,o,a,"throw",e)}o(void 0)})}}(()=>{function e(c,u,s,l,f,d,p,g,o){var v=this;this.downloadReportForDevice=function(e,r,t,n){r=_.get(r,"id",r),t=_(t).map(_.partial(v.createPairFromSeries,r)).value();return new v.Downloader(e,n,t).start()},this.downloadReportForDatapoints=function(r,e,t){var n=_(e).filter(function(e){return!0===e.__active}).map(v.getDpRequestParams).value();return n.length?o.current().then(function(e){return o.hasRole(e,"ROLE_MEASUREMENT_READ")?new v.Downloader(r,t,n).start():c.reject(new Error(d("Could not download the report. You need this global permission to download reports: Measurements Read.")))}):c.reject(new Error(d("At least 1 data point must be selected")))},this.createPairFromSeries=function(e,r){return{source:e,fragmentType:r}},this.getDpRequestParams=function(e){return{source:e.__target.id,valueFragmentType:e.fragment,valueFragmentSeries:e.series}},this.generateFileName=function(e,r){if(_.isEmpty(e.source&&r)||_.isEmpty(e.valueFragmentType||e.fragmentType))throw new Error("Unable to generate a file name for given data");var t=e.valueFragmentType?[e.valueFragmentType,e.valueFragmentSeries].join("."):e.fragmentType;return[e.source,t,r].join(".")},this.Downloader=function(t,n,e){var o=this,r=_.uniqBy(e,function(e){return JSON.stringify(e)});function a(){return(a=_asyncToGenerator(_regenerator().m(function e(t){var n,o,r;return _regenerator().w(function(e){for(;;)switch(e.n){case 0:if(n=c.defer(),403!==t.status)e.n=4;else{if(t.data instanceof Blob)return e.n=1,g.detail(t.config.params.source);e.n=2}break;case 1:o=e.v,(r=new FileReader).addEventListener("loadend",function(e){try{var r=JSON.parse(_.get(e,"srcElement.result"));n.resolve({type:"danger",text:p.getString('Could not download data for "{{name}}": access denied.',o.data),detailedData:r})}catch(e){n.resolve(i(t))}}),r.readAsText(t.data),e.n=3;break;case 2:n.resolve(i(t));case 3:e.n=5;break;case 4:n.resolve({type:"danger",text:d("An error occurred. Please try again later."),detailedData:t});case 5:return e.a(2,n.promise)}},e)}))).apply(this,arguments)}function i(e){return{text:d("Access denied."),type:"danger",detailedData:e}}this.downloadReports=function(){var e=_(r).map(o.downloadReportForDpRequestParams).value();return c.all(e).then(o.onDownloads)},this.start=function(){return l({templateUrl:":::PLUGIN_PATH:::/ui/views/measurementsReport.html",title:d("Generating report"),controller:["$scope","$timeout",function(t,n){t.completed=0,t.total=r.length,t.reportFileName="report.zip",t.close=function(){var e,r;void 0!==window.navigator.msSaveBlob?(e=t.blob,window.navigator.msSaveBlob(e,t.reportFileName)):(r=t.url,n(function(){window.URL.revokeObjectURL(r)},5e3)),t.$close()},o.scope=t,o.downloadReports()}]})},this.downloadReportForDpRequestParams=function(r,e){e=o.getFilter(r,e);return u.list(e,t).then(function(e){return o.onDownload(r,e)}).catch(function(e){return o.onDownloadError(e)})},this.onDownload=function(e,r){return o.scope.completed+=1,r.name=v.generateFileName(e,t.name),r},this.onDownloadError=function(e){return e.async?(o.scope.completed+=1,c.resolve(null)):(o.displayError(e),c.resolve(void 0))},this.displayError=function(e){!function(){return a.apply(this,arguments)}(e).then(f.add)},this.onDownloads=function(e){var e=e.filter(function(e){return void 0!==e}),r=e.filter(_.identity),e=e.length-r.length;return 0<e&&(e=p.getPlural(e,"You will get a CSV/Excel file for 1 series via email.","You will get CSV/Excel files for {{$count}} series via email.",{}),f.success(e)),0===r.length?c.when():s.zipFiles(r).then(function(e){o.scope.blob=e,o.scope.url=window.URL.createObjectURL(e)})},this.getFilter=function(e,r){r=_.isArray(n)?n[r]:n;return _.merge({},r,e)}}}e.$inject=["$q","c8yMeasurements","c8yZip","c8yModal","c8yAlert","gettext","gettextCatalog","c8yInventory","c8yUser"],angular.module("c8y.ui").service("MeasurementsReportSvc",e)})();

package/core/ui/views/auditList.html

@@ -80,7 +80,7 @@
           </button>
           <i
             class="text-gray-medium-dark"
-            c8y-icon="c8y-events"
+            c8y-icon="online1"
             ng-if="!convertTypeIcon(audit.type)"
           ></i>
         </div>
@@ -160,4 +160,4 @@
     </div>
   </div>
   <c8y-load-more></c8y-load-more>
-</div>
+</div>

package/core/ui/views/eventList.html

@@ -80,7 +80,7 @@
   ng-if="!$parent.child.templateUrl && !hideHeaderActions && ctrl.showOverviewBreadcrumbs"
 >
   <c8y-breadcrumbs-item
-    icon="c8y-events"
+    icon="online1"
     label="{{ 'Events' | translate }}"
   ></c8y-breadcrumbs-item>
   <c8y-breadcrumbs-item
@@ -165,7 +165,7 @@
 
 <!-- empty state -->
 <c8y-ui-empty-state
-  [icon]="'c8y-events'"
+  [icon]="'online1'"
   [title]="'No events to display.' | translate"
   ng-if="events.length == 0"
 >

package/core/ui/views/filePicker.html

@@ -77,7 +77,7 @@
             <i c8y-icon="ellipsis-h"></i>
           </button>
           <button
-            class="btn btn-dot btn-dot--danger"
+            class="btn-dot btn-dot--danger"
             title="{{ 'Remove' | translate }}"
             aria-label="{{ 'Remove' | translate }}"
             type="button"

package/dataBroker/connectors/connectors.service.js

@@ -1 +1 @@
-(()=>{function e(a,o,r,c,i,u,l){var s=c.url("databroker/connectors"),n=c.contentHeaders("connector",!0),e=c.createEnum([{name:"ALARM",value:"alarm",label:u("Alarms"),icon:"bell"},{name:"EVENT",value:"event",label:u("Events"),icon:"c8y-events"},{name:"MEASUREMENT",value:"measurement",label:u("Measurements"),icon:"line-chart"},{name:"MANAGED_OBJECT",value:"managedObject",label:u("Managed objects"),icon:"cubes"},{name:"OPERATION",value:"operation",label:u("Operations"),icon:"code"},{name:"ALL",value:"*",hidden:!0}]),d=c.createEnum([{name:"ACTIVE",label:u("active`connector`")},{name:"ACTIVATING",label:u("activating`connector`")},{name:"SUSPENDED",label:u("suspended`connector`")},{name:"WAITING",label:u("waiting`connector`")}]),g=c.createEnum([{name:"ACTIVE",label:u("active`connector`")},{name:"SUSPENDED",label:u("suspended`connector`")},{name:"WAITING",label:u("waiting`connector`")}]),m=c.createEnum([{name:"ACTIVE",label:u("active`connector`")},{name:"ACTIVATING",label:u("activating`connector`")},{name:"PENDING",label:u("pending`connector`")},{name:"SUSPENDED",label:u("suspended`connector`")},{name:"WAITING",label:u("waiting`connector`")}]),p=["name","description","filters"],t=["id","status","destinationStatus","instanceUrl","tenantId","username","password","code","self","suspendReason"];return{getConnectors:function e(){var t={params:c.pageSizeNoTotalFilter()};var n=c.cleanListCallback("connectors",e,t.params);return o.get(s,t).then(n).then(function(e){return _.forEach(e,E),e})},saveConnector:function(e){{var t;t=c.hasId(e)?(t=_.pick(e,p),f(c.getId(e),t)):T(e)}return t},createConnector:T,updateConnector:f,toggleConnectorStatus:function(t){t.status===d.ACTIVE.value?t.status=d.SUSPENDED.value:t.status=d.ACTIVE.value;return _.unset(t,"visibleStatus"),f(t.id,{status:t.status}).then(function(e){t.status=e.status,E(t)})},getConnector:function(e){return o.get(v(e)).then(c.getResData).then(E)},getConnectorStub:function(){return{name:"",instanceUrl:"",description:"",filters:[]}},getConnectorDuplicate:function(e){return o.get(v(e)).then(c.getResData).then(function(e){return e.name=l.getString("Duplicate of {{name}}",e),_.omit(e,t)})},deleteConnector:function(e){return o({method:"DELETE",url:v(e)})},updateConnectorName:function(t,n){var e=a.when();t.id?e=f(t.id,{name:n}).then(function(e){return t.name=n,e}):t.name=n;return e},convertToViewModel:function(e){e=_.cloneDeep(e);return e.filters=_.map(e.filters,function(e){return e.apis=_.transform(e.apis,function(e,t){e[t]=!0},{}),e.fragmentsToFilter=I(e.fragmentsToFilter),e.copyAllFragments=_.isNull(e.fragmentsToCopy)||_.isUndefined(e.fragmentsToCopy),e.fragmentsToCopy=I(e.fragmentsToCopy),e.selectedGroupOrDevice=(e=>{var t,e=e.deviceGroupId||e.sourceId;return t=e?{id:e}:t})(e),e}),e},convertToBackendModel:function(e){e=_.cloneDeep(e);return e.filters=_.map(e.filters,function(e){a=e.apis;var t,n,a=_(a).map(function(e,t){return e?t:void 0}).compact().value(),o=A(e.fragmentsToFilter),r=e.copyAllFragments?null:A(e.fragmentsToCopy),c=e.selectedGroupOrDevice;return c&&c.isDevice&&(t=c.id),c&&!c.isDevice&&(n=c.id),_.assign(e,{isOpen:void 0,apis:a,fragmentsToFilter:o,fragmentsToCopy:r,copyAllFragments:void 0,sourceId:t,deviceGroupId:n,selectedGroupOrDevice:void 0})}),e},getFilterFragmentsSummary:function(e){var t=A(_.get(e,"fragmentsToFilter",[])),n=A(_.get(e,"fragmentsToCopy",[])),e=_.get(e,"copyAllFragments"),a="",o="";a=0<t.length?l.getString("Filter: {{fragments}}",{fragments:t.join(", ")}):l.getString("Filter: none");o=e?l.getString("Copy: all"):0<n.length?l.getString("Copy: {{fragments}}",{fragments:n.join(", ")}):l.getString("Copy: standard only");return[a,o].join("; ")},navigateToList:function(){var e=i.CONNECTOR_BASE_URL;r.path(e)},navigateToNew:function(e){var t="new",n=i.CONNECTOR_BASE_URL,a="";c.hasId(e)&&(t=c.getId(e),a="/duplicate");r.path("".concat(n,"/").concat(t).concat(a))},navigateToDetails:function(e){e=c.getId(e),e="".concat(i.CONNECTOR_BASE_URL,"/").concat(e);r.path(e)},getMappedStatus:S,getStatusTooltip:function(e){var t={},n=d.WAITING.value,a=d.ACTIVE.value,o=d.ACTIVATING.value,r=d.SUSPENDED.value,c=g.ACTIVE.value,i=g.WAITING.value,s=g.SUSPENDED.value,n=(t[n]=u("Connector not bootstrapped yet."),t[a]={},t[a][c]=u("Connector is working."),t[o]={},t[o][c]=u("Inventory structure synchronization in progress."),t[a][s]=u("Subscription in destination tenant disabled."),t[r]={},t[r][i]=u("Connector not bootstrapped but suspended by source tenant."),t[r][c]=u("Connector suspended by source tenant."),t[r][s]=u("Subscription in destination tenant disabled and then connector suspended by source tenant."),t[e.status]);return(e.status===r?l.getString(e.suspendReason):void 0)||_.get(n,e.destinationStatus)||n},APIS:e,STATUS:d,MAPPED_STATUS:m,DESTINATION_STATUS:g};function v(e){return[s,e].join("/")}function T(e){return o({method:"POST",url:s,data:e,headers:n}).then(c.getResData)}function f(e,t){return o({method:"PUT",url:v(e),data:t,headers:n}).then(c.getResData)}function E(e){return e.visibleStatus=S(e),e}function S(e){var t={},n=d.WAITING.value,a=d.ACTIVE.value,o=d.ACTIVATING.value,r=d.SUSPENDED.value,c=g.ACTIVE.value,i=g.SUSPENDED.value,n=(t[n]=m.WAITING,t[a]={},t[a][c]=m.ACTIVE,t[o]={},t[o][c]=m.ACTIVATING,t[a][i]=m.PENDING,t[r]=m.SUSPENDED,t[e.status]);return _.get(n,e.destinationStatus)||n}function I(e){e=e||[];return e.length||e.push(""),_.map(e,C)}function C(e){return{fragment:e}}function A(e){return _(e).map("fragment").compact().value()}}e.$inject=["$q","$http","$location","c8yBase","dataBrokerConstants","gettext","gettextCatalog"],angular.module("c8y.dataBroker").factory("dataBrokerConnectorsSvc",e)})();
+(()=>{function e(a,o,r,i,c,u,l){var s=i.url("databroker/connectors"),n=i.contentHeaders("connector",!0),e=i.createEnum([{name:"ALARM",value:"alarm",label:u("Alarms"),icon:"bell"},{name:"EVENT",value:"event",label:u("Events"),icon:"online1"},{name:"MEASUREMENT",value:"measurement",label:u("Measurements"),icon:"line-chart"},{name:"MANAGED_OBJECT",value:"managedObject",label:u("Managed objects"),icon:"cubes"},{name:"OPERATION",value:"operation",label:u("Operations"),icon:"code"},{name:"ALL",value:"*",hidden:!0}]),d=i.createEnum([{name:"ACTIVE",label:u("active`connector`")},{name:"ACTIVATING",label:u("activating`connector`")},{name:"SUSPENDED",label:u("suspended`connector`")},{name:"WAITING",label:u("waiting`connector`")}]),g=i.createEnum([{name:"ACTIVE",label:u("active`connector`")},{name:"SUSPENDED",label:u("suspended`connector`")},{name:"WAITING",label:u("waiting`connector`")}]),m=i.createEnum([{name:"ACTIVE",label:u("active`connector`")},{name:"ACTIVATING",label:u("activating`connector`")},{name:"PENDING",label:u("pending`connector`")},{name:"SUSPENDED",label:u("suspended`connector`")},{name:"WAITING",label:u("waiting`connector`")}]),p=["name","description","filters"],t=["id","status","destinationStatus","instanceUrl","tenantId","username","password","code","self","suspendReason"];return{getConnectors:function e(){var t={params:i.pageSizeNoTotalFilter()};var n=i.cleanListCallback("connectors",e,t.params);return o.get(s,t).then(n).then(function(e){return _.forEach(e,E),e})},saveConnector:function(e){{var t;t=i.hasId(e)?(t=_.pick(e,p),f(i.getId(e),t)):T(e)}return t},createConnector:T,updateConnector:f,toggleConnectorStatus:function(t){t.status===d.ACTIVE.value?t.status=d.SUSPENDED.value:t.status=d.ACTIVE.value;return _.unset(t,"visibleStatus"),f(t.id,{status:t.status}).then(function(e){t.status=e.status,E(t)})},getConnector:function(e){return o.get(v(e)).then(i.getResData).then(E)},getConnectorStub:function(){return{name:"",instanceUrl:"",description:"",filters:[]}},getConnectorDuplicate:function(e){return o.get(v(e)).then(i.getResData).then(function(e){return e.name=l.getString("Duplicate of {{name}}",e),_.omit(e,t)})},deleteConnector:function(e){return o({method:"DELETE",url:v(e)})},updateConnectorName:function(t,n){var e=a.when();t.id?e=f(t.id,{name:n}).then(function(e){return t.name=n,e}):t.name=n;return e},convertToViewModel:function(e){e=_.cloneDeep(e);return e.filters=_.map(e.filters,function(e){return e.apis=_.transform(e.apis,function(e,t){e[t]=!0},{}),e.fragmentsToFilter=I(e.fragmentsToFilter),e.copyAllFragments=_.isNull(e.fragmentsToCopy)||_.isUndefined(e.fragmentsToCopy),e.fragmentsToCopy=I(e.fragmentsToCopy),e.selectedGroupOrDevice=(e=>{var t,e=e.deviceGroupId||e.sourceId;return t=e?{id:e}:t})(e),e}),e},convertToBackendModel:function(e){e=_.cloneDeep(e);return e.filters=_.map(e.filters,function(e){a=e.apis;var t,n,a=_(a).map(function(e,t){return e?t:void 0}).compact().value(),o=A(e.fragmentsToFilter),r=e.copyAllFragments?null:A(e.fragmentsToCopy),i=e.selectedGroupOrDevice;return i&&i.isDevice&&(t=i.id),i&&!i.isDevice&&(n=i.id),_.assign(e,{isOpen:void 0,apis:a,fragmentsToFilter:o,fragmentsToCopy:r,copyAllFragments:void 0,sourceId:t,deviceGroupId:n,selectedGroupOrDevice:void 0})}),e},getFilterFragmentsSummary:function(e){var t=A(_.get(e,"fragmentsToFilter",[])),n=A(_.get(e,"fragmentsToCopy",[])),e=_.get(e,"copyAllFragments"),a="",o="";a=0<t.length?l.getString("Filter: {{fragments}}",{fragments:t.join(", ")}):l.getString("Filter: none");o=e?l.getString("Copy: all"):0<n.length?l.getString("Copy: {{fragments}}",{fragments:n.join(", ")}):l.getString("Copy: standard only");return[a,o].join("; ")},navigateToList:function(){var e=c.CONNECTOR_BASE_URL;r.path(e)},navigateToNew:function(e){var t="new",n=c.CONNECTOR_BASE_URL,a="";i.hasId(e)&&(t=i.getId(e),a="/duplicate");r.path("".concat(n,"/").concat(t).concat(a))},navigateToDetails:function(e){e=i.getId(e),e="".concat(c.CONNECTOR_BASE_URL,"/").concat(e);r.path(e)},getMappedStatus:S,getStatusTooltip:function(e){var t={},n=d.WAITING.value,a=d.ACTIVE.value,o=d.ACTIVATING.value,r=d.SUSPENDED.value,i=g.ACTIVE.value,c=g.WAITING.value,s=g.SUSPENDED.value,n=(t[n]=u("Connector not bootstrapped yet."),t[a]={},t[a][i]=u("Connector is working."),t[o]={},t[o][i]=u("Inventory structure synchronization in progress."),t[a][s]=u("Subscription in destination tenant disabled."),t[r]={},t[r][c]=u("Connector not bootstrapped but suspended by source tenant."),t[r][i]=u("Connector suspended by source tenant."),t[r][s]=u("Subscription in destination tenant disabled and then connector suspended by source tenant."),t[e.status]);return(e.status===r?l.getString(e.suspendReason):void 0)||_.get(n,e.destinationStatus)||n},APIS:e,STATUS:d,MAPPED_STATUS:m,DESTINATION_STATUS:g};function v(e){return[s,e].join("/")}function T(e){return o({method:"POST",url:s,data:e,headers:n}).then(i.getResData)}function f(e,t){return o({method:"PUT",url:v(e),data:t,headers:n}).then(i.getResData)}function E(e){return e.visibleStatus=S(e),e}function S(e){var t={},n=d.WAITING.value,a=d.ACTIVE.value,o=d.ACTIVATING.value,r=d.SUSPENDED.value,i=g.ACTIVE.value,c=g.SUSPENDED.value,n=(t[n]=m.WAITING,t[a]={},t[a][i]=m.ACTIVE,t[o]={},t[o][i]=m.ACTIVATING,t[a][c]=m.PENDING,t[r]=m.SUSPENDED,t[e.status]);return _.get(n,e.destinationStatus)||n}function I(e){e=e||[];return e.length||e.push(""),_.map(e,C)}function C(e){return{fragment:e}}function A(e){return _(e).map("fragment").compact().value()}}e.$inject=["$q","$http","$location","c8yBase","dataBrokerConstants","gettext","gettextCatalog"],angular.module("c8y.dataBroker").factory("dataBrokerConnectorsSvc",e)})();

package/dataPointExplorer/views/widgetConfig.html

@@ -1,18 +1,17 @@
 <div
+  class="row no-card-context"
   ng-controller="DataPointWidgetConfigCtrl"
   ng-init="disableLocalStorage = true"
-  class="row no-card-context d-flex"
-  style="height: calc(100vh - 422px);"
 >
-  <div class="col-md-5 bg-level-1 a-s-stretch inner-scroll">
-    <div class="p-l-24 bg-inherit p-t-8">
+  <div class="col-md-12 a-s-stretch">
+    <div class="bg-inherit p-t-8">
       <div class="form-group m-b-0 p-b-16 separator-bottom">
         <label for="dateSelection">
           {{ 'Date selection' | translate }}
           <button
-            type="button"
             class="btn-help btn-help--sm"
             aria-label="{{ 'Help' | translate }}"
+            type="button"
             uib-popover-html="dateSelectionHelpPopoverText | translate"
             popover-placement="right"
             popover-trigger="'focus'"
@@ -21,10 +20,10 @@
         </label>
         <div class="c8y-select-wrapper">
           <select
-            id="dateSelection"
             class="form-control"
             title="{{ 'Date selection' | translate }}"
             aria-label="{{ 'Date selection' | translate }}"
+            id="dateSelection"
             ng-model="dateSelection"
           >
             <option
@@ -49,96 +48,95 @@
         </div>
       </div>
 
-      <c8y-data-point-list
-        datapoints="data.datapoints"
-        allow-adding-data-points-from-context-mo-only="dashboard.deviceType && dashboard.deviceTypeValue"
-        dont-save="true"
-        no-target
-        no-yellow-range
-        no-red-range
-        class="bg-inherit separator-bottom"
-      ></c8y-data-point-list>
-      <c8y-alarms-events-timelines-config
-        configs="data.alarmsEventsConfigs"
-        allow-alarms-events-from-context-mo-only="dashboard.deviceType && dashboard.deviceTypeValue"
-        class="d-block bg-inherit separator-top"
-        style="padding-top: 1px;"
-      ></c8y-alarms-events-timelines-config>
-    </div>
-  </div>
-
-  <div class="col-md-7 sticky-top">
-    <div class="p-r-24 p-t-8">
-      <div
-        class="data-point-explorer d-flex d-col"
-        ng-controller="c8yDataPointExplorerCtrl"
-      >
-        <div class="m-b-4 m-t-4 d-flex j-c-end gap-8">
-          <c8y-realtime-button
-            ng-show="!data.widgetInstanceGlobalTimeContext"
-            class="top-right-control"
-            channel="{{ channel }}"
-            state="data.realtime"
-            on-data="onData($data)"
-          ></c8y-realtime-button>
-          <c8y-realtime-button
-            ng-show="false"
-            channel="{{ alarmsChannel }}"
-            state="data.realtime"
-            on-data="onAlarm($data)"
-            on-data-update="onAlarm($data)"
-          ></c8y-realtime-button>
-          <c8y-realtime-button
-            ng-show="false"
-            channel="{{ eventsChannel }}"
-            state="data.realtime"
-            on-data="onEvent($data)"
-          ></c8y-realtime-button>
-          <c8y-aggregation
-            ng-show="!data.widgetInstanceGlobalTimeContext"
-            class="top-right-control"
-            date-from="data.dateFrom"
-            date-to="data.dateTo"
-            aggregation="data.aggregation"
-            realtime="data.realtime"
-            auto="true"
-          ></c8y-aggregation>
-          <c8y-interval
-            ng-show="!data.widgetInstanceGlobalTimeContext"
-            class="top-right-control"
-            date-from="data.dateFrom"
-            date-to="data.dateTo"
-            interval="data.interval"
-          ></c8y-interval>
-        </div>
-        <div
-          class="c8yGraphFill"
-          style="height: calc(100vh - 520px);"
-        >
-          <c8y-chart
-            datapoints="data.graphDataPoints"
-            date-from="data.dateFrom"
-            date-to="data.dateTo"
-            realtime="data.realtime"
-            aggregation="data.aggregation"
-            show-time="!data.widgetInstanceGlobalTimeContext"
-            on-data="(onData)"
-            on-update-dates="onUpdateDates($dateFrom, $dateTo)"
-            on-update-displayed-dates="onUpdateDisplayedDates($dateFrom, $dateTo)"
-            on-box-changed="onBoxChanged(box)"
-          ></c8y-chart>
+      <div class="p-b-8 separator-bottom">
+        <div class="p-r-24 p-t-8">
+          <div
+            class="data-point-explorer d-flex d-col"
+            ng-controller="c8yDataPointExplorerCtrl"
+          >
+            <div class="m-b-4 m-t-4 d-flex j-c-start gap-8">
+              <c8y-realtime-button
+                class="top-right-control"
+                ng-show="!data.widgetInstanceGlobalTimeContext"
+                channel="{{ channel }}"
+                state="data.realtime"
+                on-data="onData($data)"
+              ></c8y-realtime-button>
+              <c8y-realtime-button
+                ng-show="false"
+                channel="{{ alarmsChannel }}"
+                state="data.realtime"
+                on-data="onAlarm($data)"
+                on-data-update="onAlarm($data)"
+              ></c8y-realtime-button>
+              <c8y-realtime-button
+                ng-show="false"
+                channel="{{ eventsChannel }}"
+                state="data.realtime"
+                on-data="onEvent($data)"
+              ></c8y-realtime-button>
+              <c8y-aggregation
+                class="top-right-control"
+                ng-show="!data.widgetInstanceGlobalTimeContext"
+                date-from="data.dateFrom"
+                date-to="data.dateTo"
+                aggregation="data.aggregation"
+                realtime="data.realtime"
+                auto="true"
+              ></c8y-aggregation>
+              <c8y-interval
+                class="top-right-control"
+                ng-show="!data.widgetInstanceGlobalTimeContext"
+                date-from="data.dateFrom"
+                date-to="data.dateTo"
+                interval="data.interval"
+              ></c8y-interval>
+            </div>
+            <c8y-widget-preview-wrapper>
+              <div class="c8yGraphFill">
+                <c8y-chart
+                  datapoints="data.graphDataPoints"
+                  date-from="data.dateFrom"
+                  date-to="data.dateTo"
+                  realtime="data.realtime"
+                  aggregation="data.aggregation"
+                  show-time="!data.widgetInstanceGlobalTimeContext"
+                  on-data="(onData)"
+                  on-update-dates="onUpdateDates($dateFrom, $dateTo)"
+                  on-update-displayed-dates="onUpdateDisplayedDates($dateFrom, $dateTo)"
+                  on-box-changed="onBoxChanged(box)"
+                ></c8y-chart>
+              </div>
+              <c8y-alarms-events-timelines-chart
+                alarms-events-configs="data.graphAlarmsEventsConfigs"
+                date-from="data.displayedDateFrom"
+                date-to="data.displayedDateTo"
+                on-update-dates="onUpdateDates($dateFrom, $dateTo)"
+                realtime="data.realtime"
+                on-realtime-alarm-fn="onRealtimeAlarmFn(onRealtimeAlarm)"
+                on-realtime-event-fn="onRealtimeEventFn(onRealtimeEvent)"
+                chart-box="chartBox"
+              ></c8y-alarms-events-timelines-chart>
+            </c8y-widget-preview-wrapper>
+          </div>
         </div>
-        <c8y-alarms-events-timelines-chart
-          alarms-events-configs="data.graphAlarmsEventsConfigs"
-          date-from="data.displayedDateFrom"
-          date-to="data.displayedDateTo"
-          on-update-dates="onUpdateDates($dateFrom, $dateTo)"
-          realtime="data.realtime"
-          on-realtime-alarm-fn="onRealtimeAlarmFn(onRealtimeAlarm)"
-          on-realtime-event-fn="onRealtimeEventFn(onRealtimeEvent)"
-          chart-box="chartBox"
-        ></c8y-alarms-events-timelines-chart>
       </div>
     </div>
+
+    <c8y-data-point-list
+      class="bg-inherit separator-bottom"
+      datapoints="data.datapoints"
+      allow-adding-data-points-from-context-mo-only="dashboard.deviceType && dashboard.deviceTypeValue"
+      dont-save="true"
+      no-target
+      no-yellow-range
+      no-red-range
+    ></c8y-data-point-list>
+    <c8y-alarms-events-timelines-config
+      class="d-block bg-inherit separator-top"
+      style="padding-top: 1px"
+      configs="data.alarmsEventsConfigs"
+      allow-alarms-events-from-context-mo-only="dashboard.deviceType && dashboard.deviceTypeValue"
+    ></c8y-alarms-events-timelines-config>
   </div>
 </div>