Add reminder section

src/app/search/components/index.ts

 import { ProgressBarComponent } from './progress-bar.component';
 import { SummaryComponent } from './summary.component';
+import { ReminderComponent } from "./result/reminder.component ";
 
 import { DatasetTabsComponent } from './dataset/dataset-tabs.component';
 import { DatasetCardComponent } from './dataset/dataset-card.component';
@@ -23,6 +24,7 @@ import { RendererComponents } from './result/renderer';
 export const dummiesComponents = [
     ProgressBarComponent,
     SummaryComponent,
+    ReminderComponent,
 
     DatasetTabsComponent,
     DatasetCardComponent,

src/app/search/components/result/reminder.component .ts

+import { Component, Input } from '@angular/core';
+
+import { Criterion, ConeSearch } from '../../store/model';
+import {Attribute, Category, Family} from 'src/app/metamodel/model';
+import { printCriterion as print } from '../../../shared/utils'
+
+@Component({
+    selector: 'app-reminder',
+    templateUrl: 'reminder.component.html'
+})
+export class ReminderComponent {
+    @Input() datasetAttributeList: Attribute[];
+    @Input() coneSearch: ConeSearch;
+    @Input() criteriaList: Criterion[];
+    @Input() outputFamilyList: Family[];
+    @Input() categoryList: Category[];
+    @Input() outputList: number[];
+
+    noCriteria(): boolean {
+        if (this.coneSearch !== null || this.criteriaList.length > 0) {
+            return false
+        }
+        return true;
+    }
+    
+    getAttribute(id: number): Attribute {
+        return this.datasetAttributeList.find(attribute => attribute.id === id);
+    }
+
+    printCriterion(criterion: Criterion) {
+        return print(criterion);
+    }
+}

src/app/search/components/result/reminder.component.html

+<div class="jumbotron py-4">
+    <div class="lead">
+        Reminder
+    </div>
+    <hr class="my-4">
+    <div class="row">
+        <div *ngIf="noCriteria()" class="col-12 font-weight-bold">
+            No criteria selected
+        </div>
+        <div *ngIf="!noCriteria()" class="col-auto">
+            <dl class="row mb-2 mb-lg-0">
+                <dt class="col-auto">
+                    Criteria <span class="badge badge-secondary">{{ criteriaList.length }}</span>
+                </dt>
+                <div class="w-100 d-block d-sm-none"></div>
+                <dd class="col mb-0">
+                    <span *ngIf="coneSearch !== null" class="mb-0">
+                        Cone search:
+                        <ul class="pl-4 list-unstyled">
+                            <li>RA = {{ coneSearch.ra }}°</li>
+                            <li>DEC = {{ coneSearch.dec }}°</li>
+                            <li>radius = {{ coneSearch.radius }}</li>
+                        </ul>
+                    </span>
+                    <ng-container *ngIf="criteriaList.length > 0">
+                        <p *ngFor="let criterion of criteriaList" class="mb-0">
+                            {{ getAttribute(criterion.id).form_label }} {{ printCriterion(criterion) }}
+                        </p>
+                    </ng-container>
+                </dd>
+            </dl>
+        </div>
+        <div class="col">
+            <span class="font-weight-bold">Output list</span>
+            <tabset>
+                <tab *ngFor="let family of outputFamilyList" [heading]="family.label">
+                    {{ family.label }}
+                </tab>
+            </tabset>
+        </div>
+    </div>
+</div>
\ No newline at end of file

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

@@ -13,10 +13,18 @@
             [criteriaList]="criteriaList | async"
             [outputList]="outputList | async">
         </app-result-download>
-        <app-result-summary
+        <app-reminder
             [datasetAttributeList]="datasetAttributeList | async" 
             [coneSearch]="coneSearch | async"
             [criteriaList]="criteriaList | async"
+            [outputFamilyList]="outputFamilyList | async"
+            [categoryList]="categoryList | async"
+            [outputList]="outputList | async">
+        </app-reminder>
+        <app-result-summary
+            [datasetAttributeList]="datasetAttributeList | async"
+            [coneSearch]="coneSearch | async"
+            [criteriaList]="criteriaList | async"
             [outputList]="outputList | async">
         </app-result-summary>
         <app-result-url-display

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

@@ -4,7 +4,7 @@ import { Observable } from 'rxjs';
 import { Store } from '@ngrx/store';
 
 import { Criterion, SearchQueryParams, ConeSearch } from '../store/model';
-import { Dataset, Attribute } from '../../metamodel/model';
+import { Dataset, Attribute, Family, Category } from '../../metamodel/model';
 import * as searchActions from '../store/search.action';
 import * as datasetActions from '../../metamodel/action/dataset.action';
 import * as fromSearch from '../store/search.reducer';
@@ -33,6 +33,8 @@ export class ResultComponent implements OnInit, OnDestroy {
     public datasetAttributeList: Observable<Attribute[]>;
     public criteriaList: Observable<Criterion[]>;
     public coneSearch: Observable<ConeSearch>;
+    public outputFamilyList: Observable<Family[]>;
+    public categoryList: Observable<Category[]>;
     public outputList: Observable<number[]>;
     public searchData: Observable<any[]>;
     public dataLength: Observable<number>;
@@ -53,6 +55,8 @@ export class ResultComponent implements OnInit, OnDestroy {
         this.datasetAttributeList = this.store.select(metamodelSelector.getDatasetAttributeList);
         this.criteriaList = this.store.select(searchSelector.getCriteriaList);
         this.coneSearch = this.store.select(searchSelector.getConeSearch);
+        this.outputFamilyList = this.store.select(metamodelSelector.getOutputFamilyList);
+        this.categoryList = this.store.select(metamodelSelector.getCategoryList);
         this.outputList = this.store.select(searchSelector.getOutputList);
         this.searchData = this.store.select(searchSelector.getSearchData);
         this.dataLength = this.store.select(searchSelector.getDataLength);