diff --git a/frontend/package.json b/frontend/package.json
index 18cb4a51..a8482f7c 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -19,6 +19,7 @@
     "@editorjs/paragraph": "^2.11.3",
     "@editorjs/simple-image": "^1.6.0",
     "@editorjs/table": "^2.4.2",
+    "@vueuse/router": "^12.7.0",
     "ace-builds": "^1.36.2",
     "apexcharts": "^4.3.0",
     "chart.js": "^4.4.1",
diff --git a/frontend/src/components/Modals/BatchCourseModal.vue b/frontend/src/components/Modals/BatchCourseModal.vue
index 3b84d902..4d86789d 100644
--- a/frontend/src/components/Modals/BatchCourseModal.vue
+++ b/frontend/src/components/Modals/BatchCourseModal.vue
@@ -31,7 +31,7 @@
 </template>
 <script setup>
 import { Dialog, createResource } from 'frappe-ui'
-import { ref, defineModel } from 'vue'
+import { ref } from 'vue'
 import Link from '@/components/Controls/Link.vue'
 import { showToast } from '@/utils'
 
diff --git a/frontend/src/components/Modals/ChapterModal.vue b/frontend/src/components/Modals/ChapterModal.vue
index 8afc4053..5bbc44b2 100644
--- a/frontend/src/components/Modals/ChapterModal.vue
+++ b/frontend/src/components/Modals/ChapterModal.vue
@@ -77,7 +77,7 @@ import {
 	FormControl,
 	Switch,
 } from 'frappe-ui'
-import { defineModel, reactive, watch } from 'vue'
+import { reactive, watch } from 'vue'
 import { showToast, getFileSize } from '@/utils/'
 import { capture } from '@/telemetry'
 import { FileText, X } from 'lucide-vue-next'
diff --git a/frontend/src/components/Modals/DiscussionModal.vue b/frontend/src/components/Modals/DiscussionModal.vue
index cf5166c2..251413d4 100644
--- a/frontend/src/components/Modals/DiscussionModal.vue
+++ b/frontend/src/components/Modals/DiscussionModal.vue
@@ -35,7 +35,7 @@
 </template>
 <script setup>
 import { Dialog, FormControl, TextEditor, createResource } from 'frappe-ui'
-import { reactive, defineModel } from 'vue'
+import { reactive } from 'vue'
 import { showToast, singularize } from '@/utils'
 
 const topics = defineModel('reloadTopics')
diff --git a/frontend/src/components/Modals/EditProfile.vue b/frontend/src/components/Modals/EditProfile.vue
index 365007a9..afca50c1 100644
--- a/frontend/src/components/Modals/EditProfile.vue
+++ b/frontend/src/components/Modals/EditProfile.vue
@@ -94,7 +94,7 @@ import {
 	createResource,
 	TextEditor,
 } from 'frappe-ui'
-import { reactive, watch, defineModel } from 'vue'
+import { reactive, watch } from 'vue'
 import { FileText, X } from 'lucide-vue-next'
 import { getFileSize, showToast, escapeHTML } from '@/utils'
 
diff --git a/frontend/src/components/Modals/EvaluationModal.vue b/frontend/src/components/Modals/EvaluationModal.vue
index 2dc02fd0..356628ea 100644
--- a/frontend/src/components/Modals/EvaluationModal.vue
+++ b/frontend/src/components/Modals/EvaluationModal.vue
@@ -66,7 +66,7 @@
 </template>
 <script setup>
 import { Dialog, createResource, Select, FormControl } from 'frappe-ui'
-import { defineModel, reactive, watch, inject } from 'vue'
+import { reactive, watch, inject } from 'vue'
 import { createToast, formatTime } from '@/utils/'
 
 const user = inject('$user')
diff --git a/frontend/src/components/Modals/JobApplicationModal.vue b/frontend/src/components/Modals/JobApplicationModal.vue
index fa7bdf16..faceb05a 100644
--- a/frontend/src/components/Modals/JobApplicationModal.vue
+++ b/frontend/src/components/Modals/JobApplicationModal.vue
@@ -66,7 +66,7 @@
 <script setup>
 import { Dialog, FileUploader, Button, createResource } from 'frappe-ui'
 import { FileText } from 'lucide-vue-next'
-import { ref, inject, defineModel } from 'vue'
+import { ref, inject } from 'vue'
 import { createToast, getFileSize } from '@/utils/'
 
 const resume = ref(null)
diff --git a/frontend/src/components/Modals/ReviewModal.vue b/frontend/src/components/Modals/ReviewModal.vue
index c6ad600d..69b133e7 100644
--- a/frontend/src/components/Modals/ReviewModal.vue
+++ b/frontend/src/components/Modals/ReviewModal.vue
@@ -33,7 +33,7 @@
 </template>
 <script setup>
 import { Dialog, Textarea, createResource } from 'frappe-ui'
-import { defineModel, reactive } from 'vue'
+import { reactive } from 'vue'
 import Rating from '@/components/Controls/Rating.vue'
 import { createToast } from '@/utils/'
 
diff --git a/frontend/src/pages/Batch.vue b/frontend/src/pages/Batch.vue
index 295a39d9..26ae36a0 100644
--- a/frontend/src/pages/Batch.vue
+++ b/frontend/src/pages/Batch.vue
@@ -193,8 +193,9 @@
 	<BulkCertificates v-model="openCertificateDialog" :batch="batch.data" />
 </template>
 <script setup>
-import { Breadcrumbs, Button, createResource, Tabs, Badge } from 'frappe-ui'
 import { computed, inject, ref } from 'vue'
+import { useRouteQuery } from '@vueuse/router'
+import { Breadcrumbs, Button, createResource, Tabs, Badge } from 'frappe-ui'
 import CourseInstructors from '@/components/CourseInstructors.vue'
 import UserAvatar from '@/components/UserAvatar.vue'
 import {
@@ -270,7 +271,7 @@ const isStudent = computed(() => {
 	)
 })
 
-const tabIndex = ref(0)
+const tabIndex = useRouteQuery('tab', 0)
 const tabs = computed(() => {
 	let batchTabs = []
 	batchTabs.push({