fixing issues in configuration package

Issue-ID: CCSDK-2336

Signed-off-by: ShaabanEltanany <shaaban.eltanany.ext@orange.com>
Change-Id: I38e542a7959f98548a5494b0ee40ddb236f2595f

4 files changed, 46 insertions, 13 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
index c04053747..0d0f5ef93 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.html
@@ -22,20 +22,20 @@
             <div class="container">
                 <div class="creat-action-container">
 
-                    <a class="action-button save" (click)="editBluePrint()">
+                    <button class="action-button save" (click)="editBluePrint()" [disabled]="!isSaveEnabled">
                         <i class="icon-save-sm" aria-hidden="true"></i>
                         <span>Save</span>
-                    </a>
-                    <a class="action-button" (click)="discardChanges()">
+                    </button>
+                    <button data-target="#discardChangesModal" data-toggle="modal" class="action-button" [disabled]="!isSaveEnabled">
                         <i class="icon-discard-sm" aria-hidden="true"></i>
                         <span>Discard Changes</span>
-                    </a>
+                    </button>
 
                     <hr>
-                    <a class="action-button">
+                    <button class="action-button">
                         <i class="icon-clone-sm" aria-hidden="true"></i>
                         <span>Clone</span>
-                    </a>
+                    </button>
 
                     <a href="#" class="action-button">
                         <i class="icon-archive-sm" aria-hidden="true"></i>
@@ -790,3 +790,26 @@
         </div>
     </div>
 </div>
+
+<div class="modal fade" id="discardChangesModal" tabindex="-1" role="dialog" aria-labelledby="discardChangesModalLabel"
+     aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="discardChangesModalLabel">Discard Changes</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <i class="icon-action-close"></i>
+                </button>
+            </div>
+            <div class="modal-body">
+                <p>Are you sure you want to discard the changes?</p>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
+                <button type="button" (click)="discardChanges()" data-dismiss="modal"
+                        class="btn btn-primary">Discard Changes
+                </button>
+            </div>
+        </div>
+    </div>
+</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
index b4ad02364..a69e45fce 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
@@ -39,6 +39,8 @@ export class ConfigurationDashboardComponent implements OnInit {
 
     currentBlob = new Blob();
     vlbDefinition: VlbDefinition = new VlbDefinition();
+    isSaveEnabled = false;
+    versionPattern = '^(\\d+\\.)?(\\d+\\.)?(\\*|\\d+)$';
 
     constructor(
         private route: ActivatedRoute,
@@ -56,6 +58,17 @@ export class ConfigurationDashboardComponent implements OnInit {
 
         this.elementRef.nativeElement.focus();
         this.refreshCurrentPackage();
+
+        const regexp = RegExp(this.versionPattern);
+        this.packageCreationStore.state$.subscribe(cbaPackage => {
+            if (cbaPackage && cbaPackage.metaData && cbaPackage.metaData.description
+                && cbaPackage.metaData.name && cbaPackage.metaData.version &&
+                regexp.test(cbaPackage.metaData.version)) {
+                this.isSaveEnabled = true;
+            } else {
+                this.isSaveEnabled = false;
+            }
+        });
     }
 
     private refreshCurrentPackage() {
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.html
index e77356d6c..c86dd26cf 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.html
@@ -32,7 +32,7 @@
     <div class="single-line-model">
         <label class="label-name">Name <span>*</span></label>
         <div class="label-input">
-            <input type="input" [readOnly]="!packageNameAndVersionEnables" (change)="checkRequiredElements()" [(ngModel)]="metaDataTab.name"
+            <input type="input" (change)="checkRequiredElements()" [(ngModel)]="metaDataTab.name"
                 placeholder="Package name">
         </div>
         <!--<div class="model-note-container error-message">
@@ -44,7 +44,7 @@
     <div class="single-line-model">
         <label class="label-name">Version <span>*</span></label>
         <div class="label-input">
-            <input type="input" [readOnly]="!packageNameAndVersionEnables" (change)="checkRequiredElements()" [(ngModel)]="metaDataTab.version"
+            <input type="input" (change)="checkRequiredElements()" [(ngModel)]="metaDataTab.version"
                 (input)="validatePackageNameAndVersion()" pattern="(\d+)\.(\d+)\.(\d+)" placeholder="Example: 1.0.0">
         </div>
         <div class="model-note-container error-message">{{errorMessage}}</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.ts
index 4e0e5c977..af5b875f7 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/metadata-tab/metadata-tab.component.ts
@@ -11,7 +11,7 @@ import {ActivatedRoute} from '@angular/router';
     styleUrls: ['./metadata-tab.component.css']
 })
 export class MetadataTabComponent implements OnInit {
-    packageNameAndVersionEnables = true;
+
     counter = 0;
     tags = new Set<string>();
     customKeysMap = new Map();
@@ -22,7 +22,7 @@ export class MetadataTabComponent implements OnInit {
     modeType = this.modes[0].name;
     metaDataTab: MetaDataTabModel = new MetaDataTabModel();
     errorMessage: string;
-    versionPattern = '(\d+)\.(\d+)\.(\d+)';
+    versionPattern = '^(\\d+\\.)?(\\d+\\.)?(\\*|\\d+)$';
 
     constructor(
         private route: ActivatedRoute,
@@ -37,9 +37,6 @@ export class MetadataTabComponent implements OnInit {
         this.metaDataTab.mapOfCustomKey = this.customKeysMap;
         this.metaDataTab.mode = this.modeType;
 
-        const id = this.route.snapshot.paramMap.get('id');
-        id ? this.packageNameAndVersionEnables = false :
-            this.packageNameAndVersionEnables = true;
         this.packageCreationStore.state$.subscribe(element => {
 
             if (element && element.metaData) {