Merge branch 'develop' into bugfix/ui-improvements

Author: patzick

CHANGELOG.md

@@ -6,13 +6,13 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [1.8.3] - 2019.02.27
 
-
-# Added
+### Added
 - New reactive helper to check online state. Usage: `import { onlineHelper } from '@vue-storefront/core/helpers'` and then `onlineHelper.isOnline` - @patzick (#2510)
 
 ### Fixed
 - Problem with placing second order (unbinding payment methods after first order) - @patzick (#2195, #2503)
 - Remaking order on user orders page - @patzick (#2480)
+- state.ts not bound in the module-template - @pkarw (#2496)
 - Validation in the Myprofile section for postcode field - @pkarw (#1317)
 - Non-integer qty of product added to the cart - @pkarw (#2517)
 
@@ -43,6 +43,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - fix price is never below 0 and user can't add 0 or below 0 products to cart @RakowskiPrzemyslaw (#2437)
 - Check for placing single order in case of error in any payment module - @patzick (#2409)
 - Display prices in products added in offline mode. - @patzick (#2450)
+- Improved styles on recommentation filters - @patzick (#2458)
 
 ### Deprecated / Removed
 - `@vue-storefront/store` package deprecated - @filrak

core/modules/catalog/store/product/actions.ts

@@ -1,7 +1,7 @@
 import Vue from 'vue'
 import { ActionTree } from 'vuex'
 import * as types from './mutation-types'
-import { breadCrumbRoutes, productThumbnailPath } from '@vue-storefront/core/helpers'
+import { breadCrumbRoutes, productThumbnailPath, isServer } from '@vue-storefront/core/helpers'
 import { currentStoreView } from '@vue-storefront/core/lib/multistore'
 import { configureProductAsync,
   doPlatformPricesSync,
@@ -617,18 +617,20 @@ const actions: ActionTree<ProductState, RootState> = {
         const productFields = Object.keys(product).filter(fieldName => {
           return rootStore.state.config.entities.product.standardSystemFields.indexOf(fieldName) < 0 // don't load metadata info for standard fields
         })
-        subloaders.push(context.dispatch('attribute/list', { // load attributes to be shown on the product details - the request is now async
+        const attributesPromise = context.dispatch('attribute/list', { // load attributes to be shown on the product details - the request is now async
           filterValues: rootStore.state.config.entities.product.useDynamicAttributeLoader ? productFields : null,
           only_visible: rootStore.state.config.entities.product.useDynamicAttributeLoader ? true : false,
           only_user_defined: true,
           includeFields: rootStore.state.config.entities.optimize ? rootStore.state.config.entities.attribute.includeFields : null
-        }, { root: true }))
+        }, { root: true }) // TODO: it might be refactored to kind of: `await context.dispatch('attributes/list) - or using new Promise() .. to wait for attributes to be loaded before executing the next action. However it may decrease the performance - so for now we're just waiting with the breadcrumbs
         if (Vue.prototype.$isServer) {
+          subloaders.push(context.dispatch('setupBreadcrumbs', { product: product }))
           subloaders.push(context.dispatch('filterUnavailableVariants', { product: product }))
         } else {
+          attributesPromise.then(() => context.dispatch('setupBreadcrumbs', { product: product })) // if this is client's side request postpone breadcrumbs setup till attributes are loaded to avoid too-early breadcrumb switch #2469
           context.dispatch('filterUnavailableVariants', { product: product }) // exec async
         }
-        subloaders.push(context.dispatch('setupBreadcrumbs', { product: product }))
+        subloaders.push(attributesPromise)
 
         // subloaders.push(context.dispatch('setupVariants', { product: product })) -- moved to "product/single"
         /* if (product.type_id === 'grouped' || product.type_id === 'bundle') { -- moved to "product/single"

src/modules/module-template/store/index.ts

@@ -3,10 +3,12 @@ import { ExampleState } from '../types/ExampleState'
 import { mutations } from './mutations'
 import { getters } from './getters'
 import { actions } from './actions'
+import { state } from './state'
 
 export const module: Module<ExampleState, any> = {
   namespaced: true,
   mutations,
   actions,
-  getters
+  getters,
+  state
 }

src/themes/default/components/core/GenericSelector.vue

@@ -26,6 +26,7 @@ export default {
     height: 40px;
     padding-left: 8px;
     padding-right: 8px;
+    min-width: 50px;
 
     &:hover,
     &:focus {

src/themes/default/components/core/blocks/Category/Sidebar.vue

@@ -52,10 +52,10 @@
           :content="price.label"
         />
       </div>
-      <div v-else>
+      <div v-else class="sidebar__inline-selecors">
         <generic-selector
           context="category"
-          class="price-select mb10 block"
+          class="mr10 mb10 block"
           :code="filterIndex"
           v-for="(option, index) in filter"
           :key="index"
@@ -108,5 +108,9 @@ export default {
     align-items: center;
     min-height: 47px;
   }
+
+  &__inline-selecors {
+    display: flex;
+  }
 }
 </style>