From 822c61b9823048e9f2fe1e629d418b35ab05c9c3 Mon Sep 17 00:00:00 2001
From: rakesh <inaniyar7@gmail.com>
Date: Wed, 19 Apr 2023 11:53:53 +0530
Subject: [PATCH] fixes ui in vue3

---
 .env.custom                                   |   8 +-
 .env.development                              |   4 +-
 .env.production                               |  13 +-
 index.html                                    |  84 ++++
 package.json                                  |   3 +-
 public/index.html                             |   5 +-
 src/App.vue                                   |   1 -
 src/components/common/ConfirmationDialog.vue  |  12 +-
 src/components/common/SubscriptionDialog.vue  |   6 +-
 src/components/gate/GateLayout.vue            |   6 +-
 src/components/layout/Layout.vue              |  12 +-
 src/components/layout/NavigationBar.vue       |   2 +-
 .../layout/footer/FooterComponent.vue         |   4 +-
 src/components/layout/header/Header.vue       |  34 +-
 .../header/NavigationDrawerComponent.vue      |   4 +-
 .../layout/hero-image/HeroContainer.vue       |   4 +-
 .../retailer/cart-product/CartProductList.vue |   8 +-
 .../category/CategoryBaseProducts.vue         |  22 +-
 .../retailer/category/CategoryHeroContent.vue |  22 +-
 .../gift-guide/GiftGuideComponent.vue         |   4 +-
 .../retailer/home/HomeComponent.vue           |   4 +-
 .../retailer/home/PostScriptBlog.vue          |   4 +-
 src/components/retailer/layout/Layout.vue     |   8 +-
 .../retailer/layout/NavigationBar.vue         |   2 +-
 .../retailer/layout/header/Header.vue         |  10 +-
 .../ConfiguredProductDetailComponent.vue      |   8 +-
 .../GiftCardDetailsComponent.vue              |   6 +-
 .../product-detail/ProductDetailComponent.vue |   8 +-
 .../RecentlyViewedComponent.vue               |  16 +-
 .../RelatedProductsComponent.vue              |  16 +-
 .../RetailerSearchProducts.vue                |  12 +-
 .../retailer/search/SearchProducts.vue        |  18 +-
 .../ShippingAndDeliveryComponent.vue          |   2 +-
 src/main.js                                   |  44 +-
 src/multipages/gate.routes.js                 |   7 +-
 src/multipages/index.js                       |  24 +-
 src/multipages/retailer.routes.js             |   7 +-
 src/plugins/vuetify.js                        |  19 -
 src/plugins/vuetify/defaults.js               | 119 +++++
 src/plugins/vuetify/index.js                  |  15 +
 src/plugins/vuetify/theme.js                  |  58 +++
 src/routes/gate/signin.vue                    |   2 +-
 src/routes/retailer/address_book.vue          |  20 +-
 src/routes/retailer/cart_products.vue         |  10 +-
 src/routes/retailer/category_page.vue         |   8 +-
 src/routes/retailer/checkout_page.vue         |  16 +-
 src/routes/retailer/edit_account_info.vue     |   2 +-
 src/routes/retailer/maintenance.vue           |   4 +-
 src/routes/retailer/my_orders.vue             |   6 +-
 src/routes/retailer/order_success.vue         |   4 +-
 src/routes/retailer/product_page.vue          |  18 +-
 src/routes/retailer/route_not_found.vue       |   4 +-
 src/routes/retailer/search_page.vue           |   8 +-
 src/services/auth.js                          |  19 +-
 src/services/block.service.js                 |   2 +-
 src/services/gate.service.js                  |   2 +-
 src/services/image.service.js                 |   4 +-
 src/services/nav.js                           |  28 +-
 src/services/product.service.js               |  12 +-
 src/services/registration.service.js          |   4 +-
 src/services/search.service.js                |  10 +-
 src/services/user.service.js                  |  10 +-
 src/services/user_cart.service.js             |  29 +-
 src/services/util.service.js                  |   5 +-
 src/stores/index.js                           |  15 +-
 src/stores/retailer/account.one.js            |  15 +-
 src/stores/retailer/product.list.js           |  27 +-
 src/stores/retailer/user_cart.one.js          |  19 -
 src/styles/_app.scss                          |   3 -
 src/styles/custom_functions.scss              |  11 -
 src/styles/overrides.scss                     | 436 ------------------
 src/styles/variables1.scss                    |   5 -
 vue.config.js => vite.config.js               |   6 +-
 yarn.lock                                     | 138 +++++-
 74 files changed, 707 insertions(+), 860 deletions(-)
 create mode 100644 index.html
 delete mode 100644 src/plugins/vuetify.js
 create mode 100644 src/plugins/vuetify/defaults.js
 create mode 100644 src/plugins/vuetify/index.js
 create mode 100644 src/plugins/vuetify/theme.js
 delete mode 100644 src/styles/_app.scss
 delete mode 100644 src/styles/custom_functions.scss
 delete mode 100644 src/styles/overrides.scss
 delete mode 100644 src/styles/variables1.scss
 rename vue.config.js => vite.config.js (97%)

diff --git a/.env.custom b/.env.custom
index a564fbb..023cc35 100644
--- a/.env.custom
+++ b/.env.custom
@@ -18,4 +18,10 @@ VITE_APP_IMAGE_CATEGORY_PARAMS=?height=600&width=600
 VITE_APP_IMAGE_LIB_URL=https://imagelib-api.crane.com
 VITE_APP_CRANE_ORDER_URL=https://order.crane.com
 VITE_APP_BASE_URL=https://www.crane.com
-VITE_APP_RP_AUTH_NAME=rp_auth_stg
\ No newline at end of file
+VITE_APP_RP_AUTH_NAME=rp_auth_stg
+
+VITE_ACCESS_KEY_ID=AKIAsXBHFRMEXHWQCPJGN
+VITE_SECRET_ACCESS_KEY=MPsiVn466VRgFKDLIm//Ys9/2GH/xgMvSjGecr4el
+VITE_S3_REGION=us-east-1
+VITE_S3_BUCKET=retailer-edge-daily-website-bucket
+VITE_CLOUDFRONT_ID=E1NGW2VX0JV40Ws
\ No newline at end of file
diff --git a/.env.development b/.env.development
index 407b199..26f3733 100644
--- a/.env.development
+++ b/.env.development
@@ -27,5 +27,5 @@ VITE_APP_RP_AUTH_NAME=rp_auth_stg
 VITE_ACCESS_KEY_ID=AKIAsXBHFRMEXHWQCPJGN
 VITE_SECRET_ACCESS_KEY=MPsiVn466VRgFKDLIm//Ys9/2GH/xgMvSjGecr4el
 VITE_S3_REGION=us-east-1
-VITE_S3_BUCKET=assets-edge-daily-website-bucket
-VITE_CLOUDFRONT_ID=EJ6BUC5VUXA6Z
\ No newline at end of file
+VITE_S3_BUCKET=retailer-edge-daily-website-bucket
+VITE_CLOUDFRONT_ID=E1NGW2VX0JV40W
\ No newline at end of file
diff --git a/.env.production b/.env.production
index a9c8c0e..29d29e5 100644
--- a/.env.production
+++ b/.env.production
@@ -16,11 +16,14 @@ VITE_APP_MAINTENANCE_MODE=false
 VITE_APP_MAINTENANCE_PAGE_URL=/maintenance
 VITE_APP_IMAGE_CATEGORY_PARAMS=?height=600&width=600
 VITE_APP_CRANE_ORDER_URL=https://ordertest.crane.com
-
-DEPLOY_S3_REGION=us-east-1
-DEPLOY_S3_BUCKET=retailer-edge-production-website-bucket
-DEPLOY_CLOUDFRONT_ID=E1WSOW180GVD3S
+ 
 VITE_APP_ASSETS_NODESLS_URL=https://assets-sls.crane.com
 VITE_APP_IMAGE_LIB_URL=https://imagelib-api.crane.com
 VITE_APP_BASE_URL=https://retailer.crane.com
