fix issue where this package would mess with the navigation of every …

…page it has been used

package.json

@@ -10,11 +10,11 @@
         "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
     },
     "devDependencies": {
-        "cross-env": "^6.0.3",
-        "laravel-mix": "^5.0.1"
-    },
-    "dependencies": {
-        "laravel-nova": "^1.0.11",
+        "cross-env": "^7.0.2",
+        "laravel-mix": "^5.0.4",
+        "laravel-nova": "^1.3.0",
+        "sass": "^1.26.10",
+        "sass-loader": "^9.0.2",
         "vue": "^2.6.11",
         "vue-template-compiler": "^2.6.11"
     }

resources/js/card.js

@@ -1,28 +1,7 @@
-import ProxyDetail from './components/ProxyDetail'
 import ResourceNavigationCard from './components/ResourceNavigationCard'
 
 Nova.booting((Vue, router, store) => {
 
-    router.beforeEach((from, to, next) => {
-
-        if (from.name === 'detail') {
-
-            return next({ ...from, name: 'detail-navigation-card' })
-
-        }
-
-        next()
-
-    })
-
-    router.addRoutes([
-        {
-            name: 'detail-navigation-card',
-            path: '/resources/:resourceName/:resourceId',
-            component: ProxyDetail,
-            props: true
-        }
-    ])
-
     Vue.component('resource-navigation-card', ResourceNavigationCard)
+
 })

resources/js/components/ResourceNavigationCard.vue

@@ -5,6 +5,7 @@
         <router-link
                 class="p-6 dim flex-1 text-center no-underline text-primary border-b-2 cursor-pointer border-transparent hover:border-90"
                 v-for="(resource, key) of card.resources"
+                replace
                 :key="key"
                 :to="{
                     query: { ...$route.query, navigationTab: resource.slug },
@@ -22,6 +23,17 @@
 
 <script>
 
+    function setCookie(name, value, expiration) {
+        const date = new Date()
+        date.setTime(date.getTime() + (expiration * 24 * 60 * 60 * 1000))
+        const expires = 'expires=' + date.toUTCString()
+        document.cookie = name + '=' + value + ';' + expires + ';path=/'
+    }
+
+    function deleteCookie(name) {
+        document.cookie = name + '=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;'
+    }
+
     export default {
         name: 'NavigationCard',
         props: [
@@ -57,25 +69,7 @@
         },
         beforeCreate() {
 
-            const interceptor = Nova.request().interceptors.request.use(
-                config => {
-
-                    if (/^\/nova-api\/\S.+\/\d+\/metrics\/\S.+$/.test(config.url)) {
-
-                        if (config.method === 'get' && this.$route.query.navigationTab) {
-
-                            config.params[ 'navigationTab' ] = this.$route.query.navigationTab
-
-                        }
-
-                    }
-
-                    return config
-
-                }
-            )
-
-            this.$on('hook:destroyed', () => Nova.request().interceptors.request.eject(interceptor))
+            this.$on('hook:destroyed', () => deleteCookie('navigation_tab'))
 
         },
         methods: {
@@ -92,6 +86,8 @@
             },
             onNavigate() {
 
+                setCookie('navigation_tab', this.$route.query.navigationTab)
+
                 const detail = this.getDetailCard()
                 const activeTab = this.$route.query.navigationTab
                 const activeCards = this.card.cardsToRemove[ activeTab ]