Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: enhanced variation selection with color code and swatch image #1317

Merged
merged 2 commits into from
Dec 16, 2022

Conversation

tdonthu
Copy link
Contributor

@tdonthu tdonthu commented Nov 7, 2022

PR Type

[x] Feature

What Is the Current Behavior?

Currently the PWA renders for the variation selection only standard select boxes with standard options even though different variation selection types can be configured in the ICM back end.

image

image

What Is the New Behavior?

This pull request introduces an extended /variations and /products REST call and a variation attribute mapper to fetch and prepare/map additional variation information required for distinct renderings.

It also introduces different rendering components for Default, Swatch Image/HTML Color Code and Default and Swatch Image/Default and HTML Color Code (including a mobile view adaption).

image
image
image
image
image
image

Does this PR Introduce a Breaking Change?

[x] Yes

  • extended /variations and /products REST call
  • added VariationAttributeMapper used in ProductMapper
  • introduces different rendering components

Other Information

AB#80929

@shauke shauke self-assigned this Nov 21, 2022
@shauke shauke added this to the 3.2 milestone Dec 9, 2022
@shauke shauke force-pushed the feat-variation-select-with-color-tile branch from 622a474 to 1c3988d Compare December 14, 2022 08:51
@github-actions
Copy link

Azure Demo Servers are available:

@shauke shauke changed the title feat: variation select with color tile feat: enhanced variation selection with color code and swatch image Dec 14, 2022
@shauke shauke added the enhancement Enhancement to an existing feature label Dec 14, 2022
Copy link

@iwiederhold iwiederhold left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please change the border color of this rectangle swatches to the older version. And add an space like the round variation colors.
image

If you need more informations, please ask me.

@github-actions
Copy link

Azure Demo Servers are available:

@shauke shauke requested a review from iwiederhold December 15, 2022 13:16
… call (#1317)

* changed products service to use `extended=true` REST calls for product details and variations
* added VariationAttributeMapper to map variation attributes with attributeType and metaData
* backwards compatible preparation for distinct variation select displays

BREAKING CHANGES: `ProductsService` was changed to use an `extended=true` details and variations call. `VariationAttribute` model was cleaned up and extended (see [Migrations / 3.1 to 3.2](https://github.com/intershop/intershop-pwa/blob/develop/docs/guides/migrations.md#31-to-32) for more details).
shauke added a commit that referenced this pull request Dec 16, 2022
…splay (#1317)

* moved existing `ProductVariationSelectComponent` rendering as standard select box to new `ProductVariationSelectDefaultComponent`
* `ProductVariationSelectComponent` now contains the logic to select the fitting variation select rendering component
* added `ProductVariationSelectSwatchComponent` for colorCode and swatchImage variation select rendering
* added `ProductVariationSelectEnhancedComponent` for a select box rendering with color codes or swatch images and a mobile optimization

BREAKING CHANGES: Changed the rendering of the `ProductVariationSelectComponent` and introduced additional product variation select rendering components (see [Migrations / 3.1 to 3.2](https://github.com/intershop/intershop-pwa/blob/develop/docs/guides/migrations.md#31-to-32) for more details).

Co-authored-by: Stefan Hauke <s.hauke@intershop.de>
@shauke shauke force-pushed the feat-variation-select-with-color-tile branch from 26af412 to 9b6b91e Compare December 16, 2022 10:39
shauke
shauke previously approved these changes Dec 16, 2022
@schadii
Copy link

schadii commented Dec 16, 2022

Please consider the arrow icon in both drop-downs the same. Also, to maintain consistency, please apply font weight for 256 GB as well.

Microsoft Surface Laptop -arrow

Microsoft Surface Laptop - Notebooks _ Font

THX!

…splay (#1317)

* moved existing `ProductVariationSelectComponent` rendering as standard select box to new `ProductVariationSelectDefaultComponent`
* `ProductVariationSelectComponent` now contains the logic to select the fitting variation select rendering component
* added `ProductVariationSelectSwatchComponent` for colorCode and swatchImage variation select rendering
* added `ProductVariationSelectEnhancedComponent` for a select box rendering with color codes or swatch images and a mobile optimization

BREAKING CHANGES: Changed the rendering of the `ProductVariationSelectComponent` and introduced additional product variation select rendering components (see [Migrations / 3.1 to 3.2](https://github.com/intershop/intershop-pwa/blob/develop/docs/guides/migrations.md#31-to-32) for more details).

Co-authored-by: Stefan Hauke <s.hauke@intershop.de>
@shauke shauke force-pushed the feat-variation-select-with-color-tile branch from 9b6b91e to cfc4f8a Compare December 16, 2022 13:53
@shauke shauke merged commit ddd6e2e into develop Dec 16, 2022
@shauke shauke deleted the feat-variation-select-with-color-tile branch December 16, 2022 14:31
shauke added a commit that referenced this pull request Dec 16, 2022
… call (#1317)

* changed products service to use `extended=true` REST calls for product details and variations
* added VariationAttributeMapper to map variation attributes with attributeType and metaData
* backwards compatible preparation for distinct variation select displays

BREAKING CHANGES: `ProductsService` was changed to use an `extended=true` details and variations call. `VariationAttribute` model was cleaned up and extended (see [Migrations / 3.1 to 3.2](https://github.com/intershop/intershop-pwa/blob/develop/docs/guides/migrations.md#31-to-32) for more details).
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement Enhancement to an existing feature
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants