Merge pull request vuestorefront#4547 from DivanteLtd/hotfix/v1.12.1

Hotfix/v1.12.1

CHANGELOG.md

@@ -5,6 +5,22 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.12.1] - 2020.06.22
+
+### Added
+
+- Add `purgeConfig` to default.json and purge-config loader - @gibkigonzo (#4540)
+- Load attributes data of attribute-meta for bundled and grouped products - @cewald (#4551)
+- Separate theme installation and add it as yarn init:theme or as a step in yarn installer. - @gibkigonzo (4534, #4552)
+
+### Fixed
+
+- use `config.i18n.defaultLocale` as fallback locale instead of `'en-US'` - @gibkigonzo (#4489)
+- use Math.abs on raw price - @gibkigonzo (#4521)
+- Clears vuex warnings about overriding state by module - @gibkigonzo (#4541)
+
+### Changed / Improved
+
 ## [1.12.0] - 2020.06.01
 
 ### Added

README.md

@@ -156,6 +156,7 @@ You can find some tutorials and explanations on our [YouTube channel](https://ww
 - [Starter pack for install](https://docs.vuestorefront.io/guide/cookbook/setup.html)
 - [Installing on Linux/MacOS](https://docs.vuestorefront.io/guide/installation/linux-mac.html)
 - [Installing on Windows](https://docs.vuestorefront.io/guide/installation/windows.html)
+- [Installing theme](https://docs.vuestorefront.io/guide/installation/theme.html)
 - [How to install and integrate with Magento2](https://docs.vuestorefront.io/guide/installation/magento.html)
 - [Production setup](https://docs.vuestorefront.io/guide/installation/production-setup.html)
 

config/default.json

@@ -871,5 +871,17 @@
   },
   "varnish": {
     "enabled":false
-  }
+  },
+  "purgeConfig": [
+    "server.invalidateCacheKey",
+    "server.invalidateCacheForwardUrl",
+    "server.trace",
+    "redis",
+    "install",
+    "expireHeaders",
+    "fastly",
+    "nginx",
+    "varnish",
+    "cloudflare"
+  ]
 }

core/build/purge-config.js

@@ -0,0 +1,16 @@
+const omit = require('lodash/omit')
+
+/**
+ * clear config properties that shouldn't be visible on frontend
+ */
+module.exports = function loader(source) {
+  let config = JSON.parse(source);
+
+  const purgeConfig = (config.purgeConfig || []).slice()
+
+  config = omit(config, purgeConfig)
+
+  delete config['purgeConfig']
+
+  return JSON.stringify(config);
+}

core/build/theme-path.js

@@ -15,9 +15,7 @@ else {
   if(!fs.existsSync(themePath)) {
     console.error(`
       The theme you want to use does not exist.
-      Please use 'vsf init' or install manualy one of our official themes:
-      - https://github.com/DivanteLtd/vsf-capybara#--installation
-      - https://github.com/DivanteLtd/vsf-default#--installation
+      Please check theme installation: https://docs.vuestorefront.io/guide/installation/theme.html
     `)
     process.exit(1)
   }

core/build/webpack.base.config.ts

@@ -193,6 +193,10 @@ export default {
         test: /\.(graphqls|gql)$/,
         exclude: /node_modules/,
         loader: ['graphql-tag/loader']
+      },
+      {
+        test: /core\/build\/config\.json$/,
+        loader: path.resolve('core/build/purge-config.js')
       }
     ]
   }

core/filters/price.js

@@ -34,7 +34,7 @@ export function price (value, storeView) {
 
   const options = { minimumFractionDigits: fractionDigits, maximumFractionDigits: fractionDigits };
 
-  let localePrice = Math.abs(Number(value).toLocaleString(defaultLocale, options)).toFixed(2);
+  let localePrice = Math.abs(value).toLocaleString(defaultLocale, options);
 
   if (currencyDecimal !== '' || currencyGroup !== '') {
     localePrice = replaceSeparators(localePrice, { decimal: currencyDecimal, group: currencyGroup }, getLocaleSeparators(defaultLocale));

core/i18n/index.ts

@@ -8,12 +8,13 @@ once('__VUE_EXTEND_I18N__', () => {
   Vue.use(VueI18n)
 })
 
-const loadedLanguages = ['en-US']
+const defaultLocale = config.i18n.defaultLocale || 'en-US'
+const loadedLanguages = [defaultLocale]
 const i18n = new VueI18n({
-  locale: config.i18n.bundleAllStoreviewLanguages ? config.i18n.defaultLocale : 'en-US', // set locale
-  fallbackLocale: 'en-US',
+  locale: defaultLocale, // set locale
+  fallbackLocale: defaultLocale,
   messages: config.i18n.bundleAllStoreviewLanguages ? require('./resource/i18n/multistoreLanguages.json') : {
-    'en-US': require('./resource/i18n/en-US.json')
+    [defaultLocale]: require(`./resource/i18n/${defaultLocale}.json`)
   }
 })
 

core/i18n/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-storefront/i18n",
-  "version": "1.12.0",
+  "version": "1.12.1",
   "description": "Vue Storefront i18n",
   "license": "MIT",
   "main": "index.ts",

core/i18n/scripts/translation.preprocessor.js

@@ -17,7 +17,7 @@ function convertToObject (array) {
 
 module.exports = function (csvDirectories, config = null) {
   const currentLocales = currentBuildLocales()
-  const fallbackLocale = 'en-US'
+  const fallbackLocale = config.i18n.defaultLocale || 'en-US'
   let messages = {}
   let languages = []
 
@@ -43,7 +43,7 @@ module.exports = function (csvDirectories, config = null) {
 
   // create fallback
   console.debug(`Writing JSON file fallback: ${fallbackLocale}.json`)
-  fs.writeFileSync(path.join(__dirname, '../resource/i18n', `${fallbackLocale}.json`), JSON.stringify(messages[fallbackLocale]))
+  fs.writeFileSync(path.join(__dirname, '../resource/i18n', `${fallbackLocale}.json`), JSON.stringify(messages[fallbackLocale] || {}))
 
   // bundle all messages in one file
   if (config && config.i18n.bundleAllStoreviewLanguages) {

core/lib/multistore.ts

@@ -66,7 +66,10 @@ export async function prepareStoreView (storeCode: string): Promise<StoreView> {
   if (storeView.storeCode && config.storeViews.multistore === true && config.storeViews[storeView.storeCode]) {
     storeView = merge(storeView, getExtendedStoreviewConfig(config.storeViews[storeView.storeCode]))
   }
-  rootStore.state.user.current_storecode = storeView.storeCode
+
+  if (rootStore.state.user) {
+    rootStore.state.user.current_storecode = storeView.storeCode
+  }
 
   if (storeViewHasChanged) {
     storeView = coreHooksExecutors.beforeStoreViewChanged(storeView)

core/mixins/onBottomScroll.js

@@ -14,7 +14,7 @@ const isBottomVisible = () => {
 }
 
 /**
- * By implementing this mixin add "onBottomScroll" mthod in component.
+ * By implementing this mixin add "onBottomScroll" method in component.
  * It will be invoked when view reach the bottom.
  */
 export default {

core/modules/breadcrumbs/helpers/index.ts

@@ -5,6 +5,7 @@ import { formatCategoryLink } from '@vue-storefront/core/modules/url/helpers'
 export function parseCategoryPath (categoryPath) {
   let routesArray = []
   for (let category of categoryPath) {
+    if (category.url_path === undefined || category.url_path === null) continue;
     routesArray.push({
       name: category.name,
       route_link: formatCategoryLink(category)

core/modules/catalog/helpers/associatedProducts/getAttributesFromMetadata.ts

@@ -0,0 +1,11 @@
+import config from 'config'
+import Product from '@vue-storefront/core/modules/catalog/types/Product'
+
+/**
+ * Set associated attributes by meta data of product links
+ */
+export default async function getAttributesFromMetadata (context: any, products: Product[]) {
+  if (config.entities.attribute.loadByAttributeMetadata) {
+    context.dispatch('attribute/loadProductAttributes', { products, merge: true }, { root: true })
+  }
+}

core/modules/catalog/helpers/associatedProducts/index.ts

@@ -1,7 +1,9 @@
 import setGroupedProduct from './setGroupedProduct'
 import setBundleProducts from './setBundleProducts'
+import getAttributesFromMetadata from './getAttributesFromMetadata'
 
 export {
   setGroupedProduct,
-  setBundleProducts
+  setBundleProducts,
+  getAttributesFromMetadata
 }

core/modules/catalog/helpers/associatedProducts/setBundleProducts.ts

@@ -1,9 +1,10 @@
-import Product from '@vue-storefront/core/modules/catalog/types/Product';
-import { isBundleProduct } from './..';
+import Product from '@vue-storefront/core/modules/catalog/types/Product'
 import buildQuery from './buildQuery'
 import setProductLink from './setProductLink'
-import { ProductService } from '@vue-storefront/core/data-resolver/ProductService'
 import getBundleProductPrice from './getBundleProductPrice'
+import { isBundleProduct } from './..'
+import { ProductService } from '@vue-storefront/core/data-resolver/ProductService'
+import { catalogHooksExecutors } from './../../hooks'
 
 /**
  * This function prepare all product_links for bundle products.
@@ -30,6 +31,8 @@ export default async function setBundleProducts (product: Product, { includeFiel
       }
     })
 
+    catalogHooksExecutors.afterSetBundleProducts(items)
+
     for (const bundleOption of product.bundle_options) {
       for (const productLink of bundleOption.product_links) {
         const associatedProduct = items.find((associatedProduct) => associatedProduct.sku === productLink.sku)

core/modules/catalog/helpers/associatedProducts/setGroupedProduct.ts

@@ -1,9 +1,10 @@
-import Product from '@vue-storefront/core/modules/catalog/types/Product';
-import { isGroupedProduct } from './..';
+import Product from '@vue-storefront/core/modules/catalog/types/Product'
 import buildQuery from './buildQuery'
 import setProductLink from './setProductLink'
-import { ProductService } from '@vue-storefront/core/data-resolver/ProductService'
 import getGroupedProductPrice from './getGroupedProductPrice'
+import { isGroupedProduct } from './..'
+import { ProductService } from '@vue-storefront/core/data-resolver/ProductService'
+import { catalogHooksExecutors } from './../../hooks'
 
 /**
  * This function prepare all product_links for grouped products.
@@ -29,6 +30,8 @@ export default async function setGroupedProduct (product: Product, { includeFiel
       }
     })
 
+    catalogHooksExecutors.afterSetGroupedProduct(items)
+
     for (const productLink of productLinks) {
       const associatedProduct = items.find((associatedProduct) => associatedProduct.sku === productLink.linked_product_sku)
       setProductLink(productLink, associatedProduct)

core/modules/catalog/hooks/index.ts

@@ -1,17 +1,31 @@
-import { createMutatorHook } from '@vue-storefront/core/lib/hooks'
+import { createMutatorHook, createListenerHook } from '@vue-storefront/core/lib/hooks'
 import Product from '../types/Product';
 
 const {
   hook: beforeTaxesCalculatedHook,
   executor: beforeTaxesCalculatedExecutor
 } = createMutatorHook<Product[], Product[]>()
 
+const {
+  hook: afterSetBundleProductsHook,
+  executor: afterSetBundleProductsExecutor
+} = createListenerHook<Product[]>()
+
+const {
+  hook: afterSetGroupedProductHook,
+  executor: afterSetGroupedProductExecutor
+} = createListenerHook<Product[]>()
+
 const catalogHooksExecutors = {
-  beforeTaxesCalculated: beforeTaxesCalculatedExecutor
+  beforeTaxesCalculated: beforeTaxesCalculatedExecutor,
+  afterSetBundleProducts: afterSetBundleProductsExecutor,
+  afterSetGroupedProduct: afterSetGroupedProductExecutor
 }
 
 const catalogHooks = {
-  beforeTaxesCalculated: beforeTaxesCalculatedHook
+  beforeTaxesCalculated: beforeTaxesCalculatedHook,
+  afterSetBundleProducts: afterSetBundleProductsHook,
+  afterSetGroupedProduct: afterSetGroupedProductHook
 }
 
 export {

core/modules/catalog/index.ts

@@ -4,6 +4,8 @@ import { attributeModule } from './store/attribute'
 import { stockModule } from './store/stock'
 import { taxModule } from './store/tax'
 import { categoryModule } from './store/category'
+import { catalogHooks } from './hooks'
+import { getAttributesFromMetadata } from './helpers/associatedProducts'
 import { StorageManager } from '@vue-storefront/core/lib/storage-manager'
 import EventBus from '@vue-storefront/core/compatibility/plugins/event-bus'
 import config from 'config'
@@ -23,6 +25,9 @@ export const CatalogModule: StorefrontModule = async function ({ store, router,
   store.registerModule('tax', taxModule)
   store.registerModule('category', categoryModule)
 
+  catalogHooks.afterSetBundleProducts(products => getAttributesFromMetadata(store, products))
+  catalogHooks.afterSetGroupedProduct(products => getAttributesFromMetadata(store, products))
+
   if (!config.entities.attribute.loadByAttributeMetadata) {
     await store.dispatch('attribute/list', { // loading attributes for application use
       filterValues: uniq([...config.products.defaultFilters, ...config.entities.productListWithChildren.includeFields])

core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-storefront/core",
-  "version": "1.12.0",
+  "version": "1.12.1",
   "description": "Vue Storefront Core",
   "license": "MIT",
   "main": "app.js",

core/scripts/installer.js

@@ -12,6 +12,7 @@ const isWindows = require('is-windows')
 const isEmptyDir = require('empty-dir')
 const commandExists = require('command-exists')
 const program = require('commander')
+const { createThemeTasks, createThemePrompt } = require('./../../packages/cli/themeTasks')
 
 const SAMPLE_DATA_PATH = 'var/magento2-sample-data'
 const TARGET_FRONTEND_CONFIG_FILE = 'config/local.json'
@@ -561,6 +562,33 @@ class Storefront extends Abstract {
       resolve(answers)
     })
   }
+
+  /**
+   * Handles all tasks needed to make theme installation
+   */
+  async themeInstallation () {
+    // get theme tasks
+    const { installDeps, cloneTheme, configureTheme } = createThemeTasks(STOREFRONT_DIRECTORY.toString())
+
+    // put tasks in order
+    const tasks = [
+      cloneTheme,
+      installDeps,
+      configureTheme
+    ]
+
+    for (let { title, task, skip } of tasks) {
+      Message.info(title)
+
+      const skipAnswer = skip ? await skip(this.answers) : ''
+
+      if (skipAnswer) {
+        Message.warning(skipAnswer)
+      } else {
+        await task(this.answers)
+      }
+    }
+  }
 }
 
 class Manager extends Abstract {
@@ -654,6 +682,7 @@ class Manager extends Abstract {
   initStorefront () {
     return this.storefront.goToDirectory()
       .then(this.storefront.createConfig.bind(this.storefront))
+      .then(this.storefront.themeInstallation.bind(this.storefront))
       .then(this.storefront.depBuild.bind(this.storefront))
       .then(this.storefront.runDevEnvironment.bind(this.storefront))
   }
@@ -863,7 +892,8 @@ let questions = [
     name: 'ssr_endpoints',
     message: `Would You like to create fields for SSR endpoints?`,
     default: false
-  }
+  },
+  ...createThemePrompt(STOREFRONT_DIRECTORY.toString())
 ]
 
 async function processAnswers (answers) {