Fixing All Accordion panels is only open and not closed

Issue-ID: CCSDK-2219

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

2 files changed, 11 insertions, 2 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html
index 5dd68ed72..525043a51 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.html
@@ -20,7 +20,7 @@
             <div class="card">
                 <div [id]="'head-script-'+mapIndex" class="card-header">
                     <h5 class="mb-0 d-flex justify-content-between">
-                        <button [attr.aria-controls]="'id-script-'+mapIndex" [attr.data-target]="'#id-script-'+mapIndex"
+                        <button (click)="changeDivShow(mapIndex)"
                             aria-expanded="false" class="btn btn-link collapsed" data-toggle="collapse">
                             <i class="icon-file-code"></i> {{file.key}}
                         </button>
@@ -92,4 +92,4 @@
             </div>
         </div>
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.ts
index 5387489a2..efe28e9a4 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/scripts-tab/scripts-tab.component.ts
@@ -98,4 +98,13 @@ export class ScriptsTabComponent implements OnInit {
     textChanges(code: any, key: string) {
         this.packageCreationStore.addScripts(key, code);
     }
+
+    changeDivShow(mapIndex: number) {
+        const divElement = document.getElementById('id-script-' + mapIndex) as HTMLElement;
+        if (divElement.getAttribute('class').includes('show')) {
+            divElement.setAttribute('class', 'collapse');
+        } else {
+            divElement.setAttribute('class', 'collapse show');
+        }
+    }
 }