feat: unification of "Product List (Manual)" with the other CMS Produ…

…ct Lists (#673)

- renamed CMS component "Product List" to "Product List (Manual)"

e2e/cypress/integration/pages/home.page.ts

@@ -18,10 +18,10 @@ export class HomePage {
   }
 
   get featuredProducts() {
-    return cy.get('ish-cms-product-list').find('div.product-tile');
+    return cy.get('ish-products-list').find('div.product-tile');
   }
 
   gotoFeaturedProduct(sku) {
-    return cy.get('ish-cms-product-list').find(`div.product-tile[data-testing-sku="${sku}"]`).click();
+    return cy.get('ish-products-list').find(`div.product-tile[data-testing-sku="${sku}"]`).click();
   }
 }

src/app/shared/cms/cms.module.ts

@@ -9,7 +9,7 @@ import { CMSImageComponent } from './components/cms-image/cms-image.component';
 import { CMSLandingPageComponent } from './components/cms-landing-page/cms-landing-page.component';
 import { CMSProductListCategoryComponent } from './components/cms-product-list-category/cms-product-list-category.component';
 import { CMSProductListFilterComponent } from './components/cms-product-list-filter/cms-product-list-filter.component';
-import { CMSProductListComponent } from './components/cms-product-list/cms-product-list.component';
+import { CMSProductListManualComponent } from './components/cms-product-list-manual/cms-product-list-manual.component';
 import { CMSStandardPageComponent } from './components/cms-standard-page/cms-standard-page.component';
 import { CMSStaticPageComponent } from './components/cms-static-page/cms-static-page.component';
 import { CMSTextComponent } from './components/cms-text/cms-text.component';
@@ -71,7 +71,7 @@ import { SfeAdapterService } from './sfe-adapter/sfe-adapter.service';
       provide: CMS_COMPONENT,
       useValue: {
         definitionQualifiedName: 'app_sf_base_cm:component.common.productListManual.pagelet2-Component',
-        class: CMSProductListComponent,
+        class: CMSProductListManualComponent,
       },
       multi: true,
     },

src/app/shared/cms/components/cms-product-list-manual/cms-product-list-manual.component.html

@@ -0,0 +1,11 @@
+<div *ngIf="productSKUs?.length" class="product-list-container" [ngClass]="pagelet.stringParam('CSSClass')">
+  <h2 *ngIf="pagelet.stringParam('Title')">{{ pagelet.stringParam('Title') }}</h2>
+  <ish-products-list
+    [productSKUs]="productSKUs"
+    [listStyle]="pagelet.stringParam('ListStyle')"
+    [slideItems]="pagelet.numberParam('SlideItems')"
+    [listItemStyle]="pagelet.stringParam('ListItemStyle')"
+    [listItemCSSClass]="pagelet.stringParam('ListItemCSSClass')"
+  >
+  </ish-products-list>
+</div>

src/app/shared/cms/components/cms-product-list-manual/cms-product-list-manual.component.spec.ts

@@ -0,0 +1,51 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MockComponent } from 'ng-mocks';
+
+import { createContentPageletView } from 'ish-core/models/content-view/content-view.model';
+import { ProductsListComponent } from 'ish-shared/components/product/products-list/products-list.component';
+
+import { CMSProductListManualComponent } from './cms-product-list-manual.component';
+
+describe('Cms Product List Manual Component', () => {
+  let component: CMSProductListManualComponent;
+  let fixture: ComponentFixture<CMSProductListManualComponent>;
+  let element: HTMLElement;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [CMSProductListManualComponent, MockComponent(ProductsListComponent)],
+    }).compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CMSProductListManualComponent);
+    component = fixture.componentInstance;
+    element = fixture.nativeElement;
+    const pagelet = {
+      definitionQualifiedName: 'fq',
+      id: 'id',
+      displayName: 'name',
+      domain: 'domain',
+      configurationParameters: {
+        Products: ['1@Domain', '2@Domain'],
+        Title: 'PageletTitle',
+        CSSClass: 'css-class',
+        ListItemCSSClass: 'li-css-class',
+      },
+    };
+    component.pagelet = createContentPageletView(pagelet);
+  });
+
+  it('should be created', () => {
+    expect(component).toBeTruthy();
+    expect(element).toBeTruthy();
+    expect(() => component.ngOnChanges()).not.toThrow();
+    expect(() => fixture.detectChanges()).not.toThrow();
+    expect(component.productSKUs).toMatchInlineSnapshot(`
+      Array [
+        "1",
+        "2",
+      ]
+    `);
+  });
+});

src/app/shared/cms/components/cms-product-list/cms-product-list.component.ts → src/app/shared/cms/components/cms-product-list-manual/cms-product-list-manual.component.ts

@@ -4,11 +4,11 @@ import { ContentPageletView } from 'ish-core/models/content-view/content-view.mo
 import { CMSComponent } from 'ish-shared/cms/models/cms-component/cms-component.model';
 
 @Component({
-  selector: 'ish-cms-product-list',
-  templateUrl: './cms-product-list.component.html',
+  selector: 'ish-cms-product-list-manual',
+  templateUrl: './cms-product-list-manual.component.html',
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class CMSProductListComponent implements CMSComponent, OnChanges {
+export class CMSProductListManualComponent implements CMSComponent, OnChanges {
   @Input() pagelet: ContentPageletView;
 
   productSKUs: string[] = [];

src/app/shared/shared.module.ts

@@ -39,7 +39,7 @@ import { CMSImageComponent } from './cms/components/cms-image/cms-image.componen
 import { CMSLandingPageComponent } from './cms/components/cms-landing-page/cms-landing-page.component';
 import { CMSProductListCategoryComponent } from './cms/components/cms-product-list-category/cms-product-list-category.component';
 import { CMSProductListFilterComponent } from './cms/components/cms-product-list-filter/cms-product-list-filter.component';
-import { CMSProductListComponent } from './cms/components/cms-product-list/cms-product-list.component';
+import { CMSProductListManualComponent } from './cms/components/cms-product-list-manual/cms-product-list-manual.component';
 import { CMSStandardPageComponent } from './cms/components/cms-standard-page/cms-standard-page.component';
 import { CMSStaticPageComponent } from './cms/components/cms-static-page/cms-static-page.component';
 import { CMSTextComponent } from './cms/components/cms-text/cms-text.component';
@@ -173,8 +173,8 @@ const declaredComponents = [
   CMSImageEnhancedComponent,
   CMSLandingPageComponent,
   CMSProductListCategoryComponent,
-  CMSProductListComponent,
   CMSProductListFilterComponent,
+  CMSProductListManualComponent,
   CMSStandardPageComponent,
   CMSStaticPageComponent,
   CMSTextComponent,