Merge branch 'release/v2.3.0' into main

.env.example

@@ -1,4 +1,4 @@
-NUXT_PUBLIC_API_URL=https://demo-***REMOVED***.***REMOVED***
+NUXT_PUBLIC_API_URL=https://api.heseya.com
 NUXT_PUBLIC_DIRECTUS_URL=https://cms.heseya.com
 NUXT_PUBLIC_PRICE_TRACKER_URL=https://main-price-tracker.app.***REMOVED***
 NUXT_PUBLIC_PRODUCTION=false

README.md

@@ -50,9 +50,9 @@ Template uses 3 different APIs. You can change the url of each API by setting th
 - `PRICE_TRACKER_URL` is used by the application to fetch data from the Price Tracker API to fullfill the Omnibus requirement.
 
 ```env
-API_URL=https://demo-***REMOVED***.***REMOVED***
+API_URL=https://api.heseya.com
 DIRECTUS_URL=https://cms.heseya.com
-PRICE_TRACKER_URL=https://main-price-tracker.app.***REMOVED***
+PRICE_TRACKER_URL=https://main-price-tracker.heseya.com
 ```
 
 ### Custom pages

app.vue

@@ -18,6 +18,7 @@
 </template>
 
 <script setup lang="ts">
+import { COOKIES_CONFIG, COOKIE_REQUIRED_ACCEPTED_KEY } from './consts/cookiesKeys'
 import { useConfigStore } from './store/config'
 
 const config = useConfigStore()
