thingsboard-cli 4.3.1.2__py3-none-any.whl

thingsboard_cli/scaffold/.claude/examples/dashboards/facility_operations_dashboard.json

@@ -0,0 +1,3679 @@
+{
+  "title": "Facility Operations Dashboard",
+  "name": "Facility Operations Dashboard",
+  "image": null,
+  "mobileHide": false,
+  "mobileOrder": null,
+  "configuration": {
+    "timewindow": {
+      "selectedTab": 1,
+      "history": {
+        "historyType": 0,
+        "timewindowMs": 604800000
+      },
+      "aggregation": {
+        "type": "NONE",
+        "limit": 25000
+      }
+    },
+    "settings": {
+      "stateControllerId": "entity",
+      "showTitle": false,
+      "showDashboardsSelect": true,
+      "showEntitiesSelect": true,
+      "showDashboardTimewindow": true,
+      "showDashboardExport": true,
+      "toolbarAlwaysOpen": true
+    },
+    "widgets": {
+      "fc802397-a495-4ad5-b37d-2788a09685bc": {
+        "sizeX": 12,
+        "sizeY": 5,
+        "row": 6,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Office Units",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "4px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {
+            "rowClick": [
+              {
+                "id": "d4814669-b3ad-459b-b2be-f728c7c0ee41",
+                "name": "View Office Unit Details",
+                "icon": "arrow_forward",
+                "type": "openDashboardState",
+                "targetDashboardStateId": "office-unit-details",
+                "setEntityId": true,
+                "stateEntityParamName": "selectedOfficeUnit"
+              }
+            ],
+            "headerButton": [
+              {
+                "id": "47df571c-ef5e-4c8e-a2c0-b82605cd3c0b",
+                "name": "Create Office Unit",
+                "icon": "add",
+                "type": "customPretty",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Create New Office Unit\";\nlet createEntity = true;\n\nlet attributeKeys = [];\nlet additionalAttributes = [ ];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        \n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = \"ASSET\";\n      let entitySubType = \"OfficeUnit\";\n      let entityOwner = \"currentCustomer\";\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      let createRelations = [{\"fromStateEntity\":\"selectedOfficeFloor\",\"type\":\"OfficeFloorToOfficeUnit\"}];\n      if (createRelations && createRelations.length) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        for (let createRelation of createRelations) {\n          let fromEntityId = null;\n          if (createRelation.fromStateEntity === 'singleEntity' && singleEntityId) {\n            fromEntityId = singleEntityId;\n          } else if (createRelation.fromStateEntity && stateParams[createRelation.fromStateEntity]) {\n            fromEntityId = stateParams[createRelation.fromStateEntity].entityId;\n          } else {\n            fromEntityId = stateParams.entityId;\n          }\n          if (!fromEntityId && createRelation.fromStateEntity === 'currentCustomer') {\n            fromEntityId = {id: currentUser.customerId, entityType: \"CUSTOMER\" };\n          }\n          if (fromEntityId && fromEntityId.id && fromEntityId.entityType) {\n            let relation = {\n              type: createRelation.type,\n              typeGroup: 'COMMON',\n              from: fromEntityId,\n              to: entityId\n            };\n            createRelationsObservables.push(entityRelationService.saveRelation(relation));\n          }\n        }\n      }\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = [\"OfficeUnit\"];\n      \n      let entityOwner = \"currentCustomer\";\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Office Unit Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Office unit name is required.</mat-error>\n  }\n</mat-form-field>\n</fieldset>\n    \n    \n    \n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+              }
+            ],
+            "actionCellButton": [
+              {
+                "id": "223a1996-107a-4cf8-8bdb-1b499283569c",
+                "name": "Edit Office Unit",
+                "icon": "edit",
+                "type": "customPretty",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Edit Office Unit '${entityName}'\";\nlet createEntity = false;\n\nlet attributeKeys = [];\nlet additionalAttributes = [ ];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        \n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = null;\n      let entitySubType = null;\n      let entityOwner = null;\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = null;\n      \n      let entityOwner = null;\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Unit Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Unit name is required.</mat-error>\n  }\n</mat-form-field>\n</fieldset>\n    \n    \n    \n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+              },
+              {
+                "id": "0b926f38-6887-40e7-b7d6-6a8f4303aed8",
+                "name": "Delete Office Unit",
+                "icon": "delete",
+                "type": "custom",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet dialogs = $injector.get(widgetContext.servicesMap.get('dialogs'));\nlet deleteEntityTitle = \"Delete Office Unit '${entityName}'\";\nlet deleteEntityPrompt = \"Are you sure you want to delete the office unit '${entityName}'?\";\n\ndeleteEntityTitle = deleteEntityTitle.replaceAll('${entityName}', entityName);\ndeleteEntityPrompt = deleteEntityPrompt.replaceAll('${entityName}', entityName);\n\nopenDeleteEntityDialog();\n\nfunction openDeleteEntityDialog() {\n  dialogs.confirm(deleteEntityTitle, deleteEntityPrompt, 'Cancel', 'Delete').subscribe(\n    function(result) {\n      if (result) {\n        deleteEntity(entityId);\n      }\n    }\n  );\n}\n\nfunction deleteEntity(entityId) {\n  let deleteObservable = null;\n  switch (entityId.entityType) {\n    case 'DEVICE':\n      let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));\n      deleteObservable = deviceService.deleteDevice(entityId.id);\n      break;\n    case 'ASSET':\n      let assetService = $injector.get(widgetContext.servicesMap.get('assetService'));\n      deleteObservable = assetService.deleteAsset(entityId.id);\n      break;\n    case 'ENTITY_VIEW':\n      let entityViewService = $injector.get(widgetContext.servicesMap.get('entityViewService'));\n      deleteObservable = entityViewService.deleteEntityView(entityId.id);\n      break;\n    case 'EDGE':\n      let edgeService = $injector.get(widgetContext.servicesMap.get('edgeService'));\n      deleteObservable = edgeService.deleteEdge(entityId.id);\n      break;\n    case 'TENANT':\n      let tenantService = $injector.get(widgetContext.servicesMap.get('tenantService'));\n      deleteObservable = tenantService.deleteTenant(entityId.id);\n      break;\n    case 'CUSTOMER':\n      let customerService = $injector.get(widgetContext.servicesMap.get('customerService'));\n      deleteObservable = customerService.deleteCustomer(entityId.id);\n      break;\n    case 'DASHBOARD':\n      let dashboardService = $injector.get(widgetContext.servicesMap.get('dashboardService'));\n      deleteObservable = dashboardService.deleteDashboard(entityId.id);\n      break;\n    case 'USER':\n      let userService = $injector.get(widgetContext.servicesMap.get('userService'));\n      deleteObservable = userService.deleteUser(entityId.id);\n      break;\n    case 'SCHEDULER_EVENT':\n      let schedulerEventService = $injector.get(widgetContext.servicesMap.get('schedulerEventService'));\n      deleteObservable = schedulerEventService.deleteSchedulerEvent(entityId.id);\n      break;\n    case 'ROLE':\n      let roleService = $injector.get(widgetContext.servicesMap.get('roleService'));\n      deleteObservable = roleService.deleteRole(entityId.id);\n      break;\n    case 'ENTITY_GROUP':\n      let entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n      deleteObservable = entityGroupService.deleteEntityGroup(entityId.id);\n      break;\n    default:\n      showErrorDialog(`Unsupported entity type '${entityId.entityType}'`);\n      break;\n  }\n  if (deleteObservable) {\n    deleteObservable.subscribe(\n      function success() {\n        widgetContext.updateAliases();\n      },\n      function fail() {\n        showErrorDialog();\n      }\n    );\n  }\n}\n\nfunction showErrorDialog(error) {\n  let title = 'Error';\n  error = error || 'Please try again.';\n  let content = `An error occurred while deleting '${entityName}'. ${error}`;\n  dialogs.alert(title, content, 'CLOSE').subscribe(\n    function(result) {}\n  );\n}\n"
+              }
+            ]
+          },
+          "settings": {
+            "entitiesTitle": "Office Units",
+            "displayEntityName": false,
+            "displayEntityType": false
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "name",
+                  "label": "Name",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "activePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "decimals": 1,
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "dailyOfficeEnergy",
+                  "label": "Daily Energy",
+                  "type": "timeseries",
+                  "decimals": 1,
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "3db33207-8115-43ff-8997-267562d4fd1f"
+            }
+          ]
+        },
+        "id": "fc802397-a495-4ad5-b37d-2788a09685bc",
+        "typeFullFqn": "system.cards.entities_table",
+        "type": "latest"
+      },
+      "4f66c90f-367b-4f0a-82c0-a50b8e5dffa3": {
+        "sizeX": 12,
+        "sizeY": 6,
+        "row": 0,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Main Breaker Active Power Trend",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "default": {
+                "id": "default",
+                "label": "Active Power",
+                "position": "left",
+                "min": 0,
+                "max": 100000,
+                "units": "",
+                "decimals": 1,
+                "order": 0
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "activePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#2196F3",
+                  "settings": {
+                    "yAxisId": "default",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+            }
+          ]
+        },
+        "id": "4f66c90f-367b-4f0a-82c0-a50b8e5dffa3",
+        "typeFullFqn": "system.time_series_chart",
+        "type": "timeseries"
+      },
+      "d1bd0c24-6098-4ea1-8ce7-54dcf2d8335e": {
+        "sizeX": 6,
+        "sizeY": 1,
+        "row": 0,
+        "col": 6,
+        "config": {
+          "configMode": "basic",
+          "title": "Breaker Status",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "widgetCss": "tb-icon {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: 40px!important;\n  height: 40px!important;\n  background-color: var(--tb-primary-50);\n}\n\n.tb-value-card-icon-row {\n    width: 50%;\n    justify-content: space-between;\n}\n",
+          "units": "",
+          "decimals": 0,
+          "actions": {},
+          "settings": {
+            "layout": "horizontal",
+            "showLabel": true,
+            "labelColor": {
+              "type": "constant",
+              "color": "#000000DE"
+            },
+            "showIcon": true,
+            "icon": "power_settings_new",
+            "iconColor": {
+              "type": "constant",
+              "color": "var(--tb-primary-500)"
+            },
+            "iconSize": 24,
+            "iconSizeUnit": "px",
+            "valueColor": {
+              "type": "constant",
+              "color": "#000000DE"
+            },
+            "valueFont": {
+              "size": 30
+            },
+            "labelFont": {
+              "size": 20
+            },
+            "showDate": false,
+            "autoScale": true
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "active",
+                  "label": "Active Status",
+                  "type": "attribute",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+            }
+          ]
+        },
+        "id": "d1bd0c24-6098-4ea1-8ce7-54dcf2d8335e",
+        "typeFullFqn": "system.cards.horizontal_value_card",
+        "type": "latest"
+      },
+      "bf3d66c0-ba6d-4a0d-a9c5-343e90dd65e2": {
+        "sizeX": 12,
+        "sizeY": 1,
+        "row": 0,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Current",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "widgetCss": "tb-icon {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: 40px!important;\n  height: 40px!important;\n  background-color: var(--tb-primary-50);\n}\n\n.tb-value-card-icon-row {\n    width: 50%;\n    justify-content: space-between;\n}\n",
+          "units": "A",
+          "decimals": 2,
+          "actions": {},
+          "settings": {
+            "layout": "horizontal",
+            "showLabel": true,
+            "labelColor": {
+              "type": "constant",
+              "color": "#000000DE"
+            },
+            "showIcon": true,
+            "icon": "electric_meter",
+            "iconColor": {
+              "type": "constant",
+              "color": "var(--tb-primary-500)"
+            },
+            "iconSize": 24,
+            "iconSizeUnit": "px",
+            "valueColor": {
+              "type": "constant",
+              "color": "#000000DE"
+            },
+            "valueFont": {
+              "size": 30
+            },
+            "labelFont": {
+              "size": 20
+            },
+            "showDate": false,
+            "autoScale": true
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "current",
+                  "label": "Current",
+                  "type": "timeseries",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "0a7a119c-e2b5-4e63-8024-d9eba9ddfffe"
+            }
+          ]
+        },
+        "id": "bf3d66c0-ba6d-4a0d-a9c5-343e90dd65e2",
+        "typeFullFqn": "system.cards.horizontal_value_card",
+        "type": "latest"
+      },
+      "b7bf1a86-0b3e-49e1-a99c-94698059b877": {
+        "sizeX": 12,
+        "sizeY": 5,
+        "row": 7,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Hourly Energy Consumption",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "default": {
+                "id": "default",
+                "label": "Energy Consumption",
+                "position": "left",
+                "min": null,
+                "max": null,
+                "units": "",
+                "decimals": 1,
+                "order": 0
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "totalBuildingConsumption",
+                  "label": "Total Building Consumption",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#2196F3",
+                  "settings": {
+                    "yAxisId": "default",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "7327faf4-aded-4fa2-8008-8c380513e113"
+            }
+          ]
+        },
+        "id": "b7bf1a86-0b3e-49e1-a99c-94698059b877",
+        "typeFullFqn": "system.time_series_chart",
+        "type": "timeseries"
+      },
+      "2a299e04-1df1-4cc0-9389-8db9b8d0a542": {
+        "sizeX": 12,
+        "sizeY": 6,
+        "row": 1,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Alarms",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "4px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "alarmsTitle": "Alarms",
+            "enableSelection": true,
+            "enableSearch": true
+          },
+          "alarmSource": {
+            "type": "entity",
+            "name": "alarms",
+            "dataKeys": [
+              {
+                "name": "createdTime",
+                "label": "Created Time",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "originator",
+                "label": "Originator",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "type",
+                "label": "Type",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "severity",
+                "label": "Severity",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "status",
+                "label": "Status",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              }
+            ],
+            "entityAliasId": "7327faf4-aded-4fa2-8008-8c380513e113"
+          },
+          "alarmFilterConfig": {
+            "typeList": [],
+            "statusList": [
+              "ACTIVE"
+            ],
+            "severityList": [
+              "CRITICAL",
+              "MAJOR",
+              "MINOR",
+              "WARNING",
+              "INDETERMINATE"
+            ],
+            "searchPropagatedAlarms": true
+          },
+          "datasources": []
+        },
+        "id": "2a299e04-1df1-4cc0-9389-8db9b8d0a542",
+        "typeFullFqn": "system.alarm_widgets.alarms_table",
+        "type": "alarm"
+      },
+      "b0f4db58-b51e-4ba1-8dd5-3464a178d0c4": {
+        "sizeX": 12,
+        "sizeY": 11,
+        "row": 0,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Daily Energy History",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "default": {
+                "id": "default",
+                "label": "Daily Energy",
+                "position": "left",
+                "min": null,
+                "max": null,
+                "units": "",
+                "decimals": 1,
+                "order": 0
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "dailyOfficeEnergy",
+                  "label": "Daily Energy",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#2196F3",
+                  "settings": {
+                    "yAxisId": "default",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "0a7a119c-e2b5-4e63-8024-d9eba9ddfffe"
+            }
+          ]
+        },
+        "id": "b0f4db58-b51e-4ba1-8dd5-3464a178d0c4",
+        "typeFullFqn": "system.time_series_chart",
+        "type": "timeseries"
+      },
+      "d7b42191-1815-4672-bb53-71a87ae3d0e0": {
+        "sizeX": 12,
+        "sizeY": 6,
+        "row": 0,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Alarms",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "4px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "alarmsTitle": "Alarms",
+            "enableSelection": true,
+            "enableSearch": true
+          },
+          "alarmSource": {
+            "type": "entity",
+            "name": "alarms",
+            "dataKeys": [
+              {
+                "name": "createdTime",
+                "label": "Created Time",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "originator",
+                "label": "Originator",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "type",
+                "label": "Type",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "severity",
+                "label": "Severity",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "status",
+                "label": "Status",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              }
+            ],
+            "entityAliasId": "0dedaddc-76f3-4a25-9e0a-a0764422d2ce"
+          },
+          "alarmFilterConfig": {
+            "typeList": [],
+            "statusList": [
+              "ACTIVE"
+            ],
+            "severityList": [
+              "CRITICAL",
+              "MAJOR",
+              "MINOR",
+              "WARNING",
+              "INDETERMINATE"
+            ],
+            "searchPropagatedAlarms": true
+          },
+          "datasources": []
+        },
+        "id": "d7b42191-1815-4672-bb53-71a87ae3d0e0",
+        "typeFullFqn": "system.alarm_widgets.alarms_table",
+        "type": "alarm"
+      },
+      "492428b8-1ee7-4bf5-a85e-5b18465d51b3": {
+        "sizeX": 4,
+        "sizeY": 1,
+        "row": 0,
+        "col": 20,
+        "config": {
+          "configMode": "basic",
+          "title": "connect-meter-device",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": null,
+                "name": "Open connectivity documentation",
+                "icon": null,
+                "openNewBrowserTab": true,
+                "url": "https://thingsboard.io/docs/paas/getting-started-guides/connectivity/",
+                "type": "openURL"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "filled",
+              "showLabel": true,
+              "label": "How to connect real devices?",
+              "showIcon": true,
+              "icon": "help_outline",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "action": "DO_NOTHING",
+              "defaultValue": false
+            },
+            "disabledState": {
+              "action": "DO_NOTHING",
+              "defaultValue": false
+            }
+          },
+          "datasources": []
+        },
+        "id": "492428b8-1ee7-4bf5-a85e-5b18465d51b3",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "c35f60e4-284a-49e3-bbcd-8c753ea9f1f5": {
+        "sizeX": 1,
+        "sizeY": 1,
+        "row": 0,
+        "col": 23,
+        "config": {
+          "configMode": "basic",
+          "title": "Edit Building Settings",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": "f2e08df3-5817-407d-ba45-93f8990a2a31",
+                "name": "Edit Building",
+                "icon": "edit",
+                "type": "customPretty",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Edit Building '${entityName}'\";\nlet createEntity = false;\n\nlet attributeKeys = [\"tariffRate\",\"address\"];\nlet additionalAttributes = [ ];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        tariffRate: [null, []],\n        address: [null, []]\n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = null;\n      let entitySubType = null;\n      let entityOwner = null;\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = null;\n      \n      let entityOwner = null;\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Building Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Building name is required.</mat-error>\n  }\n</mat-form-field>\n</fieldset>\n    \n    \n    <fieldset formGroupName=\"attributes\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Tariff Rate</mat-label>\n  <input type=\"number\" matInput formControlName=\"tariffRate\">\n</mat-form-field>\n\n<mat-form-field appearance=\"outline\">\n  <mat-label>Address</mat-label>\n  <input matInput formControlName=\"address\">\n</mat-form-field>\n</fieldset>\n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "filled",
+              "showLabel": false,
+              "label": "Edit Building Settings",
+              "showIcon": true,
+              "icon": "edit",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "defaultValue": false,
+              "action": "DO_NOTHING",
+              "dataToValue": {
+                "type": "NONE",
+                "compareToValue": true
+              }
+            },
+            "disabledState": {
+              "defaultValue": false,
+              "action": "DO_NOTHING",
+              "dataToValue": {
+                "type": "NONE",
+                "compareToValue": true
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [],
+              "entityAliasId": "7327faf4-aded-4fa2-8008-8c380513e113"
+            }
+          ]
+        },
+        "id": "c35f60e4-284a-49e3-bbcd-8c753ea9f1f5",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "0d25e5ab-7728-4194-82d8-59ed88af4cd0": {
+        "sizeX": 12,
+        "sizeY": 6,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Floor Plan Map",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "imageSource": {
+              "entityAliasId": "0dedaddc-76f3-4a25-9e0a-a0764422d2ce",
+              "sourceType": "entityKey",
+              "entityKey": {
+                "name": "floorPlan",
+                "label": "Floor Plan",
+                "type": "attribute",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              }
+            },
+            "mapType": "image",
+            "markers": [
+              {
+                "dsType": "entity",
+                "dsEntityAliasId": "3db33207-8115-43ff-8997-267562d4fd1f",
+                "additionalDataKeys": [
+                  {
+                    "name": "name",
+                    "label": "Name",
+                    "type": "entityField",
+                    "color": "var(--tb-primary-500)",
+                    "settings": {}
+                  },
+                  {
+                    "name": "activePower",
+                    "label": "Active Power",
+                    "type": "timeseries",
+                    "color": "var(--tb-primary-500)",
+                    "settings": {}
+                  }
+                ],
+                "xKey": {
+                  "name": "xPos",
+                  "label": "X Position",
+                  "type": "attribute",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                "yKey": {
+                  "name": "yPos",
+                  "label": "Y Position",
+                  "type": "attribute",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                "label": {
+                  "show": true,
+                  "type": "pattern",
+                  "pattern": "${Name}"
+                },
+                "edit": {
+                  "enabledActions": [
+                    "add",
+                    "move",
+                    "remove"
+                  ]
+                },
+                "markerType": "icon",
+                "markerIcon": {
+                  "icon": "bolt",
+                  "color": {
+                    "type": "constant",
+                    "color": "#2196F3"
+                  }
+                },
+                "tooltip": {
+                  "show": true,
+                  "trigger": "click",
+                  "type": "pattern",
+                  "pattern": "<b>Unit:</b> ${Name}<br/><b>Active Power:</b> ${Active Power} W<br/><link-act name='navigate-to-office-unit-from-map'>View Details</link-act>",
+                  "tagActions": [
+                    {
+                      "id": "d88c6333-dde3-4f50-971f-ea3f338851fa",
+                      "name": "navigate-to-office-unit-from-map",
+                      "icon": "arrow_forward",
+                      "type": "openDashboardState",
+                      "targetDashboardStateId": "office-unit-details",
+                      "setEntityId": true,
+                      "stateEntityParamName": "selectedOfficeUnit"
+                    }
+                  ]
+                }
+              },
+              {
+                "dsType": "entity",
+                "dsEntityAliasId": "6cde2143-5432-4d8f-a2dd-c84534a98c0c",
+                "additionalDataKeys": [
+                  {
+                    "name": "name",
+                    "label": "Name",
+                    "type": "entityField",
+                    "color": "var(--tb-primary-500)",
+                    "settings": {}
+                  },
+                  {
+                    "name": "state",
+                    "label": "Status",
+                    "type": "timeseries",
+                    "color": "var(--tb-primary-500)",
+                    "settings": {}
+                  },
+                  {
+                    "name": "activePower",
+                    "label": "Active Power",
+                    "type": "timeseries",
+                    "color": "var(--tb-primary-500)",
+                    "settings": {}
+                  }
+                ],
+                "xKey": {
+                  "name": "xPos",
+                  "label": "X Position",
+                  "type": "attribute",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                "yKey": {
+                  "name": "yPos",
+                  "label": "Y Position",
+                  "type": "attribute",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                "label": {
+                  "show": true,
+                  "type": "pattern",
+                  "pattern": "${Name}"
+                },
+                "edit": {
+                  "enabledActions": [
+                    "add",
+                    "move",
+                    "remove"
+                  ]
+                },
+                "markerType": "icon",
+                "markerIcon": {
+                  "icon": "electric_meter",
+                  "color": {
+                    "type": "function",
+                    "colorFunction": "if (data.Status === 'closed') { return '#4CAF50'; } else if (data.Status === 'tripped') { return '#F44336'; } else if (data.Status === 'open') { return '#FF9800'; } return '#757575';"
+                  }
+                },
+                "tooltip": {
+                  "show": true,
+                  "trigger": "click",
+                  "type": "pattern",
+                  "pattern": "<b>Breaker:</b> ${Name}<br/><b>Status:</b> ${Status}<br/><b>Power:</b> ${Active Power} W<br/><link-act name='navigate-to-main-breaker-from-map'>View Details</link-act>",
+                  "tagActions": [
+                    {
+                      "id": "182a87a2-49fd-4263-8379-2cf5391c3bb0",
+                      "name": "navigate-to-main-breaker-from-map",
+                      "icon": "arrow_forward",
+                      "type": "openDashboardState",
+                      "targetDashboardStateId": "main-breaker-details",
+                      "setEntityId": true,
+                      "stateEntityParamName": "selectedMainBreaker"
+                    }
+                  ]
+                }
+              }
+            ],
+            "polygons": [],
+            "circles": [],
+            "fitMapBounds": false,
+            "mapActionButtons": [
+              {
+                "action": {
+                  "id": "22e52a78-64fe-473e-84ab-341d1792dd1d",
+                  "name": "Place Office Unit",
+                  "icon": "add_location",
+                  "mapItemType": "marker",
+                  "mapItemTooltips": {},
+                  "type": "placeMapItem",
+                  "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Create New Office Unit\";\nlet createEntity = true;\n\nlet attributeKeys = [];\nlet additionalAttributes = [ {key: 'xPos', value: additionalParams.coordinates.x}, {key: 'yPos', value: additionalParams.coordinates.y}];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        \n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = \"ASSET\";\n      let entitySubType = \"OfficeUnit\";\n      let entityOwner = \"currentCustomer\";\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      let createRelations = [{\"fromStateEntity\":\"selectedOfficeFloor\",\"type\":\"OfficeFloorToOfficeUnit\"}];\n      if (createRelations && createRelations.length) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        for (let createRelation of createRelations) {\n          let fromEntityId = null;\n          if (createRelation.fromStateEntity === 'singleEntity' && singleEntityId) {\n            fromEntityId = singleEntityId;\n          } else if (createRelation.fromStateEntity && stateParams[createRelation.fromStateEntity]) {\n            fromEntityId = stateParams[createRelation.fromStateEntity].entityId;\n          } else {\n            fromEntityId = stateParams.entityId;\n          }\n          if (!fromEntityId && createRelation.fromStateEntity === 'currentCustomer') {\n            fromEntityId = {id: currentUser.customerId, entityType: \"CUSTOMER\" };\n          }\n          if (fromEntityId && fromEntityId.id && fromEntityId.entityType) {\n            let relation = {\n              type: createRelation.type,\n              typeGroup: 'COMMON',\n              from: fromEntityId,\n              to: entityId\n            };\n            createRelationsObservables.push(entityRelationService.saveRelation(relation));\n          }\n        }\n      }\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = [\"OfficeUnit\"];\n      \n      let entityOwner = \"currentCustomer\";\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                  "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Office Unit Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Office unit name is required.</mat-error>\n  }\n</mat-form-field>\n</fieldset>\n    \n    \n    \n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+                },
+                "color": "#0000008a",
+                "icon": "add_location",
+                "label": "Place Office Unit"
+              },
+              {
+                "action": {
+                  "id": "e8327b14-f94a-4468-9286-1e2253098003",
+                  "name": "Place Main Breaker",
+                  "icon": "add_location",
+                  "mapItemType": "marker",
+                  "mapItemTooltips": {},
+                  "type": "placeMapItem",
+                  "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Place New Main Breaker on Floor Plan\";\nlet createEntity = true;\n\nlet attributeKeys = [];\nlet additionalAttributes = [ {key: 'xPos', value: additionalParams.coordinates.x}, {key: 'yPos', value: additionalParams.coordinates.y}];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]],\n      label: [null, []]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        \n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = \"DEVICE\";\n      let entitySubType = \"MainBreaker\";\n      let entityOwner = \"currentCustomer\";\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      let createRelations = [{\"fromStateEntity\":\"selectedOfficeFloor\",\"type\":\"OfficeFloorToMainBreaker\"}];\n      if (createRelations && createRelations.length) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        for (let createRelation of createRelations) {\n          let fromEntityId = null;\n          if (createRelation.fromStateEntity === 'singleEntity' && singleEntityId) {\n            fromEntityId = singleEntityId;\n          } else if (createRelation.fromStateEntity && stateParams[createRelation.fromStateEntity]) {\n            fromEntityId = stateParams[createRelation.fromStateEntity].entityId;\n          } else {\n            fromEntityId = stateParams.entityId;\n          }\n          if (!fromEntityId && createRelation.fromStateEntity === 'currentCustomer') {\n            fromEntityId = {id: currentUser.customerId, entityType: \"CUSTOMER\" };\n          }\n          if (fromEntityId && fromEntityId.id && fromEntityId.entityType) {\n            let relation = {\n              type: createRelation.type,\n              typeGroup: 'COMMON',\n              from: fromEntityId,\n              to: entityId\n            };\n            createRelationsObservables.push(entityRelationService.saveRelation(relation));\n          }\n        }\n      }\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = [\"MainBreaker\"];\n      \n      let entityOwner = \"currentCustomer\";\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                  "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Breaker Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Breaker name is required.</mat-error>\n  }\n</mat-form-field>\n\n<mat-form-field appearance=\"outline\">\n  <mat-label>Label</mat-label>\n  <input matInput formControlName=\"label\">\n</mat-form-field>\n</fieldset>\n    \n    \n    \n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+                },
+                "color": "#0000008a",
+                "icon": "add_location",
+                "label": "Place Main Breaker"
+              }
+            ]
+          },
+          "datasources": []
+        },
+        "id": "0d25e5ab-7728-4194-82d8-59ed88af4cd0",
+        "typeFullFqn": "system.image_map",
+        "type": "latest"
+      },
+      "075946be-5d43-42a1-86b0-b7d6297d07c6": {
+        "sizeX": 4,
+        "sizeY": 1,
+        "row": 0,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Overview",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": null,
+                "name": null,
+                "icon": null,
+                "type": "custom",
+                "customFunction": "let params = widgetContext.stateController.getStateParams();\n\nparams.subStateId = \"main-breaker-overview\";\n\nwidgetContext.stateController.updateState(widgetContext.stateController.getStateId(), params);\nwidgetContext.updateAliases();"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "outlined",
+              "showLabel": true,
+              "label": "Overview",
+              "showIcon": true,
+              "icon": "dashboard",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF00",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "action": "GET_DASHBOARD_STATE_OBJECT",
+              "defaultValue": false,
+              "dataToValue": {
+                "type": "FUNCTION",
+                "compareToValue": true,
+                "dataToValueFunction": "return data.params.subStateId === \"main-breaker-overview\";"
+              }
+            },
+            "disabledState": {
+              "action": "DO_NOTHING"
+            }
+          },
+          "datasources": []
+        },
+        "id": "075946be-5d43-42a1-86b0-b7d6297d07c6",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "9f992ee8-e9a4-4c27-a609-a26aa3ab78c5": {
+        "sizeX": 24,
+        "sizeY": 14,
+        "row": 1,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {},
+          "settings": {
+            "useMarkdownTextFunction": true,
+            "markdownTextFunction": "let subState = ctx.stateController.getStateParams().subStateId || \"main-breaker-overview\";\n\nreturn `<div tb-toast toastTarget=\"layout\" class=\"block\">\n            <tb-dashboard-state class=\"state\" [ctx]=\"ctx\" stateId=\"${subState}\" [syncParentStateParams]=\"true\"></tb-dashboard-state>\n        </div>`;",
+            "applyDefaultMarkdownStyle": true,
+            "markdownCss": ".block {\n    flex-grow: 1;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    padding: 0;\n}\n\n.state {\n    flex-grow: 1;\n    padding: 0;\n    width: 100%;\n    height: 100%;\n}"
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [],
+              "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+            }
+          ]
+        },
+        "id": "9f992ee8-e9a4-4c27-a609-a26aa3ab78c5",
+        "typeFullFqn": "system.cards.markdown_card",
+        "type": "latest"
+      },
+      "be134d80-83cc-4122-beca-699bd212ef09": {
+        "sizeX": 16,
+        "sizeY": 1,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Floor Header",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {},
+          "settings": {
+            "useMarkdownTextFunction": false,
+            "markdownTextPattern": "**${Name}**",
+            "applyDefaultMarkdownStyle": true,
+            "markdownCss": ".tb-markdown-view p {\n    display: flex;\n    margin: 0;\n    align-items: center;\n    height: 100%;\n    font-size: 28px;\n    font-weight: 500;\n    color: #212121;\n    padding: 0;\n}\n"
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "name",
+                  "label": "Name",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "0dedaddc-76f3-4a25-9e0a-a0764422d2ce"
+            }
+          ]
+        },
+        "id": "be134d80-83cc-4122-beca-699bd212ef09",
+        "typeFullFqn": "system.cards.markdown_card",
+        "type": "latest"
+      },
+      "7d375d4e-1ee3-4a89-86d4-2f57df44af05": {
+        "sizeX": 4,
+        "sizeY": 1,
+        "row": 0,
+        "col": 16,
+        "config": {
+          "configMode": "basic",
+          "title": "Overview",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": null,
+                "name": null,
+                "icon": null,
+                "type": "custom",
+                "customFunction": "let params = widgetContext.stateController.getStateParams();\n\nparams.subStateId = \"office-floor-overview\";\n\nwidgetContext.stateController.updateState(widgetContext.stateController.getStateId(), params);\nwidgetContext.updateAliases();"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "outlined",
+              "showLabel": true,
+              "label": "Overview",
+              "showIcon": true,
+              "icon": "map",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF00",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "action": "GET_DASHBOARD_STATE_OBJECT",
+              "defaultValue": false,
+              "dataToValue": {
+                "type": "FUNCTION",
+                "compareToValue": true,
+                "dataToValueFunction": "return data.params.subStateId === \"office-floor-overview\";"
+              }
+            },
+            "disabledState": {
+              "action": "DO_NOTHING"
+            }
+          },
+          "datasources": []
+        },
+        "id": "7d375d4e-1ee3-4a89-86d4-2f57df44af05",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "142f442f-f8d8-494b-8d47-282b94950935": {
+        "sizeX": 6,
+        "sizeY": 1,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Breaker State",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "widgetCss": "tb-icon {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: 40px!important;\n  height: 40px!important;\n  background-color: var(--tb-primary-50);\n}\n\n.tb-value-card-icon-row {\n    width: 50%;\n    justify-content: space-between;\n}\n",
+          "units": "",
+          "decimals": 0,
+          "actions": {},
+          "settings": {
+            "layout": "horizontal",
+            "showLabel": true,
+            "labelColor": {
+              "type": "constant",
+              "color": "#000000DE"
+            },
+            "showIcon": true,
+            "icon": "power_settings_new",
+            "iconColor": {
+              "type": "constant",
+              "color": "var(--tb-primary-500)"
+            },
+            "iconSize": 24,
+            "iconSizeUnit": "px",
+            "valueColor": {
+              "type": "constant",
+              "color": "#000000DE"
+            },
+            "valueFont": {
+              "size": 30
+            },
+            "labelFont": {
+              "size": 20
+            },
+            "showDate": false,
+            "autoScale": true
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "state",
+                  "label": "State",
+                  "type": "timeseries",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+            }
+          ]
+        },
+        "id": "142f442f-f8d8-494b-8d47-282b94950935",
+        "typeFullFqn": "system.cards.horizontal_value_card",
+        "type": "latest"
+      },
+      "d001f783-5edb-4f4d-8844-ff1598cddc4d": {
+        "sizeX": 12,
+        "sizeY": 5,
+        "row": 6,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Main Breakers",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "4px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {
+            "rowClick": [
+              {
+                "id": "c2519180-9bb8-44fb-a16b-83650a14d262",
+                "name": "View Details",
+                "icon": "arrow_forward",
+                "type": "openDashboardState",
+                "targetDashboardStateId": "main-breaker-details",
+                "setEntityId": true,
+                "stateEntityParamName": "selectedMainBreaker"
+              }
+            ],
+            "headerButton": [
+              {
+                "id": "e770881c-dc34-46ee-8d43-f886fc60419d",
+                "name": "Create Main Breaker",
+                "icon": "add",
+                "type": "customPretty",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Create New Main Breaker\";\nlet createEntity = true;\n\nlet attributeKeys = [];\nlet additionalAttributes = [ ];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        \n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = \"DEVICE\";\n      let entitySubType = \"MainBreaker\";\n      let entityOwner = \"currentCustomer\";\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      let createRelations = [{\"fromStateEntity\":\"selectedOfficeFloor\",\"type\":\"OfficeFloorToMainBreaker\"}];\n      if (createRelations && createRelations.length) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        for (let createRelation of createRelations) {\n          let fromEntityId = null;\n          if (createRelation.fromStateEntity === 'singleEntity' && singleEntityId) {\n            fromEntityId = singleEntityId;\n          } else if (createRelation.fromStateEntity && stateParams[createRelation.fromStateEntity]) {\n            fromEntityId = stateParams[createRelation.fromStateEntity].entityId;\n          } else {\n            fromEntityId = stateParams.entityId;\n          }\n          if (!fromEntityId && createRelation.fromStateEntity === 'currentCustomer') {\n            fromEntityId = {id: currentUser.customerId, entityType: \"CUSTOMER\" };\n          }\n          if (fromEntityId && fromEntityId.id && fromEntityId.entityType) {\n            let relation = {\n              type: createRelation.type,\n              typeGroup: 'COMMON',\n              from: fromEntityId,\n              to: entityId\n            };\n            createRelationsObservables.push(entityRelationService.saveRelation(relation));\n          }\n        }\n      }\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = [\"MainBreaker\"];\n      \n      let entityOwner = \"currentCustomer\";\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Breaker Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Breaker name is required.</mat-error>\n  }\n</mat-form-field>\n</fieldset>\n    \n    \n    \n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+              }
+            ],
+            "actionCellButton": [
+              {
+                "id": "fc87f57e-30d6-422c-91b3-bc50defad467",
+                "name": "Edit Main Breaker",
+                "icon": "edit",
+                "type": "customPretty",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Edit Main Breaker '${entityName}'\";\nlet createEntity = false;\n\nlet attributeKeys = [];\nlet additionalAttributes = [ ];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        \n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = null;\n      let entitySubType = null;\n      let entityOwner = null;\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = null;\n      \n      let entityOwner = null;\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Device Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Device name is required.</mat-error>\n  }\n</mat-form-field>\n</fieldset>\n    \n    \n    \n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+              },
+              {
+                "id": "e16710e9-6b72-4b43-8235-d7a611afcc59",
+                "name": "Delete Main Breaker",
+                "icon": "delete",
+                "type": "custom",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet dialogs = $injector.get(widgetContext.servicesMap.get('dialogs'));\nlet deleteEntityTitle = \"Delete Main Breaker '${entityName}'\";\nlet deleteEntityPrompt = \"Are you sure you want to delete the main breaker '${entityName}'?\";\n\ndeleteEntityTitle = deleteEntityTitle.replaceAll('${entityName}', entityName);\ndeleteEntityPrompt = deleteEntityPrompt.replaceAll('${entityName}', entityName);\n\nopenDeleteEntityDialog();\n\nfunction openDeleteEntityDialog() {\n  dialogs.confirm(deleteEntityTitle, deleteEntityPrompt, 'Cancel', 'Delete').subscribe(\n    function(result) {\n      if (result) {\n        deleteEntity(entityId);\n      }\n    }\n  );\n}\n\nfunction deleteEntity(entityId) {\n  let deleteObservable = null;\n  switch (entityId.entityType) {\n    case 'DEVICE':\n      let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));\n      deleteObservable = deviceService.deleteDevice(entityId.id);\n      break;\n    case 'ASSET':\n      let assetService = $injector.get(widgetContext.servicesMap.get('assetService'));\n      deleteObservable = assetService.deleteAsset(entityId.id);\n      break;\n    case 'ENTITY_VIEW':\n      let entityViewService = $injector.get(widgetContext.servicesMap.get('entityViewService'));\n      deleteObservable = entityViewService.deleteEntityView(entityId.id);\n      break;\n    case 'EDGE':\n      let edgeService = $injector.get(widgetContext.servicesMap.get('edgeService'));\n      deleteObservable = edgeService.deleteEdge(entityId.id);\n      break;\n    case 'TENANT':\n      let tenantService = $injector.get(widgetContext.servicesMap.get('tenantService'));\n      deleteObservable = tenantService.deleteTenant(entityId.id);\n      break;\n    case 'CUSTOMER':\n      let customerService = $injector.get(widgetContext.servicesMap.get('customerService'));\n      deleteObservable = customerService.deleteCustomer(entityId.id);\n      break;\n    case 'DASHBOARD':\n      let dashboardService = $injector.get(widgetContext.servicesMap.get('dashboardService'));\n      deleteObservable = dashboardService.deleteDashboard(entityId.id);\n      break;\n    case 'USER':\n      let userService = $injector.get(widgetContext.servicesMap.get('userService'));\n      deleteObservable = userService.deleteUser(entityId.id);\n      break;\n    case 'SCHEDULER_EVENT':\n      let schedulerEventService = $injector.get(widgetContext.servicesMap.get('schedulerEventService'));\n      deleteObservable = schedulerEventService.deleteSchedulerEvent(entityId.id);\n      break;\n    case 'ROLE':\n      let roleService = $injector.get(widgetContext.servicesMap.get('roleService'));\n      deleteObservable = roleService.deleteRole(entityId.id);\n      break;\n    case 'ENTITY_GROUP':\n      let entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n      deleteObservable = entityGroupService.deleteEntityGroup(entityId.id);\n      break;\n    default:\n      showErrorDialog(`Unsupported entity type '${entityId.entityType}'`);\n      break;\n  }\n  if (deleteObservable) {\n    deleteObservable.subscribe(\n      function success() {\n        widgetContext.updateAliases();\n      },\n      function fail() {\n        showErrorDialog();\n      }\n    );\n  }\n}\n\nfunction showErrorDialog(error) {\n  let title = 'Error';\n  error = error || 'Please try again.';\n  let content = `An error occurred while deleting '${entityName}'. ${error}`;\n  dialogs.alert(title, content, 'CLOSE').subscribe(\n    function(result) {}\n  );\n}\n"
+              }
+            ]
+          },
+          "settings": {
+            "entitiesTitle": "Main Breakers",
+            "displayEntityName": false,
+            "displayEntityType": false
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "name",
+                  "label": "Name",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "state",
+                  "label": "State",
+                  "type": "timeseries",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {
+                    "useCellContentFunction": true,
+                    "useCellContentFunctionOnExport": true,
+                    "cellContentFunction": "let color = '#757575'; let backColor = '#F5F5F5'; let text = value; if (value === 'closed') { color = '#E8F5E9'; backColor = '#2E7D32'; text = 'Closed'; } else if (value === 'tripped') { color = '#FFEBEE'; backColor = '#C62828'; text = 'Tripped'; } else if (value === 'open') { color = '#FFF3E0'; backColor = '#EF6C00'; text = 'Open'; } return `<span style=\"font-size:14px;width:fit-content;font-weight:500;color:${color};background:${backColor};padding:8px;border-radius:6px;\">${text}</span>`;"
+                  }
+                },
+                {
+                  "name": "activePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "decimals": 1,
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "active",
+                  "label": "Status",
+                  "type": "attribute",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {
+                    "useCellContentFunction": true,
+                    "useCellContentFunctionOnExport": true,
+                    "cellContentFunction": "let color = '#757575'; let backColor = '#F5F5F5'; let text = 'Inactive'; if (value == 'true' || value == true) { text = 'Active'; color = '#E8EAF6'; backColor = '#303F9F'; } return `<span style=\"font-size:14px;width:fit-content;font-weight:500;color:${color};background:${backColor};padding:8px;border-radius:6px;\">${text}</span>`;"
+                  }
+                }
+              ],
+              "entityAliasId": "6cde2143-5432-4d8f-a2dd-c84534a98c0c"
+            }
+          ]
+        },
+        "id": "d001f783-5edb-4f4d-8844-ff1598cddc4d",
+        "typeFullFqn": "system.cards.entities_table",
+        "type": "latest"
+      },
+      "0ddffb1a-5c36-4887-9ad7-a339a91c6740": {
+        "sizeX": 23,
+        "sizeY": 1,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Building Header",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {},
+          "settings": {
+            "useMarkdownTextFunction": false,
+            "markdownTextPattern": "**${Name}** | ${Address}",
+            "applyDefaultMarkdownStyle": true,
+            "markdownCss": ".tb-markdown-view p {\n    display: flex;\n    margin: 0;\n    align-items: center;\n    height: 100%;\n    font-size: 28px;\n    font-weight: 500;\n    color: #212121;\n    padding: 0;\n}\n"
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "name",
+                  "label": "Name",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "address",
+                  "label": "Address",
+                  "type": "attribute",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "7327faf4-aded-4fa2-8008-8c380513e113"
+            }
+          ]
+        },
+        "id": "0ddffb1a-5c36-4887-9ad7-a339a91c6740",
+        "typeFullFqn": "system.cards.markdown_card",
+        "type": "latest"
+      },
+      "eb50572a-f223-43ce-b517-1c1bc8d4561c": {
+        "sizeX": 12,
+        "sizeY": 4,
+        "row": 1,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Active Power",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "units": "W",
+          "decimals": 0,
+          "actions": {},
+          "settings": {
+            "minValue": 0,
+            "maxValue": 15000,
+            "gaugeType": "arc",
+            "showTitle": true,
+            "title": "Active Power",
+            "titleFont": {
+              "color": "#000000DE"
+            },
+            "labelFont": {},
+            "valueFont": {},
+            "minMaxFont": {},
+            "showMinMax": false,
+            "barColor": {
+              "type": "function",
+              "colorFunction": "if (typeof value === 'number') { if (value > 13500) return '#F44336'; if (value > 10500) return '#FF9800'; return '#4CAF50'; } return '#bdbdbd';"
+            },
+            "showValue": true
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "activePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "color": "#000000DE",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "0a7a119c-e2b5-4e63-8024-d9eba9ddfffe"
+            }
+          ]
+        },
+        "id": "eb50572a-f223-43ce-b517-1c1bc8d4561c",
+        "typeFullFqn": "system.digital_gauges.simple_gauge_justgage",
+        "type": "latest"
+      },
+      "9a9400c2-e562-4e3e-b674-0fefa7eda038": {
+        "sizeX": 24,
+        "sizeY": 6,
+        "row": 5,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Alarms",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "4px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "alarmsTitle": "Alarms",
+            "enableSelection": true,
+            "enableSearch": true
+          },
+          "alarmSource": {
+            "type": "entity",
+            "name": "alarms",
+            "dataKeys": [
+              {
+                "name": "createdTime",
+                "label": "Created Time",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "originator",
+                "label": "Originator",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "type",
+                "label": "Type",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "severity",
+                "label": "Severity",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "status",
+                "label": "Status",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              }
+            ],
+            "entityAliasId": "64c039a4-0ef0-4b75-9c73-44ae6065fceb"
+          },
+          "alarmFilterConfig": {
+            "typeList": [],
+            "statusList": [
+              "ACTIVE"
+            ],
+            "severityList": [
+              "CRITICAL",
+              "MAJOR",
+              "MINOR",
+              "WARNING",
+              "INDETERMINATE"
+            ],
+            "searchPropagatedAlarms": true
+          },
+          "datasources": []
+        },
+        "id": "9a9400c2-e562-4e3e-b674-0fefa7eda038",
+        "typeFullFqn": "system.alarm_widgets.alarms_table",
+        "type": "alarm"
+      },
+      "72935318-a7e0-45bd-97e1-131eb3138842": {
+        "sizeX": 4,
+        "sizeY": 1,
+        "row": 0,
+        "col": 16,
+        "config": {
+          "configMode": "basic",
+          "title": "Statistics",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": null,
+                "name": null,
+                "icon": null,
+                "type": "custom",
+                "customFunction": "let params = widgetContext.stateController.getStateParams();\n\nparams.subStateId = \"office-unit-statistics\";\n\nwidgetContext.stateController.updateState(widgetContext.stateController.getStateId(), params);\nwidgetContext.updateAliases();"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "outlined",
+              "showLabel": true,
+              "label": "Statistics",
+              "showIcon": true,
+              "icon": "show_chart",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF00",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "action": "GET_DASHBOARD_STATE_OBJECT",
+              "defaultValue": false,
+              "dataToValue": {
+                "type": "FUNCTION",
+                "compareToValue": true,
+                "dataToValueFunction": "return data.params.subStateId === \"office-unit-statistics\";"
+              }
+            },
+            "disabledState": {
+              "action": "DO_NOTHING"
+            }
+          },
+          "datasources": []
+        },
+        "id": "72935318-a7e0-45bd-97e1-131eb3138842",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "d0e03ae2-2f43-4023-9559-73a6365a9b5d": {
+        "sizeX": 12,
+        "sizeY": 1,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Main Breaker",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {},
+          "settings": {
+            "useMarkdownTextFunction": false,
+            "markdownTextPattern": "**${Name}**",
+            "applyDefaultMarkdownStyle": true,
+            "markdownCss": ".tb-markdown-view p {\n    display: flex;\n    margin: 0;\n    align-items: center;\n    height: 100%;\n    font-size: 28px;\n    font-weight: 500;\n    color: #212121;\n    padding: 0;\n}\n"
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "name",
+                  "label": "Name",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+            }
+          ]
+        },
+        "id": "d0e03ae2-2f43-4023-9559-73a6365a9b5d",
+        "typeFullFqn": "system.cards.markdown_card",
+        "type": "latest"
+      },
+      "e9f7fb0b-391e-4972-a00b-97992364c049": {
+        "sizeX": 4,
+        "sizeY": 1,
+        "row": 0,
+        "col": 20,
+        "config": {
+          "configMode": "basic",
+          "title": "Statistics",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": null,
+                "name": null,
+                "icon": null,
+                "type": "custom",
+                "customFunction": "let params = widgetContext.stateController.getStateParams();\n\nparams.subStateId = \"office-floor-statistics\";\n\nwidgetContext.stateController.updateState(widgetContext.stateController.getStateId(), params);\nwidgetContext.updateAliases();"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "outlined",
+              "showLabel": true,
+              "label": "Statistics",
+              "showIcon": true,
+              "icon": "show_chart",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF00",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "action": "GET_DASHBOARD_STATE_OBJECT",
+              "defaultValue": false,
+              "dataToValue": {
+                "type": "FUNCTION",
+                "compareToValue": true,
+                "dataToValueFunction": "return data.params.subStateId === \"office-floor-statistics\";"
+              }
+            },
+            "disabledState": {
+              "action": "DO_NOTHING"
+            }
+          },
+          "datasources": []
+        },
+        "id": "e9f7fb0b-391e-4972-a00b-97992364c049",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "98101b1d-6b77-45e5-b1c4-fb27991950e5": {
+        "sizeX": 4,
+        "sizeY": 1,
+        "row": 0,
+        "col": 20,
+        "config": {
+          "configMode": "basic",
+          "title": "connect-breaker-device",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": null,
+                "name": "Open connectivity documentation",
+                "icon": null,
+                "openNewBrowserTab": true,
+                "url": "https://thingsboard.io/docs/paas/getting-started-guides/connectivity/",
+                "type": "openURL"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "filled",
+              "showLabel": true,
+              "label": "How to connect real devices?",
+              "showIcon": true,
+              "icon": "help_outline",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "action": "DO_NOTHING",
+              "defaultValue": false
+            },
+            "disabledState": {
+              "action": "DO_NOTHING",
+              "defaultValue": false
+            }
+          },
+          "datasources": []
+        },
+        "id": "98101b1d-6b77-45e5-b1c4-fb27991950e5",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "96b908b7-5582-4a46-9bee-16ff06a3055b": {
+        "sizeX": 24,
+        "sizeY": 14,
+        "row": 1,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {},
+          "settings": {
+            "useMarkdownTextFunction": true,
+            "markdownTextFunction": "let subState = ctx.stateController.getStateParams().subStateId || \"office-floor-statistics\";\n\nreturn `<div tb-toast toastTarget=\"layout\" class=\"block\">\n            <tb-dashboard-state class=\"state\" [ctx]=\"ctx\" stateId=\"${subState}\" [syncParentStateParams]=\"true\"></tb-dashboard-state>\n        </div>`;",
+            "applyDefaultMarkdownStyle": true,
+            "markdownCss": ".block {\n    flex-grow: 1;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    padding: 0;\n}\n\n.state {\n    flex-grow: 1;\n    padding: 0;\n    width: 100%;\n    height: 100%;\n}"
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [],
+              "entityAliasId": "0dedaddc-76f3-4a25-9e0a-a0764422d2ce"
+            }
+          ]
+        },
+        "id": "96b908b7-5582-4a46-9bee-16ff06a3055b",
+        "typeFullFqn": "system.cards.markdown_card",
+        "type": "latest"
+      },
+      "3545f963-81d6-4ba4-9696-b1ad4a008829": {
+        "sizeX": 12,
+        "sizeY": 11,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Floor Consumption History",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "default": {
+                "id": "default",
+                "label": "Energy Consumption",
+                "position": "left",
+                "min": null,
+                "max": null,
+                "units": "",
+                "decimals": 1,
+                "order": 0
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "dailyFloorEnergy",
+                  "label": "Daily Floor Energy",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#2196F3",
+                  "settings": {
+                    "yAxisId": "default",
+                    "showLegend": true
+                  }
+                },
+                {
+                  "name": "totalTenantConsumption",
+                  "label": "Total Tenant Consumption",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#4CAF50",
+                  "settings": {
+                    "yAxisId": "default",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "0dedaddc-76f3-4a25-9e0a-a0764422d2ce"
+            }
+          ]
+        },
+        "id": "3545f963-81d6-4ba4-9696-b1ad4a008829",
+        "typeFullFqn": "system.time_series_chart",
+        "type": "timeseries"
+      },
+      "c658b81b-6794-44c8-b644-e77d984b0d00": {
+        "sizeX": 12,
+        "sizeY": 1,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Voltage",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "widgetCss": "tb-icon {\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  border-radius: 50%;\n  width: 40px!important;\n  height: 40px!important;\n  background-color: var(--tb-primary-50);\n}\n\n.tb-value-card-icon-row {\n    width: 50%;\n    justify-content: space-between;\n}\n",
+          "units": "V",
+          "decimals": 1,
+          "actions": {},
+          "settings": {
+            "layout": "horizontal",
+            "showLabel": true,
+            "labelColor": {
+              "type": "constant",
+              "color": "#000000DE"
+            },
+            "showIcon": true,
+            "icon": "electric_meter",
+            "iconColor": {
+              "type": "constant",
+              "color": "var(--tb-primary-500)"
+            },
+            "iconSize": 24,
+            "iconSizeUnit": "px",
+            "valueColor": {
+              "type": "constant",
+              "color": "#000000DE"
+            },
+            "valueFont": {
+              "size": 30
+            },
+            "labelFont": {
+              "size": 20
+            },
+            "showDate": false,
+            "autoScale": true
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "voltage",
+                  "label": "Voltage",
+                  "type": "timeseries",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "0a7a119c-e2b5-4e63-8024-d9eba9ddfffe"
+            }
+          ]
+        },
+        "id": "c658b81b-6794-44c8-b644-e77d984b0d00",
+        "typeFullFqn": "system.cards.horizontal_value_card",
+        "type": "latest"
+      },
+      "e3bab18b-940d-4f4b-af12-9a4b2fe21444": {
+        "sizeX": 24,
+        "sizeY": 5,
+        "row": 6,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Breaker Energy Trend",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "default": {
+                "id": "default",
+                "label": "Energy",
+                "position": "left",
+                "min": null,
+                "max": null,
+                "units": "",
+                "decimals": 1,
+                "order": 0
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "dailyFloorEnergy",
+                  "label": "Daily Floor Energy",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#2196F3",
+                  "settings": {
+                    "yAxisId": "default",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+            }
+          ]
+        },
+        "id": "e3bab18b-940d-4f4b-af12-9a4b2fe21444",
+        "typeFullFqn": "system.time_series_chart",
+        "type": "timeseries"
+      },
+      "1a361761-a319-4fc1-97a0-22622d585cf6": {
+        "sizeX": 12,
+        "sizeY": 11,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Electrical Metrics Trends",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "power": {
+                "id": "power",
+                "label": "Active Power",
+                "position": "left",
+                "min": 0,
+                "max": 15000,
+                "units": "",
+                "decimals": 1,
+                "order": 0
+              },
+              "voltage": {
+                "id": "voltage",
+                "label": "Voltage",
+                "position": "right",
+                "min": 0,
+                "max": 250,
+                "units": "",
+                "decimals": 1,
+                "order": 1
+              },
+              "current": {
+                "id": "current",
+                "label": "Current",
+                "position": "right",
+                "min": 0,
+                "max": 60,
+                "units": "",
+                "decimals": 1,
+                "order": 2
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "activePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#2196F3",
+                  "settings": {
+                    "yAxisId": "power",
+                    "showLegend": true
+                  }
+                },
+                {
+                  "name": "voltage",
+                  "label": "Voltage",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#F44336",
+                  "settings": {
+                    "yAxisId": "voltage",
+                    "showLegend": true
+                  }
+                },
+                {
+                  "name": "current",
+                  "label": "Current",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#4CAF50",
+                  "settings": {
+                    "yAxisId": "current",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "0a7a119c-e2b5-4e63-8024-d9eba9ddfffe"
+            }
+          ]
+        },
+        "id": "1a361761-a319-4fc1-97a0-22622d585cf6",
+        "typeFullFqn": "system.time_series_chart",
+        "type": "timeseries"
+      },
+      "50ddec34-42b8-45cf-9b41-8629fefff74a": {
+        "sizeX": 12,
+        "sizeY": 11,
+        "row": 0,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Alarms",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "4px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "alarmsTitle": "Alarms",
+            "enableSelection": true,
+            "enableSearch": true
+          },
+          "alarmSource": {
+            "type": "entity",
+            "name": "alarms",
+            "dataKeys": [
+              {
+                "name": "createdTime",
+                "label": "Created Time",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "originator",
+                "label": "Originator",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "type",
+                "label": "Type",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "severity",
+                "label": "Severity",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              },
+              {
+                "name": "status",
+                "label": "Status",
+                "type": "alarm",
+                "color": "var(--tb-primary-500)",
+                "settings": {}
+              }
+            ],
+            "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+          },
+          "alarmFilterConfig": {
+            "typeList": [],
+            "statusList": [
+              "ACTIVE"
+            ],
+            "severityList": [
+              "CRITICAL",
+              "MAJOR",
+              "MINOR",
+              "WARNING",
+              "INDETERMINATE"
+            ],
+            "searchPropagatedAlarms": true
+          },
+          "datasources": []
+        },
+        "id": "50ddec34-42b8-45cf-9b41-8629fefff74a",
+        "typeFullFqn": "system.alarm_widgets.alarms_table",
+        "type": "alarm"
+      },
+      "c22fba98-a98d-4f2c-bcc1-565430f079a4": {
+        "sizeX": 4,
+        "sizeY": 1,
+        "row": 0,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Overview",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": null,
+                "name": null,
+                "icon": null,
+                "type": "custom",
+                "customFunction": "let params = widgetContext.stateController.getStateParams();\n\nparams.subStateId = \"office-unit-overview\";\n\nwidgetContext.stateController.updateState(widgetContext.stateController.getStateId(), params);\nwidgetContext.updateAliases();"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "outlined",
+              "showLabel": true,
+              "label": "Overview",
+              "showIcon": true,
+              "icon": "info",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF00",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "action": "GET_DASHBOARD_STATE_OBJECT",
+              "defaultValue": false,
+              "dataToValue": {
+                "type": "FUNCTION",
+                "compareToValue": true,
+                "dataToValueFunction": "return data.params.subStateId === \"office-unit-overview\";"
+              }
+            },
+            "disabledState": {
+              "action": "DO_NOTHING"
+            }
+          },
+          "datasources": []
+        },
+        "id": "c22fba98-a98d-4f2c-bcc1-565430f079a4",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "0531bdba-6fdb-4c46-8415-eaad5dde4d24": {
+        "sizeX": 12,
+        "sizeY": 10,
+        "row": 1,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Main Breaker Power Load",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "units": "W",
+          "decimals": 0,
+          "actions": {},
+          "settings": {
+            "minValue": 0,
+            "maxValue": 100000,
+            "gaugeType": "arc",
+            "showTitle": true,
+            "title": "Main Breaker Power Load",
+            "titleFont": {
+              "color": "#000000DE"
+            },
+            "labelFont": {},
+            "valueFont": {},
+            "minMaxFont": {},
+            "showMinMax": false,
+            "barColor": {
+              "type": "function",
+              "colorFunction": "if (typeof value === 'number') { if (value > 80000) { return '#F44336'; } else if (value > 60000) { return '#FF9800'; } else { return '#4CAF50'; } } return '#BDBDBD';"
+            },
+            "showValue": true
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "activePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "color": "#000000DE",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+            }
+          ]
+        },
+        "id": "0531bdba-6fdb-4c46-8415-eaad5dde4d24",
+        "typeFullFqn": "system.digital_gauges.simple_gauge_justgage",
+        "type": "latest"
+      },
+      "bb4ce8df-a38f-4352-9ca9-96fd28e3d4c0": {
+        "sizeX": 12,
+        "sizeY": 5,
+        "row": 7,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Building Energy Consumption and Cost Trends",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "consumption_axis": {
+                "id": "consumption_axis",
+                "label": "Consumption",
+                "position": "left",
+                "min": null,
+                "max": null,
+                "units": "",
+                "decimals": 1,
+                "order": 0
+              },
+              "cost_axis": {
+                "id": "cost_axis",
+                "label": "Cost",
+                "position": "right",
+                "min": null,
+                "max": null,
+                "units": "",
+                "decimals": 1,
+                "order": 1
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "totalBuildingConsumption",
+                  "label": "Energy Consumption",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#2196F3",
+                  "settings": {
+                    "yAxisId": "consumption_axis",
+                    "showLegend": true
+                  }
+                },
+                {
+                  "name": "dailyCost",
+                  "label": "Daily Cost",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#4CAF50",
+                  "settings": {
+                    "yAxisId": "cost_axis",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "7327faf4-aded-4fa2-8008-8c380513e113"
+            }
+          ]
+        },
+        "id": "bb4ce8df-a38f-4352-9ca9-96fd28e3d4c0",
+        "typeFullFqn": "system.time_series_chart",
+        "type": "timeseries"
+      },
+      "accf469f-8a07-4af2-a844-385bd2c2c9b8": {
+        "sizeX": 12,
+        "sizeY": 6,
+        "row": 1,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Office Floors",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "4px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {
+            "rowClick": [
+              {
+                "id": "13a25bd8-9c4a-490d-8a98-32531ad16c9d",
+                "name": "View Office Floor Details",
+                "icon": "arrow_forward",
+                "type": "openDashboardState",
+                "targetDashboardStateId": "office-floor-details",
+                "setEntityId": true,
+                "stateEntityParamName": "selectedOfficeFloor"
+              }
+            ],
+            "headerButton": [
+              {
+                "id": "a176c8b7-5be6-4249-a53d-9608a72ea191",
+                "name": "Add Office Floor",
+                "icon": "add",
+                "type": "customPretty",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Create New Office Floor\";\nlet createEntity = true;\n\nlet attributeKeys = [\"floorPlan\"];\nlet additionalAttributes = [ ];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        floorPlan: [null, []]\n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = \"ASSET\";\n      let entitySubType = \"OfficeFloor\";\n      let entityOwner = \"currentCustomer\";\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      let createRelations = [{\"fromStateEntity\":\"singleEntity\",\"type\":\"Contains\"}];\n      if (createRelations && createRelations.length) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        for (let createRelation of createRelations) {\n          let fromEntityId = null;\n          if (createRelation.fromStateEntity === 'singleEntity' && singleEntityId) {\n            fromEntityId = singleEntityId;\n          } else if (createRelation.fromStateEntity && stateParams[createRelation.fromStateEntity]) {\n            fromEntityId = stateParams[createRelation.fromStateEntity].entityId;\n          } else {\n            fromEntityId = stateParams.entityId;\n          }\n          if (!fromEntityId && createRelation.fromStateEntity === 'currentCustomer') {\n            fromEntityId = {id: currentUser.customerId, entityType: \"CUSTOMER\" };\n          }\n          if (fromEntityId && fromEntityId.id && fromEntityId.entityType) {\n            let relation = {\n              type: createRelation.type,\n              typeGroup: 'COMMON',\n              from: fromEntityId,\n              to: entityId\n            };\n            createRelationsObservables.push(entityRelationService.saveRelation(relation));\n          }\n        }\n      }\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = [\"OfficeFloor\"];\n      \n      let entityOwner = \"currentCustomer\";\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Floor Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Floor name is required.</mat-error>\n  }\n</mat-form-field>\n</fieldset>\n    \n    \n    <fieldset formGroupName=\"attributes\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><tb-gallery-image-input class=\"flex-1\" formControlName=\"floorPlan\" label=\"Floor Plan Image\">\n</tb-gallery-image-input></fieldset>\n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+              }
+            ],
+            "actionCellButton": [
+              {
+                "id": "86322a5e-c5cb-4f2e-aa49-5cc887682295",
+                "name": "Edit Office Floor",
+                "icon": "edit",
+                "type": "customPretty",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet customDialog = $injector.get(widgetContext.servicesMap.get('customDialog'));\nlet entityService = $injector.get(widgetContext.servicesMap.get('entityService'));\nlet attributeService = $injector.get(widgetContext.servicesMap.get('attributeService'));\nlet entityRelationService = $injector.get(widgetContext.servicesMap.get('entityRelationService'));\nlet entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n\nlet dialogTitle = \"Edit '${entityName}'\";\nlet createEntity = false;\n\nlet attributeKeys = [];\nlet additionalAttributes = [ ];\nlet additionalTelemetry = [ ];\n\nopenEntityDialog();\n\nfunction openEntityDialog() {\n  customDialog.customDialog(htmlTemplate, EntityDialogController).subscribe();\n}\n\nfunction EntityDialogController(instance) {\n  let vm = instance;\n\n  const currentUser = widgetContext.currentUser;\n\n  if (createEntity) {\n    vm.dialogTitle = dialogTitle;\n  } else {\n    vm.dialogTitle = dialogTitle.replaceAll('${entityName}', entityName);\n  }\n\n  vm.submitTitle = createEntity ? 'Create' : 'Save';\n\n  vm.entityFormGroup = vm.fb.group({\n    entityFields: vm.fb.group({\n      name: [null, [vm.validators.required]]\n    }),\n    \n  });\n\n  \n\n  if (attributeKeys.length) {\n    vm.entityFormGroup.addControl('attributes',\n      vm.fb.group({\n        \n      })\n    );\n  }\n\n  vm.save = function() {\n    vm.entityFormGroup.markAsPristine();\n    saveEntity().subscribe(\n      function (entity) {\n        widgetContext.rxjs.forkJoin([\n          saveAttributes(entity.id),\n          saveTelemetry(entity.id),\n          createRelations(entity.id),\n          addToEntityGroups(entity.id)\n        ]).subscribe(\n          function () {\n            widgetContext.updateAliases();\n            vm.dialogRef.close(null);\n          }\n        );\n      }\n    );\n  };\n\n  vm.cancel = function() {\n    vm.dialogRef.close(null);\n  };\n\n  if (!createEntity) {\n    loadEntity();\n  }\n\n  function saveEntity() {\n    const entityFields = vm.entityFormGroup.get('entityFields').value;\n    let entity;\n    if (createEntity) {\n      entity = entityFields;\n      let entityType = null;\n      let entitySubType = null;\n      let entityOwner = null;\n      entity.id = {\n        entityType: entityType\n      };\n      \n      \n      if (entitySubType) {\n        entity.type = entitySubType;\n      }\n      \n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n          stateParams = stateParams[entityOwner];\n        }\n        let ownerId = stateParams.entityId;\n        if (ownerId && ownerId.entityType === 'CUSTOMER') {\n          entity.customerId = ownerId;\n        }\n      }\n      if (!entity.customerId && widgetContext.currentUser.authority === 'CUSTOMER_USER') {\n        entity.customerId = {id: widgetContext.currentUser.customerId, entityType: 'CUSTOMER'};\n      }\n      if (entityType === 'USER') {\n        if (entity.customerId) {\n          entity.authority = 'CUSTOMER_USER';\n        } else {\n          entity.authority = 'TENANT_ADMIN';\n        }\n      }\n    } else {\n      entity = {...vm.entity, ...entityFields};\n    }\n    return entityService.saveEntity(entity);\n  }\n\n  function saveAttributes(entityId) {\n    if (attributeKeys.length || additionalAttributes.length) {\n      let attributes = attributeKeys.length ? vm.entityFormGroup.get('attributes').value : [];\n      let attributesArray = [];\n      for (let key in attributes) {\n        if (attributes[key] !== null) {\n          attributesArray.push({key: key, value: attributes[key]});\n        }\n      }\n      if (additionalAttributes.length) {\n        additionalAttributes.forEach(attribute => {\n          attributesArray.push({key: attribute.key, value: attribute.value});\n        })\n      }\n      if (attributesArray.length > 0) {\n        return attributeService.saveEntityAttributes(entityId, \"SERVER_SCOPE\", attributesArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n    function saveTelemetry(entityId) {\n      if (additionalTelemetry.length) {\n        let telemetryArray = [];\n        additionalTelemetry.forEach(telemetry => {\n          telemetryArray.push({key: telemetry.key, value: telemetry.value});\n        })\n        return attributeService.saveEntityTimeseries(entityId, \"LATEST_TELEMETRY\", telemetryArray);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    }\n\n  function createRelations(entityId) {\n    let singleEntityId;\n    for (const value of Object.values(widgetContext.aliasController.entityAliases)) {\n      if (value.filter.type === 'singleEntity') {\n        singleEntityId = value.filter.singleEntity ?? null;\n      }\n    }\n\n    if (createEntity) {\n      let createRelationsObservables = [];\n      \n      \n      if (createRelationsObservables.length) {\n        return widgetContext.rxjs.forkJoin(createRelationsObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function addToEntityGroups(entityId) {\n    if (createEntity) {\n      let addToGroupObservables = [];\n      let targetEntityGroups = null;\n      \n      let entityOwner = null;\n      let ownerId;\n      if (entityOwner) {\n        let stateParams = widgetContext.stateController.getStateParams();\n        if (stateParams[entityOwner]) {\n            stateParams = stateParams[entityOwner];\n        }\n        ownerId = stateParams.entityId;\n      }\n      if (targetEntityGroups && targetEntityGroups.length) {\n        for (let targetEntityGroup of targetEntityGroups) {\n          addToGroupObservables.push(getOrCreateEntityGroupByName(targetEntityGroup, entityId.entityType, ownerId).pipe(\n            widgetContext.rxjs.switchMap((group) => {\n              if (group) {\n                return entityGroupService.addEntityToEntityGroup(group.id.id, entityId.id);\n              } else {\n                return widgetContext.rxjs.of(null);\n              }\n            })\n          ));\n        }\n      }\n      if (addToGroupObservables.length) {\n        return widgetContext.rxjs.forkJoin(addToGroupObservables);\n      } else {\n        return widgetContext.rxjs.of([]);\n      }\n    } else {\n      return widgetContext.rxjs.of([]);\n    }\n  }\n\n  function loadEntity() {\n    entityService.getEntity(entityId.entityType, entityId.id).subscribe(\n      function(entity) {\n        vm.entity = entity;\n        vm.entityFormGroup.get('entityFields').patchValue(entity);\n        if (attributeKeys.length) {\n          attributeService.getEntityAttributes(entityId, 'SERVER_SCOPE', attributeKeys).subscribe(\n            function (attributes) {\n              let entityAttributes = {};\n              for (var i = 0; i < attributes.length; i++) {\n                entityAttributes[attributes[i].key] = attributes[i].value;\n              }\n              vm.entityFormGroup.get('attributes').patchValue(entityAttributes);\n            }\n          );\n        }\n      }\n    );\n  }\n\n  function getOrCreateEntityGroupByName(groupName, groupType, ownerId) {\n    var entityGroupsPageLink = widgetContext.pageLink(10, 0, groupName);\n    let findEntyGroup$;\n    if (ownerId) {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByOwnerIdAndPageLink(ownerId.entityType, ownerId.id, groupType, entityGroupsPageLink, {ignoreLoading: true});\n    } else {\n      findEntyGroup$ = entityGroupService.getEntityGroupsByPageLink(entityGroupsPageLink, groupType, {ignoreLoading: true});\n    }\n    return findEntyGroup$.pipe(\n      widgetContext.rxjs.switchMap((data) => {\n        if (data.data.length) {\n          const findGroup = data.data.find((group) => group.name === groupName);\n          if (findGroup) {\n            return widgetContext.rxjs.of(findGroup);\n          }\n        }\n        const entityGroup = {\n          name: groupName,\n          type: groupType,\n        }\n        if (ownerId) {\n          entityGroup.ownerId = ownerId;\n        }\n        return entityGroupService.saveEntityGroup(entityGroup, {ignoreLoading: true}).pipe(\n          widgetContext.rxjs.catchError(() => widgetContext.rxjs.of(null))\n        );\n      })\n    );\n  }\n}",
+                "customHtml": "<form #entityForm=\"ngForm\" [formGroup]=\"entityFormGroup\"\n      (ngSubmit)=\"save()\" class=\"entity-form\" style=\"width: 600px;\">\n  <mat-toolbar color=\"primary\">\n    <h2>{{ dialogTitle }}</h2>\n    <span class=\"flex-1\"></span>\n    <button mat-icon-button (click)=\"cancel()\" type=\"button\">\n      <mat-icon class=\"material-icons\">close</mat-icon>\n    </button>\n  </mat-toolbar>\n  <mat-progress-bar color=\"warn\" mode=\"indeterminate\" *ngIf=\"isLoading$ | async\">\n  </mat-progress-bar>\n  <div style=\"height: 4px;\" *ngIf=\"!(isLoading$ | async)\"></div>\n  <div mat-dialog-content>\n    <fieldset formGroupName=\"entityFields\" class=\"tb-form-panel outlined\" [disabled]=\"isLoading$ | async\"><mat-form-field appearance=\"outline\">\n  <mat-label>Floor Name</mat-label>\n  <input matInput formControlName=\"name\" required=\"required\">\n  @if(entityFormGroup.get(\"entityFields\").get(\"name\").hasError(\"required\")) {\n    <mat-error>Floor name is required.</mat-error>\n  }\n</mat-form-field>\n</fieldset>\n    \n    \n    \n  </div>\n  <div mat-dialog-actions class=\"flex items-center justify-end\">\n    <button mat-button color=\"primary\"\n            type=\"button\"\n            [disabled]=\"(isLoading$ | async)\"\n            (click)=\"cancel()\" cdkFocusInitial>\n      Cancel\n    </button>\n    <button mat-button mat-raised-button color=\"primary\"\n            type=\"submit\"\n            [disabled]=\"(isLoading$ | async) || entityForm.invalid || !entityForm.dirty\">\n      {{ submitTitle }}\n    </button>\n  </div>\n</form>\n"
+              },
+              {
+                "id": "12bb4e94-80bf-415c-b707-2ae1ed2e65e9",
+                "name": "Delete Office Floor",
+                "icon": "delete",
+                "type": "custom",
+                "customFunction": "let $injector = widgetContext.$scope.$injector;\nlet dialogs = $injector.get(widgetContext.servicesMap.get('dialogs'));\nlet deleteEntityTitle = \"Delete Office Floor '${entityName}'\";\nlet deleteEntityPrompt = \"Are you sure you want to delete the Office Floor '${entityName}'?\";\n\ndeleteEntityTitle = deleteEntityTitle.replaceAll('${entityName}', entityName);\ndeleteEntityPrompt = deleteEntityPrompt.replaceAll('${entityName}', entityName);\n\nopenDeleteEntityDialog();\n\nfunction openDeleteEntityDialog() {\n  dialogs.confirm(deleteEntityTitle, deleteEntityPrompt, 'Cancel', 'Delete').subscribe(\n    function(result) {\n      if (result) {\n        deleteEntity(entityId);\n      }\n    }\n  );\n}\n\nfunction deleteEntity(entityId) {\n  let deleteObservable = null;\n  switch (entityId.entityType) {\n    case 'DEVICE':\n      let deviceService = $injector.get(widgetContext.servicesMap.get('deviceService'));\n      deleteObservable = deviceService.deleteDevice(entityId.id);\n      break;\n    case 'ASSET':\n      let assetService = $injector.get(widgetContext.servicesMap.get('assetService'));\n      deleteObservable = assetService.deleteAsset(entityId.id);\n      break;\n    case 'ENTITY_VIEW':\n      let entityViewService = $injector.get(widgetContext.servicesMap.get('entityViewService'));\n      deleteObservable = entityViewService.deleteEntityView(entityId.id);\n      break;\n    case 'EDGE':\n      let edgeService = $injector.get(widgetContext.servicesMap.get('edgeService'));\n      deleteObservable = edgeService.deleteEdge(entityId.id);\n      break;\n    case 'TENANT':\n      let tenantService = $injector.get(widgetContext.servicesMap.get('tenantService'));\n      deleteObservable = tenantService.deleteTenant(entityId.id);\n      break;\n    case 'CUSTOMER':\n      let customerService = $injector.get(widgetContext.servicesMap.get('customerService'));\n      deleteObservable = customerService.deleteCustomer(entityId.id);\n      break;\n    case 'DASHBOARD':\n      let dashboardService = $injector.get(widgetContext.servicesMap.get('dashboardService'));\n      deleteObservable = dashboardService.deleteDashboard(entityId.id);\n      break;\n    case 'USER':\n      let userService = $injector.get(widgetContext.servicesMap.get('userService'));\n      deleteObservable = userService.deleteUser(entityId.id);\n      break;\n    case 'SCHEDULER_EVENT':\n      let schedulerEventService = $injector.get(widgetContext.servicesMap.get('schedulerEventService'));\n      deleteObservable = schedulerEventService.deleteSchedulerEvent(entityId.id);\n      break;\n    case 'ROLE':\n      let roleService = $injector.get(widgetContext.servicesMap.get('roleService'));\n      deleteObservable = roleService.deleteRole(entityId.id);\n      break;\n    case 'ENTITY_GROUP':\n      let entityGroupService = $injector.get(widgetContext.servicesMap.get('entityGroupService'));\n      deleteObservable = entityGroupService.deleteEntityGroup(entityId.id);\n      break;\n    default:\n      showErrorDialog(`Unsupported entity type '${entityId.entityType}'`);\n      break;\n  }\n  if (deleteObservable) {\n    deleteObservable.subscribe(\n      function success() {\n        widgetContext.updateAliases();\n      },\n      function fail() {\n        showErrorDialog();\n      }\n    );\n  }\n}\n\nfunction showErrorDialog(error) {\n  let title = 'Error';\n  error = error || 'Please try again.';\n  let content = `An error occurred while deleting '${entityName}'. ${error}`;\n  dialogs.alert(title, content, 'CLOSE').subscribe(\n    function(result) {}\n  );\n}\n"
+              }
+            ]
+          },
+          "settings": {
+            "entitiesTitle": "Office Floors",
+            "displayEntityName": false,
+            "displayEntityType": false
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "name",
+                  "label": "Floor Name",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "dailyFloorEnergy",
+                  "label": "Daily Energy",
+                  "type": "timeseries",
+                  "decimals": 1,
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "floorActivePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "decimals": 1,
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "3272366f-d077-44a8-854b-6fed87d70687"
+            }
+          ]
+        },
+        "id": "accf469f-8a07-4af2-a844-385bd2c2c9b8",
+        "typeFullFqn": "system.cards.entities_table",
+        "type": "latest"
+      },
+      "e643d044-c596-48cf-9019-096384e6920e": {
+        "sizeX": 12,
+        "sizeY": 11,
+        "row": 0,
+        "col": 12,
+        "config": {
+          "configMode": "basic",
+          "title": "Floor Active Power Trend",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "default": {
+                "id": "default",
+                "label": "Active Power",
+                "position": "left",
+                "min": null,
+                "max": null,
+                "units": "",
+                "decimals": 1,
+                "order": 0
+              }
+            }
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "floorActivePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "units": "",
+                  "decimals": 1,
+                  "color": "#2196F3",
+                  "settings": {
+                    "yAxisId": "default",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "0dedaddc-76f3-4a25-9e0a-a0764422d2ce"
+            }
+          ]
+        },
+        "id": "e643d044-c596-48cf-9019-096384e6920e",
+        "typeFullFqn": "system.time_series_chart",
+        "type": "timeseries"
+      },
+      "e3bac23d-ff76-4f7e-873c-2d87fef62062": {
+        "sizeX": 12,
+        "sizeY": 1,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Office Unit",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {},
+          "settings": {
+            "useMarkdownTextFunction": false,
+            "markdownTextPattern": "**${Name}**",
+            "applyDefaultMarkdownStyle": true,
+            "markdownCss": ".tb-markdown-view p {\n    display: flex;\n    margin: 0;\n    align-items: center;\n    height: 100%;\n    font-size: 28px;\n    font-weight: 500;\n    color: #212121;\n    padding: 0;\n}\n"
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "name",
+                  "label": "Name",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "64c039a4-0ef0-4b75-9c73-44ae6065fceb"
+            }
+          ]
+        },
+        "id": "e3bac23d-ff76-4f7e-873c-2d87fef62062",
+        "typeFullFqn": "system.cards.markdown_card",
+        "type": "latest"
+      },
+      "e1d93317-516f-43a1-94d6-cabf8f8c6ec3": {
+        "sizeX": 12,
+        "sizeY": 4,
+        "row": 1,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Office Unit Details",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "padding": "10px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "useMarkdownTextFunction": false,
+            "markdownTextPattern": "<div class=\"value-block flex flex-col justify-between gap-2\"><div class=\"flex flex-1\"><span class=\"title\">Office Unit Details</span></div><div class=\"flex flex-col justify-between gap-1\"><div class=\"flex flex-row justify-between\"><span class=\"label\">Name</span><span class=\"value\">${Name}</span></div><div class=\"flex flex-row justify-between\"><span class=\"label\">Label</span><span class=\"value\">${Label}</span></div><div class=\"flex flex-row justify-between\"><span class=\"label\">Active Power</span><span class=\"value\">${Active Power:1}</span></div><div class=\"flex flex-row justify-between\"><span class=\"label\">Daily Energy</span><span class=\"value\">${Daily Energy:1}</span></div></div></div>",
+            "applyDefaultMarkdownStyle": false,
+            "markdownCss": ".label {font-weight: 400;font-size: 16px;line-height: 21px;letter-spacing: 0.2px;color: #424242;}.value {padding: 4px;font-weight: 500;font-size: 16px;line-height: 21px;letter-spacing: 0.2px;color: #212121;}.title {font-weight: 600;font-size: 18px;line-height: 21px;letter-spacing: 0.2px;color: #212121;}.value-block {height: 100%;}"
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "name",
+                  "label": "Name",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "label",
+                  "label": "Label",
+                  "type": "entityField",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "activePower",
+                  "label": "Active Power",
+                  "type": "timeseries",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                },
+                {
+                  "name": "dailyOfficeEnergy",
+                  "label": "Daily Energy",
+                  "type": "timeseries",
+                  "color": "var(--tb-primary-500)",
+                  "settings": {}
+                }
+              ],
+              "entityAliasId": "64c039a4-0ef0-4b75-9c73-44ae6065fceb"
+            }
+          ]
+        },
+        "id": "e1d93317-516f-43a1-94d6-cabf8f8c6ec3",
+        "typeFullFqn": "system.cards.markdown_card",
+        "type": "latest"
+      },
+      "f3402cce-adb2-4e28-9dac-0411c343a1f0": {
+        "sizeX": 4,
+        "sizeY": 1,
+        "row": 0,
+        "col": 16,
+        "config": {
+          "configMode": "basic",
+          "title": "Statistics",
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {
+            "click": [
+              {
+                "id": null,
+                "name": null,
+                "icon": null,
+                "type": "custom",
+                "customFunction": "let params = widgetContext.stateController.getStateParams();\n\nparams.subStateId = \"main-breaker-statistics\";\n\nwidgetContext.stateController.updateState(widgetContext.stateController.getStateId(), params);\nwidgetContext.updateAliases();"
+              }
+            ]
+          },
+          "settings": {
+            "appearance": {
+              "type": "outlined",
+              "showLabel": true,
+              "label": "Statistics",
+              "showIcon": true,
+              "icon": "show_chart",
+              "mainColor": "var(--tb-primary-500)",
+              "backgroundColor": "#FFFFFF00",
+              "customStyle": {}
+            },
+            "activatedState": {
+              "action": "GET_DASHBOARD_STATE_OBJECT",
+              "defaultValue": false,
+              "dataToValue": {
+                "type": "FUNCTION",
+                "compareToValue": true,
+                "dataToValueFunction": "return data.params.subStateId === \"main-breaker-statistics\";"
+              }
+            },
+            "disabledState": {
+              "action": "DO_NOTHING"
+            }
+          },
+          "datasources": []
+        },
+        "id": "f3402cce-adb2-4e28-9dac-0411c343a1f0",
+        "typeFullFqn": "system.action_button",
+        "type": "latest"
+      },
+      "c91b9b21-f993-4722-b4bf-133731feb76c": {
+        "sizeX": 12,
+        "sizeY": 6,
+        "row": 0,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "title": "Breaker State History",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": true,
+          "dropShadow": false,
+          "useDashboardTimewindow": true,
+          "padding": "0px",
+          "margin": "0px",
+          "borderRadius": "8px",
+          "widgetStyle": {
+            "box-shadow": "0px 2px 4px 0px #00000024;"
+          },
+          "actions": {},
+          "settings": {
+            "dataZoom": false,
+            "showLegend": false,
+            "legendConfig": {
+              "position": "top",
+              "sortDataKeys": false,
+              "showMin": false,
+              "showMax": false,
+              "showAvg": true,
+              "showTotal": false,
+              "showLatest": false
+            },
+            "xAxis": {
+              "show": true,
+              "position": "bottom"
+            },
+            "yAxis": {
+              "show": true,
+              "position": "left"
+            },
+            "yAxes": {
+              "default": {
+                "id": "default",
+                "label": "Status",
+                "position": "left",
+                "min": null,
+                "max": null,
+                "units": null,
+                "decimals": null,
+                "order": 0
+              }
+            },
+            "states": [
+              {
+                "label": "Closed",
+                "value": 0,
+                "sourceType": "constant",
+                "sourceValue": "closed"
+              },
+              {
+                "label": "Tripped",
+                "value": 1,
+                "sourceType": "constant",
+                "sourceValue": "tripped"
+              },
+              {
+                "label": "Open",
+                "value": 2,
+                "sourceType": "constant",
+                "sourceValue": "open"
+              }
+            ]
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [
+                {
+                  "name": "state",
+                  "label": "Breaker State",
+                  "type": "timeseries",
+                  "decimals": 0,
+                  "color": "#F44336",
+                  "settings": {
+                    "yAxisId": "default",
+                    "showLegend": true
+                  }
+                }
+              ],
+              "entityAliasId": "fc70867e-e467-430b-83dd-ef1b2becd117"
+            }
+          ]
+        },
+        "id": "c91b9b21-f993-4722-b4bf-133731feb76c",
+        "typeFullFqn": "system.state_chart",
+        "type": "timeseries"
+      },
+      "931b2e1e-2940-460a-a167-43f0ddb1a589": {
+        "sizeX": 24,
+        "sizeY": 14,
+        "row": 1,
+        "col": 0,
+        "config": {
+          "configMode": "basic",
+          "titleFont": {
+            "size": 21,
+            "sizeUnit": "px",
+            "weight": "500",
+            "lineHeight": "22px"
+          },
+          "showTitle": false,
+          "dropShadow": false,
+          "enableFullscreen": false,
+          "enableDataExport": false,
+          "backgroundColor": "#FFFFFF00",
+          "padding": "0px",
+          "borderRadius": "8px",
+          "actions": {},
+          "settings": {
+            "useMarkdownTextFunction": true,
+            "markdownTextFunction": "let subState = ctx.stateController.getStateParams().subStateId || \"office-unit-statistics\";\n\nreturn `<div tb-toast toastTarget=\"layout\" class=\"block\">\n            <tb-dashboard-state class=\"state\" [ctx]=\"ctx\" stateId=\"${subState}\" [syncParentStateParams]=\"true\"></tb-dashboard-state>\n        </div>`;",
+            "applyDefaultMarkdownStyle": true,
+            "markdownCss": ".block {\n    flex-grow: 1;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    padding: 0;\n}\n\n.state {\n    flex-grow: 1;\n    padding: 0;\n    width: 100%;\n    height: 100%;\n}"
+          },
+          "datasources": [
+            {
+              "type": "entity",
+              "dataKeys": [],
+              "entityAliasId": "64c039a4-0ef0-4b75-9c73-44ae6065fceb"
+            }
+          ]
+        },
+        "id": "931b2e1e-2940-460a-a167-43f0ddb1a589",
+        "typeFullFqn": "system.cards.markdown_card",
+        "type": "latest"
+      }
+    },
+    "states": {
+      "office-floor-details": {
+        "name": "Office Floor Navigation",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "e9f7fb0b-391e-4972-a00b-97992364c049": {
+                "sizeX": 4,
+                "sizeY": 1,
+                "col": 20,
+                "row": 0
+              },
+              "be134d80-83cc-4122-beca-699bd212ef09": {
+                "sizeX": 16,
+                "sizeY": 1,
+                "col": 0,
+                "row": 0
+              },
+              "96b908b7-5582-4a46-9bee-16ff06a3055b": {
+                "sizeX": 24,
+                "sizeY": 14,
+                "col": 0,
+                "row": 1
+              },
+              "7d375d4e-1ee3-4a89-86d4-2f57df44af05": {
+                "sizeX": 4,
+                "sizeY": 1,
+                "col": 16,
+                "row": 0
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "false",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "office-unit-details": {
+        "name": "Office Unit Navigation",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "492428b8-1ee7-4bf5-a85e-5b18465d51b3": {
+                "sizeX": 4,
+                "sizeY": 1,
+                "col": 20,
+                "row": 0
+              },
+              "72935318-a7e0-45bd-97e1-131eb3138842": {
+                "sizeX": 4,
+                "sizeY": 1,
+                "col": 16,
+                "row": 0
+              },
+              "e3bac23d-ff76-4f7e-873c-2d87fef62062": {
+                "sizeX": 12,
+                "sizeY": 1,
+                "col": 0,
+                "row": 0
+              },
+              "c22fba98-a98d-4f2c-bcc1-565430f079a4": {
+                "sizeX": 4,
+                "sizeY": 1,
+                "col": 12,
+                "row": 0
+              },
+              "931b2e1e-2940-460a-a167-43f0ddb1a589": {
+                "sizeX": 24,
+                "sizeY": 14,
+                "col": 0,
+                "row": 1
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "false",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "office-floor-overview": {
+        "name": "Office Floor Overview",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "0d25e5ab-7728-4194-82d8-59ed88af4cd0": {
+                "sizeX": 12,
+                "sizeY": 6,
+                "col": 0,
+                "row": 0
+              },
+              "fc802397-a495-4ad5-b37d-2788a09685bc": {
+                "sizeX": 12,
+                "sizeY": 5,
+                "col": 0,
+                "row": 6
+              },
+              "d001f783-5edb-4f4d-8844-ff1598cddc4d": {
+                "sizeX": 12,
+                "sizeY": 5,
+                "col": 12,
+                "row": 6
+              },
+              "d7b42191-1815-4672-bb53-71a87ae3d0e0": {
+                "sizeX": 12,
+                "sizeY": 6,
+                "col": 12,
+                "row": 0
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "true",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "office-unit-statistics": {
+        "name": "Office Unit Statistics",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "1a361761-a319-4fc1-97a0-22622d585cf6": {
+                "sizeX": 12,
+                "sizeY": 11,
+                "col": 0,
+                "row": 0
+              },
+              "b0f4db58-b51e-4ba1-8dd5-3464a178d0c4": {
+                "sizeX": 12,
+                "sizeY": 11,
+                "col": 12,
+                "row": 0
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "true",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "main-breaker-details": {
+        "name": "Main Breaker Navigation",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "075946be-5d43-42a1-86b0-b7d6297d07c6": {
+                "sizeX": 4,
+                "sizeY": 1,
+                "col": 12,
+                "row": 0
+              },
+              "d0e03ae2-2f43-4023-9559-73a6365a9b5d": {
+                "sizeX": 12,
+                "sizeY": 1,
+                "col": 0,
+                "row": 0
+              },
+              "9f992ee8-e9a4-4c27-a609-a26aa3ab78c5": {
+                "sizeX": 24,
+                "sizeY": 14,
+                "col": 0,
+                "row": 1
+              },
+              "98101b1d-6b77-45e5-b1c4-fb27991950e5": {
+                "sizeX": 4,
+                "sizeY": 1,
+                "col": 20,
+                "row": 0
+              },
+              "f3402cce-adb2-4e28-9dac-0411c343a1f0": {
+                "sizeX": 4,
+                "sizeY": 1,
+                "col": 16,
+                "row": 0
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "false",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "root": {
+        "name": "Commercial Building Details",
+        "root": true,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "accf469f-8a07-4af2-a844-385bd2c2c9b8": {
+                "sizeX": 12,
+                "sizeY": 6,
+                "col": 0,
+                "row": 1
+              },
+              "c35f60e4-284a-49e3-bbcd-8c753ea9f1f5": {
+                "sizeX": 1,
+                "sizeY": 1,
+                "col": 23,
+                "row": 0
+              },
+              "b7bf1a86-0b3e-49e1-a99c-94698059b877": {
+                "sizeX": 12,
+                "sizeY": 5,
+                "col": 0,
+                "row": 7
+              },
+              "2a299e04-1df1-4cc0-9389-8db9b8d0a542": {
+                "sizeX": 12,
+                "sizeY": 6,
+                "col": 12,
+                "row": 1
+              },
+              "0ddffb1a-5c36-4887-9ad7-a339a91c6740": {
+                "sizeX": 23,
+                "sizeY": 1,
+                "col": 0,
+                "row": 0
+              },
+              "bb4ce8df-a38f-4352-9ca9-96fd28e3d4c0": {
+                "sizeX": 12,
+                "sizeY": 5,
+                "col": 12,
+                "row": 7
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "true",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "main-breaker-statistics": {
+        "name": "Main Breaker Statistics",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "4f66c90f-367b-4f0a-82c0-a50b8e5dffa3": {
+                "sizeX": 12,
+                "sizeY": 6,
+                "col": 12,
+                "row": 0
+              },
+              "e3bab18b-940d-4f4b-af12-9a4b2fe21444": {
+                "sizeX": 24,
+                "sizeY": 5,
+                "col": 0,
+                "row": 6
+              },
+              "c91b9b21-f993-4722-b4bf-133731feb76c": {
+                "sizeX": 12,
+                "sizeY": 6,
+                "col": 0,
+                "row": 0
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "true",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "office-floor-statistics": {
+        "name": "Office Floor Statistics",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "e643d044-c596-48cf-9019-096384e6920e": {
+                "sizeX": 12,
+                "sizeY": 11,
+                "col": 12,
+                "row": 0
+              },
+              "3545f963-81d6-4ba4-9696-b1ad4a008829": {
+                "sizeX": 12,
+                "sizeY": 11,
+                "col": 0,
+                "row": 0
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "true",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "office-unit-overview": {
+        "name": "Office Unit Overview",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "9a9400c2-e562-4e3e-b674-0fefa7eda038": {
+                "sizeX": 24,
+                "sizeY": 6,
+                "col": 0,
+                "row": 5
+              },
+              "e1d93317-516f-43a1-94d6-cabf8f8c6ec3": {
+                "sizeX": 12,
+                "sizeY": 4,
+                "col": 0,
+                "row": 1
+              },
+              "bf3d66c0-ba6d-4a0d-a9c5-343e90dd65e2": {
+                "sizeX": 12,
+                "sizeY": 1,
+                "col": 12,
+                "row": 0
+              },
+              "c658b81b-6794-44c8-b644-e77d984b0d00": {
+                "sizeX": 12,
+                "sizeY": 1,
+                "col": 0,
+                "row": 0
+              },
+              "eb50572a-f223-43ce-b517-1c1bc8d4561c": {
+                "sizeX": 12,
+                "sizeY": 4,
+                "col": 12,
+                "row": 1
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "true",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      },
+      "main-breaker-overview": {
+        "name": "Main Breaker Overview",
+        "root": false,
+        "layouts": {
+          "main": {
+            "widgets": {
+              "d1bd0c24-6098-4ea1-8ce7-54dcf2d8335e": {
+                "sizeX": 6,
+                "sizeY": 1,
+                "col": 6,
+                "row": 0
+              },
+              "50ddec34-42b8-45cf-9b41-8629fefff74a": {
+                "sizeX": 12,
+                "sizeY": 11,
+                "col": 12,
+                "row": 0
+              },
+              "142f442f-f8d8-494b-8d47-282b94950935": {
+                "sizeX": 6,
+                "sizeY": 1,
+                "col": 0,
+                "row": 0
+              },
+              "0531bdba-6fdb-4c46-8415-eaad5dde4d24": {
+                "sizeX": 12,
+                "sizeY": 10,
+                "col": 0,
+                "row": 1
+              }
+            },
+            "gridSettings": {
+              "layoutType": "default",
+              "backgroundColor": "#EEEEEE",
+              "columns": "24",
+              "margin": 10,
+              "outerMargin": true,
+              "backgroundSizeMode": "100%",
+              "marginBetweenWidgets": "10",
+              "applyMarginToSides": "true",
+              "autoFillHeight": "true",
+              "mobileAutoFillHeight": "false",
+              "mobileRowHeight": "70"
+            },
+            "breakpoints": null
+          }
+        }
+      }
+    },
+    "entityAliases": {
+      "3db33207-8115-43ff-8997-267562d4fd1f": {
+        "id": "3db33207-8115-43ff-8997-267562d4fd1f",
+        "alias": "Floor Office Units",
+        "filter": {
+          "resolveMultiple": true,
+          "rootStateEntity": true,
+          "stateEntityParamName": "selectedOfficeFloor",
+          "defaultStateEntity": null,
+          "rootEntity": null,
+          "direction": "FROM",
+          "maxLevel": 1,
+          "fetchLastLevelOnly": false,
+          "relationType": "OfficeFloorToOfficeUnit",
+          "assetTypes": [
+            "OfficeUnit"
+          ],
+          "type": "assetSearchQuery"
+        }
+      },
+      "7327faf4-aded-4fa2-8008-8c380513e113": {
+        "id": "7327faf4-aded-4fa2-8008-8c380513e113",
+        "alias": "Building Details",
+        "filter": {
+          "resolveMultiple": false,
+          "singleEntity": {
+            "entityType": "ASSET",
+            "id": "eb675110-4211-11f1-86a0-57164b9ff915"
+          },
+          "type": "singleEntity"
+        }
+      },
+      "6cde2143-5432-4d8f-a2dd-c84534a98c0c": {
+        "id": "6cde2143-5432-4d8f-a2dd-c84534a98c0c",
+        "alias": "Floor Main Breakers",
+        "filter": {
+          "resolveMultiple": true,
+          "rootStateEntity": true,
+          "stateEntityParamName": "selectedOfficeFloor",
+          "defaultStateEntity": null,
+          "rootEntity": null,
+          "direction": "FROM",
+          "maxLevel": 1,
+          "fetchLastLevelOnly": false,
+          "relationType": "OfficeFloorToMainBreaker",
+          "deviceTypes": [
+            "MainBreaker"
+          ],
+          "type": "deviceSearchQuery"
+        }
+      },
+      "0dedaddc-76f3-4a25-9e0a-a0764422d2ce": {
+        "id": "0dedaddc-76f3-4a25-9e0a-a0764422d2ce",
+        "alias": "Selected Floor",
+        "filter": {
+          "resolveMultiple": false,
+          "stateEntityParamName": "selectedOfficeFloor",
+          "defaultStateEntity": null,
+          "type": "stateEntity"
+        }
+      },
+      "fc70867e-e467-430b-83dd-ef1b2becd117": {
+        "id": "fc70867e-e467-430b-83dd-ef1b2becd117",
+        "alias": "Selected Main Breaker",
+        "filter": {
+          "resolveMultiple": false,
+          "stateEntityParamName": "selectedMainBreaker",
+          "defaultStateEntity": null,
+          "type": "stateEntity"
+        }
+      },
+      "0a7a119c-e2b5-4e63-8024-d9eba9ddfffe": {
+        "id": "0a7a119c-e2b5-4e63-8024-d9eba9ddfffe",
+        "alias": "Unit Smart Meter",
+        "filter": {
+          "resolveMultiple": true,
+          "rootStateEntity": true,
+          "stateEntityParamName": "selectedOfficeUnit",
+          "defaultStateEntity": null,
+          "rootEntity": null,
+          "direction": "FROM",
+          "maxLevel": 1,
+          "fetchLastLevelOnly": false,
+          "relationType": "Has",
+          "deviceTypes": [
+            "SmartMeter"
+          ],
+          "type": "deviceSearchQuery"
+        }
+      },
+      "64c039a4-0ef0-4b75-9c73-44ae6065fceb": {
+        "id": "64c039a4-0ef0-4b75-9c73-44ae6065fceb",
+        "alias": "Selected Office Unit",
+        "filter": {
+          "resolveMultiple": false,
+          "stateEntityParamName": "selectedOfficeUnit",
+          "defaultStateEntity": null,
+          "type": "stateEntity"
+        }
+      },
+      "3272366f-d077-44a8-854b-6fed87d70687": {
+        "id": "3272366f-d077-44a8-854b-6fed87d70687",
+        "alias": "Building Floors",
+        "filter": {
+          "resolveMultiple": true,
+          "rootStateEntity": true,
+          "stateEntityParamName": "singleAsset",
+          "defaultStateEntity": {
+            "entityType": "ASSET",
+            "id": "eb675110-4211-11f1-86a0-57164b9ff915"
+          },
+          "rootEntity": null,
+          "direction": "FROM",
+          "maxLevel": 1,
+          "fetchLastLevelOnly": false,
+          "relationType": "Contains",
+          "assetTypes": [
+            "OfficeFloor"
+          ],
+          "type": "assetSearchQuery"
+        }
+      }
+    },
+    "additionalInfo": {
+      "description": "Tenant-level operational dashboard for monitoring building energy performance, managing floor-level breakers, and resolving technical alarms.",
+      "aiGenerated": true
+    },
+    "filters": {}
+  },
+  "resources": null
+}