Prepare accordion for datasets with results => DONE

src/app/search-multiple/components/result/datasets-result.component.html

 <div *ngIf="datasetsCountIsLoaded">
-    <div *ngFor="let dataset of getSelectedDatasetOrderedByProject()">
-        {{ dataset.label }}
-    </div>
+    <accordion [isAnimated]="true">
+        <ng-container *ngFor="let dataset of getOrderedDatasetWithResults()">
+            <accordion-group (isOpenChange)="retrieveData.emit(dataset.name)" #ag [panelClass]="'custom-accordion'" [isOpen]="false" class="my-2">
+                <button class="btn btn-link btn-block clearfix" accordion-heading>
+                    <div class="pull-left float-left">
+                        {{ dataset.label }} <span class="badge badge-pill badge-primary">{{ getCount(dataset.name) }}</span>
+                        &nbsp;
+                        <span *ngIf="ag.isOpen">
+                        <span class="fas fa-chevron-up"></span>
+                    </span>
+                        <span *ngIf="!ag.isOpen">
+                        <span class="fas fa-chevron-down"></span>
+                    </span>
+                    </div>
+                </button>
+                toto
+            </accordion-group>
+        </ng-container>
+    </accordion>
 </div>
 
 

src/app/search-multiple/components/result/datasets-result.component.ts

-import { Component, Input, ChangeDetectionStrategy } from '@angular/core';
+import {Component, Input, Output, ChangeDetectionStrategy, EventEmitter} from '@angular/core';
 
 import { Dataset, Project } from "../../../metamodel/model";
 import { DatasetCount } from "../../store/model";
@@ -15,18 +15,26 @@ export class DatasetsResultComponent {
     @Input() datasetList: Dataset[];
     @Input() selectedDatasets: string[];
     @Input() datasetsCount: DatasetCount[];
+    @Output() retrieveData: EventEmitter<string> = new EventEmitter();
 
-    getSelectedDatasetOrderedByProject(): Dataset[] {
-        let datasetsOrdered: Dataset[] = [];
+    getOrderedDatasetWithResults(): Dataset[] {
+        let datasets: Dataset[] = [];
         const projectOrderedByName: Project[] = [...this.projectList].sort((a, b) => a.name.localeCompare(b.name));
-        console.log(projectOrderedByName);
-        // projectOrderedByName.map(p => {
-        //     this.datasetList.sort(sortByDisplay).map(d =>{
-        //         if (this.selectedDatasets.includes(d.name)) {
-        //             datasetsOrdered.push(d);
-        //         }
-        //     });
-        // });
-        return datasetsOrdered;
+        projectOrderedByName.map(p => {
+            this.datasetList.filter(d => d.project_name === p.name)
+                .sort(sortByDisplay)
+                .map(d => {
+                    this.datasetsCount.map(c => {
+                        if (c.dname === d.name && c.count > 0) {
+                            datasets.push(d);
+                        }
+                    });
+                });
+        });
+        return datasets;
+    }
+
+    getCount(dname: string): number {
+        return this.datasetsCount.find(c => c.dname === dname).count;
     }
 }
\ No newline at end of file

src/app/search-multiple/containers/result-multiple.component.html

@@ -16,25 +16,9 @@
             [projectList]="projectList | async"
             [datasetList]="datasetList | async"
             [selectedDatasets]="selectedDatasets | async"
-            [datasetsCount]="datasetsCount | async">
+            [datasetsCount]="datasetsCount | async"
+            (retrieveData)="retrieveData($event)">
         </app-datasets-result>
-<!--        <app-result-datatable-->
-<!--            [datasetName]="datasetName | async"-->
-<!--            [datasetList]="datasetList | async"-->
-<!--            [queryParams]="queryParams | async"-->
-<!--            [datasetAttributeList]="datasetAttributeList | async"-->
-<!--            [outputList]="outputList | async"-->
-<!--            [searchData]="searchData | async"-->
-<!--            [dataLength]="dataLength | async"-->
-<!--            [selectedData]="selectedData | async"-->
-<!--            (getSearchData)="getSearchData($event)"-->
-<!--            (addSelectedData)="addSearchData($event)"-->
-<!--            (deleteSelectedData)="deleteSearchData($event)"-->
-<!--            [processWip]="processWip | async"-->
-<!--            [processDone]="processDone | async"-->
-<!--            [processId]="processId | async"-->
-<!--            (executeProcess)="executeProcess($event)">-->
-<!--        </app-result-datatable>-->
     </div>
 </div>
 <div *ngIf="(datasetSearchMetaIsLoaded | async) && (datasetsCountIsLoaded | async)" class="row mt-5 justify-content-between">

src/app/search-multiple/containers/result-multiple.component.ts

@@ -77,6 +77,10 @@ export class ResultMultipleComponent implements OnInit, OnDestroy {
         this.store.dispatch(new searchMultipleActions.RetrieveDatasetsCountAction());
     }
 
+    retrieveData(dname: string): void {
+        console.log(dname);
+    }
+
     // getSearchData(pagination: [number, number, number, string]): void {
     //     this.store.dispatch(new searchActions.RetrieveDataAction(pagination));
     //     this.store.dispatch(new searchActions.GetDataLengthAction());