@@ -80,7 +81,8 @@ useHead({
 
 delayedOnMounted(() => {
   const { $enableGtm } = useNuxtApp()
-  $enableGtm()
+  const requiredCookie = useStatefulCookie<number>(COOKIE_REQUIRED_ACCEPTED_KEY, COOKIES_CONFIG)
+  if (requiredCookie.value) $enableGtm()
 }, 3000)
 </script>
 

components/auth/RegisterForm.vue

@@ -61,6 +61,8 @@
       {{ errorMessage || consentsListError }}
     </LayoutInfoBox>
 
+    <LayoutRecaptchaBadge />
+
     <div class="register-form__btn-container">
       <LayoutButton
         :disabled="isFormDisabled"
@@ -98,6 +100,7 @@ const t = useLocalI18n()
 const $t = useGlobalI18n()
 const heseya = useHeseya()
 const formatError = useErrorMessage()
+const { recaptchaPublic } = usePublicRuntimeConfig()
 
 const isLoading = ref(false)
 const errorMessage = ref('')
@@ -145,7 +148,11 @@ const onSubmit = form.handleSubmit(async () => {
   isLoading.value = true
 
   try {
-    const user = await heseya.Auth.register(registerFormDto.value)
+    const recaptchaToken = await getRecaptchaToken(recaptchaPublic, 'register')
+    const user = await heseya.Auth.register({
+      ...registerFormDto.value,
+      captcha_token: recaptchaToken,
+    })
     if (newsletterConsent.value) newsletterSubscribe(user.email)
 
     ev.emit(HeseyaEvent.Register, user)

components/base/CookiesBar.vue

@@ -147,6 +147,7 @@ import { useConfigStore } from '~/store/config'
 const t = useLocalI18n()
 const config = useConfigStore()
 const localePath = useLocalePath()
+const { $enableGtm } = useNuxtApp()
 
 const optInForm = reactive({
   required: true,
@@ -180,6 +181,8 @@ const setCookies = ([required, functional, analytics, ads]: [
   functionalCookie.value = functional ? 1 : 0
   analyticsCookie.value = analytics ? 1 : 0
   adsCookie.value = ads ? 1 : 0
+
+  $enableGtm()
 }
 
 // Tabs

components/base/FooterSocialmedia.vue

@@ -3,59 +3,10 @@
     <div class="footer-socialmedia__section">
       <span class="footer-socialmedia__text">{{ t('text') }}</span>
     </div>
-    <div v-if="***REMOVED***SocialUrls.length > 0" class="footer-socialmedia__section">
-      <img
-        src="@/assets/icons/social/***REMOVED***.svg"
-        alt="Hammer logo"
-        class="footer-socialmedia__main-icon"
-        loading="lazy"
-      />
+    <div v-for="{ key, logo, urls } in socialMedia" :key="key" class="footer-socialmedia__section">
+      <img :src="logo" :alt="`Logo ${key}`" class="footer-socialmedia__main-icon" loading="lazy" />
       <a
-        v-for="[name, url] in ***REMOVED***SocialUrls"
-        :key="name"
-        target="_blank"
-        rel="nofollow noreferrer"
-        :href="url"
-      >
-        <img
-          :src="ICONS[name]"
-          :alt="t(`go_to_${name}`)"
-          class="footer-socialmedia__icon"
-          loading="lazy"
-        />
-      </a>
-    </div>
-    <div v-if="***REMOVED***SocialUrls.length > 0" class="footer-socialmedia__section">
-      <img
-        src="@/assets/icons/social/***REMOVED***.svg"
-        alt="myPhone logo"
-        class="footer-socialmedia__main-icon"
-        loading="lazy"
-      />
-      <a
-        v-for="[name, url] in ***REMOVED***SocialUrls"
-        :key="name"
-        target="_blank"
-        rel="nofollow noreferrer"
-        :href="url"
-      >
-        <img
-          :src="ICONS[name]"
-          :alt="t(`go_to_${name}`)"
-          class="footer-socialmedia__icon"
-          loading="lazy"
-        />
-      </a>
-    </div>
-    <div v-if="***REMOVED***SocialUrls.length > 0" class="footer-socialmedia__section">
-      <img
-        src="@/assets/icons/social/***REMOVED***.svg"
-        alt="Techbite logo"
-        class="footer-socialmedia__main-icon"
-        loading="lazy"
-      />
-      <a
-        v-for="[name, url] in ***REMOVED***SocialUrls"
+        v-for="[name, url] in urls"
         :key="name"
         target="_blank"
         rel="nofollow noreferrer"
@@ -90,10 +41,6 @@
 </i18n>
 
 <script setup lang="ts">
-/**
- * TODO: this is ***REMOVED*** specific component, maybe it should be refactored to be universal
- */
-
 import FacebookIcon from '@/assets/icons/social/facebook.svg'
 import InstagramIcon from '@/assets/icons/social/instagram.svg'
 import YoutubeIcon from '@/assets/icons/social/youtube.svg'
@@ -116,16 +63,18 @@ const ICONS = {
   youtube: YoutubeIcon,
 }
 
-const ***REMOVED***SocialUrls = computed(() => getSocialUrls('***REMOVED***'))
-const ***REMOVED***SocialUrls = computed(() => getSocialUrls('***REMOVED***'))
-const ***REMOVED***SocialUrls = computed(() => getSocialUrls('***REMOVED***'))
-
-const showSocials = computed(
-  () =>
-    ***REMOVED***SocialUrls.value.length > 0 ||
-    ***REMOVED***SocialUrls.value.length > 0 ||
-    ***REMOVED***SocialUrls.value.length > 0,
+const socialMedia = computed(() =>
+  config.env.footer_social_media
+    ?.toString()
+    .split(',')
+    ?.map((key) => ({
+      key,
+      logo: config.env[`${key}_logo_url`]?.toString(),
+      urls: getSocialUrls(key),
+    })),
 )
+
+const showSocials = computed(() => socialMedia.value.some(({ urls }) => urls.length > 0))
 </script>
 
 <style lang="scss" scoped>

components/ceneo/Consent.vue

@@ -1,5 +1,5 @@
 <template>
-  <FormCheckbox v-model="value" class="ceneo-consent" name="ceneo-consent">
+  <FormCheckbox v-model="value" class="ceneo-consent" name="ceneo-consent" :disabled="disabled">
     {{ t('text') }}
   </FormCheckbox>
 </template>
@@ -20,6 +20,7 @@ const t = useLocalI18n()
 
 const props = defineProps<{
   modelValue: boolean
+  disabled?: boolean
 }>()
 
 const emit = defineEmits<{

components/checkout/Consents.vue

@@ -4,6 +4,7 @@
       v-if="newsletterEnabled || ceneoEnabled"
       v-model="allAccepted"
       class="all-consent"
+      :disabled="disabled"
       name="all-consent"
     >
       {{ t('acceptAllText') }}
@@ -13,6 +14,7 @@
       v-model="checkout.consents.statute"
       rules="required"
       :class="{ 'checkout-consents__indented': newsletterEnabled }"
+      :disabled="disabled"
       name="statute-consent"
     >
       {{ t('statute.accept') }}
@@ -30,12 +32,14 @@
     <NewsletterConsent
       v-if="newsletterEnabled"
       v-model="checkout.consents.newsletter"
+      :disabled="disabled"
       class="checkout-consents__indented"
     />
 
     <CeneoConsent
       v-if="ceneoEnabled"
       v-model="checkout.consents.ceneo"
+      :disabled="disabled"
       class="checkout-consents__indented"
     />
   </div>
@@ -71,6 +75,10 @@ import { useCheckoutStore } from '@/store/checkout'
 import { useCeneo } from '~/composables/useCeneo'
 import { useConfigStore } from '~/store/config'
 
+defineProps<{
+  disabled?: boolean
+}>()
+
 const t = useLocalI18n()
 
 const config = useConfigStore()

components/checkout/Summary.vue

@@ -4,7 +4,7 @@
     :title="$t('orders.summary')"
     :placeholder-height="300"
   >
-    <div class="checkout-summary">
+    <div class="checkout-summary" :class="{ 'checkout-summary--disabled': disabled }">
       <LayoutLoading :active="cart.isProcessing" />
 
       <div v-for="item in cart.items" :key="item.id" class="checkout-summary-item">
@@ -44,14 +44,19 @@
       <hr class="checkout-summary__hr hr" />
 
       <div class="checkout-summary-item">
-        <CheckoutConsents />
+        <CheckoutConsents :disabled="disabled" />
       </div>
 
       <LayoutInfoBox v-if="!isValid && isErrorVisible" type="danger" class="checkout-summary-item">
         {{ shownError }}
       </LayoutInfoBox>
 
-      <LayoutButton variant="primary" class="cart-summary__button" @click="handleClick">
+      <LayoutButton
+        variant="primary"
+        class="cart-summary__button"
+        :disabled="disabled"
+        @click="handleClick"
+      >
         {{ $t('payments.confirmAndPay') }}
       </LayoutButton>
     </div>
@@ -63,7 +68,7 @@ import { useCartStore } from '@/store/cart'
 import { useCheckoutStore } from '~/store/checkout'
 
 const props = defineProps<{
-  disabled: boolean
+  disabled?: boolean
   isValidationError: boolean
 }>()
 
@@ -104,6 +109,10 @@ const handleClick = () => {
   display: flex;
   flex-direction: column;
 
+  &--disabled {
+    color: $gray-color-600;
+  }
+
   &__hr {
     margin-top: 12px;
   }

components/form/Checkbox.vue

@@ -28,12 +28,13 @@ const props = withDefaults(
     name: string
     label?: string
     text?: string
-    modelValue: boolean
+    modelValue?: boolean
     disabled?: boolean
     error?: string
     rules?: string
   }>(),
   {
+    modelValue: false,
     label: '',
     text: '',
     disabled: false,

components/newsletter/Consent.vue

@@ -2,6 +2,7 @@
   <FormCheckbox
     v-show="enabled"
     v-model="value"
+    :disabled="disabled"
     class="newsletter-consent"
     name="newsletter-consent"
   >
@@ -41,6 +42,7 @@ const localePath = useLocalePath()
 
 const props = defineProps<{
   modelValue: boolean
+  disabled?: boolean
 }>()
 
 const emit = defineEmits<{

components/product/page/Attributes.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="product-attributes">
     <template v-if="showDescriptionShortInAttributes">
-      <!-- This is a ***REMOVED*** specific rule, maybe refactor somehow in the future? -->
+      <!-- This is a very specific bussines rule, maybe refactor somehow in the future? -->
       <div class="attributes-description-short" v-html="product.description_short"></div>
 
       <br />

components/product/page/ContactForm.vue

@@ -139,7 +139,7 @@ const constentContent = computed(
 const onSubmit = form.handleSubmit(async () => {
   isLoading.value = true
   try {
-    const recaptchaToken = await getRecaptchaToken(recaptchaPublic)
+    const recaptchaToken = await getRecaptchaToken(recaptchaPublic, 'contact_request')
 
     await axios.post('/api/contact', {
       ...form.values,

lang/en.ts

@@ -144,6 +144,7 @@ export default {
     CLIENT_TFA_REQUIRED: 'To log in, you need to enter the code from the two-factor authorization.',
     CLIENT_TFA_INVALID_TOKEN: 'Invalid two-factor authorization token.',
     CLIENT_NO_ACCESS: 'You do not have access to these resources.',
+    CLIENT_CAPTCHA_FAILED: 'Captcha verification failed.',
 
     ORDER_WITH_THIS_NUMBER_DOESNT_EXIST: 'Order with this number doesnt exist',
     CLIENT_GENERATE_PAYMENT_URL: 'Error while generating payment link.',
@@ -167,6 +168,7 @@ export default {
 
     UNPROCESSABLE_ENTITY: 'Validation error.',
 
+    SERVER_CAPTCHA_ERROR: 'Error while verifying the captcha.',
     NOT_FOUND: 'The specified page was not found.',
     INTERNAL_SERVER_ERROR: 'Internal server error.',
     UNAUTHORIZED: 'Nie posiadasz dostępu do tego miejsca.',

lang/pl.ts

@@ -144,6 +144,7 @@ export default {
     CLIENT_TFA_REQUIRED: 'Do zalogowania potrzebne jest wpisanie kodu z podwójnej autoryzacji.',
     CLIENT_TFA_INVALID_TOKEN: 'Nieprawidłowy token podwójnej autoryzacji.',
     CLIENT_NO_ACCESS: 'Nie posiadasz dostępu do tego miejsca.',
+    CLIENT_CAPTCHA_FAILED: 'Weryfikacja reCAPTCHA nie powiodła się.',
 
     ORDER_WITH_THIS_NUMBER_DOESNT_EXIST: 'Zamówienie o tym numerze nie istnieje',
     CLIENT_GENERATE_PAYMENT_URL: 'Błąd podczas generowania linku do płatności.',
@@ -169,6 +170,7 @@ export default {
 
     UNPROCESSABLE_ENTITY: 'Błąd walidacji.',
 
+    SERVER_CAPTCHA_ERROR: 'Błąd serwera reCAPTCHA.',
     NOT_FOUND: 'Podana strona nie została znaleziona.',
     INTERNAL_SERVER_ERROR: 'Wewnętrzny błąd serwera.',
     UNAUTHORIZED: 'Nie posiadasz dostępu do tego miejsca.',

package.json

@@ -1,6 +1,6 @@
 {
   "name": "store",
-  "version": "2.2.1",
+  "version": "2.3.0",
   "private": true,
   "scripts": {
     "start": "nuxt start",
@@ -19,7 +19,7 @@
   "dependencies": {
     "@directus/sdk": "^10.3.5",
     "@gtm-support/vue-gtm": "^2.2.0",
-    "@heseya/store-core": "6.0.0",
+    "@heseya/store-core": "6.1.0-dev.1",
     "@kyvg/vue3-notification": "^3.2.0",
     "@pinia-plugin-persistedstate/nuxt": "1.2.0",
     "@pinia/nuxt": "^0.5.1",