chore: release 1.0.0-rc.5

README.md

@@ -74,22 +74,23 @@ Thanks go to these wonderful people 🙌:
   <tr>
     <td align="center"><a href="https://github.com/bloodf"><img src="https://avatars.githubusercontent.com/u/1626923?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Heitor Ramon Ribeiro</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=bloodf" title="Code">💻</a> <a href="#maintenance-bloodf" title="Maintenance">🚧</a> <a href="https://github.com/vuestorefront/magento2/commits?author=bloodf" title="Documentation">📖</a> <a href="#projectManagement-bloodf" title="Project Management">📆</a></td>
     <td align="center"><a href="https://github.com/alefbarbeli"><img src="https://avatars.githubusercontent.com/u/7727647?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Alef Barbeli</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=alefbarbeli" title="Code">💻</a> <a href="https://github.com/vuestorefront/magento2/commits?author=alefbarbeli" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/domideimel"><img src="https://avatars.githubusercontent.com/u/32941053?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Dominik Deimel</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=domideimel" title="Code">💻</a> <a href="https://github.com/vuestorefront/magento2/commits?author=domideimel" title="Documentation">📖</a></td>
-    <td align="center"><a href="https://github.com/LiorLindvor"><img src="https://avatars.githubusercontent.com/u/6757942?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Lior Lindvor</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=LiorLindvor" title="Code">💻</a></td>
     <td align="center"><a href="https://github.com/hcmlopes"><img src="https://avatars.githubusercontent.com/u/20449158?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Henrique Lopes</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=hcmlopes" title="Code">💻</a> <a href="https://github.com/vuestorefront/magento2/commits?author=hcmlopes" title="Documentation">📖</a></td>
-  </tr>
-  <tr>
     <td align="center"><a href="https://github.com/DaiLoc5698"><img src="https://avatars.githubusercontent.com/u/76195735?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Đại Lộc Lê Quang</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=DaiLoc5698" title="Code">💻</a></td>
     <td align="center"><a href="https://github.com/zfmaster"><img src="https://avatars.githubusercontent.com/u/10129233?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Bogdan Podlesnii</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=zfmaster" title="Code">💻</a></td>
-    <td align="center"><a href="https://github.com/filrak"><img src="https://avatars.githubusercontent.com/u/15185752?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Filip Rakowski</b></sub></a><br /><a href="#question-filrak" title="Answering Questions">💬</a> <a href="#mentoring-filrak" title="Mentoring">🧑‍🏫</a> <a href="https://github.com/vuestorefront/magento2/pulls?q=is%3Apr+reviewed-by%3Afilrak" title="Reviewed Pull Requests">👀</a></td>
-    <td align="center"><a href="https://github.com/filipsobol"><img src="https://avatars.githubusercontent.com/u/4145208?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Filip Sobol</b></sub></a><br /><a href="#question-filipsobol" title="Answering Questions">💬</a> <a href="#mentoring-filipsobol" title="Mentoring">🧑‍🏫</a> <a href="https://github.com/vuestorefront/magento2/pulls?q=is%3Apr+reviewed-by%3Afilipsobol" title="Reviewed Pull Requests">👀</a></td>
-    <td align="center"><a href="https://github.com/andrzejewsky"><img src="https://avatars.githubusercontent.com/u/7943292?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Patryk Andrzejewski</b></sub></a><br /><a href="#question-andrzejewsky" title="Answering Questions">💬</a> <a href="#mentoring-andrzejewsky" title="Mentoring">🧑‍🏫</a> <a href="https://github.com/vuestorefront/magento2/pulls?q=is%3Apr+reviewed-by%3Aandrzejewsky" title="Reviewed Pull Requests">👀</a></td>
   </tr>
   <tr>
-    <td align="center"><a href="https://github.com/renanoliveira0"><img src="https://avatars.githubusercontent.com/u/1081576?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Renan Oliveira</b></sub></a><br /><a href="#tool-renanoliveira0" title="Tools">🔧</a> <a href="#plugin-renanoliveira0" title="Plugin/utility libraries">🔌</a></td>
     <td align="center"><a href="https://github.com/patrickmonteiro"><img src="https://avatars.githubusercontent.com/u/13258255?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Patrick Monteiro</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=patrickmonteiro" title="Code">💻</a></td>
     <td align="center"><a href="https://github.com/KevinGorjan"><img src="https://avatars.githubusercontent.com/u/789614?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Kevin Gorjan</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=kevingorjan" title="Code">💻</a></td>
     <td align="center"><a href="https://github.com/bartoszherba"><img src="https://avatars.githubusercontent.com/u/16045377?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Bartosz Herba</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=bartoszherba" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/Frodigo"><img src="https://avatars.githubusercontent.com/u/11998249?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Marcin Kwiatkowski</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=Frodigo" title="Code">💻</a> <a href="#projectManagement-Frodigo" title="Project Management">📆</a></td>
