Enhancement/config

package.json

@@ -16,7 +16,7 @@
     "@vueuse/core": "^13.6.0"
   },
   "devDependencies": {
-    "@nuxt/icon": "^1.15.0",
+    "@nuxt/icon": "^2.0.0",
     "@nuxt/image": "1.11.0",
     "@nuxtjs/i18n": "^9.5.2",
     "@nuxtjs/tailwindcss": "^6.14.0",

woonuxt_base/app/app.config.ts

@@ -1,27 +1,8 @@
+import { defaultConfig } from '../modules/woonuxt-bridge/defaults';
+
 /**
  * App configuration.
  * This file is used to configure the app settings.
  * Below are the default values.
  */
-export default defineAppConfig({
-  siteName: 'WooNuxt',
-  shortDescription: 'This is an example of a WooNuxt store. It provides a modern, fast, and SEO friendly ecommerce store built with Nuxt and WooCommerce.',
-  description: `WooNuxt is unmatched when it comes to performance and scalability. Reap the benefits of having a online store that out performs all of your competitors. You can edit components to display your own information just like the one you're reading now.`,
-  baseUrl: 'https://v3.woonuxt.com',
-  siteImage: 'https://user-images.githubusercontent.com/5116925/218879668-f4c1f9fd-bef4-44b0-bc7f-e87d994aa3a1.png',
-  storeSettings: {
-    autoOpenCart: false,
-    showReviews: true,
-    showFilters: true,
-    showOrderByDropdown: true,
-    showSKU: true,
-    showRelatedProducts: true,
-    showProductCategoriesOnSingleProduct: true,
-    showBreadcrumbOnSingleProduct: true,
-    showMoveToWishlist: true,
-    hideBillingAddressForVirtualProducts: false,
-    initStoreOnUserActionToReduceServerLoad: true,
-    saleBadge: 'percent', // 'percent', 'onSale' or 'hidden'
-    socialLoginsDisplay: 'buttons', // 'buttons' or 'icons'
-  },
-});
+export default defineAppConfig(defaultConfig);

woonuxt_base/app/composables/useFiltering.ts

@@ -6,7 +6,8 @@
 export function useFiltering() {
   const route = useRoute();
   const router = useRouter();
-  const runtimeConfig = useRuntimeConfig(); // Declare a variable for the runtime config and the filter and order functions
+  const appConfig = useAppConfig();
+  const globalAttributes = computed(() => appConfig.globalAttributes || []); // Use centralized config instead of runtime config
   const { updateProductList } = useProducts();
 
   const filterQuery = useState<string>('filter', () => '');
@@ -118,7 +119,7 @@ export function useFiltering() {
       const ratingCondition = starRating.length ? (product?.averageRating || 0) >= parseFloat(starRating[0] as string) : true;
 
       // Product attribute filters
-      const globalProductAttributes = runtimeConfig?.public?.GLOBAL_PRODUCT_ATTRIBUTES?.map((attribute: any) => attribute.slug) || [];
+      const globalProductAttributes = (Array.isArray(globalAttributes.value) ? globalAttributes.value : []).map((attribute: any) => attribute.slug);
       const attributeCondition = globalProductAttributes
         .map((attribute: string) => {
           const attributeValues = getFilter(attribute) || [];

woonuxt_base/app/composables/useHelpers.ts

@@ -4,12 +4,13 @@ import pkg from '../../../woonuxt_base/package.json';
 export function useHelpers() {
   const route = useRoute();
   const runtimeConfig = useRuntimeConfig();
+  const appConfig = useAppConfig();
 
   const isShowingMobileMenu = useState<boolean>('isShowingMobileMenu', () => false);
   const wooNuxtVersionInfo: string = pkg.version || '0.0.0';
-  const productsPerPage: number = runtimeConfig.public?.PRODUCTS_PER_PAGE || 24;
-  const wooNuxtSEO = Array.isArray(runtimeConfig.public?.WOO_NUXT_SEO) ? runtimeConfig.public?.WOO_NUXT_SEO : [];
-  const frontEndUrl = runtimeConfig.public?.FRONT_END_URL?.replace(/\/$/, '') || null;
+  const productsPerPage: number = (appConfig as any).productsPerPage || 24;
+  const wooNuxtSEO = (appConfig as any).wooNuxtSEO || [];
+  const frontEndUrl = (appConfig as any).frontEndUrl?.replace(/\/$/, '') || null;
   const isDev: boolean = process.env.NODE_ENV === 'development';
   const FALLBACK_IMG = '/images/placeholder.jpg';
 

woonuxt_base/app/error.vue

@@ -39,6 +39,8 @@ useSeoMeta({
     <div class="flex flex-col items-center justify-center flex-1 gap-4 min-h-[500px]">
       <h1 class="text-6xl font-bold">Error {{ error?.statusCode || '404' }}</h1>
       <p v-if="error?.message" class="text-lg">{{ error.message }}</p>
+      <p v-else class="text-lg">An unexpected error occurred.</p>
+      <NuxtLink to="/" class="text-primary hover:underline">Go back to Home</NuxtLink>
     </div>
 
     <Transition name="fade">