Disable contribute button and add occupancy message fallback

src/app/components/chart/chart.component.ts

@@ -11,6 +11,8 @@ import { Dataset, ChartType, ChartContext, Point } from './chart.model';
 			<span class="x">{{ tooltipXValue }}</span><br>
 			<span class="y">{{ tooltipYValue }}</span>
 		</div>
+		<p class="empty-message" *ngIf="dataset?.options?.empty">Aucune donnée</p>
+		<p class="unavailable-message" *ngIf="dataset?.options?.unavailable">Données non disponibles</p>
 	`,
 	styles: [
 		':host {display: block; position: relative;}'

src/app/components/chart/chart.model.ts

@@ -25,7 +25,9 @@ export interface Dataset {
 		y?: Axis;
 	};
 	options?: {
-		padding?: number | [number, number, number, number]
+		padding?: number | [number, number, number, number],
+		empty?: boolean,
+		unavailable?: boolean,
 	}
 }
 

src/app/components/detail-prochainspassages/detail-prochainspassages.component.html

@@ -87,7 +87,7 @@
 			<app-chart type="vertical-bar" [dataset]="obj | occupancyDataset | async" [tooltipDisabled]="true"></app-chart>
 		</button>
 		<div class="layout content-center">
-			<button mat-button color="primary">Contribuer</button>
+			<a href="#" mat-button color="primary" [disabled]="!enableContrib">Contribuer</a>
 		</div>
 	</div>
 </ng-template>

src/app/components/detail-prochainspassages/detail-prochainspassages.component.ts

@@ -7,6 +7,7 @@ import { NextStop } from '@features/realtime-data/realtime-data.model';
 import { takeUntil } from 'rxjs/operators';
 import { Subject } from 'rxjs';
 import { OccupancyChartDialogComponent } from '@features/occupancy/occupancy-chart-dialog/occupancy-chart-dialog.component';
+import { environment } from 'src/environments/environment';
 
 @Component({
 	selector: 'app-detail-prochainspassages',
@@ -28,6 +29,7 @@ export class DetailProchainspassagesComponent implements OnInit, OnDestroy {
 	expandedElement: any;
 	url;
 	unavailable = false;
+	enableContrib = environment.enableContrib;
 
 	private paused = false;
 	private _zoneArret: any;

src/app/features/occupancy/occupancy-dataset.pipe.ts

@@ -22,21 +22,36 @@ export class OccupancyDatasetPipe implements PipeTransform {
 				}
 			});
 			this.occupancyService.getOccupancy(obj.stopId).subscribe(response => {
-				const dataset: Dataset = {
-					points: [
-						response.timeSlots.map((time, index, list) => {
-							return {
-								x: time,
-								y: response.occupancy.routeDirection[routeDirection][index]
-							};
-						})
-					],
-					axis,
-					options: {
-						padding: [4, 0, 8, 16]
+				if (response?.occupancy?.routeDirection) {
+					const points = response.timeSlots.map((time, index, list) => {
+						return {
+							x: time,
+							y: response.occupancy.routeDirection[routeDirection][index]
+						};
+					});
+					const isEmpty = points.every(p => p.y === 0);
+					const dataset: Dataset = {
+						points: [],
+						axis,
+						options: {
+							padding: [4, 0, 8, 16],
+							empty: isEmpty
+						}
+					};
+					if (!isEmpty) {
+						dataset.points = [points];
 					}
-				};
-				observer.next(dataset);
+					observer.next(dataset);
+				} else {
+					observer.next({
+						points: [],
+						axis,
+						options: {
+							padding: [4, 0, 8, 16],
+							unavailable: true,
+						}
+					});
+				}
 				observer.complete();
 			});
 		});

src/app/helpers/domain.helpers.ts

@@ -5,12 +5,12 @@ if (environment.api === 'test') {
 	_domain = 'https://datatest.metromobilite.fr';
 }
 if (environment.api === 'testOuProd') {
-	if (window.location.hostname === 'app.metromobilite.fr') {
-		_domain = 'https://data.metromobilite.fr';
-	} else if (['apptest.metromobilite.fr', 'pwa.passmobilites.app'].includes(window.location.hostname)) {
+	if (['www.metromobilite.fr', 'www.mobilites-m.fr'].includes(window.location.hostname)) {
+		_domain = 'https://data.mobilites-m.fr';
+	} else if (['preprod.metromobilite.fr', 'preprod.mobilites-m.fr'].includes(window.location.hostname)) {
 		_domain = 'https://datatest.metromobilite.fr';
 	} else {
-		_domain = 'https://data.metromobilite.fr';
+		_domain = 'https://data.mobilites-m.fr';
 	}
 }
 

src/app/pages/horaires-lignes/horaires-lignes.component.html

@@ -2,7 +2,7 @@
 	<mat-sidenav-content>
 		<h1>Fréquentation aux arrêts</h1>
 		<div class="contribute-wrapper" *ngIf="isMobile">
-			<button mat-raised-button class="affluence-btn contribute" color="primary">Contribuer</button>
+			<a href="#" mat-raised-button class="affluence-btn contribute" color="primary" [disabled]="!enableContrib">Contribuer</a>
 			<button mat-raised-button class="affluence-btn contribute-help" color="warn" aria-label="Aide" (click)="sidenav.toggle()">
 				<mat-icon>help</mat-icon>
 			</button>
@@ -92,7 +92,7 @@
 			<br><br>
 		</p>
 		<div class="actions">
-			<button mat-raised-button class="affluence-btn contribute" color="primary">Contribuer</button>
+			<a href="#" mat-raised-button class="affluence-btn contribute" color="primary" [disabled]="!enableContrib">Contribuer</a>
 			<a href="/assets/consignes.pdf" target="_blank" class="affluence-btn" mat-raised-button>Les règles à respecter</a>
 		</div>
 		<p>(*) données issues de l'enquête origine-destination du réseau Tag menée en 2016.</p>

src/app/pages/horaires-lignes/horaires-lignes.component.ts

@@ -4,6 +4,7 @@ import { Line } from '@features/line/line.model';
 import { BreakpointService } from '@services/breakpoint.service';
 import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';
+import { environment } from 'src/environments/environment';
 
 @Component({
 	templateUrl: './horaires-lignes.component.html',
@@ -11,6 +12,7 @@ import { takeUntil } from 'rxjs/operators';
 })
 export class HorairesLignesComponent implements OnInit, OnDestroy {
 
+	enableContrib = environment.enableContrib;
 	lines: Line[] = [];
 	sidenavMode = 'side';
 	sidenavOpened = false;

src/environments/environment.prod.ts

 export const environment = {
 	production: true,
 	api: 'testOuProd',
+	enableContrib: false,
 	// matomo: false,
 };

src/environments/environment.ts

@@ -5,6 +5,7 @@
 export const environment = {
 	production: false,
 	api: 'test',
+	enableContrib: false,
 	// matomo: false,
 };
 

src/styles/components/_chart.scss

@@ -186,3 +186,20 @@ path.line {
 		}
 	}
 }
+
+.unavailable-message,
+.empty-message {
+	margin: 0;
+	padding: 0;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+
+	body.dark-theme & {
+		color: map-get($dark-theme-foreground, text);
+	}
+	body.light-theme & {
+		color: map-get($light-theme-foreground, text);
+	}
+}