:recycle: using scrollBehavior to intercept hashes from router

vue-theme/src/components/sidebars/sidebar.vue

                 li(v-for="option in sortOptions")
                     router-link(:to="`/${type}/sorted/${sortTypes[option]}`")
                         p {{ option }}
+                li
                     router-link(:to="`/${type}`")
                         p by all
+                li
                     router-link(v-if="shouldShowDateSort.includes(type) && layout !== 'single'" :to="`/${type}/sorted/by-current-and-upcoming`")
                         p by current and upcoming
         

vue-theme/src/router/index.js

 const router = createRouter({
     history: createWebHistory(),
     routes,
+    scrollBehavior(to, from, savedPosition) {
+        let pos = { x: 0, y: 0 }
+        if (savedPosition) {
+            pos = savedPosition
+        }
+        if (to.hash) {
+            pos = { el: to.hash }
+        }
+        return pos
+    }
 })
 
 router.beforeEach((to, from, next) => {
     document.title = 'Craft in America'
 
-    // Scroll to top
-    window.scrollTo(0, 0)
-
     // Append list type
     if (to.path.split('/').length > 1 && to.path.split('/')[1]) {
         const path = convertTitleCase(to.path.split('/')[1])
         document.title = `${document.title} - ${to.path.split('/')[2]}`
     }
 
-    // Jump link intercept
-    if (to.hash) {
-        console.log('jump to:', to.hash)
-        const el = document.querySelector(to.hash)
-        const barHeight = 50
-        window.scrollTo(0, el.offsetTop - barHeight)
-    }
     // Regular links
-    else {
-        next()
-    }
+    next()
+
 })
 
 export default router