Release 2.1.0

.gitignore

@@ -51,6 +51,7 @@ Thumbs.db
 .scannerwork/
 out/
 package-lock.json
+pnpm-lock.yaml
 ### JetBrains template
 # Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio, WebStorm and Rider
 # Reference: https://intellij-support.jetbrains.com/hc/en-us/articles/206544839

nae.json

@@ -105,7 +105,7 @@
         "urls": {
             "netgrif": "https://netgrif.com",
             "bpmn2pn": "https://bpmn2pn.netgrif.cloud/bpmn2pn/",
-            "engine": "https://demo.netgrif.com/",
+            "engine": "https://etask.netgrif.cloud/",
             "youtube": "https://www.youtube.com/channel/UCNfqgnjskMMpy7QvOOKhKgw",
             "github": "https://github.com/netgrif",
             "issues": "https://github.com/netgrif/application-builder/issues"

package.json

@@ -1,6 +1,6 @@
 {
     "name": "@netgrif/application-builder",
-    "version": "2.0.0",
+    "version": "2.1.0",
     "description": "Netgrif Application Builder for building, configuring and modeling applications for Application Engine.",
     "homepage": "https://builder.netgrif.com",
     "license": "SEE LICENSE IN LICENSE FILE",
@@ -58,9 +58,9 @@
         "@mdi/font": "^7.4.47",
         "@netgrif/components": "7.0.0-beta.1",
         "@netgrif/components-core": "7.0.0-beta.1",
-        "@netgrif/petri.svg": "1.1.0",
-        "@netgrif/petriflow": "2.2.0",
-        "@netgrif/petriflow.svg": "1.1.0",
+        "@netgrif/petri.svg": "1.1.1",
+        "@netgrif/petriflow": "2.2.2",
+        "@netgrif/petriflow.svg": "1.1.1",
         "@ngbracket/ngx-layout": "^17.0.1",
         "@ngx-translate/core": "~15.0.0",
         "@ngx-translate/http-loader": "~8.0.0",

src/app/app-builder-view.service.ts

@@ -1,6 +1,6 @@
-import {ConfigurationService, LoggerService, ViewService} from '@netgrif/components-core';
-import {Router} from '@angular/router';
 import {Injectable} from '@angular/core';
+import {Router} from '@angular/router';
+import {ConfigurationService, LoggerService, ViewService} from '@netgrif/components-core';
 
 @Injectable({
   providedIn: 'root',

src/app/app-routing.module.ts

@@ -1,6 +1,6 @@
-import { NgModule } from '@angular/core';
-import {RouterModule, Routes} from '@angular/router';
 import {CommonModule} from '@angular/common';
+import {NgModule} from '@angular/core';
+import {RouterModule, Routes} from '@angular/router';
 
 const routes: Routes = [];
 

src/app/app.component.html

@@ -11,7 +11,7 @@
                                text="{{tutorial.demo.text}}"
                                stepPosition="{{tutorial.demo.position}}"
                                (click)="openInTab(config.services.urls.engine)"
-                               matTooltip="Netgrif Demo" matTooltipPosition="right">
+                               matTooltip="Netgrif eTask" matTooltipPosition="right">
                     <mat-icon>play_arrow</mat-icon>
                 </mat-list-item>
                 <mat-list-item class="field-list-mat-list-item"

src/app/app.component.scss

@@ -87,4 +87,4 @@
         padding-right: 9px;
         height: 42px;
     }
-}
+}

src/app/app.component.spec.ts

@@ -1,18 +1,18 @@
-import {waitForAsync, TestBed} from '@angular/core/testing';
-import {AppComponent} from './app.component';
+import {HttpClientTestingModule} from '@angular/common/http/testing';
+import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {TestBed, waitForAsync} from '@angular/core/testing';
+import {FlexLayoutModule} from '@angular/flex-layout';
+import {MatListModule} from '@angular/material/list';
 import {BrowserModule} from '@angular/platform-browser';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MaterialImportModule} from './material-import/material-import.module';
-import {FlexLayoutModule} from '@angular/flex-layout';
-import {FormBuilderModule} from './form-builder/form-builder.module';
 import {RouterTestingModule} from '@angular/router/testing';
-import {MatListModule} from '@angular/material/list';
-import {JoyrideModule} from 'ngx-joyride';
 import {AuthenticationModule, ConfigurationService} from '@netgrif/components-core';
