Layout improvements.

backend/i18n/frontend_en.json

@@ -698,15 +698,15 @@
   "rules.simulation.actionCreated": "Job is created from the enriched event and action and added to a job queue.",
   "rules.simulation.actionExecuted": "Job will be taken from the queue and executed.",
   "rules.simulation.conditionEvaluated": "Event is evaluated, whether it matches the conditions in the tigger. ",
-  "rules.simulation.errorWrongConditionDoesNotMatch": "Condition does not match to the trigger.",
-  "rules.simulation.errorWrongDisabled": "Rule is dissabled.",
+  "rules.simulation.errorConditionDoesNotMatch": "Condition does not match to the trigger.",
+  "rules.simulation.errorDisabled": "Rule is dissabled.",
+  "rules.simulation.errorEventMismatch": "Event does not match to the trigger.",
+  "rules.simulation.errorFailed": "Internal Error.",
+  "rules.simulation.errorFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
+  "rules.simulation.errorNoAction": "Action type is obsolete and has been removed.",
+  "rules.simulation.errorNoTrigger": "Trigger type is obsolete and has been removed.",
+  "rules.simulation.errorTooOld": "Event is too old.",
   "rules.simulation.errorWrongEventForTrigger": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongEventMismatch": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongFailed": "Internal Error.",
-  "rules.simulation.errorWrongFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
-  "rules.simulation.errorWrongNoAction": "Action type is obsolete and has been removed.",
-  "rules.simulation.errorWrongNoTrigger": "Trigger type is obsolete and has been removed.",
-  "rules.simulation.errorWrongTooOld": "Event is too old.",
   "rules.simulation.eventEnriched": "Event is enriched with additional data",
   "rules.simulation.eventQueried": "Event is queried from the database",
   "rules.simulator": "Simulator",

backend/i18n/frontend_it.json

@@ -698,15 +698,15 @@
   "rules.simulation.actionCreated": "Job is created from the enriched event and action and added to a job queue.",
   "rules.simulation.actionExecuted": "Job will be taken from the queue and executed.",
   "rules.simulation.conditionEvaluated": "Event is evaluated, whether it matches the conditions in the tigger. ",
-  "rules.simulation.errorWrongConditionDoesNotMatch": "Condition does not match to the trigger.",
-  "rules.simulation.errorWrongDisabled": "Rule is dissabled.",
+  "rules.simulation.errorConditionDoesNotMatch": "Condition does not match to the trigger.",
+  "rules.simulation.errorDisabled": "Rule is dissabled.",
+  "rules.simulation.errorEventMismatch": "Event does not match to the trigger.",
+  "rules.simulation.errorFailed": "Internal Error.",
+  "rules.simulation.errorFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
+  "rules.simulation.errorNoAction": "Action type is obsolete and has been removed.",
+  "rules.simulation.errorNoTrigger": "Trigger type is obsolete and has been removed.",
+  "rules.simulation.errorTooOld": "Event is too old.",
   "rules.simulation.errorWrongEventForTrigger": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongEventMismatch": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongFailed": "Internal Error.",
-  "rules.simulation.errorWrongFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
-  "rules.simulation.errorWrongNoAction": "Action type is obsolete and has been removed.",
-  "rules.simulation.errorWrongNoTrigger": "Trigger type is obsolete and has been removed.",
-  "rules.simulation.errorWrongTooOld": "Event is too old.",
   "rules.simulation.eventEnriched": "Event is enriched with additional data",
   "rules.simulation.eventQueried": "Event is queried from the database",
   "rules.simulator": "Simulator",

backend/i18n/frontend_nl.json

@@ -698,15 +698,15 @@
   "rules.simulation.actionCreated": "Job is created from the enriched event and action and added to a job queue.",
   "rules.simulation.actionExecuted": "Job will be taken from the queue and executed.",
   "rules.simulation.conditionEvaluated": "Event is evaluated, whether it matches the conditions in the tigger. ",
