#22: update card and list item components ( make it reusable in on model page)

src/app/shared/common/shared-item-base/shared-item-base.component.ts

@@ -20,6 +20,7 @@ export abstract class SharedItemBaseComponent {
   @Input() items!: PublicSolution[];
   @Input() isMarketPlacePage = false;
   @Input() viewTile!: boolean;
+  @Input() isPublishedSolution!: boolean;
   imageToShow: any;
 
   isImageLoading = true;

src/app/shared/components/card-item/card-item.component.html

@@ -2,7 +2,7 @@
   <mat-card-header (click)="goToModelDetails()">
     <div class="img-container">
       <img
-        [src]="imageToShow"
+        [src]="imageToShow ?? '../../../../../assets/images/default-model.png'"
         class="img-rounded"
         alt="Place image title"
         tabindex="0"
@@ -39,14 +39,14 @@
     </div>
     <div
       style="display: flex; align-items: center; gap: 4px"
-      *ngIf="isMarketPlacePage"
+      *ngIf="isMarketPlacePage && isPublishedSolution"
     >
       <gp-catalog-name [item]="item"></gp-catalog-name>
 
       |
       <gp-publisher [item]="item"></gp-publisher>
     </div>
-    <div class="a-mp-container1">
+    <div class="a-mp-container1" *ngIf="isPublishedSolution">
       <gp-stars [width]="getStarWidth(item.solutionRatingAvg).width"></gp-stars>
 
       <div *ngIf="isMarketPlacePage">
@@ -54,9 +54,15 @@
       </div>
     </div>
     <div class="md-icons md-icons-tiles" *ngIf="isMarketPlacePage">
-      <gp-comment-count [item]="item"></gp-comment-count>
-      <gp-view-count [item]="item"></gp-view-count>
-      <gp-download-count [item]="item"></gp-download-count>
+      <gp-comment-count
+        *ngIf="isPublishedSolution"
+        [item]="item"
+      ></gp-comment-count>
+      <gp-view-count *ngIf="isPublishedSolution" [item]="item"></gp-view-count>
+      <gp-download-count
+        *ngIf="isPublishedSolution"
+        [item]="item"
+      ></gp-download-count>
       <gp-favorite
         [item]="item"
         [items]="items"

src/app/shared/components/list-item/list-item.component.html

@@ -32,7 +32,10 @@
       |
       <span class="text-xsmall link-orange" *ngIf="item.active">New</span>
     </div>
-    <div class="a-mp-container1" *ngIf="isMarketPlacePage">
+    <div
+      class="a-mp-container1"
+      *ngIf="isMarketPlacePage && isPublishedSolution"
+    >
       <gp-stars [width]="getStarWidth(item.solutionRatingAvg).width"></gp-stars>
       <div class="tile-icons">
         <gp-catalog-name [item]="item"></gp-catalog-name>
@@ -40,14 +43,20 @@
         |
         <gp-publisher [item]="item"></gp-publisher>
       </div>
-      <div *ngIf="isMarketPlacePage">
+      <div *ngIf="isMarketPlacePage && isPublishedSolution">
         <gp-tags-list [item]="item" [slnID]="slnID" [Tag]="Tag"></gp-tags-list>
       </div>
     </div>
     <div class="md-icons-tiles" *ngIf="isMarketPlacePage">
-      <gp-comment-count [item]="item"></gp-comment-count>
-      <gp-view-count [item]="item"></gp-view-count>
-      <gp-download-count [item]="item"></gp-download-count>
+      <gp-comment-count
+        *ngIf="isPublishedSolution"
+        [item]="item"
+      ></gp-comment-count>
+      <gp-view-count *ngIf="isPublishedSolution" [item]="item"></gp-view-count>
+      <gp-download-count
+        *ngIf="isPublishedSolution"
+        [item]="item"
+      ></gp-download-count>
       <gp-favorite
         [item]="item"
         [items]="items"