Les mélanges, étapes et images d'une recette ne s'affichent plus lorsqu'ils sont vide dans l'explorateur.

De plus un avertissement s'affiche lorsque la recette n'a pas de mélange ou d'étape.

src/app/modules/colors/components/images-editor/images-editor.component.html

@@ -1,4 +1,4 @@
-<mat-card>
+<mat-card *ngIf="editionMode || hasImages">
   <mat-card-header>
     <mat-card-title>Images</mat-card-title>
   </mat-card-header>

src/app/modules/colors/components/images-editor/images-editor.component.ts

@@ -18,6 +18,7 @@ export class ImagesEditorComponent extends SubscribingComponent {
 
   imageIds$: Observable<number[]>
   backendUrl = environment.apiUrl
+  hasImages = false
 
   constructor(
     private recipeImageService: RecipeImageService,
@@ -32,6 +33,11 @@ export class ImagesEditorComponent extends SubscribingComponent {
     super.ngOnInit()
 
     this.loadImagesIds()
+    this.subscribe(
+      this.imageIds$,
+      ids => this.hasImages = ids.length > 0,
+      1
+    )
   }
 
   submit(event) {

src/app/modules/colors/pages/explore/explore.component.html

@@ -24,7 +24,7 @@
 
   <div class="recipe-content d-flex flex-row justify-content-around align-items-start flex-wrap mt-5">
     <!-- Mixes -->
-    <div>
+    <div *ngIf="recipe.mixes.length > 0">
       <cre-mixes-card
         [recipe]="recipe"
         [deductErrorBody]="deductErrorBody"
@@ -36,7 +36,7 @@
     </div>
 
     <!-- Steps -->
-    <div>
+    <div *ngIf="recipe.steps.length > 0">
       <cre-step-list [steps]="recipe.steps"></cre-step-list>
     </div>
 

src/app/modules/colors/pages/explore/explore.component.ts

@@ -50,6 +50,10 @@ export class ExploreComponent extends ErrorHandlingComponent {
       r => {
         this.recipe = r
         this.note = r.note
+
+        if (this.recipe.mixes.length <= 0 || this.recipe.steps.length <= 0) {
+          this.alertService.pushWarning("Cette recette n'est pas complète")
+        }
       },
       '/colors/list'
     )