+import {JoyrideModule} from 'ngx-joyride';
 import {AppBuilderConfigurationService} from './app-builder-configuration.service';
-import {HttpClientTestingModule} from '@angular/common/http/testing';
+import {AppComponent} from './app.component';
 import {AppModule} from './app.module';
-import {NO_ERRORS_SCHEMA} from '@angular/core';
+import {FormBuilderModule} from './form-builder/form-builder.module';
+import {MaterialImportModule} from './material-import/material-import.module';
 
 describe('AppComponent', () => {
   beforeEach(waitForAsync(() => {

src/app/app.component.ts

@@ -2,17 +2,17 @@ import {AfterViewInit, Component, HostListener} from '@angular/core';
 import {MatDialog} from '@angular/material/dialog';
 import {Router} from '@angular/router';
 import {NetgrifApplicationEngine} from '@netgrif/components-core/';
+import {JoyrideService} from 'ngx-joyride';
 import {AppBuilderConfigurationService} from './app-builder-configuration.service';
 import {DialogConfirmComponent} from './dialogs/dialog-confirm/dialog-confirm.component';
 import {
-    DialogLocalStorageModelComponent,
+  DialogLocalStorageModelComponent,
 } from './dialogs/dialog-local-storage-model/dialog-local-storage-model.component';
 import {ModelImportService} from './modeler/model-import-service';
 import {ModelerConfig} from './modeler/modeler-config';
 import {MortgageService} from './modeler/mortgage.service';
 import {ModelService} from './modeler/services/model/model.service';
 import {TutorialService} from './tutorial/tutorial-service';
-import {JoyrideService} from 'ngx-joyride';
 
 @Component({
     selector: 'nab-root',

src/app/app.module.ts

@@ -1,49 +1,50 @@
-import {BrowserModule, DomSanitizer} from '@angular/platform-browser';
+import {CommonModule, NgOptimizedImage} from '@angular/common';
 import {NgModule} from '@angular/core';
-import {AppComponent} from './app.component';
+import {MAT_FORM_FIELD_DEFAULT_OPTIONS} from '@angular/material/form-field';
+import {MatIconRegistry} from '@angular/material/icon';
+import {MatPaginatorIntl} from '@angular/material/paginator';
+import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
+import {BrowserModule, DomSanitizer} from '@angular/platform-browser';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {MaterialImportModule} from './material-import/material-import.module';
-import {FormBuilderModule} from './form-builder/form-builder.module';
 import {RouterModule, Routes} from '@angular/router';
-import {FormBuilderComponent} from './form-builder/form-builder.component';
-import {ModelerComponent} from './modeler/modeler.component';
-import {ModelerModule} from './modeler/modeler.module';
-import {EditModeComponent} from './modeler/edit-mode/edit-mode.component';
-import {DataModeComponent} from './modeler/data-mode/data-mode.component';
-import {RoleModeComponent} from './modeler/role-mode/role-mode.component';
-import {ActionsModeComponent} from './modeler/actions-mode/actions-mode.component';
-import {MatIconRegistry} from '@angular/material/icon';
+import {TaskContentComponentModule} from '@netgrif/components';
+import {AuthenticationMethodService, ConfigurationService, NullAuthenticationService} from '@netgrif/components-core';
+import {ExportService, ImportService} from '@netgrif/petriflow';
+import {JoyrideModule} from 'ngx-joyride';
 import {environment} from '../environments/environment';
+import {AppBuilderConfigurationService} from './app-builder-configuration.service';
+import {AppRoutingModule} from './app-routing.module';
+import {AppComponent} from './app.component';
+import {DialogArcEditComponent} from './dialogs/dialog-arc-edit/dialog-arc-edit.component';
+import {DialogChangeDataComponent} from './dialogs/dialog-change-data/dialog-change-data.component';
 import {DialogConfirmComponent} from './dialogs/dialog-confirm/dialog-confirm.component';
-import {DialogRefactorComponent} from './dialogs/dialog-refactor/dialog-refactor.component';
-import {DialogErrorsComponent} from './dialogs/dialog-errors/dialog-errors.component';
-import {ExportService, ImportService} from '@netgrif/petriflow';
-import {SelectedTransitionService} from './modeler/selected-transition.service';
-import {I18nModeComponent} from './modeler/i18n-mode/i18n-mode.component';
 import {DialogDeadNetComponent} from './dialogs/dialog-dead-net/dialog-dead-net.component';
-import {AppRoutingModule} from './app-routing.module';
-import {DialogPlaceRefDeleteComponent} from './dialogs/dialog-place-ref-delete/dialog-place-ref-delete.component';
-import {DialogPlaceEditComponent} from './dialogs/dialog-place-edit/dialog-place-edit.component';
 import {DialogDeleteModelComponent} from './dialogs/dialog-delete-model/dialog-delete-model.component';
-import {DialogArcEditComponent} from './dialogs/dialog-arc-edit/dialog-arc-edit.component';
-import {DialogTransitionEditComponent} from './dialogs/dialog-transition-edit/dialog-transition-edit.component';
-import {SimulationModeComponent} from './modeler/simulation-mode/simulation-mode.component';
+import {DialogErrorsComponent} from './dialogs/dialog-errors/dialog-errors.component';
 import {
-    DialogLocalStorageModelComponent
+  DialogLocalStorageModelComponent,
 } from './dialogs/dialog-local-storage-model/dialog-local-storage-model.component';
-import {HistoryModeComponent} from './modeler/history-mode/history-mode.component';
-import {DialogChangeDataComponent} from './dialogs/dialog-change-data/dialog-change-data.component';
+import {DialogMarkingChangeComponent} from './dialogs/dialog-marking-change/dialog-marking-change.component';
 import {DialogModelEditComponent} from './dialogs/dialog-model-edit/dialog-model-edit.component';
-import {MaterialIconPickerComponent} from './modeler/components/material-icon-picker/material-icon-picker.component';
-import {CommonModule, NgOptimizedImage} from '@angular/common';
-import {MAT_FORM_FIELD_DEFAULT_OPTIONS} from '@angular/material/form-field';
-import {TaskContentComponentModule} from '@netgrif/components';
-import {JoyrideModule} from 'ngx-joyride';
-import {AuthenticationMethodService, ConfigurationService, NullAuthenticationService} from '@netgrif/components-core';
-import {AppBuilderConfigurationService} from './app-builder-configuration.service';
-import {MatProgressSpinnerModule} from '@angular/material/progress-spinner';
-import {MatPaginatorIntl} from '@angular/material/paginator';
+import {DialogPlaceEditComponent} from './dialogs/dialog-place-edit/dialog-place-edit.component';
+import {DialogPlaceRefDeleteComponent} from './dialogs/dialog-place-ref-delete/dialog-place-ref-delete.component';
+import {DialogRefactorComponent} from './dialogs/dialog-refactor/dialog-refactor.component';
+import {DialogTransitionEditComponent} from './dialogs/dialog-transition-edit/dialog-transition-edit.component';
+import {FormBuilderComponent} from './form-builder/form-builder.component';
+import {FormBuilderModule} from './form-builder/form-builder.module';
+import {MaterialImportModule} from './material-import/material-import.module';
+import {ActionsModeComponent} from './modeler/actions-mode/actions-mode.component';
 import {BuilderPaginatorIntl} from './modeler/components/master-detail/main-master/builder-paginator-inpl';
+import {MaterialIconPickerComponent} from './modeler/components/material-icon-picker/material-icon-picker.component';
+import {DataModeComponent} from './modeler/data-mode/data-mode.component';
+import {EditModeComponent} from './modeler/edit-mode/edit-mode.component';
+import {HistoryModeComponent} from './modeler/history-mode/history-mode.component';
+import {I18nModeComponent} from './modeler/i18n-mode/i18n-mode.component';
+import {ModelerComponent} from './modeler/modeler.component';
+import {ModelerModule} from './modeler/modeler.module';
+import {RoleModeComponent} from './modeler/role-mode/role-mode.component';
+import {SelectedTransitionService} from './modeler/selected-transition.service';
+import {SimulationModeComponent} from './modeler/simulation-mode/simulation-mode.component';
 
 const appRoutes: Routes = [
     {
@@ -77,6 +78,7 @@ const appRoutes: Routes = [
         DialogModelEditComponent,
         MaterialIconPickerComponent,
         DialogLocalStorageModelComponent,
+        DialogMarkingChangeComponent
     ],
     imports: [
         BrowserModule,

src/app/cdk-import/cdk-import.module.ts

@@ -1,6 +1,6 @@
-import {NgModule} from '@angular/core';
+import {CdkPortalOutlet} from '@angular/cdk/portal';
 import {CdkTreeModule} from '@angular/cdk/tree';
-import {CdkPortal, CdkPortalOutlet} from '@angular/cdk/portal';
+import {NgModule} from '@angular/core';
 
 @NgModule({
     declarations: [],

src/app/dialogs/dialog-arc-attach/dialog-arc-attach.component.ts

@@ -1,8 +1,8 @@
 import {Component, Inject} from '@angular/core';
-import {DataVariable, Place} from '@netgrif/petriflow';
 import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material/dialog';
-import {ModelerConfig} from '../../modeler/modeler-config';
+import {DataVariable, Place} from '@netgrif/petriflow';
 import {ReferenceDialogData} from '../../modeler/edit-mode/domain/reference-dialog-data';
+import {ModelerConfig} from '../../modeler/modeler-config';
 import {ModelService} from '../../modeler/services/model/model.service';
 
 @Component({

src/app/dialogs/dialog-arc-edit/dialog-arc-edit.component.ts

@@ -1,11 +1,11 @@
 import {Component, Inject, OnInit} from '@angular/core';
-import {ModelService} from '../../modeler/services/model/model.service';
-import {Arc, DataType, TransitionPlaceArc, XmlArcType} from '@netgrif/petriflow';
-import {MAT_DIALOG_DATA} from '@angular/material/dialog';
-import {ChangedArc} from './changed-arc';
 import {FormControl, ValidatorFn, Validators} from '@angular/forms';
+import {MAT_DIALOG_DATA} from '@angular/material/dialog';
+import {Arc, DataType, TransitionPlaceArc, XmlArcType} from '@netgrif/petriflow';
 import {Observable} from 'rxjs';
 import {map, startWith} from 'rxjs/operators';
+import {ModelService} from '../../modeler/services/model/model.service';
+import {ChangedArc} from './changed-arc';
 
 export interface ArcEditData {
     arcId: string;

src/app/dialogs/dialog-change-data/dialog-change-data.component.html

@@ -1,13 +1,15 @@
-<h2 mat-dialog-title>Change referenced data values</h2>
+<h2 mat-dialog-title>Change referenced data value{{dataSet.length > 1 ? 's' : ''}}</h2>
 <mat-dialog-content class="netgrif-input">
     <mat-form-field fxFlex *ngFor="let data of dataSet">
         <mat-label>{{data.id}}</mat-label>
-        <input type="number" step="1" matInput [(ngModel)]="data.value">
+        <input type="number" step="1" min="0" matInput [(ngModel)]="data.value" [formControl]="valueCtrl">
+        <mat-error *ngIf="valueCtrl.errors && valueCtrl.errors.required">Value is required</mat-error>
+        <mat-error *ngIf="valueCtrl.errors && valueCtrl.errors.validValue">Value can not be a negative number</mat-error>
     </mat-form-field>
     <span *ngIf="dataSet.length === 0">No referenced data found</span>
 </mat-dialog-content>
 <mat-dialog-actions>
-    <button mat-flat-button color="primary" [mat-dialog-close]="dataSet">
+    <button mat-flat-button color="primary" [mat-dialog-close]="dataSet" [disabled]="valueCtrl.invalid">
         <mat-icon>done</mat-icon>
         <span>Save</span>
     </button>

src/app/dialogs/dialog-change-data/dialog-change-data.component.ts

@@ -1,4 +1,5 @@
-import {Component, Inject, OnInit} from '@angular/core';
+import {Component, Inject} from '@angular/core';
+import {FormControl, ValidatorFn, Validators} from '@angular/forms';
 import {MAT_DIALOG_DATA} from '@angular/material/dialog';
 
 export interface DataSet {
@@ -18,11 +19,26 @@ export interface Data {
 export class DialogChangeDataComponent {
 
     public dataSet: Array<Data>;
+    public valueCtrl: FormControl;
 
     constructor(
         @Inject(MAT_DIALOG_DATA) public data: DataSet,
     ) {
         this.dataSet = new Array<Data>();
         data.dataSet.forEach((value, id) => this.dataSet.push({id, value}));
+        this.valueCtrl = new FormControl('', [
+            Validators.required,
+            this.validValue()
+        ]);
+    }
+
+    private validValue(): ValidatorFn {
+        return (fc: FormControl): { [key: string]: any } | null => {
+            const value = Math.floor(fc.value as number);
+            if (isFinite(value) && value === fc.value as number && value >= 0) {
+                return null;
+            }
+            return ({validMultiplicity: true})
+        };
     }
 }

src/app/dialogs/dialog-delete-model/dialog-delete-model.component.spec.ts

@@ -1,6 +1,6 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
-import { DialogDeleteModelComponent } from './dialog-delete-model.component';
+import {DialogDeleteModelComponent} from './dialog-delete-model.component';
 
 describe('DialogDeleteModelComponent', () => {
   let component: DialogDeleteModelComponent;

src/app/dialogs/dialog-delete-model/dialog-delete-model.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit } from '@angular/core';
+import {Component} from '@angular/core';
 
 @Component({
   selector: 'nab-dialog-delete-model',

src/app/dialogs/dialog-errors/dialog-errors.component.ts

@@ -1,4 +1,4 @@
-import {Component, Inject, OnInit} from '@angular/core';
+import {Component, Inject} from '@angular/core';
 import {MAT_DIALOG_DATA} from '@angular/material/dialog';
 
 export interface DialogErrorsData {

src/app/dialogs/dialog-local-storage-model/dialog-local-storage-model.component.spec.ts

@@ -1,6 +1,6 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
+import {ComponentFixture, TestBed} from '@angular/core/testing';
 
-import { DialogLocalStorageModelComponent } from './dialog-local-storage-model.component';
+import {DialogLocalStorageModelComponent} from './dialog-local-storage-model.component';
 
 describe('DialogLocalStorageModelComponent', () => {
   let component: DialogLocalStorageModelComponent;

src/app/dialogs/dialog-local-storage-model/dialog-local-storage-model.component.ts

@@ -1,4 +1,4 @@
-import {Component, Inject, OnInit} from '@angular/core';
+import {Component, Inject} from '@angular/core';
 import {MAT_DIALOG_DATA} from '@angular/material/dialog';
 
 export interface DialogData {

src/app/dialogs/dialog-manage-roles/dialog-manage-roles.component.ts

@@ -1,13 +1,13 @@
 import {Component, Inject, OnDestroy, OnInit, ViewChild} from '@angular/core';
-import {MatTableDataSource} from '@angular/material/table';
+import {MAT_CHECKBOX_DEFAULT_OPTIONS, MatCheckboxDefaultOptions} from '@angular/material/checkbox';
 import {MAT_DIALOG_DATA} from '@angular/material/dialog';
-import {MatSort, MatSortable, Sort} from '@angular/material/sort';
 import {MatPaginator} from '@angular/material/paginator';
+import {MatSort, MatSortable, Sort} from '@angular/material/sort';
+import {MatTableDataSource} from '@angular/material/table';
 import {DataVariable, ProcessPermissionRef, Role, TransitionPermissionRef} from '@netgrif/petriflow';
-import {ModelService} from '../../modeler/services/model/model.service';
 import {ModelerConfig} from '../../modeler/modeler-config';
 import {HistoryService} from '../../modeler/services/history/history.service';
-import {MAT_CHECKBOX_DEFAULT_OPTIONS, MatCheckboxDefaultOptions} from '@angular/material/checkbox';
+import {ModelService} from '../../modeler/services/model/model.service';
 
 export enum RoleRefType {
     TRANSITION = 'transition',

src/app/dialogs/dialog-marking-change/dialog-marking-change.component.html

@@ -0,0 +1,15 @@
+<h2 mat-dialog-title>Change marking of place {{CanvasNodeElement.pretty(place)}}</h2>
+<mat-dialog-content class="netgrif-input">
+    <mat-form-field fxFlex>
+        <mat-label>Tokens</mat-label>
+        <input type="number" min="0" step="1" matInput [(ngModel)]="place.marking" [formControl]="markingCtrl">
+        <mat-error *ngIf="markingCtrl.errors && markingCtrl.errors.required">Number of tokens is required</mat-error>
+        <mat-error *ngIf="markingCtrl.errors && markingCtrl.errors.validMultiplicity">Number of tokens must be a non-negative integer</mat-error>
+    </mat-form-field>
+</mat-dialog-content>
+<mat-dialog-actions>
+    <button mat-flat-button color="primary" [mat-dialog-close]="place.marking" [disabled]="markingCtrl.invalid">
+        <mat-icon>done</mat-icon>
+        <span>Save</span>
+    </button>
+</mat-dialog-actions>

src/app/dialogs/dialog-marking-change/dialog-marking-change.component.scss

@@ -0,0 +1,8 @@
+mat-dialog-content {
+    display: flex;
+    flex-direction: column;
+}
+
+mat-dialog-actions {
+    justify-content: flex-end;
+}