-  "rules.simulation.errorWrongConditionDoesNotMatch": "Condition does not match to the trigger.",
-  "rules.simulation.errorWrongDisabled": "Rule is dissabled.",
+  "rules.simulation.errorConditionDoesNotMatch": "Condition does not match to the trigger.",
+  "rules.simulation.errorDisabled": "Rule is dissabled.",
+  "rules.simulation.errorEventMismatch": "Event does not match to the trigger.",
+  "rules.simulation.errorFailed": "Internal Error.",
+  "rules.simulation.errorFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
+  "rules.simulation.errorNoAction": "Action type is obsolete and has been removed.",
+  "rules.simulation.errorNoTrigger": "Trigger type is obsolete and has been removed.",
+  "rules.simulation.errorTooOld": "Event is too old.",
   "rules.simulation.errorWrongEventForTrigger": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongEventMismatch": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongFailed": "Internal Error.",
-  "rules.simulation.errorWrongFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
-  "rules.simulation.errorWrongNoAction": "Action type is obsolete and has been removed.",
-  "rules.simulation.errorWrongNoTrigger": "Trigger type is obsolete and has been removed.",
-  "rules.simulation.errorWrongTooOld": "Event is too old.",
   "rules.simulation.eventEnriched": "Event is enriched with additional data",
   "rules.simulation.eventQueried": "Event is queried from the database",
   "rules.simulator": "Simulator",

backend/i18n/frontend_zh.json

@@ -698,15 +698,15 @@
   "rules.simulation.actionCreated": "Job is created from the enriched event and action and added to a job queue.",
   "rules.simulation.actionExecuted": "Job will be taken from the queue and executed.",
   "rules.simulation.conditionEvaluated": "Event is evaluated, whether it matches the conditions in the tigger. ",
-  "rules.simulation.errorWrongConditionDoesNotMatch": "Condition does not match to the trigger.",
-  "rules.simulation.errorWrongDisabled": "Rule is dissabled.",
+  "rules.simulation.errorConditionDoesNotMatch": "Condition does not match to the trigger.",
+  "rules.simulation.errorDisabled": "Rule is dissabled.",
+  "rules.simulation.errorEventMismatch": "Event does not match to the trigger.",
+  "rules.simulation.errorFailed": "Internal Error.",
+  "rules.simulation.errorFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
+  "rules.simulation.errorNoAction": "Action type is obsolete and has been removed.",
+  "rules.simulation.errorNoTrigger": "Trigger type is obsolete and has been removed.",
+  "rules.simulation.errorTooOld": "Event is too old.",
   "rules.simulation.errorWrongEventForTrigger": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongEventMismatch": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongFailed": "Internal Error.",
-  "rules.simulation.errorWrongFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
-  "rules.simulation.errorWrongNoAction": "Action type is obsolete and has been removed.",
-  "rules.simulation.errorWrongNoTrigger": "Trigger type is obsolete and has been removed.",
-  "rules.simulation.errorWrongTooOld": "Event is too old.",
   "rules.simulation.eventEnriched": "Event is enriched with additional data",
   "rules.simulation.eventQueried": "Event is queried from the database",
   "rules.simulator": "模拟器",

backend/i18n/source/frontend_en.json

@@ -698,15 +698,15 @@
   "rules.simulation.actionCreated": "Job is created from the enriched event and action and added to a job queue.",
   "rules.simulation.actionExecuted": "Job will be taken from the queue and executed.",
   "rules.simulation.conditionEvaluated": "Event is evaluated, whether it matches the conditions in the tigger. ",
