From 9ca9bfab1a47be94dcf47188024ed09d93a9c77d Mon Sep 17 00:00:00 2001
From: FORESTIER Fabien <fabien.forestier@soprasteria.com>
Date: Wed, 29 Apr 2020 11:07:55 +0200
Subject: [PATCH] Optimization of http calls on the Download and API tabs +
small css fix
---
.../dataset-api/dataset-api.component.ts | 7 ++--
.../dataset-downloads.component.html | 4 +--
.../dataset-downloads.component.scss | 11 ++++++-
.../dataset-downloads.component.ts | 33 +++++++++----------
.../resource-download-item.component.html | 2 +-
.../resource-download-item.component.scss | 3 +-
.../services/resources.service.ts | 21 +++++++++---
7 files changed, 49 insertions(+), 32 deletions(-)
diff --git a/src/app/dataset-detail/components/dataset-api/dataset-api.component.ts b/src/app/dataset-detail/components/dataset-api/dataset-api.component.ts
index ba65a838..a8004bef 100644
--- a/src/app/dataset-detail/components/dataset-api/dataset-api.component.ts
+++ b/src/app/dataset-detail/components/dataset-api/dataset-api.component.ts
@@ -45,15 +45,11 @@ export class DatasetAPIComponent implements OnInit, OnDestroy {
this.cguModalIsOpened = (this._cookieService.get(environment.cguAcceptedCookieName) !== 'true') &&
!this._userService.userIsSignedIn;
- this.initialize();
this._resourcesService.getResources().subscribe(
(results) => {
this.resources = results;
this.initialize();
- this.sub = this._datasetDetailService.dataset$.subscribe(() => {
- this.initialize();
- });
},
(err) => {
this._notificationService.notify(new Notification({
@@ -63,6 +59,9 @@ export class DatasetAPIComponent implements OnInit, OnDestroy {
},
);
+ this.sub = this._datasetDetailService.dataset$.subscribe(() => {
+ this.initialize();
+ });
}
ngOnDestroy() {
diff --git a/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.html b/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.html
index cd5b42ad..06984893 100644
--- a/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.html
+++ b/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.html
@@ -8,12 +8,12 @@
<span>{{downloadable.key}}</span>
</div>
<div class="resource-downloadable-files" *ngFor="let resource of downloadable.value">
- <ng-container *ngFor="let format of resource.formats; let i=index">
+ <div class="resource-download-item-wrapper" *ngFor="let format of resource.formats; let i=index">
<app-resource-download-item [metadata]="metadata"
[format]="format" [resource]="resource" [projections]="projections"
[isQueryable]="true">
</app-resource-download-item>
- </ng-container>
+ </div>
</div>
</div>
</div>
diff --git a/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.scss b/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.scss
index 06f3ae34..cdc0c047 100644
--- a/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.scss
+++ b/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.scss
@@ -48,11 +48,11 @@
.resource-download {
margin-bottom: 1.5rem;
- border-bottom: 2px solid $grey-background-color;
background-color: white;
padding: 2.5rem;
box-shadow: 0 6px 12px 0 rgba(129, 128, 128, 0.1);
border-radius: 8px;
+ border-bottom: 2px solid $grey-background-color;
}
.resource-description {
@@ -136,6 +136,15 @@
}
}
+.resource-download-item-wrapper,
+.resource-static-files {
+ border-bottom: 1px solid #f2f2f2;
+}
+.resource-downloadable-files:last-of-type .resource-download-item-wrapper:last-of-type,
+.resource-static-files:last-of-type {
+ border-bottom: none;
+}
+
::ng-deep .downloads-container {
.modal {
overflow-y: auto;
diff --git a/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.ts b/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.ts
index 99be9c70..73e742bb 100644
--- a/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.ts
+++ b/src/app/dataset-detail/components/dataset-downloads/dataset-downloads.component.ts
@@ -53,29 +53,26 @@ export class DatasetDownloadsComponent implements OnInit {
this.isSample = this._datasetDetailService.dataset.editorialMetadata.isSample;
- this.initialize();
-
- // Why retrieveDatasetData():
- // to retrieve the first data for the dataset (if exists). It will be used in the
- // Data, Downloads and API tabs.
forkJoin([
this._resourcesService.getProjections(),
this._resourcesService.getResources(),
- this._datasetDetailService.retrieveDatasetData(),
- ]).subscribe((response) => {
- this.projections = response[0];
- this.resources = response[1];
+ ]).subscribe(
+ (response) => {
+ this.projections = response[0];
+ this.resources = response[1];
- this.initialize();
- this.sub = this._datasetDetailService.dataset$.subscribe(() => {
this.initialize();
- });
- // tslint:disable-next-line: align
- }, (err) => {
- this._notificationService.notify(new Notification({
- type: 'error',
- message: `${notificationMessages.resources.initializationError}`,
- }));
+ },
+ (err) => {
+ this._notificationService.notify(new Notification({
+ type: 'error',
+ message: `${notificationMessages.resources.initializationError}`,
+ }));
+ },
+ );
+
+ this.sub = this._datasetDetailService.dataset$.subscribe(() => {
+ this.initialize();
});
}
diff --git a/src/app/dataset-detail/components/dataset-downloads/resource-download-item/resource-download-item/resource-download-item.component.html b/src/app/dataset-detail/components/dataset-downloads/resource-download-item/resource-download-item/resource-download-item.component.html
index 0267c2aa..8119b62b 100644
--- a/src/app/dataset-detail/components/dataset-downloads/resource-download-item/resource-download-item/resource-download-item.component.html
+++ b/src/app/dataset-detail/components/dataset-downloads/resource-download-item/resource-download-item/resource-download-item.component.html
@@ -1,4 +1,4 @@
- <div class="resource-download">
+ <div class="resource-download-item">
<div class="first-line">
<div class="resource-left">
diff --git a/src/app/dataset-detail/components/dataset-downloads/resource-download-item/resource-download-item/resource-download-item.component.scss b/src/app/dataset-detail/components/dataset-downloads/resource-download-item/resource-download-item/resource-download-item.component.scss
index 949318b2..b4f9bb3f 100644
--- a/src/app/dataset-detail/components/dataset-downloads/resource-download-item/resource-download-item/resource-download-item.component.scss
+++ b/src/app/dataset-detail/components/dataset-downloads/resource-download-item/resource-download-item/resource-download-item.component.scss
@@ -1,10 +1,9 @@
@import '../../../../../../scss/variables.scss';
@import '../.././../../../../../node_modules/bulma/sass/utilities/_all.sass';
-.resource-download {
+.resource-download-item {
background-color: white;
align-items: center;
- border-bottom: 1px solid #f2f2f2;
margin-top: 1rem;
padding-bottom: 1rem;
}
diff --git a/src/app/dataset-detail/services/resources.service.ts b/src/app/dataset-detail/services/resources.service.ts
index 7fb48359..e9b4569e 100644
--- a/src/app/dataset-detail/services/resources.service.ts
+++ b/src/app/dataset-detail/services/resources.service.ts
@@ -1,6 +1,7 @@
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import lodashClonedeep from 'lodash.clonedeep';
+import { of } from 'rxjs';
import { map } from 'rxjs/operators';
import { APP_CONFIG } from '../../core/services/app-config.service';
import { IMetadataLink, linkFormats, Metadata } from '../../shared/models';
@@ -11,24 +12,36 @@ export class ResourcesService {
linkFormats = linkFormats;
resources: Resource[];
+ projections: Projection[];
constructor(
private _httpClient: HttpClient,
) { }
getResources() {
+ if (this.resources && this.resources.length > 0) {
+ return of(this.resources);
+ }
+
return this._httpClient.get<IResource[]>(`${APP_CONFIG.backendUrls.resources}/resources`).pipe(
map((resourcesBack) => {
this.resources = resourcesBack.map(r => new Resource(r));
return this.resources;
- }));
+ }),
+ );
}
getProjections() {
+ if (this.projections && this.projections.length > 0) {
+ return of(this.projections);
+ }
+
return this._httpClient.get<IProjection[]>(`${APP_CONFIG.backendUrls.resources}/projections`).pipe(
- map((resourcesBack) => {
- return resourcesBack.map(r => new Projection(r));
- }));
+ map((projections) => {
+ this.projections = projections.map(r => new Projection(r));
+ return this.projections;
+ }),
+ );
}
getQueryableResources(link: IMetadataLink[]) {
--
GitLab