diff --git a/components/Cms/Element/CmsElementCategoryNavigation.vue b/components/Cms/Element/CmsElementCategoryNavigation.vue
index 657a5231..d58fb12a 100644
--- a/components/Cms/Element/CmsElementCategoryNavigation.vue
+++ b/components/Cms/Element/CmsElementCategoryNavigation.vue
@@ -26,7 +26,7 @@ const listingStore = useListingStore(route.path === '/search' ? 'search' : 'cate
:to="getCategoryRoute(item)"
class="text-lg"
:class="{ 'font-bold': isActive(item.seoUrls) }"
- @click="listingStore.isLoading = true;"
+ @click="listingStore.isLoading = !isActive(item.seoUrls, true);"
>
{{ getTranslatedProperty(item, 'name') }}
@@ -40,7 +40,7 @@ const listingStore = useListingStore(route.path === '/search' ? 'search' : 'cate
{{ getTranslatedProperty(child, 'name') }}
diff --git a/components/Navigation/NavigationLink.vue b/components/Navigation/NavigationLink.vue
index 7ed6edc6..86e2e5b2 100644
--- a/components/Navigation/NavigationLink.vue
+++ b/components/Navigation/NavigationLink.vue
@@ -59,7 +59,7 @@ const listingStore = useListingStore(route.path === '/search' ? 'search' : 'cate
:format="!isExternalLink"
class="block transition-all hover:text-brand-primary"
:class="[classes, isActive(navigationElement.seoUrls, activeWithExactMatch) ? activeClasses : '']"
- @click="trackNavigation(navigationElement.level ? navigationElement.level - 1 : 0, getTranslatedProperty(navigationElement, 'name')); listingStore.isLoading = true;"
+ @click="trackNavigation(navigationElement.level ? navigationElement.level - 1 : 0, getTranslatedProperty(navigationElement, 'name')); listingStore.isLoading = !isActive(navigationElement.seoUrls, true);"
>
{{ $t('navigation.sidebar.allItems') }}
diff --git a/components/Product/ProductVariantSelection.vue b/components/Product/ProductVariantSelection.vue
index ea52098a..30837bca 100644
--- a/components/Product/ProductVariantSelection.vue
+++ b/components/Product/ProductVariantSelection.vue
@@ -87,11 +87,8 @@ const onVariantChange = async (groupName: string, optionId: string) => {
outer: {
'max-w-full min-w-32 w-full sm:w-fit': true,
},
- inner: {
- 'pr-4': true,
- },
input: {
- 'w-fit': true,
+ 'w-fit mr-2 text-ellipsis': true,
},
}"
:options="entityArrayToOptions(group.options.sort((a: Schemas['PropertyGroupOption'], b: Schemas['PropertyGroupOption']) => (a.position ?? 999) - (b.position ?? 999)), 'name', false) ?? []"
diff --git a/composables/useActivePath.ts b/composables/useActivePath.ts
index 05a23635..d8254de6 100644
--- a/composables/useActivePath.ts
+++ b/composables/useActivePath.ts
@@ -2,11 +2,14 @@ import { useRoute } from 'vue-router';
import type { Schemas } from '@shopware/api-client/api-types';
export const useActivePath = () => {
+ // useRoute needs to be called here and not inside the function to prevent loss of context when calling the function outside the initial rendering process
+ const route = useRoute();
+
const isActive = (path: Schemas['SeoUrl'][] | undefined, onlyExactMatch: boolean = false) => {
if (!path) return false;
const formattedPath = `/${path[0]?.seoPathInfo}`;
- const { path: currentPath } = useRoute();
+ const currentPath = route.path;
return onlyExactMatch ? formattedPath === currentPath : currentPath.includes(formattedPath);
};
diff --git a/package.json b/package.json
index 8d714dd2..bdb82739 100755
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
"name": "@basecom-gmbh/pond",
"type": "module",
"main": "./nuxt.config.ts",
- "version": "0.1.8",
+ "version": "0.1.9",
"scripts": {
"build": "nuxt build",
"dev": "nuxt dev",