fix vite v5.0.6 building for production...

transforming...
✓ 54 modules transformed.
rendering chunks...
computing gzip size...
dist/index.html                                        0.83 kB │ gzip:  0.44 kB
dist/assets/Patron-PersonalUse-Regular-VRDUqsgA.otf   13.17 kB
dist/assets/Exodar-Outline-cczeqCpn.ttf              111.62 kB
dist/assets/index-pUH2M1aI.css                        20.04 kB │ gzip:  2.28 kB
dist/assets/index-7B0PKRlB.js                        220.53 kB │ gzip: 81.74 kB
✓ built in 1.03s

Author: brianhorakh

src/App.vue

@@ -1,6 +1,6 @@
 <!-- src/App.vue -->
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
+import { onMounted } from 'vue';
 import CookieBanner from './components/CookieBanner.vue';
 
 import CommandLineInterface from './components/CommandLineInterface.vue';
@@ -9,8 +9,6 @@ import PromptExecutionLogo from './components/PromptExecutionLogo.vue';
 import { useMainStore } from './store';
 const mainStore = useMainStore();
 
-const showBanner = ref(true); // Or whatever logic you need to show/hide the banner
-
 // Example of how you might control the visibility of the banner
 // This is just a placeholder logic, adjust according to your needs
 onMounted(() => {

src/components/CookiePolicy.vue src/components/CookiePolicy.vue.ignoresrc/components/CookiePolicy.vue renamed to src/components/CookiePolicy.vue.ignore

@@ -8,7 +8,7 @@
 </template>
 
 <script lang="ts">
-import { useCookies } from '../useCookies'
+import useCookies from '../useCookies'
 export default {
   setup() {
     const { allowCookies } = useCookies()

src/store.ts

@@ -13,18 +13,18 @@ export const useMainStore = defineStore('main', {
     increment() {
       this.count++
     },
-    setCookieConsent(value) {
+    setCookieConsent(value: 'accepted' | 'rejected') {
       this.cookieConsent = value
       localStorage.setItem('cookieConsent', value)
     },
     resetCookieConsent() {
       this.cookieConsent = null;
       localStorage.removeItem('cookieConsent');
     },
-    toggleLogin(show) {
+    toggleLogin() {
       this.showLogin = !this.showLogin;
       },
-    toggleDebugPanel(show) {
+    toggleDebugPanel() {
       this.showDebugPanel = !this.showDebugPanel;
     }
   },

src/useCookies.ts

@@ -1,35 +1,32 @@
 import { ref, watch, computed } from 'vue';
 import { useCookie } from 'vue-cookie-next';
 
-const allowCookies = ref<boolean>();
 
 export default function useCookies(gtag: any) {
   const cookie = useCookie();
+  const allowCookies = ref<boolean>();
 
-  if (cookie.isCookieAvailable('cookies_consent')) {
-    allowCookies.value = cookie.getCookie('cookies_consent') === 'true';
-    gtag.optIn();
-  } else {
-    allowCookies.value = undefined;
-  }
+  // Initialize allowCookies based on the existing cookie
+  const initCookieConsent = () => {
+    if (cookie.isCookieAvailable('cookies_consent')) {
+      allowCookies.value = cookie.getCookie('cookies_consent') === 'true';
+      if (allowCookies.value) gtag.optIn();
+    }
+  };
+
+  // Call this function on initialization
+  initCookieConsent();
 
-  watch(allowCookies, () => {
-    if (allowCookies.value != undefined) {
-      cookie.setCookie('cookies_consent', allowCookies.value.toString(), {
-        expire: new Date(2022, 1, 1),
+  watch(allowCookies, (newValue) => {
+    if (newValue !== undefined) {
+      cookie.setCookie('cookies_consent', newValue.toString(), {
+        expire: '1Y' // Expires in 1 year, adjust as needed
       });
-      if (allowCookies.value) {
-        gtag.optIn();
-      } else {
-        gtag.optOut();
-      }
+      newValue ? gtag.optIn() : gtag.optOut();
     }
   });
 
-  const showBanner = computed(() => {
-    return allowCookies.value === undefined;
-  });
-
+  const showBanner = computed(() => allowCookies.value === undefined);
   const okClicked = () => (allowCookies.value = true);
 
   return {