-  "rules.simulation.errorWrongConditionDoesNotMatch": "Condition does not match to the trigger.",
-  "rules.simulation.errorWrongDisabled": "Rule is dissabled.",
+  "rules.simulation.errorConditionDoesNotMatch": "Condition does not match to the trigger.",
+  "rules.simulation.errorDisabled": "Rule is dissabled.",
+  "rules.simulation.errorEventMismatch": "Event does not match to the trigger.",
+  "rules.simulation.errorFailed": "Internal Error.",
+  "rules.simulation.errorFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
+  "rules.simulation.errorNoAction": "Action type is obsolete and has been removed.",
+  "rules.simulation.errorNoTrigger": "Trigger type is obsolete and has been removed.",
+  "rules.simulation.errorTooOld": "Event is too old.",
   "rules.simulation.errorWrongEventForTrigger": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongEventMismatch": "Event does not match to the trigger.",
-  "rules.simulation.errorWrongFailed": "Internal Error.",
-  "rules.simulation.errorWrongFromRule": "Event has been created from another rule and will be skipped to prevent endless loops.",
-  "rules.simulation.errorWrongNoAction": "Action type is obsolete and has been removed.",
-  "rules.simulation.errorWrongNoTrigger": "Trigger type is obsolete and has been removed.",
-  "rules.simulation.errorWrongTooOld": "Event is too old.",
   "rules.simulation.eventEnriched": "Event is enriched with additional data",
   "rules.simulation.eventQueried": "Event is queried from the database",
   "rules.simulator": "Simulator",

frontend/app/features/administration/pages/event-consumers/event-consumers-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:eventConsumers.pageTitle"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.consumers" titleIcon="time" [width]="50" [hideSidebar]="true">
+<sqx-layout layout="main" titleText="i18n:common.consumers" titleIcon="time" [innerWidth]="50" [hideSidebar]="true">
     <ng-container menu>
         <button type="button" class="btn btn-text-secondary" (click)="reload()" title="i18n:eventConsumers.refreshTooltip" shortcut="CTRL + B">
             <i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}

frontend/app/features/administration/pages/restore/restore-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:backups.restorePageTitle"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:backups.restoreTitle" titleIcon="backup" [width]="70">
+<sqx-layout layout="main" titleText="i18n:backups.restoreTitle" titleIcon="backup" [innerWidth]="70">
     <sqx-list-view innerWidth="70rem">
         <div class="card section" *ngIf="restoreJob | async; let job">
             <div class="card-header">

frontend/app/features/administration/pages/users/users-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:users.listPageTitle"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:users.listTitle" titleIcon="user-o" [width]="50">
+<sqx-layout layout="main" titleText="i18n:users.listTitle" titleIcon="user-o" [innerWidth]="50">
     <ng-container menu>
         <div class="d-flex justify-content-end">
             <button type="button" class="btn btn-text-secondary" (click)="reload()" title="i18n:users.refreshTooltip" shortcut="CTRL + B">

frontend/app/features/rules/pages/rule/rule-page.component.html

@@ -2,7 +2,7 @@
 <sqx-title message="i18n:rules.itemPageTitle"></sqx-title>
 
 <form (ngSubmit)="save()">#
-    <sqx-layout layout="main" [width]="54">
+    <sqx-layout layout="main" [innerWidth]="54">
         <ng-container title>
             <div class="d-flex align-items-center">
                 <a class="btn btn-text-secondary" (click)="back()">

frontend/app/features/rules/pages/rules/rules-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:rules.listPageTitle"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.rules" titleIcon="rules" [width]="54">
+<sqx-layout layout="main" titleText="i18n:common.rules" titleIcon="rules" [innerWidth]="54">
     <ng-container menu>
         <button type="button" class="btn btn-text-secondary" (click)="reload()" title="i18n:rules.refreshTooltip" shortcut="CTRL + B">
             <i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}

frontend/app/features/rules/pages/simulator/simulated-rule-event.component.html

@@ -47,9 +47,17 @@
                         </div>
         
                         <ng-container *ngIf="event.enrichedEvent; else error2">