+    <td align="center"><a href="https://github.com/filrak"><img src="https://avatars.githubusercontent.com/u/15185752?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Filip Rakowski</b></sub></a><br /><a href="#question-filrak" title="Answering Questions">💬</a> <a href="#mentoring-filrak" title="Mentoring">🧑‍🏫</a> <a href="https://github.com/vuestorefront/magento2/pulls?q=is%3Apr+reviewed-by%3Afilrak" title="Reviewed Pull Requests">👀</a></td>
+  </tr>
+  <tr>
+    <td align="center"><a href="https://github.com/filipsobol"><img src="https://avatars.githubusercontent.com/u/4145208?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Filip Sobol</b></sub></a><br /><a href="#question-filipsobol" title="Answering Questions">💬</a> <a href="#mentoring-filipsobol" title="Mentoring">🧑‍🏫</a> <a href="https://github.com/vuestorefront/magento2/pulls?q=is%3Apr+reviewed-by%3Afilipsobol" title="Reviewed Pull Requests">👀</a></td>
+    <td align="center"><a href="https://github.com/andrzejewsky"><img src="https://avatars.githubusercontent.com/u/7943292?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Patryk Andrzejewski</b></sub></a><br /><a href="#question-andrzejewsky" title="Answering Questions">💬</a> <a href="#mentoring-andrzejewsky" title="Mentoring">🧑‍🏫</a> <a href="https://github.com/vuestorefront/magento2/pulls?q=is%3Apr+reviewed-by%3Aandrzejewsky" title="Reviewed Pull Requests">👀</a></td>
+    <td align="center"><a href="https://github.com/renanoliveira0"><img src="https://avatars.githubusercontent.com/u/1081576?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Renan Oliveira</b></sub></a><br /><a href="#tool-renanoliveira0" title="Tools">🔧</a> <a href="#plugin-renanoliveira0" title="Plugin/utility libraries">🔌</a></td>
+    <td align="center"><a href="https://github.com/domideimel"><img src="https://avatars.githubusercontent.com/u/32941053?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Dominik Deimel</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=domideimel" title="Code">💻</a> <a href="https://github.com/vuestorefront/magento2/commits?author=domideimel" title="Documentation">📖</a></td>
+    <td align="center"><a href="https://github.com/LiorLindvor"><img src="https://avatars.githubusercontent.com/u/6757942?v=4?s=80" width="80px;" alt=""/><br /><sub><b>Lior Lindvor</b></sub></a><br /><a href="https://github.com/vuestorefront/magento2/commits?author=LiorLindvor" title="Code">💻</a></td>
   </tr>
 </table>
 

components/AppHeader.vue

@@ -30,30 +30,48 @@
       <template #aside>
         <LocaleSelector class="smartphone-only" />
       </template>
-      <template #header-icons>
+      <template
+        #header-icons="{activeIcon}"
+      >
         <div class="sf-header__icons">
           <SfButton
             v-e2e="'app-header-account'"
             class="sf-button--pure sf-header__action"
-            aria-label="Open account button"
+            data-testid="accountIcon"
+            aria-label="Account"
             @click="handleAccountClick"
           >
             <SfIcon
               :icon="accountIcon"
               size="1.25rem"
+              :class="{
+                'sf-header__icon is-active': activeIcon === 'account',
+              }"
             />
           </SfButton>
           <SfButton
             v-if="isAuthenticated"
             class="sf-button--pure sf-header__action"
-            aria-label="Toggle wishlist sidebar"
+            data-testid="wishlistIcon"
+            aria-label="Wishlist"
             @click="toggleWishlistSidebar"
           >
             <SfIcon
               class="sf-header__icon"
-              icon="heart"
+              :icon="wishlistHasProducts ? 'heart_fill' : 'heart'"
+              :has-badge="wishlistHasProducts"
+              :badge-label="wishlistItemsQty"
               size="1.25rem"
+              :class="{
+                'sf-header__icon is-active': activeIcon === 'wishlist',
+              }"
             />
+            <SfBadge
+              v-if="wishlistHasProducts"
+              class="sf-badge--number cart-badge"
+            >
+              {{ wishlistItemsQty }}
+            </SfBadge>
           </SfButton>
           <SfButton
             v-e2e="'app-header-cart'"
@@ -65,6 +83,9 @@
               class="sf-header__icon"
               icon="empty_cart"
               size="1.25rem"
+              :class="{
+                'sf-header__icon is-active': activeIcon === 'cart',
+              }"
             />
             <SfBadge
               v-if="cartTotalItems"