-VITE_APP_RP_AUTH_NAME=rp_auth_prod
\ No newline at end of file
+VITE_APP_RP_AUTH_NAME=rp_auth_prod
+
+VITE_ACCESS_KEY_ID=AKIAsXBHFRMEXHWQCPJGN
+VITE_SECRET_ACCESS_KEY=MPsiVn466VRgFKDLIm//Ys9/2GH/xgMvSjGecr4el
+VITE_S3_REGION=us-east-1
+VITE_S3_BUCKET=retailer-edge-daily-website-bucket
+VITE_CLOUDFRONT_ID=E1NGW2VX0JV40W
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..6ac74e2
--- /dev/null
+++ b/index.html
@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="utf-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
+    <meta http-equiv="cache-control" content="max-age=0" />
+    <meta http-equiv="cache-control" content="no-cache" />
+    <meta http-equiv="expires" content="-1" />
+    <meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT" />
+    <meta http-equiv="pragma" content="no-cache" />
+    <!-- <link rel="icon" href="<%= BASE_URL %>favicon.ico"> -->
+    <title>Crane Stationery</title>
+    <link rel="preload" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'">
+    <link rel="preload"  href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
+</head>
+
+<body>
+    <!-- <img src="https://fp.listrakbi.com/fp/yJ3fjhPTdCKx.jpg" height="1" width="1" hidden /> -->
+    <noscript>
+        <strong>We're sorry but my_vuetify doesn't work properly without JavaScript enabled. Please enable it to
+            continue.</strong>
+    </noscript>
+    <div id="app"></div>
+    <script type="module" src="/src/main.js"></script>
+ 
+    <script type="module" src="/static/js/magentoCmsCache.js"></script>
+    <script type="module" src="/static/js/craneRetailerCatalog.js"></script>    
+
+    <script>
+        // if (location.hash) {
+        //   history.pushState({}, "Application entry", location.hash.substring(2))
+        // };
+
+        // if (location.hash) {
+        //   console.log("url change to :",location.hash.substring(2)+window.location.search)
+        //   history.pushState({}, "Application entry", location.hash.substring(2)+window.location.search)
+        // };
+    </script>
+    <!-- built files will be auto injected -->
+
+    <!-- Listrak Analytics – Javascript Framework -->
+   <!-- <script type="text/javascript">
+        var biJsHost = (("https:" == document.location.protocol) ? "https://" : "http://");
+        (function (d, s, id, tid, vid) {
+            var js, ljs = d.getElementsByTagName(s)[0];
+            if (d.getElementById(id)) return;
+            js = d.createElement(s);
+            js.id = id;
+            js.src = biJsHost + "cdn.listrakbi.com/scripts/script.js?m=" + tid + "&v=" + vid;
+            ljs.parentNode.insertBefore(js, ljs);
+        })(document, 'script', 'ltkSDK', 'yJ3fjhPTdCKx', '1');
+    </script>-->
+    <!--START Pepperjam CODE-->
+    <!--<script>
+        (function () {
+            var a = document.createElement("script");
+            a.type = "text/javascript", a.async = !0, a.src = "//container.pepperjam.com/4135755510.js";
+            var b = document.getElementsByTagName("head")[0];
+            if (b) b.appendChild(a, b);
+            else {
+                var b = document.getElementsByTagName("script")[0];
+                b.parentNode.insertBefore(a, b)
+            }
+        })();
+    </script>-->
+    <!--END Pepperjam CODE-->
+    <!-- Criteo Homepage Tag -->
+    <!--<script type="text/javascript" src="//static.criteo.net/js/ld/ld.js" async="true"></script>
+    <script type="text/javascript">
+        window.criteo_q = window.criteo_q || [];
+        var deviceType = /iPad/.test(navigator.userAgent) ? "t" : /Mobile|iP(hone|od)|Android|BlackBerry|IEMobile|Silk/.test(navigator.userAgent) ? "m" : "d";
+        window.criteo_q.push(
+            { event: "setAccount", account: 51127 }, // You should never update this line
+         //   { event: "setEmail", email: "" }, // Can be an empty string
+            { event: "setSiteType", type: deviceType },
+         //   { event: "viewHome" }
+        );
+    </script>-->
+    <!-- END Criteo Home Page Tag -->
+</body>
+
+</html>
\ No newline at end of file
diff --git a/package.json b/package.json
index f0b8332..77e891f 100644
--- a/package.json
+++ b/package.json
@@ -4,8 +4,7 @@
     "private": true,
     "scripts": {
         "serve": "vite serve  --port 8092",
-
-        "serve:daily": "NODE_ENV=staging vite  --mode development --port 8092",
+        "serve:daily": "vite --mode daily --port 8092",
         "serve:custom": "vite serve --mode custom --port 8092",
         "serve:development": "vite serve --mode development --port 8092",
         "serve:staging": "vite serve --mode staging --port 8092",
diff --git a/public/index.html b/public/index.html
index ef41e08..6ac74e2 100644
--- a/public/index.html
+++ b/public/index.html
@@ -24,8 +24,9 @@
     </noscript>
     <div id="app"></div>
     <script type="module" src="/src/main.js"></script>
-    <script src="/static/js/magentoCmsCache.js"></script>
-    <script src="/static/js/craneRetailerCatalog.js"></script>    
+ 
+    <script type="module" src="/static/js/magentoCmsCache.js"></script>
+    <script type="module" src="/static/js/craneRetailerCatalog.js"></script>    
 
     <script>
         // if (location.hash) {
diff --git a/src/App.vue b/src/App.vue
index 9a39656..c1e2161 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -23,6 +23,5 @@ export default {
  
 };
 </script>
- <style src="@/styles/_app.scss" lang="scss" /> 
 
 
diff --git a/src/components/common/ConfirmationDialog.vue b/src/components/common/ConfirmationDialog.vue
index 9939a94..fd78025 100644
--- a/src/components/common/ConfirmationDialog.vue
+++ b/src/components/common/ConfirmationDialog.vue
@@ -1,7 +1,7 @@
 <template>
   <v-container class="py-0 my-0">
     <v-dialog
-      v-model="confirmationDialog"
+      v-model="confirmationDialogKey"
       origin="left top"
       hide-overlay
       persistent
@@ -59,11 +59,13 @@
 </template>
 <script>
 export default {
-  name: "ConfirmationDialog",
+  name: "ConfirmationDialogForm",
   props: ["confirmationDialog", "confirmationDetails"],
-  data: () => ({
-    //confirmationDialog:false
-  }),
+  data() {
+    return {
+      confirmationDialogKey:this.confirmationDialog
+    };
+  },
   components: {},
   computed: {},
   methods: {
diff --git a/src/components/common/SubscriptionDialog.vue b/src/components/common/SubscriptionDialog.vue
index 486168c..bb7844c 100644
--- a/src/components/common/SubscriptionDialog.vue
+++ b/src/components/common/SubscriptionDialog.vue
@@ -2,7 +2,7 @@
   <v-container class="py-0 my-0">
     <v-dialog
       v-model="subscriptionDialog"
-      :max-width="$vuetify.breakpoint.xlOnly?1100:800"
+      :max-width="$vuetify.display.xlOnly?1100:800"
       :scrollable="false"
       :overlay-opacity="0.5"
     >
@@ -120,7 +120,7 @@
 </template>
 <script>
 /*eslint-disable*/
-import SnackbarComponent from "@/components/common/SnackbarComponent";
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
 export default {
   name: "SubscriptionDialog",
   data: () => ({
@@ -142,7 +142,7 @@ export default {
   components: { SnackbarComponent },
   computed: {
     isDesktop: function () {
-      return this.$vuetify.breakpoint.xsOnly ? false : true;
+      return this.$vuetify.display.xsOnly ? false : true;
     },
   },
   methods: {
diff --git a/src/components/gate/GateLayout.vue b/src/components/gate/GateLayout.vue
index 47e0a2b..e725967 100644
--- a/src/components/gate/GateLayout.vue
+++ b/src/components/gate/GateLayout.vue
@@ -97,7 +97,7 @@
   </div>
 </template>
 <script>
-import Header from "@/components/layout/header/Header";
+import Header from "@/components/layout/header/Header.vue";
 import {
   customAttributeValueNew,
   getCategoryOne,
@@ -159,7 +159,7 @@ export default {
       };
     },
     isDesktop: function () {
-      return this.$vuetify.breakpoint.xsOnly ? true : false;
+      return this.$vuetify.display.xsOnly ? true : false;
     },
     userAuth: function () {
       return this.$store.state.auth.userAuth;
@@ -185,7 +185,7 @@ export default {
   methods: {
     OnResize() {
       setTimeout(() => {
-        if (this.$vuetify.breakpoint.mdAndUp) {
+        if (this.$vuetify.display.mdAndUp) {
           this.showMenu = false;
         }
       }, 200);
diff --git a/src/components/layout/Layout.vue b/src/components/layout/Layout.vue
index 8eb51bc..4ff4167 100644
--- a/src/components/layout/Layout.vue
+++ b/src/components/layout/Layout.vue
@@ -263,14 +263,14 @@
 </template>
 
 <script>
-import * as easings from "vuetify/es5/services/goto/easing-patterns";
-import Header from "@/components/layout/header/Header";
+//import * as easings from "vuetify/es5/services/goto/easing-patterns";
+import Header from "@/components/layout/header/Header.vue";
 import {
   customAttributeValue,
   goToCategoryPageRouting,
   getCategoryOne,
 } from "@/services/util.service";
-import HeroContainer from "@/components/layout/hero-image/HeroContainer";
+import HeroContainer from "@/components/layout/hero-image/HeroContainer.vue";
 import { doFetchCatelogProducts } from "@/services/product.service";
 import humps from "lodash-humps";
 import { createHelpers } from "vuex-map-fields";
@@ -291,7 +291,7 @@ export default {
     lookupCatelog: null,
     searchInProgress: false,
     easing: "easeInOutCubic",
-    easings: Object.keys(easings),
+   // easings: Object.keys(easings),
     selector: "#scroll-with-options",
     duration: 100,
     activeMainMenu: "",
@@ -352,7 +352,7 @@ export default {
       };
     },
     isDesktop: function () {
-      return this.$vuetify.breakpoint.xsOnly ? true : false;
+      return this.$vuetify.display.xsOnly ? true : false;
     },
     ...mapFields(["user", "user.userVisits"]),
 
@@ -475,7 +475,7 @@ export default {
     },
     OnResize() {
       setTimeout(() => {
-        if (this.$vuetify.breakpoint.mdAndUp) {
+        if (this.$vuetify.display.mdAndUp) {
           this.showMenu = false;
         }
       }, 200);
diff --git a/src/components/layout/NavigationBar.vue b/src/components/layout/NavigationBar.vue
index 8b46245..c5500cb 100644
--- a/src/components/layout/NavigationBar.vue
+++ b/src/components/layout/NavigationBar.vue
@@ -1,5 +1,5 @@
     <template>
-  <v-navigation-drawer v-model="showMenuBar" v-if="showMenuBar" app :clipped="$vuetify.breakpoint.mdAndUp">
+  <v-navigation-drawer v-model="showMenuBar" v-if="showMenuBar" app :clipped="$vuetify.display.mdAndUp">
     <v-list dense>
       <v-list-item link>
         <v-list-item-action>
diff --git a/src/components/layout/footer/FooterComponent.vue b/src/components/layout/footer/FooterComponent.vue
index fb4471e..ff3d8d5 100644
--- a/src/components/layout/footer/FooterComponent.vue
+++ b/src/components/layout/footer/FooterComponent.vue
@@ -116,8 +116,8 @@
 </template>
 
 <script>
-import SnackbarComponent from "@/components/common/SnackbarComponent";
-import SubscriptionDialog from "@/components/common/SubscriptionDialog";
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
+import SubscriptionDialog from "@/components/common/SubscriptionDialog.vue";
 //import { listrakSubscribe } from "@/services/util.service";
 export default {
   name: "FooterComponent",
diff --git a/src/components/layout/header/Header.vue b/src/components/layout/header/Header.vue
index 1bc13a7..75a0967 100644
--- a/src/components/layout/header/Header.vue
+++ b/src/components/layout/header/Header.vue
@@ -41,7 +41,7 @@
               v-on="on"
               :class="textColor"
               class="d-none d-md-block header-buttons"
-              :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+              :max-width="$vuetify.display.mdOnly ? '35px' : ''"
             >
               <div class="text-uppercase">Hi {{ userName }}</div>
             </v-btn>
@@ -69,7 +69,7 @@
             icon
             @click="goToLogin()"
             class="d-none d-md-block header-buttons"
-            :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+            :max-width="$vuetify.display.mdOnly ? '35px' : ''"
           >
             <v-icon
               v-if="pageName() == 'CategoryPage'"
@@ -90,7 +90,7 @@
             "
             @click="showSearchInput = true"
             class="d-none d-md-block header-buttons"
-            :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+            :max-width="$vuetify.display.mdOnly ? '35px' : ''"
           >
             <v-icon
               v-if="pageName() == 'CategoryPage'"
@@ -173,7 +173,7 @@
           :class="textColor"
           class="header-buttons"
           @click="categoryProducts('10')"
-          :max-width="this.$vuetify.breakpoint.mdOnly? '35px':''"
+          :max-width="this.$vuetify.display.mdOnly? '35px':''"
         >
           <v-icon class="white--text">mdi-shopping-outline</v-icon>
         </v-btn>-->
@@ -185,7 +185,7 @@
             "
             class="header-buttons"
             @click.stop="showCartDrawer(true)"
-            :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+            :max-width="$vuetify.display.mdOnly ? '35px' : ''"
           >
             <v-icon
               v-if="pageName() == 'CategoryPage'"
@@ -463,7 +463,7 @@
                       : ''
                   "
                   class="d-none d-md-block header-buttons mr-6"
-                  :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+                  :max-width="$vuetify.display.mdOnly ? '35px' : ''"
                 >
                   <div class="text-uppercase">Hi {{ userName }}</div>
                 </v-btn>
@@ -496,7 +496,7 @@
               @click="goToLogin()"
               :class="textColor"
               class="d-none d-md-block header-buttons"
-              :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+              :max-width="$vuetify.display.mdOnly ? '35px' : ''"
             >
               <v-icon class="header-action-icons"
                 >mdi-account-circle-outline</v-icon
@@ -511,7 +511,7 @@
               @click="showSearchInput = true"
               :class="textColor"
               class="d-none d-md-block header-buttons"
-              :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+              :max-width="$vuetify.display.mdOnly ? '35px' : ''"
             >
               <v-icon class="header-action-icons">mdi-magnify</v-icon>
             </v-btn>
@@ -522,7 +522,7 @@
             :class="textColor"
             class="header-buttons"
             @click="categoryProducts('10')"
-            :max-width="this.$vuetify.breakpoint.mdOnly? '35px':''"
+            :max-width="this.$vuetify.display.mdOnly? '35px':''"
           >
             <v-icon>mdi-shopping-outline</v-icon>
             </v-btn>-->
@@ -536,7 +536,7 @@
                 "
                 class="header-buttons mr-n2"
                 @click.stop="showCartDrawer(true)"
-                :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+                :max-width="$vuetify.display.mdOnly ? '35px' : ''"
               >
                 <v-icon class="header-action-icons">mdi-cart-outline</v-icon>
 
@@ -638,11 +638,11 @@
 <script>
 /* eslint-disable */
 
-import SubMenu from "@/components/layout/sub-menu/SubMenu";
-import NavigationDrawerComponent from "@/components/layout/header/NavigationDrawerComponent";
-import SnackbarComponent from "@/components/common/SnackbarComponent";
+import SubMenu from "@/components/layout/sub-menu/SubMenu.vue";
+import NavigationDrawerComponent from "@/components/layout/header/NavigationDrawerComponent.vue";
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
 import { doFetchCatelogProducts } from "@/services/product.service";
-import HeaderPromoBanner from "@/components/layout/header/HeaderPromoBanner";
+import HeaderPromoBanner from "@/components/layout/header/HeaderPromoBanner.vue";
 import {
   customAttributeValueNew,
 //  googleAanalyticsEventCategory,
@@ -744,18 +744,18 @@ export default {
       }
     },
     isDesktop: function () {
-      return this.$vuetify.breakpoint.xsOnly ? true : false;
+      return this.$vuetify.display.xsOnly ? true : false;
     },
 
     newUser() {
-      if (this.$vuetify.breakpoint.smAndDown) return false;
+      if (this.$vuetify.display.smAndDown) return false;
       let userVisits = this.$store.state.layout.user.userVisits;
       if (userVisits && Number(userVisits) > 1) return false;
       else return true;
     },
 
     searchInputWidth() {
-      return this.$vuetify.breakpoint.xsOnly ? "100%" : "256";
+      return this.$vuetify.display.xsOnly ? "100%" : "256";
     },
     isScrolled: function () {
       let pagePath = this.$route.path;
diff --git a/src/components/layout/header/NavigationDrawerComponent.vue b/src/components/layout/header/NavigationDrawerComponent.vue
index cfaec8a..b287bf1 100644
--- a/src/components/layout/header/NavigationDrawerComponent.vue
+++ b/src/components/layout/header/NavigationDrawerComponent.vue
@@ -104,7 +104,7 @@
 </template>
 
 <script>
-import CartProductList from "@/components/retailer/cart-product/CartProductList";
+import CartProductList from "@/components/retailer/cart-product/CartProductList.vue";
 import {  priceFormatter } from "@/services/util.service";
 export default {
   name: "NavigationDrawerComponent",
@@ -120,7 +120,7 @@ export default {
   }),
   computed: {
     isDesktop: function() {
-      return this.$vuetify.breakpoint.xsOnly ? true : false;
+      return this.$vuetify.display.xsOnly ? true : false;
     },
     productListWidth() {
       return window.innerHeight;
diff --git a/src/components/layout/hero-image/HeroContainer.vue b/src/components/layout/hero-image/HeroContainer.vue
index 7d60c57..ac73cd2 100644
--- a/src/components/layout/hero-image/HeroContainer.vue
+++ b/src/components/layout/hero-image/HeroContainer.vue
@@ -339,7 +339,7 @@ export default {
   },
   methods: {
     initialLink() {
-      return process.env.VUE_APP_HOME_PAGE_URL;
+      return import.meta.env.VITE_APP_HOME_PAGE_URL;
     },
     async goToPage(main,sub,child,categoryId) {
        let categoryOne = await getCategoryOne(
@@ -351,7 +351,7 @@ export default {
     
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PATH_URL;
     },
     getBlockId() {
       if (this.pageName() == "FaqPage") {
diff --git a/src/components/retailer/cart-product/CartProductList.vue b/src/components/retailer/cart-product/CartProductList.vue
index da0dfbd..8f99b0c 100644
--- a/src/components/retailer/cart-product/CartProductList.vue
+++ b/src/components/retailer/cart-product/CartProductList.vue
@@ -540,8 +540,8 @@
 <script>
 //import { getAuthUser } from "@/services/auth";
 /* eslint-disable */
-const personlizeUrl = process.env.VUE_APP_PERSONALIZE_URL;
-const retailorId = process.env.VUE_APP_RETAILOR_ID;
+const personlizeUrl = import.meta.env.VITE_APP_PERSONALIZE_URL;
+const retailorId = import.meta.env.VITE_APP_RETAILOR_ID;
 import {
   getLable,
   customAttributeValue,
@@ -549,7 +549,7 @@ import {
   checkPromotion,
  // googleAanalyticsEventRemoveCart
 } from "@/services/util.service";
-import ConfirmationDialog from "@/components/common/ConfirmationDialog";
+import ConfirmationDialog from "@/components/common/ConfirmationDialog.vue";
 import { doFetchProductTags } from "@/services/product.service";
 import { removeCookieByName} from "@/services/auth";
 
@@ -594,7 +594,7 @@ export default {
       }
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     userAuth: function () {
       return this.$store.state.auth.userAuth;
diff --git a/src/components/retailer/category/CategoryBaseProducts.vue b/src/components/retailer/category/CategoryBaseProducts.vue
index cd5ece2..f7e578c 100644
--- a/src/components/retailer/category/CategoryBaseProducts.vue
+++ b/src/components/retailer/category/CategoryBaseProducts.vue
@@ -569,7 +569,7 @@ import * as easings from "vuetify/es5/services/goto/easing-patterns";
 import { createHelpers } from "vuex-map-fields";
 import { mapState } from "vuex";
 import FilterComponent from "../filter/FilterComponent";
-import BreadcrumbComponent from "@/components/retailer/breadcrumb/Breadcrumb";
+import BreadcrumbComponent from "@/components/retailer/breadcrumb/Breadcrumb.vue";
 import {
   attribute,
   customAttributeValue,
@@ -611,12 +611,12 @@ export default {
       };
     },
     isIpad: function () {
-      return this.$vuetify.breakpoint.smOnly || this.$vuetify.breakpoint.mdOnly
+      return this.$vuetify.display.smOnly || this.$vuetify.display.mdOnly
         ? true
         : false;
     },
     isIpadOrMobile: function () {
-      return this.$vuetify.breakpoint.mdAndDown ? true : false;
+      return this.$vuetify.display.mdAndDown ? true : false;
     },
     categoryListIdWise: function () {
       return this.$store.state.headerCategoryList.categoryListIdWise;
@@ -640,10 +640,10 @@ export default {
       return this.$store.state.productList.attributeList;
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     imageBaseParams() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PARAMS;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PARAMS;
     },
     /* totalProducts() {
       return this.$store.state.productList.sideBarFilterDetails.totalCount;
@@ -676,17 +676,17 @@ export default {
       return this.$store.state.layout.heroContent;
     },
     getImageHeight() {
-      if (this.$vuetify.breakpoint.lgAndUp) {
+      if (this.$vuetify.display.lgAndUp) {
         return "454";
-      } else if (this.$vuetify.breakpoint.mdOnly) {
+      } else if (this.$vuetify.display.mdOnly) {
         return "406";
-      } else if (this.$vuetify.breakpoint.smOnly) {
+      } else if (this.$vuetify.display.smOnly) {
         return "300";
       }
       return "454";
     },
     newUser() {
-      if (this.$vuetify.breakpoint.smAndDown) return false;
+      if (this.$vuetify.display.smAndDown) return false;
       let userVisits = this.$store.state.layout.user.userVisits;
       if (userVisits && Number(userVisits) > 1) return false;
       else return true;
@@ -812,7 +812,7 @@ export default {
       this.closeFilterMenu = true;
     },
     categoryImageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PATH_URL;
     },
     getCustomAttributeValue(customAttributes, attributeCode) {
       return customAttributeValue(customAttributes, attributeCode);
@@ -914,7 +914,7 @@ export default {
     },
     OnResize() {
       setTimeout(() => {
-        if (this.$vuetify.breakpoint.lgAndUp) {
+        if (this.$vuetify.display.lgAndUp) {
           this.showDrawarFilter = false;
         }
       }, 200);
diff --git a/src/components/retailer/category/CategoryHeroContent.vue b/src/components/retailer/category/CategoryHeroContent.vue
index a7f967a..b056e5f 100644
--- a/src/components/retailer/category/CategoryHeroContent.vue
+++ b/src/components/retailer/category/CategoryHeroContent.vue
@@ -159,22 +159,20 @@
 </template>
 <script>
 /* eslint-disable no-alert, no-console ,  no-debugger */
-//import BreadcrumbComponent from "@/components/retailer/breadcrumb/Breadcrumb";
-import { attribute, customAttributeValueNew } from "@/services/util.service";
+ import { attribute, customAttributeValueNew } from "@/services/util.service";
 export default {
   name: "CategoryHeroContentComponent",
   components: {
-    // BreadcrumbComponent
   },
   props: ["breadcrumbData", "categoryContent"],
   computed: {
     isIpad: function() {
-      return this.$vuetify.breakpoint.smOnly || this.$vuetify.breakpoint.mdOnly
+      return this.$vuetify.display.smOnly || this.$vuetify.display.mdOnly
         ? true
         : false;
     },
     isIpadOrMobile: function() {
-      return this.$vuetify.breakpoint.mdAndDown ? true : false;
+      return this.$vuetify.display.mdAndDown ? true : false;
     },
     categoryListIdWise: function() {
       return this.$store.state.headerCategoryList.categoryListIdWise;
@@ -183,27 +181,27 @@ export default {
       return this.$store.state.productList.attributeList;
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     imageBaseParams() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PARAMS;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PARAMS;
     },
 
     heroContent() {
       return this.$store.state.layout.heroContent;
     },
     getImageHeight() {
-      if (this.$vuetify.breakpoint.lgAndUp) {
+      if (this.$vuetify.display.lgAndUp) {
         return "454";
-      } else if (this.$vuetify.breakpoint.mdOnly) {
+      } else if (this.$vuetify.display.mdOnly) {
         return "406";
-      } else if (this.$vuetify.breakpoint.smOnly) {
+      } else if (this.$vuetify.display.smOnly) {
         return "300";
       }
       return "454";
     },
     newUser() {
-      if (this.$vuetify.breakpoint.smAndDown) return false;
+      if (this.$vuetify.display.smAndDown) return false;
       let userVisits = this.$store.state.layout.user.userVisits;
       if (userVisits && Number(userVisits) > 1) return false;
       else return true;
@@ -222,7 +220,7 @@ export default {
     },
 
     categoryImageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PATH_URL;
     },
     getCustomAttributeValue(customAttributes, attributeCode) {
       return customAttributeValueNew(customAttributes, attributeCode);
diff --git a/src/components/retailer/gift-guide/GiftGuideComponent.vue b/src/components/retailer/gift-guide/GiftGuideComponent.vue
index 511aeb0..d00a875 100644
--- a/src/components/retailer/gift-guide/GiftGuideComponent.vue
+++ b/src/components/retailer/gift-guide/GiftGuideComponent.vue
@@ -84,7 +84,7 @@ export default {
       }
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PATH_URL;
     },
     getBlockContent() {
       if (this.callOutsBlock.length) {
@@ -132,7 +132,7 @@ export default {
         });
     },
     initialLink() {
-      return process.env.VUE_APP_HOME_PAGE_URL;
+      return import.meta.env.VITE_APP_HOME_PAGE_URL;
     },
     async goToPage(main, sub, child, categoryId) {
       let categoryOne = await getCategoryOne(
diff --git a/src/components/retailer/home/HomeComponent.vue b/src/components/retailer/home/HomeComponent.vue
index bcc1dab..29e7d16 100644
--- a/src/components/retailer/home/HomeComponent.vue
+++ b/src/components/retailer/home/HomeComponent.vue
@@ -87,7 +87,7 @@ export default {
       }
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PATH_URL;
     },
     getBlockContent() {
       if (this.callOutsBlock.length) {
@@ -135,7 +135,7 @@ export default {
         });
     },
     initialLink() {
-      return process.env.VUE_APP_HOME_PAGE_URL;
+      return import.meta.env.VITE_APP_HOME_PAGE_URL;
     },
    /* async goToPage(main, sub, child, categoryId) {
       let categoryOne = await getCategoryOne(
diff --git a/src/components/retailer/home/PostScriptBlog.vue b/src/components/retailer/home/PostScriptBlog.vue
index be6eb87..433a707 100644
--- a/src/components/retailer/home/PostScriptBlog.vue
+++ b/src/components/retailer/home/PostScriptBlog.vue
@@ -8,7 +8,7 @@ export default {
   name: "PostScriptBlog",
   computed: {
       homeBaseUrl() {
-      return process.env.VUE_APP_HOME_PAGE_URL;
+      return import.meta.env.VITE_APP_HOME_PAGE_URL;
     },
      postScriptContent: function() {
       return this.$store.state.layout.cmsBlockContent;
@@ -16,7 +16,7 @@ export default {
   },
   methods: {
       imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PATH_URL;
     },
      getPostScriptContent(){
       if (this.postScriptContent.length) {
diff --git a/src/components/retailer/layout/Layout.vue b/src/components/retailer/layout/Layout.vue
index 00bdf8d..3329a8a 100644
--- a/src/components/retailer/layout/Layout.vue
+++ b/src/components/retailer/layout/Layout.vue
@@ -3,7 +3,7 @@
     <v-navigation-drawer
       v-model="showMenu"
       v-if="showMenu"
-      :clipped="$vuetify.breakpoint.mdAndUp"
+      :clipped="$vuetify.display.mdAndUp"
       app
       color="header-background-color darken-3"
       class="white--text pa-4"
@@ -54,8 +54,8 @@
 
 
 <script>
-import Header from "@/components/retailer/layout/header/Header";
-import FooterComponent from "@/components/retailer/layout/footer/FooterComponent"
+import Header from "@/components/retailer/layout/header/Header.vue";
+import FooterComponent from "@/components/retailer/layout/footer/FooterComponent.vue"
 
 import { createHelpers } from "vuex-map-fields";
 
@@ -80,7 +80,7 @@ export default {
   }),
   computed: {
     isDesktop: function() {
-      return this.$vuetify.breakpoint.xsOnly ? true : false;
+      return this.$vuetify.display.xsOnly ? true : false;
     },
     basicInfo: function() {
       return this.$store.state.accountOne.one;
diff --git a/src/components/retailer/layout/NavigationBar.vue b/src/components/retailer/layout/NavigationBar.vue
index 8b46245..c5500cb 100644
--- a/src/components/retailer/layout/NavigationBar.vue
+++ b/src/components/retailer/layout/NavigationBar.vue
@@ -1,5 +1,5 @@
     <template>
-  <v-navigation-drawer v-model="showMenuBar" v-if="showMenuBar" app :clipped="$vuetify.breakpoint.mdAndUp">
+  <v-navigation-drawer v-model="showMenuBar" v-if="showMenuBar" app :clipped="$vuetify.display.mdAndUp">
     <v-list dense>
       <v-list-item link>
         <v-list-item-action>
diff --git a/src/components/retailer/layout/header/Header.vue b/src/components/retailer/layout/header/Header.vue
index 4b1e389..8b86d5c 100644
--- a/src/components/retailer/layout/header/Header.vue
+++ b/src/components/retailer/layout/header/Header.vue
@@ -1,6 +1,6 @@
  <template>
   <v-app-bar
-    :clipped-left="$vuetify.breakpoint.mdAndUp"
+    :clipped-left="$vuetify.display.mdAndUp"
     app
     color="header-background-color darken-3"
     dark
@@ -121,7 +121,7 @@
         icon
         class="header-buttons"
         @click="goToLogout()"
-        :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+        :max-width="$vuetify.display.mdOnly ? '35px' : ''"
       >
         <v-icon>mdi-logout</v-icon>
       </v-btn>
@@ -129,7 +129,7 @@
         icon
         @click="showSearchInput = true"
         class="d-none d-md-block header-buttons"
-        :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+        :max-width="$vuetify.display.mdOnly ? '35px' : ''"
       >
         <v-icon class="header-action-icons">mdi-magnify</v-icon>
       </v-btn> -->
@@ -137,7 +137,7 @@
         icon
         class="header-buttons"
         @click="goToCartProducts()"
-        :max-width="$vuetify.breakpoint.mdOnly ? '35px' : ''"
+        :max-width="$vuetify.display.mdOnly ? '35px' : ''"
       >
         <v-icon>mdi-cart-outline</v-icon>
         <span v-if="cartProductsProgress || inProgress">
@@ -280,7 +280,7 @@ export default {
       return this.$store.state.headerCategoryList.categoryDetails;
     },
     searchInputWidth() {
-      return this.$vuetify.breakpoint.xsOnly ? "100%" : "256";
+      return this.$vuetify.display.xsOnly ? "100%" : "256";
     },
   },
   methods: {
diff --git a/src/components/retailer/product-detail/ConfiguredProductDetailComponent.vue b/src/components/retailer/product-detail/ConfiguredProductDetailComponent.vue
index b30943f..b75be3e 100644
--- a/src/components/retailer/product-detail/ConfiguredProductDetailComponent.vue
+++ b/src/components/retailer/product-detail/ConfiguredProductDetailComponent.vue
@@ -379,10 +379,10 @@
   </v-container>
 </template>
 <script>
-const personlizeUrl = process.env.VUE_APP_PERSONALIZE_URL;
-const retailorId = process.env.VUE_APP_RETAILOR_ID;
+const personlizeUrl = import.meta.env.VITE_APP_PERSONALIZE_URL;
+const retailorId = import.meta.env.VITE_APP_RETAILOR_ID;
 import * as easings from "vuetify/es5/services/goto/easing-patterns";
-import SnackbarComponent from "@/components/common/SnackbarComponent";
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
 import { getLable, customAttributeValue ,setCategoryNameInLocal} from "@/services/util.service";
 //import { getAuthUser } from "@/services/auth";
 export default {
@@ -440,7 +440,7 @@ export default {
   }),
   computed: {
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     /*  productAttributes() {
       return this.$store.state.productList.attributeList;
diff --git a/src/components/retailer/product-detail/GiftCardDetailsComponent.vue b/src/components/retailer/product-detail/GiftCardDetailsComponent.vue
index e1a5072..2defa92 100644
--- a/src/components/retailer/product-detail/GiftCardDetailsComponent.vue
+++ b/src/components/retailer/product-detail/GiftCardDetailsComponent.vue
@@ -490,8 +490,8 @@
   </v-container>
 </template>
 <script>
-//const personlizeUrl = process.env.VUE_APP_PERSONALIZE_URL;
-import SnackbarComponent from "@/components/common/SnackbarComponent";
+//const personlizeUrl = import.meta.env.VITE_APP_PERSONALIZE_URL;
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
 import { getLable ,customAttributeValue,setCategoryNameInLocal} from "@/services/util.service";
 import { createHelpers } from "vuex-map-fields";
 import * as easings from "vuetify/es5/services/goto/easing-patterns";
@@ -571,7 +571,7 @@ export default {
     ]),
     ...customerInfo(["one", "one.firstname", "one.email"]),
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
 
     itemId: function() {
diff --git a/src/components/retailer/product-detail/ProductDetailComponent.vue b/src/components/retailer/product-detail/ProductDetailComponent.vue
index 7830955..f050da5 100644
--- a/src/components/retailer/product-detail/ProductDetailComponent.vue
+++ b/src/components/retailer/product-detail/ProductDetailComponent.vue
@@ -446,10 +446,10 @@
   </v-container>
 </template>
 <script>
-const personlizeUrl = process.env.VUE_APP_PERSONALIZE_URL;
-const retailorId = process.env.VUE_APP_RETAILOR_ID;
+const personlizeUrl = import.meta.env.VITE_APP_PERSONALIZE_URL;
+const retailorId = import.meta.env.VITE_APP_RETAILOR_ID;
 import * as easings from "vuetify/es5/services/goto/easing-patterns";
-import SnackbarComponent from "@/components/common/SnackbarComponent";
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
 import { priceFormatter, getLable, customAttributeValue , /*criteoForCurrentProduct, */setCategoryNameInLocal} from "@/services/util.service";
 //import { getAuthUser } from "@/services/auth";
 /* eslint-disable no-alert, no-console ,  no-debugger */
@@ -498,7 +498,7 @@ export default {
   }),
   computed: {
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     /*  productAttributes() {
       return this.$store.state.productList.attributeList;
diff --git a/src/components/retailer/product-detail/RecentlyViewedComponent.vue b/src/components/retailer/product-detail/RecentlyViewedComponent.vue
index 3ead505..a5e02db 100644
--- a/src/components/retailer/product-detail/RecentlyViewedComponent.vue
+++ b/src/components/retailer/product-detail/RecentlyViewedComponent.vue
@@ -239,28 +239,28 @@ export default {
       return this.$store.state.productList.attributeList;
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     perSlides: function() {
-      if (this.$vuetify.breakpoint.xsOnly) return 1;
-      else if (this.$vuetify.breakpoint.smOnly) return 3;
-      else return this.$vuetify.breakpoint.mdAndUp ? 4 : 4;
+      if (this.$vuetify.display.xsOnly) return 1;
+      else if (this.$vuetify.display.smOnly) return 3;
+      else return this.$vuetify.display.mdAndUp ? 4 : 4;
     },
     slideHeight: function() {
-      return this.$vuetify.breakpoint.xsOnly ? "400px" : "350px";
+      return this.$vuetify.display.xsOnly ? "400px" : "350px";
     },
     showArrows: function() {
-      if (this.$vuetify.breakpoint.smAndDown) return false;
+      if (this.$vuetify.display.smAndDown) return false;
       else return true;
     },
     imageMaxHeight: function() {
-      if (this.$vuetify.breakpoint.xsOnly) return "250px";
+      if (this.$vuetify.display.xsOnly) return "250px";
       else return "300px";
     }
   },
   methods: {
       initialLink() {
-      return process.env.VUE_APP_HOME_PAGE_URL;
+      return import.meta.env.VITE_APP_HOME_PAGE_URL;
     },
      goToPage(pageLink) {
       window.location.replace(this.initialLink()+pageLink);
diff --git a/src/components/retailer/product-detail/RelatedProductsComponent.vue b/src/components/retailer/product-detail/RelatedProductsComponent.vue
index 25b9d67..b683d5e 100644
--- a/src/components/retailer/product-detail/RelatedProductsComponent.vue
+++ b/src/components/retailer/product-detail/RelatedProductsComponent.vue
@@ -100,7 +100,7 @@
  <script>
 import { VueperSlides, VueperSlide } from "vueperslides";
 import "vueperslides/dist/vueperslides.css";
-//const personlizeUrl = process.env.VUE_APP_PERSONALIZE_URL;
+//const personlizeUrl = import.meta.env.VITE_APP_PERSONALIZE_URL;
 export default {
   name: "RelatedProductsComponent",
   props: ["relatedProducts"],
@@ -110,22 +110,22 @@ export default {
   },
   computed: {
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     perSlides: function() {
-      if (this.$vuetify.breakpoint.xsOnly) return 1;
-      else if (this.$vuetify.breakpoint.smOnly) return 3;
-      else return this.$vuetify.breakpoint.mdAndUp ? 4 : 4;
+      if (this.$vuetify.display.xsOnly) return 1;
+      else if (this.$vuetify.display.smOnly) return 3;
+      else return this.$vuetify.display.mdAndUp ? 4 : 4;
     },
     slideHeight: function() {
-      return this.$vuetify.breakpoint.xsOnly ? "400px" : "350px";
+      return this.$vuetify.display.xsOnly ? "400px" : "350px";
     },
     showArrows: function() {
-      if (this.$vuetify.breakpoint.smAndDown) return false;
+      if (this.$vuetify.display.smAndDown) return false;
       else return true;
     },
     imageMaxHeight: function() {
-      if (this.$vuetify.breakpoint.xsOnly) return "250px";
+      if (this.$vuetify.display.xsOnly) return "250px";
       else return "300px";
     }
   },
diff --git a/src/components/retailer/retailer-search/RetailerSearchProducts.vue b/src/components/retailer/retailer-search/RetailerSearchProducts.vue
index 5773b02..f993ddc 100644
--- a/src/components/retailer/retailer-search/RetailerSearchProducts.vue
+++ b/src/components/retailer/retailer-search/RetailerSearchProducts.vue
@@ -147,21 +147,21 @@ export default {
     }),
    
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     imageBaseParams() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PARAMS;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PARAMS;
     },
     isIpadOrMobile: function() {
-      return this.$vuetify.breakpoint.mdAndDown ? true : false;
+      return this.$vuetify.display.mdAndDown ? true : false;
     },
     isIpad: function() {
-      return this.$vuetify.breakpoint.smOnly || this.$vuetify.breakpoint.mdOnly
+      return this.$vuetify.display.smOnly || this.$vuetify.display.mdOnly
         ? true
         : false;
     },
     isMobile: function() {
-      return this.$vuetify.breakpoint.xs ? true : false;
+      return this.$vuetify.display.xs ? true : false;
     },
      userAuth: function() {
       return this.$store.state.auth.userAuth;
@@ -226,7 +226,7 @@ export default {
     },
     OnResize() {
       setTimeout(() => {
-        if (this.$vuetify.breakpoint.lgAndUp) {
+        if (this.$vuetify.display.lgAndUp) {
           this.showDrawarFilter = false;
         }
       }, 200);
diff --git a/src/components/retailer/search/SearchProducts.vue b/src/components/retailer/search/SearchProducts.vue
index be15fd6..5780f2f 100644
--- a/src/components/retailer/search/SearchProducts.vue
+++ b/src/components/retailer/search/SearchProducts.vue
@@ -320,10 +320,10 @@
 <script>
 /* eslint-disable no-alert, no-console ,  no-debugger */
 import * as easings from "vuetify/es5/services/goto/easing-patterns";
-import BreadcrumbComponent from "@/components/retailer/breadcrumb/Breadcrumb";
+import BreadcrumbComponent from "@/components/retailer/breadcrumb/Breadcrumb.vue";
 import { createHelpers } from "vuex-map-fields";
 import { mapState } from "vuex";
-import CategoryHeroContent from "@/components/retailer/category/CategoryHeroContent";
+import CategoryHeroContent from "@/components/retailer/category/CategoryHeroContent.vue";
 import FilterComponent from "../filter/FilterComponent";
  
 const { mapFields } = createHelpers({
@@ -370,27 +370,27 @@ export default {
       return this.$store.state.headerCategoryList.categoryListIdWise;
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     imageBaseParams() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PARAMS;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PARAMS;
     },
     isIpadOrMobile: function() {
-      return this.$vuetify.breakpoint.mdAndDown ? true : false;
+      return this.$vuetify.display.mdAndDown ? true : false;
     },
     isIpad: function() {
-      return this.$vuetify.breakpoint.smOnly || this.$vuetify.breakpoint.mdOnly
+      return this.$vuetify.display.smOnly || this.$vuetify.display.mdOnly
         ? true
         : false;
     },
     isMobile: function() {
-      return this.$vuetify.breakpoint.xs ? true : false;
+      return this.$vuetify.display.xs ? true : false;
     },
      categoryId: function() {
       return this.$route.meta.id;
     }, 
     newUser() {
-      if (this.$vuetify.breakpoint.smAndDown) return false;
+      if (this.$vuetify.display.smAndDown) return false;
       let userVisits = this.$store.state.layout.user.userVisits;
       if (userVisits && Number(userVisits) > 1) return false;
       else return true;
@@ -472,7 +472,7 @@ export default {
     },
     OnResize() {
       setTimeout(() => {
-        if (this.$vuetify.breakpoint.lgAndUp) {
+        if (this.$vuetify.display.lgAndUp) {
           this.showDrawarFilter = false;
         }
       }, 200);
diff --git a/src/components/retailer/shipping-delivery/ShippingAndDeliveryComponent.vue b/src/components/retailer/shipping-delivery/ShippingAndDeliveryComponent.vue
index e6192ed..a445d53 100644
--- a/src/components/retailer/shipping-delivery/ShippingAndDeliveryComponent.vue
+++ b/src/components/retailer/shipping-delivery/ShippingAndDeliveryComponent.vue
@@ -51,7 +51,7 @@ export default {
       }
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_CATEGORY_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_CATEGORY_PATH_URL;
     }
   },
   mounted() {
diff --git a/src/main.js b/src/main.js
index aaf9f21..7173935 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,35 +1,23 @@
-import Vue from 'vue'
-import VueCookies from 'vue-cookies';
+import { createApp } from 'vue'
+import VueCookies from 'vue3-cookies';
+
 import App from './App.vue'
-// import VueTelInput from 'vue-tel-input'
-import vuetify from './plugins/vuetify'
-import "vuetify/dist/vuetify.min.css";
 import router from './multipages'
-import store from '@/stores';
- 
-import VueMeta from 'vue-meta'
- 
+import store from './stores';
+import vuetify from '@/plugins/vuetify'
 
-Vue.use(VueCookies);
-// Vue.use(VueTelInput);
+import 'vuetify/lib/styles/settings/_variables.scss';
 
-// Vue.use(VueGoogleMaps, {
-//     load: { key: 'AIzaSyDmHp0PPuKHD1KGHCDmLq1qQKr_03XKEHo', libraries: ['places', 'geometry'] }
-// });
- 
+import 'vuetify/dist/vuetify.min.css'
 
-Vue.use(VueMeta, {
-    // optional pluginOptions
-    refreshOnceOnNavigation: true
-})
-
- 
-Vue.config.productionTip = false
+const app = createApp(App)
+app.use(vuetify)
+app.use(VueCookies)
 
 
-export default new Vue({
-    vuetify,
-    router,
-    store,
-    render: (h) => h(App)
-}).$mount('#app')
+app.use(store)
+app.use(router)
+
+app.config.productionTip = false
+
+app.mount('#app')
\ No newline at end of file
diff --git a/src/multipages/gate.routes.js b/src/multipages/gate.routes.js
index eca1e40..00dbfe2 100644
--- a/src/multipages/gate.routes.js
+++ b/src/multipages/gate.routes.js
@@ -45,8 +45,5 @@ export default [{
             }
         },
         ]
-    },
-    {
-        path: '*',
-        redirect: '/gate/sign-in'
-    }]
+    }
+     ]
diff --git a/src/multipages/index.js b/src/multipages/index.js
index 573ee2a..45f90fb 100644
--- a/src/multipages/index.js
+++ b/src/multipages/index.js
@@ -1,30 +1,30 @@
-import Vue from 'vue'
-import Router from 'vue-router'
+import {  createRouter,createWebHistory } from "vue-router";
+
 import { beforeEachRoute } from '@/services/nav'
-//const { beforeEachRoute } = nav
 
 // Routes
 import RetailorRoutes from './retailer.routes'
 import GateRoutes from './gate.routes'
 
-Vue.use(Router)
 
 export const routes = [
-...RetailorRoutes,
-...GateRoutes,
+ ...GateRoutes,
+ ...RetailorRoutes,
 ]
 
-const router = new Router({
-  mode: 'history',
-   base: process.env.BASE_URL || '/',
+
+const router = createRouter({
+  history: createWebHistory(),
+   base: import.meta.env.BASE_URL || '/',
   scrollBehavior(to, from, savedPosition) {
     if (savedPosition) return savedPosition
 
     return { x: 0, y: 0 }
   },
-  routes
-})
+  routes,
+});
+
 
 router.beforeEach(beforeEachRoute);
 
-export default router
+export default router
\ No newline at end of file
diff --git a/src/multipages/retailer.routes.js b/src/multipages/retailer.routes.js
index 5bfa276..3fa36fc 100644
--- a/src/multipages/retailer.routes.js
+++ b/src/multipages/retailer.routes.js
@@ -323,11 +323,6 @@ export default [
           
         ]
     },
-    {
-        path: '*',
-        name: 'RouteNotFound',
-        redirect: '/b2b',
-        component: () => import( /* webpackChunkName: "craneMain" */'@/routes/retailer/route_not_found.vue'),
-    }
+   
    
     ]
diff --git a/src/plugins/vuetify.js b/src/plugins/vuetify.js
deleted file mode 100644
index 98083b2..0000000
--- a/src/plugins/vuetify.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import Vue from 'vue';
-import Vuetify from 'vuetify/lib';
-
-Vue.use(Vuetify);
-
-export default new Vuetify({
-    theme: {
-        themes: {
-            light: {
-                primary: '#2850DA',
-                contentColor: '#1d1d1d',
-                strongBlue: '#2d5d84',
-                strongOrange: '#eb7525',
-                strongPink: '#c53c44',
-                linkHoverColor:'#CCB7FF',
-            },
-        },
-    }
-});
\ No newline at end of file
diff --git a/src/plugins/vuetify/defaults.js b/src/plugins/vuetify/defaults.js
new file mode 100644
index 0000000..572be5e
--- /dev/null
+++ b/src/plugins/vuetify/defaults.js
@@ -0,0 +1,119 @@
+export default {
+  VAlert: {
+    density: 'comfortable',
+  },
+  VAvatar: {
+    // ℹ️ Remove after next release
+    variant: 'flat',
+  },
+  VBadge: {
+    // set v-badge default color to primary
+    color: 'primary',
+  },
+  VBtn: {
+    // set v-btn default color to primary
+    color: 'primary',
+  },
+  VChip: {
+    elevation: 0,
+  },
+  VMenu: {
+    VList: {
+      density: 'compact',
+    },
+  },
+  VPagination: {
+    activeColor: 'primary',
+    density: 'comfortable',
+  },
+  VTabs: {
+    // set v-tabs default color to primary
+    color: 'primary',
+  },
+  VTooltip: {
+    // set v-tooltip default location to top
+    location: 'top',
+  },
+
+  // VList: {
+  //   VListItem: {
+  //     activeColor: 'primary',
+  //   },
+  // },
+  VCheckbox: {
+    // set v-checkbox default color to primary
+    color: 'primary',
+    density: 'comfortable',
+    hideDetails: 'auto',
+  },
+  VRadioGroup: {
+    color: 'primary',
+    density: 'comfortable',
+    hideDetails: 'auto',
+  },
+  VRadio: {
+    density: 'comfortable',
+    hideDetails: 'auto',
+  },
+  VSelect: {
+    variant: 'outlined',
+    density: 'comfortable',
+    color: 'primary',
+    hideDetails: 'auto',
+  },
+  VRangeSlider: {
+    // set v-range-slider default color to primary
+    color: 'primary',
+    density: 'comfortable',
+    thumbLabel: true,
+    hideDetails: 'auto',
+  },
+  VRating: {
+    // set v-rating default color to primary
+    color: 'warning',
+  },
+  VProgressCircular: {
+    // set v-progress-circular default color to primary
+    color: 'primary',
+  },
+  VSlider: {
+    // set v-slider default color to primary
+    color: 'primary',
+    hideDetails: 'auto',
+  },
+  VTextField: {
+    variant: 'outlined',
+    density: 'comfortable',
+    color: 'primary',
+    hideDetails: 'auto',
+  },
+  VAutocomplete: {
+    variant: 'outlined',
+    density: 'comfortable',
+    color: 'primary',
+    hideDetails: 'auto',
+  },
+  VCombobox: {
+    variant: 'outlined',
+    density: 'comfortable',
+    color: 'primary',
+    hideDetails: 'auto',
+  },
+  VFileInput: {
+    variant: 'outlined',
+    density: 'comfortable',
+    color: 'primary',
+    hideDetails: 'auto',
+  },
+  VTextarea: {
+    variant: 'outlined',
+    density: 'comfortable',
+    color: 'primary',
+    hideDetails: 'auto',
+  },
+  VSwitch: {
+    // set v-switch default color to primary
+    color: 'primary',
+    hideDetails: 'auto',
+  },
+}
diff --git a/src/plugins/vuetify/index.js b/src/plugins/vuetify/index.js
new file mode 100644
index 0000000..e616aa4
--- /dev/null
+++ b/src/plugins/vuetify/index.js
@@ -0,0 +1,15 @@
+import { createVuetify } from 'vuetify'
+import { VDataTable } from 'vuetify/labs/VDataTable'
+import 'vuetify/styles'
+
+import theme from './theme'
+ import * as directives from 'vuetify/directives'
+export default createVuetify({
+  ssr: true,
+  directives,
+  
+  components: {
+    VDataTable,
+  },
+  theme
+})
diff --git a/src/plugins/vuetify/theme.js b/src/plugins/vuetify/theme.js
new file mode 100644
index 0000000..d957425
--- /dev/null
+++ b/src/plugins/vuetify/theme.js
@@ -0,0 +1,58 @@
+ 
+const theme = {
+  defaultTheme: 'light',
+  themes: {
+    light: {
+      dark: false,
+      colors: {
+        'primary': '#9155FD',
+        'secondary': '#8A8D93',
+        'on-secondary': '#fff',
+        'success': '#56CA00',
+        'info': '#16B1FF',
+        'warning': '#FFB400',
+        'error': '#FF4C51',
+        'on-primary': '#FFFFFF',
+        'on-success': '#FFFFFF',
+        'on-warning': '#FFFFFF',
+        'background': '#F4F5FA',
+        'on-background': '#3A3541',
+        'on-surface': '#3A3541',
+        'grey-50': '#FAFAFA',
+        'grey-100': '#F5F5F5',
+        'grey-200': '#EEEEEE',
+        'grey-300': '#E0E0E0',
+        'grey-400': '#BDBDBD',
+        'grey-500': '#9E9E9E',
+        'grey-600': '#757575',
+        'grey-700': '#616161',
+        'grey-800': '#424242',
+        'grey-900': '#212121',
+      },
+      variables: {
+        'border-color': '#3A3541',
+        'medium-emphasis-opacity': 0.68,
+
+        // Shadows
+        'shadow-key-umbra-opacity': 'rgba(var(--v-theme-on-surface), 0.08)',
+        'shadow-key-penumbra-opacity': 'rgba(var(--v-theme-on-surface), 0.12)',
+        'shadow-key-ambient-opacity': 'rgba(var(--v-theme-on-surface), 0.04)',
+      },
+    },
+    dark: {
+      dark: false,
+      colors: {
+        
+        'primary':  '#2196f3',
+        'secondary': '#8A8D93',
+        
+        'success': '#56CA00',
+        'info': '#16B1FF',
+        'warning': '#FFB400',
+        'error': '#FF4C51',
+      },
+      
+    },
+  },
+}
+export default theme
diff --git a/src/routes/gate/signin.vue b/src/routes/gate/signin.vue
index d52be31..38eafcd 100644
--- a/src/routes/gate/signin.vue
+++ b/src/routes/gate/signin.vue
@@ -4,7 +4,7 @@
   </div>
 </template>
 <script>
-import SignInComponent from "../../components/gate/SignInComponent";
+import SignInComponent from "@/components/gate/SignInComponent.vue";
 export default {
   name: "SignInPage",
    components: {
diff --git a/src/routes/retailer/address_book.vue b/src/routes/retailer/address_book.vue
index 3d1cc12..5cb0eee 100644
--- a/src/routes/retailer/address_book.vue
+++ b/src/routes/retailer/address_book.vue
@@ -30,7 +30,7 @@
                       :color="hover?'white':'primary'"
                       :class="hover?'primary--text':'white--text'"
                       depressed
-                      :large="$vuetify.breakpoint.mdAndUp?true:false"
+                      :large="$vuetify.display.mdAndUp?true:false"
                       tile
                       class="body-font my-2 address-book-button"
                     >EDIT</v-btn>
@@ -56,7 +56,7 @@
                     <v-btn
                       @click="editAddress(shippingAddressDetails.address,shippingAddressDetails.index)"
                       depressed
-                      :large="$vuetify.breakpoint.mdAndUp?true:false"
+                      :large="$vuetify.display.mdAndUp?true:false"
                       tile
                       :outlined="hover"
                       :color="hover?'white':'primary'"
@@ -138,7 +138,7 @@
                   <v-btn
                     @click="editAddress()"
                     depressed
-                    :large="$vuetify.breakpoint.mdAndUp?true:false"
+                    :large="$vuetify.display.mdAndUp?true:false"
                     tile
                     :outlined="hover"
                     :color="hover?'white':'primary'"
@@ -349,17 +349,17 @@
 </template>
 <script>
 /*eslint-disable*/
-import BillingAddressComponent from "@/components/retailer/address/BillingAddressComponent";
-import ShippingAddressComponent from "@/components/retailer/address/ShippingAddressComponent";
-import ShippingAddressFormComponent from "@/components/retailer/address/ShippingAddressFormComponent";
-import MeVerifyAddressComponent from "@/components/retailer/address/MeVerifyAddressComponent";
+import BillingAddressComponent from "@/components/retailer/address/BillingAddressComponent.vue";
+import ShippingAddressComponent from "@/components/retailer/address/ShippingAddressComponent.vue";
+import ShippingAddressFormComponent from "@/components/retailer/address/ShippingAddressFormComponent.vue";
+import MeVerifyAddressComponent from "@/components/retailer/address/MeVerifyAddressComponent.vue";
 // import ContactInfoComponent from "@/components/retailer/contact-info/ContactInfoComponent";
 //import { doFormatAddress } from "@/services/util.service";
 import { loginInterrupt } from "@/services/nav";
-import SnackbarComponent from "@/components/common/SnackbarComponent";
-import ConfirmationDialog from "@/components/common/ConfirmationDialog";
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
+import ConfirmationDialog from "@/components/common/ConfirmationDialog.vue";
 import { VueTelInput } from "vue-tel-input";
-//import BillingAddressComponent from "@/components/retailer/address/BillingAddressComponent";
+//import BillingAddressComponent from "@/components/retailer/address/BillingAddressComponent.vue";
 
 import { createHelpers } from "vuex-map-fields";
 
diff --git a/src/routes/retailer/cart_products.vue b/src/routes/retailer/cart_products.vue
index 9eb0bc1..4379765 100644
--- a/src/routes/retailer/cart_products.vue
+++ b/src/routes/retailer/cart_products.vue
@@ -185,11 +185,11 @@
 </template>
 <script>
 /* eslint-disable no-alert, no-console ,  no-debugger */
-const baseUrl = process.env.VUE_APP_BASE_URL;
-import CartProductList from "@/components/retailer/cart-product/CartProductList";
-import RetailerSearchProducts from "@/components/retailer/retailer-search/RetailerSearchProducts";
+const baseUrl = import.meta.env.VITE_APP_BASE_URL;
+import CartProductList from "@/components/retailer/cart-product/CartProductList.vue";
+import RetailerSearchProducts from "@/components/retailer/retailer-search/RetailerSearchProducts.vue";
 
-import SnackbarComponent from "@/components/common/SnackbarComponent";
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
 import { priceFormatter } from "@/services/util.service";
 export default {
   name: "CartProducts",
@@ -224,7 +224,7 @@ export default {
       return this.$route.meta.canonical;
     },
     isDesktop: function () {
-      return this.$vuetify.breakpoint.smAndDown ? true : false;
+      return this.$vuetify.display.smAndDown ? true : false;
     },
     userAuth: function () {
       return this.$store.state.auth.userAuth;
diff --git a/src/routes/retailer/category_page.vue b/src/routes/retailer/category_page.vue
index 8754b67..3516860 100644
--- a/src/routes/retailer/category_page.vue
+++ b/src/routes/retailer/category_page.vue
@@ -7,10 +7,10 @@
 </template>
 <script>
 /* eslint-disable no-alert, no-console ,  no-debugger */
-const baseUrl = process.env.VUE_APP_BASE_URL;
-import SeoFooterContent from "@/components/layout/footer/SeoFooterContent";
-import FooterComponent from "@/components/layout/footer/FooterComponent";
-import SearchProductsComponent from "@/components/retailer/search/SearchProducts";
+const baseUrl = import.meta.env.VITE_APP_BASE_URL;
+import SeoFooterContent from "@/components/layout/footer/SeoFooterContent.vue";
+import FooterComponent from "@/components/layout/footer/FooterComponent.vue";
+import SearchProductsComponent from "@/components/retailer/search/SearchProducts.vue";
 
 import { getMeta,getCategoryOne} from "@/services/util.service";
  import { mapState } from "vuex";
diff --git a/src/routes/retailer/checkout_page.vue b/src/routes/retailer/checkout_page.vue
index 2d738c7..15183f6 100644
--- a/src/routes/retailer/checkout_page.vue
+++ b/src/routes/retailer/checkout_page.vue
@@ -1159,13 +1159,13 @@
 </template>
 <script>
 /* eslint-disable */
-const baseUrl = process.env.VUE_APP_BASE_URL;
-import SnackbarComponent from "@/components/common/SnackbarComponent";
-import CartProductList from "@/components/retailer/cart-product/CartProductList";
-import ShippingAddressFormComponent from "@/components/retailer/address/ShippingAddressFormComponent";
-import GuestShippingAddressForm from "@/components/retailer/address/GuestShippingAddressForm";
-import BillingAddressComponent from "@/components/retailer/address/BillingAddressComponent";
-import VerifyAddressComponent from "@/components/retailer/address/VerifyAddressComponent";
+const baseUrl = import.meta.env.VITE_APP_BASE_URL;
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
+import CartProductList from "@/components/retailer/cart-product/CartProductList.vue";
+import ShippingAddressFormComponent from "@/components/retailer/address/ShippingAddressFormComponent.vue";
+import GuestShippingAddressForm from "@/components/retailer/address/GuestShippingAddressForm.vue";
+import BillingAddressComponent from "@/components/retailer/address/BillingAddressComponent.vue";
+import VerifyAddressComponent from "@/components/retailer/address/VerifyAddressComponent.vue";
 import { createHelpers } from "vuex-map-fields";
  import { VueTelInput } from "vue-tel-input";
 import {
@@ -1346,7 +1346,7 @@ export default {
       else return this.$store.state.guestInfo.paymentInProgress;
     },
     isMobileDevice() {
-      return this.$vuetify.breakpoint.xsOnly;
+      return this.$vuetify.display.xsOnly;
     },
     cartProductTotalAmt() {
       if (this.userAuth) {
diff --git a/src/routes/retailer/edit_account_info.vue b/src/routes/retailer/edit_account_info.vue
index 26f6ebc..0ed2b63 100644
--- a/src/routes/retailer/edit_account_info.vue
+++ b/src/routes/retailer/edit_account_info.vue
@@ -172,7 +172,7 @@
 import { loginInterrupt } from "@/services/nav";
 import { createHelpers } from "vuex-map-fields";
 import { commonValidationRules } from "@/services/util.service";
-import SnackbarComponent from "@/components/common/SnackbarComponent";
+import SnackbarComponent from "@/components/common/SnackbarComponent.vue";
 const { mapFields } = createHelpers({
   getterType: "accountOne/getField",
   mutationType: "accountOne/updateField"
diff --git a/src/routes/retailer/maintenance.vue b/src/routes/retailer/maintenance.vue
index 7b5d797..3294dfd 100644
--- a/src/routes/retailer/maintenance.vue
+++ b/src/routes/retailer/maintenance.vue
@@ -40,7 +40,7 @@
   </div>
 </template>
 <script>
-const baseUrl = process.env.VUE_APP_BASE_URL;
+const baseUrl = import.meta.env.VITE_APP_BASE_URL;
 export default {
   name: "Maintenance",
   components: { },
@@ -49,7 +49,7 @@ export default {
   }),
   computed: {
     isDesktopDevice: function() {
-      return this.$vuetify.breakpoint.smAndUp ? true : false;
+      return this.$vuetify.display.smAndUp ? true : false;
     },
      canonical: function() {
       return this.$route.meta.canonical;
diff --git a/src/routes/retailer/my_orders.vue b/src/routes/retailer/my_orders.vue
index 5f8ea0f..95a31ab 100644
--- a/src/routes/retailer/my_orders.vue
+++ b/src/routes/retailer/my_orders.vue
@@ -105,9 +105,9 @@
   </v-container>
 </template>
 <script>
-import ViewOrderTabs from "@/components/retailer/my-orders/ViewOrderTabs";
+import ViewOrderTabs from "@/components/retailer/my-orders/ViewOrderTabs.vue";
 import { loginInterrupt } from "@/services/nav";
-//const vueAppMagenotApiUrl = process.env.VUE_APP_MAGENTO_API_URL;
+//const vueAppMagenotApiUrl = import.meta.env.VITE_APP_MAGENTO_API_URL;
 import {  
   priceFormatter
 } from "@/services/util.service";
@@ -144,7 +144,7 @@ export default {
       return this.$route.params.orderId;
     },
     imageBasePathUrl() {
-      return process.env.VUE_APP_IMAGE_PATH_URL;
+      return import.meta.env.VITE_APP_IMAGE_PATH_URL;
     },
     hideAndShowFields: function() {
       let currentName = this.$router.history.current.name;
diff --git a/src/routes/retailer/order_success.vue b/src/routes/retailer/order_success.vue
index 5d22069..1f9c24c 100644
--- a/src/routes/retailer/order_success.vue
+++ b/src/routes/retailer/order_success.vue
@@ -126,8 +126,8 @@
   </div>
 </template>
 <script>
-const baseUrl = process.env.VUE_APP_BASE_URL;
-import ViewOrderTabs from "@/components/retailer/my-orders/ViewOrderTabs";
+const baseUrl = import.meta.env.VITE_APP_BASE_URL;
+import ViewOrderTabs from "@/components/retailer/my-orders/ViewOrderTabs.vue";
 //import { getCookieByName } from "@/services/auth";
 //import {goToCategoryPage} from "@/services/util.service";
 export default {
diff --git a/src/routes/retailer/product_page.vue b/src/routes/retailer/product_page.vue
index 8a989db..79ec24b 100644
--- a/src/routes/retailer/product_page.vue
+++ b/src/routes/retailer/product_page.vue
@@ -49,14 +49,14 @@
 </template>
 <script>
 /* eslint-disable no-alert, no-console ,  no-debugger */
-const baseUrl = process.env.VUE_APP_BASE_URL;
+const baseUrl = import.meta.env.VITE_APP_BASE_URL;
 import * as easings from "vuetify/es5/services/goto/easing-patterns";
-import RelatedProductsComponent from "@/components/retailer/product-detail/RelatedProductsComponent";
-import RecentlyViewedComponent from "@/components/retailer/product-detail/RecentlyViewedComponent";
-import ProductDetailComponent from "@/components/retailer/product-detail/ProductDetailComponent";
-import ConfiguredProductDetailComponent from "@/components/retailer/product-detail/ConfiguredProductDetailComponent";
-import GiftCardDetailsComponent from "@/components/retailer/product-detail/GiftCardDetailsComponent";
-import FooterComponent from "@/components/layout/footer/FooterComponent";
+import RelatedProductsComponent from "@/components/retailer/product-detail/RelatedProductsComponent.vue";
+import RecentlyViewedComponent from "@/components/retailer/product-detail/RecentlyViewedComponent.vue";
+import ProductDetailComponent from "@/components/retailer/product-detail/ProductDetailComponent.vue";
+import ConfiguredProductDetailComponent from "@/components/retailer/product-detail/ConfiguredProductDetailComponent.vue";
+import GiftCardDetailsComponent from "@/components/retailer/product-detail/GiftCardDetailsComponent.vue";
+import FooterComponent from "@/components/layout/footer/FooterComponent.vue";
 import { getMeta } from "@/services/util.service";
 export default {
   name: "ProductPage",
@@ -154,9 +154,9 @@ export default {
           this.productDetails.stockDetails.qty <= 0
         ) {
           this.stockFlag = false;
-          console.log("checked env", process.env.NODE_ENV);
+          console.log("checked env", import.meta.env.NODE_ENV);
           if (
-            process.env.NODE_ENV == "production" &&
+            import.meta.env.NODE_ENV == "production" &&
             window.craneCatalog.products.hasOwnProperty(this.productDetails.id)
           ) {
             this.$store.dispatch("productOne/updateCatlog");
diff --git a/src/routes/retailer/route_not_found.vue b/src/routes/retailer/route_not_found.vue
index 52aeb83..d27db03 100644
--- a/src/routes/retailer/route_not_found.vue
+++ b/src/routes/retailer/route_not_found.vue
@@ -13,8 +13,8 @@
 /* eslint-disable no-alert, no-console ,  no-debugger */
 
 
-const baseUrl = process.env.VUE_APP_BASE_URL;
-import FooterComponent from "@/components/layout/footer/FooterComponent";
+const baseUrl = import.meta.env.VITE_APP_BASE_URL;
+import FooterComponent from "@/components/layout/footer/FooterComponent.vue";
 export default {
   name: "RouteNotFound",
    data() {
diff --git a/src/routes/retailer/search_page.vue b/src/routes/retailer/search_page.vue
index 1e45014..365a617 100644
--- a/src/routes/retailer/search_page.vue
+++ b/src/routes/retailer/search_page.vue
@@ -6,11 +6,11 @@
   </div>
 </template>
 <script>
-const baseUrl = process.env.VUE_APP_BASE_URL;
+const baseUrl = import.meta.env.VITE_APP_BASE_URL;
 /* eslint-disable no-alert, no-console ,  no-debugger */
-import SearchProductsComponent from "@/components/retailer/search/SearchProducts";
-import SeoFooterContent from "@/components/layout/footer/SeoFooterContent";
-import FooterComponent from "@/components/layout/footer/FooterComponent";
+import SearchProductsComponent from "@/components/retailer/search/SearchProducts.vue";
+import SeoFooterContent from "@/components/layout/footer/SeoFooterContent.vue";
+import FooterComponent from "@/components/layout/footer/FooterComponent.vue";
 //import CategoryHeroContent from "@/components/retailer/category/CategoryHeroContent";
 
 import { mapState } from "vuex";
diff --git a/src/services/auth.js b/src/services/auth.js
index bac7ed4..cc572cf 100644
--- a/src/services/auth.js
+++ b/src/services/auth.js
@@ -1,9 +1,12 @@
 import { Base64 } from 'js-base64';
-const rpAuthName = process.env.VUE_APP_RP_AUTH_NAME;
+const rpAuthName = import.meta.env.VITE_APP_RP_AUTH_NAME;
 console.log("rpAuthName",rpAuthName)
+import { useCookies } from "vue3-cookies";
+const { cookies } = useCookies();
+
 const getAuthUser = function() {
     // return authorization header with jwt token
-    const userAuthEncoded = window.$cookies.get(rpAuthName);
+    const userAuthEncoded = cookies.get(rpAuthName);
     if (userAuthEncoded === null) {
         return null;
     }
@@ -21,12 +24,12 @@ const setAuthUser = function(userAuth,flag) {
     if(flag)
     {
         const userAuthEncoded = Base64.encode(JSON.stringify(userAuth));
-        window.$cookies.set(rpAuthName, userAuthEncoded, '30d', null, getDomain(window.location.hostname));
+        cookies.set(rpAuthName, userAuthEncoded, '30d', null, getDomain(window.location.hostname));
     }
     else
     {
         const userAuthEncoded = Base64.encode(JSON.stringify(userAuth));
-        window.$cookies.set(rpAuthName, userAuthEncoded, '1h', null, getDomain(window.location.hostname));
+        cookies.set(rpAuthName, userAuthEncoded, '1h', null, getDomain(window.location.hostname));
     }
    
 }
@@ -35,7 +38,7 @@ const resetAuthUser = function() {
     if (au === null) {
         return false;
     }
-    window.$cookies.remove(rpAuthName, null, getDomain(window.location.hostname));
+    cookies.remove(rpAuthName, null, getDomain(window.location.hostname));
 }
 
 const authHeader = function() {
@@ -48,13 +51,13 @@ const authHeader = function() {
 }
 
 const getCookieByName = function(name) {
-    return window.$cookies.get(name);
+    return cookies.get(name);
 }
 
 const setCookieByName = function(name, value) {
-    window.$cookies.set(name, value, '168h', null, getDomain(window.location.hostname))
+    cookies.set(name, value, '168h', null, getDomain(window.location.hostname))
 }
 const removeCookieByName = function(name) {
-    window.$cookies.remove(name, null, getDomain(window.location.hostname))
+    cookies.remove(name, null, getDomain(window.location.hostname))
 }
 export { authHeader, getAuthUser, setAuthUser, resetAuthUser, getCookieByName, setCookieByName, removeCookieByName ,getDomain};
\ No newline at end of file
diff --git a/src/services/block.service.js b/src/services/block.service.js
index c30cf80..21671ab 100644
--- a/src/services/block.service.js
+++ b/src/services/block.service.js
@@ -1,7 +1,7 @@
  import { authHeader } from './auth';
  import { wrapRequest } from './nav';
 
- const vueAppMagenotApiUrl = process.env.VUE_APP_MAGENTO_API_URL;
+ const vueAppMagenotApiUrl = import.meta.env.VITE_APP_MAGENTO_API_URL;
 
  export const doFetchOne = wrapRequest((blockId) => {
      const requestOptions = {
diff --git a/src/services/gate.service.js b/src/services/gate.service.js
index 430e818..acc84a7 100644
--- a/src/services/gate.service.js
+++ b/src/services/gate.service.js
@@ -1,6 +1,6 @@
 //import { authHeader } from './auth';
 import { wrapRequest } from './nav';
-const vueAppMagentoApiUrl=process.env.VUE_APP_MAGENTO_API_URL;
+const vueAppMagentoApiUrl=import.meta.env.VITE_APP_MAGENTO_API_URL;
 
 export const doLogin = wrapRequest((loginDetail) => {
     const requestOptions = {
diff --git a/src/services/image.service.js b/src/services/image.service.js
index 55c063b..422e713 100644
--- a/src/services/image.service.js
+++ b/src/services/image.service.js
@@ -1,8 +1,8 @@
 // import { authHeader } from './auth';
  import { wrapRequest } from './nav';
-const imageLibApiUrl = process.env.VUE_APP_IMAGE_LIB_URL;
+const imageLibApiUrl = import.meta.env.VITE_APP_IMAGE_LIB_URL;
 
-const vueAppNodeslsApiUrl = process.env.VUE_APP_NODESLS_API_URL;
+const vueAppNodeslsApiUrl = import.meta.env.VITE_APP_NODESLS_API_URL;
 
 export const doFetchUploadSignatureAndPolicy = wrapRequest((bucketName, bucketRegion, fileName, fileType) => {
 
diff --git a/src/services/nav.js b/src/services/nav.js
index 1cd9e91..2d8f6db 100644
--- a/src/services/nav.js
+++ b/src/services/nav.js
@@ -1,11 +1,11 @@
-import Vue from 'vue';
+//import Vue from 'vue';
 //import { getAuthUser } from './auth';
 
 /* eslint-disable */
 
-const loginUrl = process.env.VUE_APP_LOGIN_URL ? process.env.VUE_APP_LOGIN_URL : '/gate/sign-in';
-const homeUrl = process.env.VUE_APP_ME_URL ? process.env.VUE_APP_ME_URL + '/b2b' : '/';
-const vueMaintenanceMode = process.env.VUE_APP_MAINTENANCE_MODE;
+const loginUrl = import.meta.env.VITE_APP_LOGIN_URL ? import.meta.env.VITE_APP_LOGIN_URL : '/gate/sign-in';
+const homeUrl = import.meta.env.VITE_APP_ME_URL ? import.meta.env.VITE_APP_ME_URL + '/b2b' : '/';
+const vueMaintenanceMode = import.meta.env.VITE_APP_MAINTENANCE_MODE;
 
 const loginInterrupt = function(current_url, message) {
 
@@ -118,9 +118,9 @@ const handleError = async errorResponse => {
                     const text_403 = await errorResponse.text();
                     //console.log('error:', text_403);
                     const data_403 = JSON.parse(text_403);
-                    if (typeof Vue.$snotify != 'undefined') {
+                    /*if (typeof Vue.$snotify != 'undefined') {
                         Vue.$snotify.error(data_403.message);
-                    }
+                    }*/
                     throw data_403;
                     //break;
                 }
@@ -130,9 +130,9 @@ const handleError = async errorResponse => {
                     const text_401 = await errorResponse.text();
                     //console.log('error:', text_403);
                     const data_401 = JSON.parse(text_401);
-                    if (typeof Vue.$snotify != 'undefined') {
+                   /* if (typeof Vue.$snotify != 'undefined') {
                         Vue.$snotify.error(data_401.message);
-                    }
+                    }*/
                     // throw data_401;
 
                     loginInterrupt(window.location.href, 'There was an access violation caused by your request. You need to sign back in please.');
@@ -146,9 +146,9 @@ const handleError = async errorResponse => {
                         data_400.message.indexOf('does not exist')) {
                         loginInterrupt(window.location.href, 'There was an access violation caused by your request. You need to sign back in please.');
                     } else {
-                        if (typeof Vue.$snotify != 'undefined') {
+                       /* if (typeof Vue.$snotify != 'undefined') {
                             Vue.$snotify.error('Unexpected error while communicating with the cloud');
-                        }
+                        }*/
                         throw data_400;
                     }
                     break;
@@ -168,17 +168,17 @@ const handleError = async errorResponse => {
                         data_500.message.indexOf('does not exist')) {
                         loginInterrupt(window.location.href, 'There was an access violation caused by your request. You need to sign back in please.');
                     } else {
-                        if (typeof Vue.$snotify != 'undefined') {
+                        /*if (typeof Vue.$snotify != 'undefined') {
                             Vue.$snotify.error('Unexpected error while communicating with the cloud');
-                        }
+                        }*/
                         throw data_500;
                     }
                     break;
                 }
             default:
-                if (typeof Vue.$snotify != 'undefined') {
+               /* if (typeof Vue.$snotify != 'undefined') {
                     Vue.$snotify.error('Unexpected error while communicating with the cloud');
-                }
+                }*/
                 throw { message: 'Unexpected error while communicating with the cloud' };
 
         } //switch
diff --git a/src/services/product.service.js b/src/services/product.service.js
index 8cb03de..6a3ad0a 100644
--- a/src/services/product.service.js
+++ b/src/services/product.service.js
@@ -2,10 +2,10 @@
 import { wrapRequest } from './nav';
 /* eslint-disable no-alert, no-console ,  no-debugger */
 
-const vueAppMagenotApiUrl = process.env.VUE_APP_MAGENTO_API_URL;
-const vueAppCraneOrderUrl = process.env.VUE_APP_CRANE_ORDER_URL;
-const imageLibApiUrl = process.env.VUE_APP_IMAGE_LIB_URL;
-//const vueAppCustomCachePath = process.env.VUE_APP_CUSTOM_CACHE_PATH;
+const vueAppMagenotApiUrl = import.meta.env.VITE_APP_MAGENTO_API_URL;
+const vueAppCraneOrderUrl = import.meta.env.VITE_APP_CRANE_ORDER_URL;
+const imageLibApiUrl = import.meta.env.VITE_APP_IMAGE_LIB_URL;
+//const vueAppCustomCachePath = import.meta.env.VITE_APP_CUSTOM_CACHE_PATH;
 export const doFetchOrderProductsList = wrapRequest((emailId) => {
     const requestOptions = {
         method: 'GET',
@@ -456,7 +456,7 @@ export const doFetchAttributeFilterProducts = wrapRequest(() => {
    , 'Authorization' : 'Bearer xi7a8g1ey22veysbp6ckan4yjqqkgjys' },
    };
  
-   return fetch(`${process.env.VUE_APP_MAGENTO_API_URL}/products? searchCriteria[filter_groups][0][filters][0][field]=category_id& searchCriteria[filter_groups][0][filters][0][value]=${categorySearch}& searchCriteria[filter_groups][1][filters][0][field]=${attributeCode}& searchCriteria[filter_groups][1][filters][0][value]=${value}& searchCriteria[filter_groups][1][filters][0][condition_type]=finset`, requestOptions)
+   return fetch(`${import.meta.env.VITE_APP_MAGENTO_API_URL}/products? searchCriteria[filter_groups][0][filters][0][field]=category_id& searchCriteria[filter_groups][0][filters][0][value]=${categorySearch}& searchCriteria[filter_groups][1][filters][0][field]=${attributeCode}& searchCriteria[filter_groups][1][filters][0][value]=${value}& searchCriteria[filter_groups][1][filters][0][condition_type]=finset`, requestOptions)
  */
 });
 
@@ -468,7 +468,7 @@ export const doFetchSearchProducts = wrapRequest(() => {
   };
   
  
-  return fetch(`${process.env.VUE_APP_MAGENTO_API_URL}/products/? searchCriteria[filter_groups][0][filters][0][field]=name& searchCriteria[filter_groups][0][filters][0][value]=%${search}%& searchCriteria[filter_groups][0][filters][0][condition_type]=like`, requestOptions)*/
+  return fetch(`${import.meta.env.VITE_APP_MAGENTO_API_URL}/products/? searchCriteria[filter_groups][0][filters][0][field]=name& searchCriteria[filter_groups][0][filters][0][value]=%${search}%& searchCriteria[filter_groups][0][filters][0][condition_type]=like`, requestOptions)*/
 
 });
 export const doFetchSortProducts = wrapRequest((pageNo, pageSize, sortBy, categoryIds, productNames, sideFilter) => {
diff --git a/src/services/registration.service.js b/src/services/registration.service.js
index 8bcae1f..0f77d98 100644
--- a/src/services/registration.service.js
+++ b/src/services/registration.service.js
@@ -1,4 +1,4 @@
-const vueAppMagenotApiUrl = process.env.VUE_APP_MAGENTO_API_URL;
+const vueAppMagenotApiUrl = import.meta.env.VITE_APP_MAGENTO_API_URL;
 import { authHeader } from './auth';
 import { meWrapRequest } from './nav';
 export const registrationService = {
@@ -56,7 +56,7 @@ function doForgotPassword(forgot) {
             }
         )
     };
-    return fetch(`${process.env.VUE_APP_MAGENTO_API_URL}/rpc/confirm_user_email`, requestOptions).then(handleResponse);
+    return fetch(`${import.meta.env.VITE_APP_MAGENTO_API_URL}/rpc/confirm_user_email`, requestOptions).then(handleResponse);
 }*/
 
 //async function doconfirmEmail(token) {
diff --git a/src/services/search.service.js b/src/services/search.service.js
index ed35d2d..60f77a2 100644
--- a/src/services/search.service.js
+++ b/src/services/search.service.js
@@ -1,9 +1,9 @@
 
-// const vueAppMagenotApiUrl = process.env.VUE_APP_MAGENTO_API_URL;
-//const vueAppCCUrl = process.env.VUE_APP_CC_URL;
-// const retailorId = process.env.VUE_APP_RETAILOR_ID;
-// const vueAppNodeslsApiUrl = process.env.VUE_APP_NODESLS_API_URL;
-// const assetNodeslsUrl = process.env.VUE_APP_ASSETS_NODESLS_URL;
+// const vueAppMagenotApiUrl = import.meta.env.VITE_APP_MAGENTO_API_URL;
+//const vueAppCCUrl = import.meta.env.VITE_APP_CC_URL;
+// const retailorId = import.meta.env.VITE_APP_RETAILOR_ID;
+// const vueAppNodeslsApiUrl = import.meta.env.VITE_APP_NODESLS_API_URL;
+// const assetNodeslsUrl = import.meta.env.VITE_APP_ASSETS_NODESLS_URL;
 
 /* eslint-disable no-alert, no-console ,  no-debugger */
 export const doIncreaseCountsForFilter = ({ product, availableFilter }) => {
diff --git a/src/services/user.service.js b/src/services/user.service.js
index 715b230..f039598 100644
--- a/src/services/user.service.js
+++ b/src/services/user.service.js
@@ -1,11 +1,11 @@
 import { authHeader } from './auth';
 import { wrapRequest, meWrapRequest } from './nav';
 
-const vueAppMagenotApiUrl = process.env.VUE_APP_MAGENTO_API_URL;
-//const vueAppCCUrl = process.env.VUE_APP_CC_URL;
-const retailorId = process.env.VUE_APP_RETAILOR_ID;
-const vueAppNodeslsApiUrl = process.env.VUE_APP_NODESLS_API_URL;
-const assetNodeslsUrl = process.env.VUE_APP_ASSETS_NODESLS_URL;
+const vueAppMagenotApiUrl = import.meta.env.VITE_APP_MAGENTO_API_URL;
+//const vueAppCCUrl = import.meta.env.VITE_APP_CC_URL;
+const retailorId = import.meta.env.VITE_APP_RETAILOR_ID;
+const vueAppNodeslsApiUrl = import.meta.env.VITE_APP_NODESLS_API_URL;
+const assetNodeslsUrl = import.meta.env.VITE_APP_ASSETS_NODESLS_URL;
 
 // export const doValidateAddress = wrapRequest((address) => {
 //     const requestOptions = {
diff --git a/src/services/user_cart.service.js b/src/services/user_cart.service.js
index b4e2471..af2b8a3 100644
--- a/src/services/user_cart.service.js
+++ b/src/services/user_cart.service.js
@@ -1,31 +1,10 @@
 import { authHeader } from './auth';
 import { wrapRequest } from './nav';
 
-const vueAppMagenotApiUrl = process.env.VUE_APP_MAGENTO_API_URL;
-const vueAppNodeslsApiUrl = process.env.VUE_APP_NODESLS_API_URL;
-const retailorId = process.env.VUE_APP_RETAILOR_ID;
-export const doPostCartItem = wrapRequest((sku, qty, ccid, price, personalizeDetails,builderId, quoteId) => {
-    const requestOptions = {
-        method: 'POST',
-        headers: {
-            'Content-type': 'application/json',
-            'Access-Control-Allow-Origin': '*',
-            ...authHeader()
-        },
-        body: JSON.stringify({
-            "cartItem": {
-                "quote_id": quoteId,
-                "sku": sku,
-                "qty": qty,
-            },
-            "ccid": ccid,
-            "order_total": price,
-            "personalize_Data": personalizeDetails,
-            "builder_id": builderId
-        })
-    };
-    return fetch(`${vueAppMagenotApiUrl}/rest/crn_retailer/V1/carts/mine/items`, requestOptions)
-});
+const vueAppMagenotApiUrl = import.meta.env.VITE_APP_MAGENTO_API_URL;
+const vueAppNodeslsApiUrl = import.meta.env.VITE_APP_NODESLS_API_URL;
+const retailorId = import.meta.env.VITE_APP_RETAILOR_ID;
+ 
 
 export const doPostConfiguredCartItem = wrapRequest((itemNumber, quantity, typeId, optionId, optionValue, quoteId) => {
 
diff --git a/src/services/util.service.js b/src/services/util.service.js
index f63aa9f..5a4a9a4 100644
--- a/src/services/util.service.js
+++ b/src/services/util.service.js
@@ -1,6 +1,7 @@
 /* eslint-disable no-alert, no-console , no-debugger  */
 import { getDomain, getCookieByName, removeCookieByName } from "@/services/auth";
-
+import { useCookies } from "vue3-cookies";
+const { cookies } = useCookies();
 export const doFormatAddress = (address) => {
     let newaddress = address.streetNoOne + " " + address.city + " " + address.regionId + " " + address.countryId;
     return newaddress;
@@ -938,7 +939,7 @@ export const setCategoryNameInLocal = async (categoryId, res) => {
         Number(categoryId)
     );
     if (categoryOne && res) {
-        window.$cookies.set(res.item_id, categoryOne.n + ':' + categoryId, '30d', null, getDomain(window.location.hostname));
+        cookies.set(res.item_id, categoryOne.n + ':' + categoryId, '30d', null, getDomain(window.location.hostname));
     }
     console.log('category name ', res.item_id, categoryOne.n);
 }
diff --git a/src/stores/index.js b/src/stores/index.js
index c2beb39..f6aa54e 100644
--- a/src/stores/index.js
+++ b/src/stores/index.js
@@ -1,7 +1,4 @@
-import Vue from 'vue'
-import Vuex from 'vuex'
-
-// Global vuex
+import { createStore } from 'vuex'
 
 
 import { layout } from './retailer/layout';
@@ -16,12 +13,8 @@ import { headerCategoryList } from './retailer/header';
 import { meProductOne } from './retailer/me_product.one';
 import { catalogBrowser } from './retailer/catalog_browser';
 import {orderlist} from "./retailer/orderlist"
-Vue.use(Vuex)
-
-/**
- * Main Vuex Store
- */
-const store = new Vuex.Store({
+ 
+const store = createStore({
   modules: {
     auth,
     registration,
@@ -39,4 +32,4 @@ const store = new Vuex.Store({
   }
 })
 
-export default store
+export default store
\ No newline at end of file
diff --git a/src/stores/retailer/account.one.js b/src/stores/retailer/account.one.js
index 13384ff..f32a653 100644
--- a/src/stores/retailer/account.one.js
+++ b/src/stores/retailer/account.one.js
@@ -1,4 +1,4 @@
-import { doFetchCountries, doFetchStates, doFetchBasicInfo, doFetchChangePassword, doValidateAddress, doValidateAddressCheckout, doUpdateUserAddress, doUpdateSubscription, doChangeBasicInfo, doFetchEstimatedShippingMethods, doShippingInformation, doProductsOrder, doChangePassword, doProductsOrderOnCC, doFetchGiftCardDetails, doFetchProductPdfs } from '@/services/user.service';
+import { doFetchCountries, doFetchStates, doFetchBasicInfo, doFetchChangePassword, doValidateAddress, doValidateAddressCheckout, doUpdateUserAddress, doUpdateSubscription, doChangeBasicInfo, doFetchEstimatedShippingMethods, doShippingInformation, doProductsOrder, doChangePassword, doProductsOrderOnCC, doFetchProductPdfs } from '@/services/user.service';
 import { doPlaceCraneOrder } from '@/services/product.service';
 import { invalidPoBoxAddress } from '@/services/util.service';
 import { doFetchQuote } from '@/services/user_cart.service';
@@ -549,19 +549,6 @@ export const accountOne = {
                 commit('errorMessage', error.message);
             }
         },
-        fetchGiftCardDetails: async({ commit }, giftCardCode) => {
-            commit('inProgress', true);
-            try {
-                const giftCardDetails = await doFetchGiftCardDetails(giftCardCode);
-                if (giftCardDetails) {
-                    commit('setGiftCardDetails', humps(giftCardDetails));
-                    commit('inProgress', false);
-                }
-            } catch (err) {
-                throw err;
-                //commit('errorMessage', err.message);
-            }
-        },
         setUserAddress: async({ commit }, address) => {
             commit('setSuggestedAddress', address);
         },
diff --git a/src/stores/retailer/product.list.js b/src/stores/retailer/product.list.js
index b757948..11bb374 100644
--- a/src/stores/retailer/product.list.js
+++ b/src/stores/retailer/product.list.js
@@ -4,12 +4,7 @@ import {
     doFetchAttributeFilterProducts,
     doFetchSortProducts,
     doFetchSearchProducts,
-    doFetchAttributeList,
-    doPostCartItem,
-    doFetchQuote,
-    doFetchCartProducts,
-    doFetchTotalAmt,
-    doDeleteCartProduct,
+    doFetchAttributeList, 
     doFetchRecentlyViewedList,
     doSideBarFilter
 } from '@/services/product.service';
@@ -151,25 +146,7 @@ export const productList = {
                 commit('setAttributeList', humps(attributeList));
             }
         },
-        addToCart: async({ commit }, data) => {
-            const guestQuote = await doFetchQuote();
-            if (guestQuote) {
-                commit('setGuestQuote', (guestQuote));
-                const cartProduct = await doPostCartItem(data.sku, data.qty, guestQuote);
-
-                if (cartProduct) {
-                    commit('setCartProduct', (cartProduct));
-                    const cartProductList = await doFetchCartProducts(guestQuote);
-                    if (cartProductList) {
-                        commit('setCartProductList', (cartProductList));
-                        const productTotalAmt = await doFetchTotalAmt(guestQuote);
-                        if (productTotalAmt) {
-                            commit('setProductAmt', humps(productTotalAmt));
-                        }
-                    }
-                }
-            }
-        },
+  
         removeCartProduct: async({ commit }, { productId, guestQuoteId }) => {
             let trueOrFalse = await doDeleteCartProduct(productId, guestQuoteId);
 
diff --git a/src/stores/retailer/user_cart.one.js b/src/stores/retailer/user_cart.one.js
index a32fd87..5e2027f 100644
--- a/src/stores/retailer/user_cart.one.js
+++ b/src/stores/retailer/user_cart.one.js
@@ -1,5 +1,4 @@
 import {
-    doPostCartItem,
     doFetchQuote,
     doFetchCartProducts,
     doFetchTotalAmt,
@@ -114,24 +113,6 @@ export const userCartProduct = {
         },
     },
     actions: {
-        addToCart: async({ commit, state }, data) => {
-            try {
-                let result;
-                commit('inProgress', true);
-                if (!state.cartProductDetails.length > 0) {
-                    const userQuote = await doFetchQuote();
-                    localStorage.setItem("cr_userQuoteId", userQuote); //no use
-                    result = await doPostCartItem(data.sku, data.qty, data.ccid, data.price, data.personalizeDetails, data.builderId?data.builderId:null, userQuote);
-                } else {
-                    result = await doPostCartItem(data.sku, data.qty, data.ccid, data.price, data.personalizeDetails, data.builderId?data.builderId:null, state.cartProductDetails[0].quoteId);
-                }
-                commit('inProgress', false);
-                return result;
-            } catch (err) {
-                commit('inProgress', false);
-                throw err;
-            }
-        },
         addToConfiguredCart: async({ commit, state }, data) => {
             try {
                 commit('inProgress', true);
diff --git a/src/styles/_app.scss b/src/styles/_app.scss
deleted file mode 100644
index cef1abb..0000000
--- a/src/styles/_app.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-@import './custom_functions.scss';
-@import './overrides.scss';
-
diff --git a/src/styles/custom_functions.scss b/src/styles/custom_functions.scss
deleted file mode 100644
index 3000527..0000000
--- a/src/styles/custom_functions.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-@import '~vuetify/src/styles/settings/_variables.scss';
-
-@mixin mq($mq-breakpoint) { 
-  @if map-has-key($grid-breakpoints, $mq-breakpoint) {
-    $mq-breakpoint: map-get($grid-breakpoints, $mq-breakpoint);
-  }
-  
-  @media screen and (min-width: #{$mq-breakpoint}) {
-    @content;
-  }
-}
\ No newline at end of file
diff --git a/src/styles/overrides.scss b/src/styles/overrides.scss
deleted file mode 100644
index d242273..0000000
--- a/src/styles/overrides.scss
+++ /dev/null
@@ -1,436 +0,0 @@
-.mdi:before,.mdi-set {
-    display: inline-block;
-    font: normal normal normal 24px/1 "Material Design Icons";
-    font-size: inherit;
-    text-rendering: auto;
-    line-height: inherit;
-    -webkit-font-smoothing: antialiased;
-    -moz-osx-font-smoothing: grayscale
-}
-
-@import './custom_functions.scss';
-@import url('https://fonts.googleapis.com/css2?family=PT+Serif:wght@400;700&display=swap');
-
-@font-face {
-    font-family: 'Whyte-Regular';
-    src: url('../assets/font/Whyte-Regular.woff2') format("woff2");
-    font-weight: 400;
-    font-style: normal;
-    font-display: swap;
-}
-
-@font-face {
-    font-family: 'Whyte-Book';
-    src: url('../assets/font/Whyte-Book.woff2') format("woff2");
-    font-weight: 400;
-    font-style: normal;
-    font-display: swap;
-}
-
-.v-application {
-    .h1,
-    .h2,
-    .h3,
-    .h4,
-    .whyte-regular-font {
-        font-family: 'Whyte-Regular', sans-serif;
-    }
-    .whyte-book-font {
-        font-family: 'Whyte-Book', sans-serif;
-    }
-    .body {
-        font-family: 'Whyte-Regular', sans-serif;
-    }
-    .body-font {
-        font-family: 'Whyte-Book', sans-serif;
-    }
-    .body-font1 {
-        font-family: 'PT Serif', serif;
-    }
-    .regular-font {
-        font-family: 'Whyte-Regular', sans-serif;
-    }
-    .whyteTmin10-font {
-        font-family: 'WhyteTmin10', sans-serif;
-    }
-    .whyteBookTmin10-font {
-        font-family: 'WhyteBookTmin10', sans-serif;
-    }
-    .ls-n01 {
-        letter-spacing: -0.1px;
-    }
-    .ls-n03 {
-        letter-spacing: -0.03px;
-    }
-    .ls-n009 {
-        letter-spacing: -0.09px;
-    }
-    // .ls-n10 {
-    //     letter-spacing: -1px !important;
-    // }
-    .ls-n008 {
-        letter-spacing: -0.08px;
-    }
-    .ls-0 {
-        letter-spacing: 0px;
-    }
-    .ls-n012 {
-        letter-spacing: -0.12px;
-    }
-    .ls-n015 {
-        letter-spacing: -0.15px;
-    }
-    .ls-n028 {
-        letter-spacing: -0.28px;
-    }
-    .ls-n016 {
-        letter-spacing: -0.16px;
-    }
-    .ls-n029 {
-        letter-spacing: -0.29px;
-    }
-    .primary-focus-button:hover,
-    .primary-focus-button:active,
-    .primary-focus-button:focus {
-        color: #fff !important;
-        background-color: #2850DA !important;
-    }
-    .primary-focus:hover,
-    .primary-focus:active,
-    .primary-focus:focus {
-        color: #2850DA !important;
-    }
-    .title-color-black {
-        color: #000000;
-    }
-    .transparent-background {
-        background: transparent !important;
-    }
-    .fontcolor-black-darken {
-        color: #1D1D1D!important;
-    }
-    .fontcolor-black-light {
-        color: #333333;
-    }
-    .fontcolor-grey-darken {
-        color: #666666;
-    }
-    .fontcolor-grey-shade8b {
-        color: #8b8b8b;
-    }
-    .fontcolor-mauve {
-        color: #E5DBFE;
-    }
-    .fontcolor-mauve-CCB7FF {
-        color: #CCB7FF;
-    }
-    .background-mauve-CCB7FF {
-        background-color: #CCB7FF;
-    }
-    .fontcolor-monarch {
-        color: #EB7525;
-    }
-    .fontcolor-lapis {
-        color: #2E5D86;
-    }
-    .fontcolor-bordeaux {
-        color: #C53C44;
-    }
-    .fontcolor-ecru {
-        color: #F5F3F2;
-    }
-    .fontcolor-404040 {
-        color: #404040;
-    }
-    .fontcolor-cloud {
-        color: #CEE4F2;
-    }
-    .background-ecru {
-        background-color: #F5F3F2;
-    }
-    .background-bordeaux {
-        background-color: #C53C44;
-    }
-    .background-lapis {
-        background-color: #2E5D86;
-    }
-    .background-mauve {
-        background-color: #E5DBFE;
-    }
-    .background-monarch {
-        background-color: #EB7525;
-    }
-    .background-cloud {
-        background-color: #CEE4F2;
-    }
-   
-    .fontsize-10 {
-        font-size: 0.625rem;
-    }
-    .fontsize-12 {
-        font-size: 0.75rem;
-    }
-    .fontsize-28 {
-        font-size: 1.75rem;
-    }
-    .fontsize-14 {
-        font-size: 0.875rem;
-    }
-    .fontsize-15 {
-        font-size: 0.970rem;
-    }
-    .fontsize-16 {
-        font-size: 1rem !important;
-    }
-    .fontsize-18 {
-        font-size: 1.125rem;
-    }
-    .fontsize-16pt {
-        font-size: 1.375rem;
-    }
-    .fontsize-50 {
-        font-size: 3.125rem;
-    }
-    .fontsize-70 {
-        font-size: 4.375rem;
-    }
-    .font-weight-400 {
-        font-weight: 400;
-    }
-    .font-weight-300 {
-        font-weight: 300;
-    }
-    .line-height-18 {
-        line-height: 1.125rem !important;
-    }
-    .line-height-18pt {
-        line-height: 1.5rem !important;
-    }
-    .line-height-20 {
-        line-height: 1.25rem !important;
-    }
-    .line-height-21 {
-        line-height: 1.3125rem !important;
-    }
-    .line-height-22 {
-        line-height: 1.375rem !important;
-    }
-    .line-height-36 {
-        line-height: 2.25rem !important;
-    }
-    .line-height-33 {
-        line-height: 2.0625rem !important;
-    }
-    .line-height-46 {
-        line-height: 2.875rem !important;
-    }
-    .line-height-54 {
-        line-height: 3.375rem !important;
-    }
-    .text-decoration-none {
-        text-decoration: none;
-    }
-    .word-break {
-        word-break: break-word!important;
-        overflow-wrap: break-word!important;
-    }
-    .content-link-hover-color {
-        color: #CCB7FF !important;
-    }
-    // custom css for vue-tel-input
-    .phonenumber-input-error-border {
-        &.vue-tel-input,
-        &.vue-tel-input:focus,
-        &.vue-tel-input:focus-within,
-        &.vue-tel-input:active {
-            border: 2px solid red !important;
-            border-radius: 4px !important;
-            box-shadow: unset !important;
-        }
-    }
-    .phonenumber-custom-input .vti__input {
-        height: 40px!important;
-    }
-    .phonenumber-custom-input.vue-tel-input {
-        border-radius: 4px !important;
-        border: thin solid rgba(0, 0, 0, 0.42) !important;
-    }
-    .phonenumber-custom-input {
-        &,
-        &:focus,
-        &:active,
-        &:focus-within {
-            border: 2px solid #2c05da !important;
-        }
-    }
-    .phonenumber-custom-input.vue-tel-input:focus-within {
-        box-shadow: unset !important;
-    }
-    .phonenumber-custom-input .vti__dropdown {
-        &:focus,
-        &:active,
-        &:focus-within {
-            border: unset !important;
-            outline: unset !important;
-        }
-    }
-    .opacity-1 {
-        opacity: 1;
-    }
-    .height-100 {
-        height: 100vh;
-    }
-    .height-130px{
-        height: 130px;
-    }
-    
-    // end vue-tel-input  css end
-    @include mq(xs) {
-        .h1 {
-            font-size: 2rem;
-            line-height: 2.25rem;
-        }
-        .h2 {
-            font-size: 1.625rem;
-            line-height: 1.875rem;
-        }
-        .h3 {
-            font-size: 1.375rem;
-            line-height: 1.75rem;
-        }
-        .h4 {
-            font-size: 1.125rem;
-            line-height: 1.375rem;
-        }
-        .body {
-            font-size: 1rem!important;
-            line-height: 1.5rem!important
-        }
-        .v-btn--outlined {
-            border: 1px solid !important;
-        }
-        .textfield-border.v-text-field>.v-input__control>.v-input__slot:before {
-            border-width: 1px 0 0 0 !important;
-        }
-    }
-    @include mq(sm) {
-        .h1 {
-            font-size: 2rem;
-            line-height: 2.25rem;
-        }
-        .h2 {
-            font-size: 1.625rem;
-            line-height: 1.875rem;
-        }
-        .h3 {
-            font-size: 1.375rem;
-            line-height: 1.75rem;
-        }
-        .h4 {
-            font-size: 1.125rem;
-            line-height: 1.375rem;
-        }
-        .body {
-            font-size: 1rem!important;
-            line-height: 1.5rem!important
-        }
-        .v-btn--outlined {
-            border: thin solid !important;
-        }
-        .textfield-border.v-text-field>.v-input__control>.v-input__slot:before {
-            border-width: thin 0 0 0 !important;
-        }
-    }
-    @include mq(md) {
-        .h1 {
-            font-size: 2.5rem;
-            line-height: 2.875rem;
-        }
-        .h2 {
-            font-size: 2rem;
-            line-height: 2.25rem;
-        }
-        .h3 {
-            font-size: 1.5rem;
-            line-height: 1.75rem;
-        }
-        .h4 {
-            font-size: 1.125rem;
-            line-height: 1.375rem;
-        }
-        .body {
-            font-size: 1rem!important;
-            line-height: 1.5rem!important
-        }
-    }
-    @include mq(lg) {
-        .h1 {
-            font-size: 3rem;
-            line-height: 3.375rem;
-        }
-        .h2 {
-            font-size: 2.25rem;
-            line-height: 2.5rem;
-        }
-        .h3 {
-            font-size: 1.75rem;
-            line-height: 2.25rem;
-        }
-        .h4 {
-            font-size: 1.125rem;
-            line-height: 1.375rem;
-        }
-        .body {
-            font-size: 1rem!important;
-            line-height: 1.5rem!important
-        }
-    }
-    @include mq(xl) {
-        .h1 {
-            font-size: 3rem;
-            line-height: 3.375rem;
-        }
-        .h2 {
-            font-size: 2.25rem;
-            line-height: 2.5rem;
-        }
-        .h3 {
-            font-size: 1.75rem;
-            line-height: 2.25rem;
-        }
-        .h4 {
-            font-size: 1.125rem;
-            line-height: 1.375rem;
-        }
-        .body {
-            font-size: 1rem!important;
-            line-height: 1.5rem!important
-        }
-    }
-    @supports (-webkit-overflow-scrolling: touch) {
-        /* CSS specific to iOS devices */
-        .ios-fill-height {
-            height: -webkit-fill-available;
-        }
-    }
-}
-
-.cursor-pointer {
-    cursor: pointer;
-}
-
-.button-background.v-btn:before {
-    background-color: transparent !important;
-}
-
-* {
-    text-transform: none !important;
-}
-
-.p-absolute {
-    position: absolute!important;
-}
-
-// .v-application{
-// 	font-family: 'Whyte-Regular'!important;
-// }
\ No newline at end of file
diff --git a/src/styles/variables1.scss b/src/styles/variables1.scss
deleted file mode 100644
index 724f8fa..0000000
--- a/src/styles/variables1.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-// @import '~vuetify/src/styles/settings/_variables.scss';
-
-
-$body-font-family: 'Whyte-Regular', sans-serif !default;
-$body-font-family-book: 'Whyte-Book', sans-serif !default;
\ No newline at end of file
diff --git a/vue.config.js b/vite.config.js
similarity index 97%
rename from vue.config.js
rename to vite.config.js
index d5388b0..4ffdc47 100644
--- a/vue.config.js
+++ b/vite.config.js
@@ -54,12 +54,12 @@ export default ({ mode }) => {
       watch: {
         usePolling: true
       },
-      host: 'local.crane.com',
-
+      
     },
     build: {
       manifest: true,
       chunkSizeWarningLimit: 2048
     }
   });
-}
\ No newline at end of file
+}
+
diff --git a/yarn.lock b/yarn.lock
index 53119f4..12e6bb7 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1966,6 +1966,11 @@
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.11.tgz#d421b6c527a3037f7c84433fd2c4229e016863d3"
   integrity sha512-wOuvG1SN4Us4rez+tylwwwCV1psiNVOkJeM3AUWUNWg/jDQY2+HE/444y5gc+jBmRqASOm2Oeh5c1axHobwRKQ==
 
+"@vitejs/plugin-vue@^4.1.0":
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-4.1.0.tgz#b6a9d83cd91575f7ee15593f6444397f68751073"
+  integrity sha512-++9JOAFdcXI3lyer9UKUV4rfoQ3T1RN8yDqoCLar86s0xQct5yblxAE+yWgRnU5/0FOlVCpTZpYSBV/bGWrSrQ==
+
 "@volar/language-core@1.3.0-alpha.0":
   version "1.3.0-alpha.0"
   resolved "https://registry.yarnpkg.com/@volar/language-core/-/language-core-1.3.0-alpha.0.tgz#4924b4cbc37dbce5f3845c1d2b2811938223a980"
@@ -2105,7 +2110,7 @@
   resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.47.tgz#e597ef75086c6e896ff5478a6bfc0a7aa4bbd14c"
   integrity sha512-BHGyyGN3Q97EZx0taMQ+OLNuZcW3d37ZEVmEAyeoA9ERdGvm9Irc/0Fua8SNyOtV1w6BS4q25wbMzJujO9HIfQ==
 
-"@vuetify/loader-shared@^1.4.0":
+"@vuetify/loader-shared@^1.4.0", "@vuetify/loader-shared@^1.7.1":
   version "1.7.1"
   resolved "https://registry.yarnpkg.com/@vuetify/loader-shared/-/loader-shared-1.7.1.tgz#0f63a3d41b6df29a2db1ff438aa1819b237c37a3"
   integrity sha512-kLUvuAed6RCvkeeTNJzuy14pqnkur8lTuner7v7pNE/kVhPR97TuyXwBSBMR1cJeiLiOfu6SF5XlCYbXByEx1g==
@@ -2221,6 +2226,16 @@ awesome-phonenumber@^2.39.0:
   resolved "https://registry.yarnpkg.com/awesome-phonenumber/-/awesome-phonenumber-2.66.0.tgz#b3198131117935fd313625304e1f2c42dd725f47"
   integrity sha512-mC3+t8KAvodwQFSt4j63g+rNSjZf3+5CrVOduANB3JkCFN6LWsmJGLqBtW3F7S1J35hutoYKLwbCBHT7VtO1gQ==
 
+aws-sdk@~2.4.9:
+  version "2.4.14"
+  resolved "https://registry.yarnpkg.com/aws-sdk/-/aws-sdk-2.4.14.tgz#68bfff706cddf7cb38a35617999987e6379c5843"
+  integrity sha512-Aj+liiZUD25sFXrCP6UZZE/xa/v+gXGO+pKGQeOrRnET/AWq+fvUm+dbdFY2JsqIY767aFhnjW12yY81rc5q3Q==
+  dependencies:
+    jmespath "0.15.0"
+    sax "1.1.5"
+    xml2js "0.4.15"
+    xmlbuilder "2.6.2"
+
 babel-eslint@^10.0.3:
   version "10.1.0"
   resolved "https://registry.yarnpkg.com/babel-eslint/-/babel-eslint-10.1.0.tgz#6968e568a910b78fb3779cdd8b6ac2f479943232"
@@ -2675,6 +2690,13 @@ fast-xml-parser@4.1.2:
   dependencies:
     strnum "^1.0.5"
 
+fd-slicer@~1.0.0:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.0.1.tgz#8b5bcbd9ec327c5041bf9ab023fd6750f1177e65"
+  integrity sha512-MX1ZLPIuKED51hrI4++K+1B0VX87Cs4EkybD2q12Ysuf5p4vkmHqMvQJRlDwROqFr4D2Pzyit5wGQxf30grIcw==
+  dependencies:
+    pend "~1.2.0"
+
 file-entry-cache@^6.0.1:
   version "6.0.1"
   resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027"
@@ -2714,6 +2736,11 @@ find-up@^4.0.0:
     locate-path "^5.0.0"
     path-exists "^4.0.0"
 
+findit2@~2.2.3:
+  version "2.2.3"
+  resolved "https://registry.yarnpkg.com/findit2/-/findit2-2.2.3.tgz#58a466697df8a6205cdfdbf395536b8bd777a5f6"
+  integrity sha512-lg/Moejf4qXovVutL0Lz4IsaPoNYMuxt4PA0nGqFxnJ1CTTGGlEO2wKgoDpwknhvZ8k4Q2F+eesgkLbG2Mxfog==
+
 flat-cache@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/flat-cache/-/flat-cache-3.0.4.tgz#61b0338302b2fe9f957dcc32fc2a87f1c3048b11"
@@ -2788,6 +2815,11 @@ globals@^13.6.0, globals@^13.9.0:
   dependencies:
     type-fest "^0.20.2"
 
+graceful-fs@~4.1.4:
+  version "4.1.15"
+  resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.1.15.tgz#ffb703e1066e8a0eeaa4c8b80ba9253eeefbfb00"
+  integrity sha512-6uHUhOPEBgQ24HM+r6b/QwWfZq+yiFcipKFrOFiBEnWdy5sdzYoi+pJeQaPI5qOLRFqWmAXUPQNsielzdLoecA==
+
 has-flag@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
@@ -2895,6 +2927,11 @@ isexe@^2.0.0:
   resolved "https://registry.yarnpkg.com/isexe/-/isexe-2.0.0.tgz#e8fbf374dc556ff8947a10dcb0572d633f2cfa10"
   integrity sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=
 
+jmespath@0.15.0:
+  version "0.15.0"
+  resolved "https://registry.yarnpkg.com/jmespath/-/jmespath-0.15.0.tgz#a3f222a9aae9f966f5d27c796510e28091764217"
+  integrity sha512-+kHj8HXArPfpPEKGLZ+kB5ONRTCiGQXo8RQYL0hH8t6pWXUBBK5KkkQmTNOwKK4LEsd0yTsgtjJVm4UBSZea4w==
+
 js-base64@^2.5.1:
   version "2.5.2"
   resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.5.2.tgz#313b6274dda718f714d00b3330bbae6e38e90209"
@@ -3001,6 +3038,11 @@ lodash@^4.17.21:
   resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
   integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
 
+lodash@~3.5.0:
+  version "3.5.0"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.5.0.tgz#19bb3f4d51278f0b8c818ed145c74ecf9fe40e6d"
+  integrity sha512-eC2gi6pEoXXAWKz1fKvWnA0wOdBPsvTVFT71szjM6dFoDE9llinK81xW4EH4QxF+wNZoVeLIxUp21BDPniMn4g==
+
 lru-cache@^6.0.0:
   version "6.0.0"
   resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94"
@@ -3027,6 +3069,11 @@ mime@^3.0.0:
   resolved "https://registry.yarnpkg.com/mime/-/mime-3.0.0.tgz#b374550dca3a0c18443b0c950a6a58f1931cf7a7"
   integrity sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A==
 
+mime@~1.2.11:
+  version "1.2.11"
+  resolved "https://registry.yarnpkg.com/mime/-/mime-1.2.11.tgz#58203eed86e3a5ef17aed2b7d9ebd47f0a60dd10"
+  integrity sha512-Ysa2F/nqTNGHhhm9MV8ure4+Hc+Y8AWiqUdHxsO7xu8zc92ND9f3kpALHjaP026Ft17UfxrMt95c50PLUeynBw==
+
 minimatch@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/minimatch/-/minimatch-3.0.4.tgz#5166e286457f03306064be5497e8dbb0c3d32083"
@@ -3046,6 +3093,18 @@ minimist@^1.2.5:
   resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
   integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==
 
+minimist@^1.2.6:
+  version "1.2.8"
+  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.8.tgz#c1a464e7693302e082a075cee0c057741ac4772c"
+  integrity sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==
+
+mkdirp@~0.5.0:
+  version "0.5.6"
+  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.6.tgz#7def03d2432dcae4ba1d611445c48396062255f6"
+  integrity sha512-FP+p8RB8OWpF3YZBCrP5gtADmtXApB5AMLn+vdyA+PyxCjrCs00mjyUozssO33cwDeT3wNGdLxJ5M//YqtHAJw==
+  dependencies:
+    minimist "^1.2.6"
+
 ms@2.1.2, ms@^2.1.1:
   version "2.1.2"
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
@@ -3153,6 +3212,11 @@ path-parse@^1.0.7:
   resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735"
   integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==
 
+pend@~1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
+  integrity sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==
+
 picocolors@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
@@ -3257,6 +3321,11 @@ rimraf@^3.0.2:
   dependencies:
     glob "^7.1.3"
 
+rimraf@~2.2.8:
+  version "2.2.8"
+  resolved "https://registry.yarnpkg.com/rimraf/-/rimraf-2.2.8.tgz#e439be2aaee327321952730f99a8929e4fc50582"
+  integrity sha512-R5KMKHnPAQaZMqLOsyuyUmcIjSeDm+73eoqQpaXA7AZ22BL+6C+1mcUscgOsNd8WVlJuvlgAPsegcx7pjlV0Dg==
+
 rollup@^3.18.0:
   version "3.20.4"
   resolved "https://registry.yarnpkg.com/rollup/-/rollup-3.20.4.tgz#cde35731c5c0c637de0b532d5d1a84bd802c128e"
@@ -3264,6 +3333,21 @@ rollup@^3.18.0:
   optionalDependencies:
     fsevents "~2.3.2"
 
+s3-node@^0.0.1:
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/s3-node/-/s3-node-0.0.1.tgz#675446263c0c17a354879430e4ac2ea6be2e145e"
+  integrity sha512-KypyxvKZfC84V9sWMEGi+z8nGKNBZgFWOUXfrJ4tndSjBzlGOWpJd3ZgYcKSrN5wHlKf0ESlt5596dBgQMxVOw==
+  dependencies:
+    aws-sdk "~2.4.9"
+    fd-slicer "~1.0.0"
+    findit2 "~2.2.3"
+    graceful-fs "~4.1.4"
+    mime "~1.2.11"
+    mkdirp "~0.5.0"
+    pend "~1.2.0"
+    rimraf "~2.2.8"
+    streamsink "~1.2.0"
+
 sass-loader@^13.2.2:
   version "13.2.2"
   resolved "https://registry.yarnpkg.com/sass-loader/-/sass-loader-13.2.2.tgz#f97e803993b24012c10d7ba9676548bf7a6b18b9"
@@ -3281,6 +3365,16 @@ sass@^1.62.0:
     immutable "^4.0.0"
     source-map-js ">=0.6.2 <2.0.0"
 
+sax@1.1.5:
+  version "1.1.5"
+  resolved "https://registry.yarnpkg.com/sax/-/sax-1.1.5.tgz#1da50a8d00cdecd59405659f5ff85349fe773743"
+  integrity sha512-z19WXQiOz8RBu3zDpOE9541RgB7Q5NecZ7SAgU3yUvqhMNvG4hTChbrutzpDyDSHmeHouR5Rqk4eup1o6C6dxQ==
+
+sax@>=0.6.0:
+  version "1.2.4"
+  resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
+  integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==
+
 schema-utils@^3.0.0:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-3.1.2.tgz#36c10abca6f7577aeae136c804b0c741edeadc99"
@@ -3348,6 +3442,11 @@ sprintf-js@~1.0.2:
   resolved "https://registry.yarnpkg.com/sprintf-js/-/sprintf-js-1.0.3.tgz#04e6926f662895354f3dd015203633b857297e2c"
   integrity sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=
 
+streamsink@~1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/streamsink/-/streamsink-1.2.0.tgz#efafee9f1e22d3591ed7de3dcaa95c3f5e79f73c"
+  integrity sha512-MJ440L2+j2vmc1v8Z/BkMx3X+HsJ++V7mgDROboQKxqCLZdNbu+AeSwQbayXw3LPHVAMxw+h7ZJUnyFYl/zp2g==
+
 string-width@^4.2.3:
   version "4.2.3"
   resolved "https://registry.yarnpkg.com/string-width/-/string-width-4.2.3.tgz#269c7117d27b05ad2e536830a8ec895ef9c6d010"
@@ -3495,6 +3594,23 @@ vite-plugin-aws3@^0.3.0:
     mime "^3.0.0"
     progress "^2.0.3"
 
+vite-plugin-s3@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/vite-plugin-s3/-/vite-plugin-s3-0.3.0.tgz#5bac800aaf678cc203dfacb23ad0c58073985efb"
+  integrity sha512-Y7UWgxVbAkIWP7KwTL1AatuNU9RJPZAe/+qh9PhCIBSE9Rg52th8/6oOunqQ+Lwx19oE8zdEVaDZSSY/6S1ZRg==
+  dependencies:
+    progress "^2.0.3"
+    s3-node "^0.0.1"
+
+vite-plugin-vuetify@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/vite-plugin-vuetify/-/vite-plugin-vuetify-1.0.2.tgz#d1777c63aa1b3a308756461b3d0299fd101ee8f4"
+  integrity sha512-MubIcKD33O8wtgQXlbEXE7ccTEpHZ8nPpe77y9Wy3my2MWw/PgehP9VqTp92BLqr0R1dSL970Lynvisx3UxBFw==
+  dependencies:
+    "@vuetify/loader-shared" "^1.7.1"
+    debug "^4.3.3"
+    upath "^2.0.1"
+
 vite@^4.2.1:
   version "4.2.1"
   resolved "https://registry.yarnpkg.com/vite/-/vite-4.2.1.tgz#6c2eb337b0dfd80a9ded5922163b94949d7fc254"
@@ -3635,6 +3751,26 @@ wrappy@1:
   resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
   integrity sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=
 
+xml2js@0.4.15:
+  version "0.4.15"
+  resolved "https://registry.yarnpkg.com/xml2js/-/xml2js-0.4.15.tgz#95cd03ff2dd144ec28bc6273bf2b2890c581ad0c"
+  integrity sha512-7kiknY222Be8HfanusoisInC58cAnxE0W0u+5NrSF9piZh4RQDHfDzbRiOWjqY5CiHybCjlxI24mmjLOuZ4/rQ==
+  dependencies:
+    sax ">=0.6.0"
+    xmlbuilder ">=2.4.6"
+
+xmlbuilder@2.6.2:
+  version "2.6.2"
+  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-2.6.2.tgz#f916f6d10d45dc171b1be2e6e673fb6e0cc35d0a"
+  integrity sha512-wJQzq0KF5ZlHUR2LfkTldfT91recShIEBu1rWv3buMlZ7lfyJa8XreOuNjxRrnxdkqETPq+uF7RgDcXgY50T4w==
+  dependencies:
+    lodash "~3.5.0"
+
+xmlbuilder@>=2.4.6:
+  version "15.1.1"
+  resolved "https://registry.yarnpkg.com/xmlbuilder/-/xmlbuilder-15.1.1.tgz#9dcdce49eea66d8d10b42cae94a79c3c8d0c2ec5"
+  integrity sha512-yMqGBqtXyeN1e3TGYvgNgDVZ3j84W4cwkOXQswghol6APgZWaff9lnbvN7MHYJOiXsvGPXtjTYJEiC9J2wv9Eg==
+
 yallist@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"