-                            <div class="history-transition">
-                                {{ 'rules.simulation.conditionEvaluated' | sqxTranslate }}
-                            </div>
+                            <ng-container *ngIf="event.skipReason == 'ConditionDoesNotMatch'"; else valid>
+                                <div class="history-transition text-danger">
+                                    {{ 'rules.simulation.errorConditionDoesNotMatch' | sqxTranslate }}
+                                </div>
+                            </ng-container>
+
+                            <ng-template #valid>
+                                <div class="history-transition">
+                                    {{ 'rules.simulation.conditionEvaluated' | sqxTranslate }}
+                                </div>
+                            </ng-template>
                             
                             <div class="history-transition">
                                 {{ 'rules.simulation.actionCreated' | sqxTranslate }}

frontend/app/features/schemas/pages/schema/schema-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title [message]="schemasState.schemaName"></sqx-title>
 
-<sqx-layout layout="main" [width]="50" *ngIf="schemaTab | async; let tab">
+<sqx-layout layout="main"[innerWidth]="50" *ngIf="schemaTab | async; let tab">
     <ng-container title>
         <ul class="nav nav-tabs2">
             <li class="nav-item">

frontend/app/features/settings/pages/backups/backups-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:common.backups"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.backups" titleIcon="backups" [width]="40">
+<sqx-layout layout="main" titleText="i18n:common.backups" titleIcon="backups" [innerWidth]="40">
     <ng-container menu>
         <button type="button" class="btn btn-text-secondary me-2" (click)="reload()" title="i18n:backups.refreshTooltip" shortcut="CTRL + B">
             <i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}

frontend/app/features/settings/pages/clients/clients-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:common.clients"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.clients" titleIcon="clients" [width]="55">
+<sqx-layout layout="main" titleText="i18n:common.clients" titleIcon="clients" [innerWidth]="55">
     <ng-container menu>
         <button type="button" class="btn btn-text-secondary" (click)="reload()" title="i18n:clients.refreshTooltip" shortcut="CTRL + B">
             <i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}

frontend/app/features/settings/pages/contributors/contributors-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:common.contributors"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.contributors" titleIcon="contributors" [width]="55">
+<sqx-layout layout="main" titleText="i18n:common.contributors" titleIcon="contributors" [innerWidth]="55">
     <ng-container menu>
         <div class="d-flex justify-content-end">
             <sqx-notifo topic="apps/{{contributorsState.appId}}/settings/contributors"></sqx-notifo>

frontend/app/features/settings/pages/languages/languages-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:common.languages"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.languages" titleIcon="languages" [width]="55">
+<sqx-layout layout="main" titleText="i18n:common.languages" titleIcon="languages" [innerWidth]="55">
     <ng-container menu>
         <button type="button" class="btn btn-text-secondary" (click)="reload()" title="i18n:languages.refreshTooltip" shortcut="CTRL + B">
             <i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}

frontend/app/features/settings/pages/more/more-page.component.html

@@ -1,4 +1,4 @@
-<sqx-layout layout="main" titleText="i18n:common.settings" titleIcon="settings" [width]="55" [hideSidebar]="true">
+<sqx-layout layout="main" titleText="i18n:common.settings" titleIcon="settings" [innerWidth]="55" [hideSidebar]="true">
     <ng-container>
         <sqx-list-view innerWidth="55rem">
             <ng-container content>

frontend/app/features/settings/pages/plans/plans-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:common.subscription"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.subscription" titleIcon="subscription" [width]="60">
+<sqx-layout layout="main" titleText="i18n:common.subscription" titleIcon="subscription" [innerWidth]="60">
     <ng-container menu>
         <sqx-notifo topic="apps/{{plansState.appId}}/settings/plan"></sqx-notifo>
 

frontend/app/features/settings/pages/roles/roles-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:common.roles"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.roles" titleIcon="roles" [width]="55">
+<sqx-layout layout="main" titleText="i18n:common.roles" titleIcon="roles" [innerWidth]="55">
     <ng-container menu>
         <button type="button" class="btn btn-text-secondary" (click)="reload()" title="i18n:roles.refreshTooltip" shortcut="CTRL + B">
             <i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}