@@ -140,8 +161,6 @@ import {
   SfBadge,
   SfSearchBar,
   SfOverlay,
-  SfMenuItem,
-  SfLink,
 } from '@storefront-ui/vue';
 import {
   cartGetters,
@@ -150,8 +169,7 @@ import {
   useCategory,
   useCategorySearch,
   useFacet,
-  useUser,
-  useWishlist,
+  useUser, useWishlist, wishlistGetters,
 } from '@vue-storefront/magento';
 import {
   computed,
@@ -194,7 +212,7 @@ export default defineComponent({
     const { setTermForUrl, getFacetsFromURL, getAgnosticCatLink } = useUiHelpers();
     const { isAuthenticated, load: loadUser } = useUser();
     const { cart, load: loadCart } = useCart();
-    const { load: loadWishlist } = useWishlist();
+    const { wishlist } = useWishlist('GlobalWishlist');
     const {
       result: searchResult,
       search: productsSearch,
@@ -214,6 +232,9 @@ export default defineComponent({
     const searchBarRef = ref(null);
     const result = ref(null);
 
+    const wishlistHasProducts = computed(() => wishlistGetters.getTotalItems(wishlist.value) > 0);
+    const wishlistItemsQty = computed(() => wishlistGetters.getTotalItems(wishlist.value));
+
     const cartTotalItems = computed(() => {
       const count = cartGetters.getTotalItems(cart.value);
       return count ? count.toString() : null;
@@ -235,7 +256,6 @@ export default defineComponent({
       await Promise.all([
         loadUser(),
         loadCart(),
-        loadWishlist(),
         categoriesListSearch({
           pageSize: 20,
         }),
@@ -315,6 +335,8 @@ export default defineComponent({
       term,
       toggleCartSidebar,
       toggleWishlistSidebar,
+      wishlistHasProducts,
+      wishlistItemsQty,
     };
   },
 });

components/BottomNavigation.vue

@@ -52,10 +52,10 @@
 <script>
 import { SfBottomNavigation, SfIcon, SfCircleIcon } from '@storefront-ui/vue';
 import { useUser } from '@vue-storefront/magento';
-import { useRouter } from '@nuxtjs/composition-api';
+import { defineComponent, useRouter } from '@nuxtjs/composition-api';
 import { useUiState } from '~/composables';
 
-export default {
+export default defineComponent({
   components: {
     SfBottomNavigation,
     SfIcon,
@@ -88,7 +88,7 @@ export default {
       handleAccountClick,
     };
   },
-};
+});
 </script>
 <style lang="scss" scoped>
 .navigation-bottom {

components/CartSidebar.vue

@@ -93,7 +93,7 @@
             >
               <SfCollectedProduct
                 v-for="product in products"
-                :key="`${cartGetters.getItemSku(product)}-${Math.random()}`"
+                :key="cartGetters.getItemSku(product)"
                 :image="cartGetters.getItemImage(product)"
                 :title="cartGetters.getItemName(product)"
                 :regular-price="

components/Checkout/UserShippingAddresses.vue

@@ -65,8 +65,10 @@ export default defineComponent({
     const { shipping: userShipping } = useUserShipping();
 
     const setCurrentAddress = (addressId) => {
-      const selectedAddress = userShippingGetters.getAddresses(userShipping.value,
-        { id: Number.parseInt(addressId, 10) });
+      const selectedAddress = userShippingGetters.getAddresses(
+        userShipping.value,
+        { id: Number.parseInt(addressId, 10) },
+      );
 
       if (!selectedAddress) {
         return;

components/Checkout/VsfShippingProvider.vue

@@ -3,7 +3,7 @@
     <SfHeading
       :level="3"
       :title="$t('Shipping method')"
-      class="sf-heading&#45;&#45;left sf-heading&#45;&#45;no-underline title"
+      class="sf-heading--left sf-heading--no-underline title"
     />
     <div class="form">
       <SfLoader :loading="isLoading">

components/ContentBlock.vue

@@ -8,12 +8,18 @@
         {{ title }}
       </h3>
     </div>
-    <div v-dompurify-html="content" />
+    <HTMLContent
+      :content="content"
+    />
   </div>
 </template>
 <script>
-export default {
+import { defineComponent } from '@nuxtjs/composition-api';
+import HTMLContent from '~/components/HTMLContent';
+
+export default defineComponent({
   name: 'ContentBlock',
+  components: { HTMLContent },
   props: {
     title: {
       type: String,
@@ -26,5 +32,5 @@ export default {
       default: '',
     },
   },
-};
+});
 </script>

components/ContentBlocks.vue

@@ -9,11 +9,12 @@
   </div>
 </template>
 <script>
+import { defineComponent } from '@nuxtjs/composition-api';
 import { onSSR } from '@vue-storefront/core';
 import { useContent } from '@vue-storefront/magento';
 import ContentBlock from './ContentBlock';
 
-export default {
+export default defineComponent({
   name: 'ContentBlocks',
   components: {
     ContentBlock,
@@ -38,5 +39,5 @@ export default {
       blocks,
     };
   },
-};
+});
 </script>