We notice that all product variants are returned in the API "occ/v2/telcospa/products/{{product}}" through the property called "variantMatrix", when all properties about categories of base product attributes are returned.
But not find any component in Spartacus utilizing this property, for presenting in the PDP, the product details as well as its attributes category (storage size, color, and any others dinamic attributes), selectable through HTML 'select'.
Enabling the user to change attribute options according to their choice in the PDP, and each change corresponds to a product variant and its SKU. Very similar user experience with wireframe extracted from an ongoing project by the Spartacus team as shown below:
variantMatrix is used by so called "Multidimensional Product support" (Multi-d Variants) feature of Hybris (B2B extensions). It's not yet implemented in Spartacus due to API missings. However it's developed under epic/multi-d branch, you will find the variantMatrix usage there:
https://github.com/SAP/spartacus/commits/epic/multi-d
AFAIK, multi-d variants will become a feature lib, but pls take some time for exploring the project board for details:
https://github.com/SAP/spartacus/projects/119#card-51242735
And the official roadmap with a mention of Multidimensional product support:
https://sap.github.io/spartacus-docs/spartacus-roadmap/
Please note that while Multi-d variants are B2B feature, it should be doable to make use of it for B2C setup after some backend adjustments.
Related
For our Spartacus project, we need to introduce additional Data properties in the checkout:
We have the case, that the user needs to select a delivery mode per product.
In an ideal world, upon selection, the selected delivery mode would be saved in the NGRX Store and also in the Backend to stay within the principle of the data binding defined here: https://sap.github.io/spartacus-docs/connecting-to-other-systems/#component-data-binding
Expected Data / User flow:
User goes to Checkout and to Delivery Mode Step
Custom OCC Call is made to load the supported delivery modes for each product (depends on product type and further customer specific logic)
The cart items are displayed, enhanced with a dropdown containing the available delivery modes
The user selects a delivery mode
The selected delivery mode is stored on the cart entry within the NGRX Store and saved in the backend
The new Cart totals is calculated based on the costs of the selected delivery mode
The new Cart totals is stored on the cart within the NGRX Store and saved in the backend
The user clicks on continue to get to the Review Order Step
The cart items are listed with the previously selected delivery mode
After some analysis of the existing code, we found a property deliveryMode on the orderEntry. This does not seem to be used anywhere in spartacus, but could be used to make Step 9 work by following this stackoverflow answer and this one.
Questions regarding this flow:
How can we extend the NGRX Store? We assume, it would be possible to just extend the facade (Active Cart Service), bypass the store and save the information in the backend (Described here) and afterwards refresh the store from the backend. Is that Assumption correct? If yes, that feels awkward though, as we need to reload the whole store just to contain the new property deliveryMode on the orderEntry
How can we hook into the price calculation of the cart totals to update the total based on the selected delivery mode? And again, how can we bring the new total sum into the store?
There seem to be several Answers within the Slack Channel without very few usable answers around extending the ngrx store, even though for us, it seems to be a quit normal task.. :-/
Any thoughts, inputs or support would be very appreciated. :-)
This seems like a difficult thing to accomplish seeing as delivery modes per product aren't supported as-is in spartacus. But some ideas:
You can extend core CartEntry classes (adapter, connecter, facade, etc.) to include the delivery mode for entries added to the cart. You will probably need to change all to include the delivery mode setting(s). All of these are exposed so you can modify them as needed including the store.
Utilizing multiple carts to have a product per cart and set delivery mode that way. But this would be cumbersome in my opinion.
As far as price calculation goes, I'm assuming OCC calls return total prices. Does the call for the cart entries include delivery mode costs per entry?
We have implemented the following work around and it works so far:
Enhance the Cart Model in the backend
Add new Endpoints to load the available delivery Modes per Product (by bypassing the NGRX Store)
Add new Endpoints to save the selected Delivery Mode (by bypassing the NGRX Store)
After Save Endpoint, a cart Reload is triggered, which loads the new cart totals having a custom property on the order entry (via type augmentation) into the store from the backend
It's already a lot of years past since Spartacus project started, but looks like it's still really raw projects. Spartacus is not ready to deal with real word customer's requirement and complexity of customize it quickly grow at real project(so you start to think do we really need it, as it's so unflexible at some dimentions). Some parts is really hard or not possible to customize, so you begin to search a workarounds(This question is one common case).
I think NGRX Store is one of the biggest pain in the ass to customize something at Spartacus. 2 years past and nothing changed by Spartacus team...
Requirement:
The business provides a URL in the format as (":category/:name") and against this format, system will have an SKU defined for which PDP needs to be opened without changing the URL.
e.g. for a defined URL -- https://example.com/categoryName/baseProductName and SKU (SKU123) will be configured in backend.
When a customer opens the above URL, the PDP of SKU123 should load where the URL remains the same.
Spartacus code has a constraint that PDP cannot be opened without providing a product code (SKU number) to it. We have tried to override the routing configurations but internally spartacus is redirecting to a 404 page.
In Spartacus Docs(https://sap.github.io/spartacus-docs/route-configuration/) it is mentioned that it is not allowed otherwise functionality will break.
I am looking for a workaround on the same to allow routing config as (":category/:name") and (":category/:name/:productCode") both which seems to be a constraint from Spartacus end. We can feed in the productCode but the URL needs to be as is.
The current PDP functionality should not break.
Spartacus: 1.4.4
SAP Commerce: 1905
that's an interesting question, and not straightforward to solve actually. I'll give you a few pointers to workaround.
First off, Spartacus uses the product code as a unique key in all layers of the application. The code is used in the routing logic, in the store and to load the product from the backend.
Moreover, the code is passed to the CMS, as the CMS is capable to resolve custom page structure per product; you can configure a specific CMS page structure for a specific product code or product category; therefor the product code is passed as an id to the CMS when loading.
To workaround these features you need to configure and override a number of things:
Bring product name into the routing configuration
You can easily do this with the routing configuration, or just by provide a paramsMapping from product.code to product.name. More on this can be found at the docs. Additionally, you could prettify the product name (avoid spaces and other characters to avoid ugly encoding)
Bring the category name into the routing configuration
Before you can configure the router (see 1) for the category name, you need to get the category from the backend. You can do this by normalising the (first) category from the product model. However, by default the product doesn't contain the categories, which is why you'd need to configure the OCC field configuration. It's all described at https://sap.github.io/spartacus-docs/connecting-to-other-systems/. Special attention is required for the SOLR results, as they also need to expose the categories.
Additionally, you could prettify the product name (avoid spaces and other characters to avoid ugly encoding)
Change the product key internally
To ensure that the category name and product name are used instead of the product code to store (ngrx) and load (OCC) the product, you need to trick the system. You can provide a custom implementation of the CurrentProductService, where you'd evaluate if the Router state contains the category name and product name parameters. If those parameters are available, you would concatenate them so that they can later on be reconstructed.
Load product data by category and product name
You could introduce a custom adapter to resolve the product code by it's category and product name, but i'd not recommend this. It would involve an additional API call, and that's expensive. Instead, I would implement a custom backend endpoint, that takes the the category and product name. You could still provide a custom adapter in Spartacus, for deconstructing the concatenated category and product name from step 3, as this would result in a cleaner code base.
Load CMS product page by category and product name
The CMS uses the product code (id) as well to load the right cms structure. You could do 2 things here:
a. use the same pattern from step 4; create custom OCC endpoint to resolve the product code and then load the right CMS product page structure
b. use a static (but existing) product code in a customer OccCmsPageAdapter, to load the same CMS structure for all product pages. This will obviously block existing CMS functionality, but it might be ok. Or at least for your first implementation you can get it to work with this workaround.
Hope that gives you an idea or 2.
All of this being said, I believe this is quite an uncommon requirement. Not that you need pretty URLs and want to use the product name as a unique "code". But using both the category name and product name as a unique key. If possible, I'd try to move into this pattern:
use the product category and product name in the title for SEO purposes (exactly as you require)
only depend on the product code as being the unique property
change the product code structure in the backend; the product.code there are various ways to do this, the idea is that the actual product code could be stored in an alternative field, and the generated (based on name) product.code in the native code field.
all application logic (UIs, APIs, SOLR, Spartacus) will transparently use the product name as the unique key.
Can products in the react-admin framework be assigned to multiple categories?
For example in the demo, a new poster of a bearded man with a pet cat would ideally be categorised as both 'beard' and 'animal'. Currently you can only select one category.
You are able to specify multiple segments for a customer in the demo (using alt-select in the customer's segment drop-down list) so I wondered why this feature was not enabled for product categories...
In addition, can filtering then be configured to support multiple category filtering, rather than only allowing one single category term to be used?
Yes we could have implemented it this way for product categories too. We didn't as we wanted to show multiple types of references in the demo.
As for your question about filtering, yes, it's possible if you use the same input as for segments selection which allow multiple ones.
React-admin is a framework for building administration applications with React. It's not an e-commerce framework nor a UI kit. You can do whatever you want :)
I've successfully got 3rd party merchant orders posting new orders to my client's BigCommerce store programmatically. I've even got product options posting as part of the order (product->option set-> option relationships are a total cluster).
My client relies heavily on configurable fields. I'm able to pull the definitions of the configurable fields for each product, but can't find a way to POST or update the configurable field values through the API.
Is it possible to manipulate an order's configurable fields through the API?
Got a response from the support team # BigCommerce. Manipulating configurable fields via the API is not currently possible and not currently on the roadmap.
Original reply below:
Unfortunately that is a product limitation with the API, it will not tie to configurable fields on the product. The best you can do is attach that information through a generic text field like 'staff_notes'. Honestly I have not heard of any talk of adding a way to add products with configurable fields to orders via the API. I think this may be because anything that can be done with configurable fields can be done with options and options are what is being pushed for the future. I have noted this feedback down though and will pass it along to our Product Manager for the API. Best case scenario is that it may be seen in a future version of the API which is at least several months away.
We are wanting to add custom product attributes to a BigCommerce store using API so that the main global product page will have the custom product attributes for cigars in our case.
Below are the product attributes so you get an idea on what it will include. We need the ability to have these attribute fields in the admin so when we add or import products they will be populated manually or automatically on the import.
County, Wrapper, Binder, Package, Size, Strength, Shape.
An example of those customs fields you can see on this other website.
http://www.thecigarstore.com/Cigars/Rocky-Patel/Rocky-Patel-Sun-Grown-Toro.htm
This is BigCommerce's API page on this.
http://developer.bigcommerce.com/docs/api/v2/resources/products/custom_fields
As mentioned here, this seems to be a bug in the API. I am not sure what are Bigcommerce plans to fix it, but I imagine there's plenty of people waiting to be fixed.