frontend/app/features/settings/pages/settings/settings-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:appSettings.title"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:appSettings.title" titleIcon="patterns" [width]="55">
+<sqx-layout layout="main" titleText="i18n:appSettings.title" titleIcon="patterns" [innerWidth]="55">
     <ng-container menu>
         <button type="button" class="btn btn-text-secondary me-2" (click)="reload()" title="i18n:appSettings.refreshTooltip" shortcut="CTRL + B">
             <i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}

frontend/app/features/settings/pages/workflows/workflows-page.component.html

@@ -1,6 +1,6 @@
 <sqx-title message="i18n:common.workflows"></sqx-title>
 
-<sqx-layout layout="main" titleText="i18n:common.workflows" titleIcon="workflows" [width]="80">
+<sqx-layout layout="main" titleText="i18n:common.workflows" titleIcon="workflows" [innerWidth]="80">
     <ng-container menu>
         <button type="button" class="btn btn-text-secondary" (click)="reload()" title="i18n:workflows.refreshTooltip" shortcut="CTRL + B">
             <i class="icon-reset"></i> {{ 'common.refresh' | sqxTranslate }}

frontend/app/framework/angular/layout-container.directive.ts

@@ -77,11 +77,11 @@ export class LayoutContainerDirective implements AfterViewInit {
             }
         }
 
+        const spreadWidth = (this.containerWidth - currentSize) / layoutsWidthSpread;
+
         for (const layout of layouts) {
             if (layout.desiredWidth <= 0) {
-                const layoutWidth = (this.containerWidth - currentSize) / layoutsWidthSpread;
-
-                layout.measure(`${layoutWidth}px`);
+                layout.measure(`${spreadWidth}px`);
 
                 currentSize += layout.renderWidth;
             }

frontend/app/framework/angular/layout.component.html

@@ -55,7 +55,7 @@
     <ng-container *ngIf="layout === 'main'">
         <div class="panel2-slice main">
             <div class="panel2-header main" *ngIf="!hideHeader">
-                <div class="panel2-header-inner main" [style.width]="innerWidth"> 
+                <div class="panel2-header-inner main" [style.width]="desiredInnerWidth"> 
                     <h3 *ngIf="titleText">
                         <i class="icon-{{titleIcon}}" *ngIf="titleIcon"></i> {{ titleText | sqxTranslate }}
                     </h3>

frontend/app/framework/angular/layout.component.ts

@@ -42,7 +42,10 @@ export class LayoutComponent implements OnInit, OnDestroy, AfterViewInit {
     public width = -1;
 
     @Input()
-    public widthPadding = 3;
+    public innerWidth = -1;
+
+    @Input()
+    public innerWidthPadding = 3;
 
     @Input()
     public white = false;
@@ -66,11 +69,11 @@ export class LayoutComponent implements OnInit, OnDestroy, AfterViewInit {
     public panel: ElementRef<HTMLElement>;
 
     public get desiredWidth() {
-        return this.layout === 'main' ? 0 : (this.isCollapsed ? 3 : this.width);
+        return this.isCollapsed ? 3 : this.width;
     }
 
-    public get innerWidth() {
-        return this.width > 0 ? `${this.width}rem` : '100%';
+    public get desiredInnerWidth() {
+        return this.innerWidth <= 0 ? '100%' : `${this.innerWidth}rem`;
     }
 
     public get isViewInit() {
@@ -124,7 +127,7 @@ export class LayoutComponent implements OnInit, OnDestroy, AfterViewInit {
                 this.renderer.setStyle(element, 'width', size);
 
                 if (this.layout === 'main') {
-                    this.renderer.setStyle(element, 'minWidth', `${this.width + this.widthPadding}rem`);
+                    this.renderer.setStyle(element, 'minWidth', `${this.innerWidth + this.innerWidthPadding}rem`);
                 }
 
                 this.widthToRender = element.offsetWidth;