diff --git a/src/components/Scheduling/Calendar.vue b/src/components/Scheduling/Calendar.vue
index eac8b77..cdde2d9 100644
--- a/src/components/Scheduling/Calendar.vue
+++ b/src/components/Scheduling/Calendar.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { ref, watch, defineEmits, onMounted } from 'vue'
-import { fetchSemesterData, currentSemesterEnd } from '../../utils/calendarUtils'
+import { fetchSemesterData, currentSemesterEnd, parseISOString } from '../../utils/calendarUtils'
 
 const emits = defineEmits(['updateDateRange'])
 
@@ -25,9 +25,13 @@ onMounted(async () => {
         mode="date"
         is-range
         :min-date="today"
-        :max-date="new Date(currentSemesterEnd)"
+        :max-date="parseISOString(currentSemesterEnd)"
         placeholder="Select Dates"
         is-required
-        />
+        @dayclick="
+        (_, event) => {
+          event.target.blur();
+        }
+      " />
     </div>
 </template>
diff --git a/src/tests/integration/components/calendar.test.js b/src/tests/integration/components/calendar.test.js
index b99d46e..a1ec0fb 100644
--- a/src/tests/integration/components/calendar.test.js
+++ b/src/tests/integration/components/calendar.test.js
@@ -4,10 +4,21 @@ import Calendar from '../../../components/Scheduling/Calendar.vue'
 import { fetchSemesterData, currentSemesterEnd } from '../../../utils/calendarUtils'
 import flushPromises from 'flush-promises'
 
-vi.mock('../../../utils/calendarUtils', () => ({
-  fetchSemesterData: vi.fn(),
-  currentSemesterEnd: '2024-08-01T12:00:00Z'
-}))
+// Partially mock the calendarUtils module
+// The terminal suggested using 'importOriginal' to do a partial mock.
+// This is necessary because we want to mock some exports (like 'fetchSemesterData' and 'currentSemesterEnd')
+// while keeping other exports (like 'parseISOString') unchanged and available.
+// 'importOriginal' represents the original module with all its exports.
+// Using 'actual' will hold all original exports, then spread them to preserve the original functionality.
+vi.mock('../../../utils/calendarUtils', async (importOriginal) => {
+  const actual = await importOriginal()
+  return {
+    // Include all original exports
+    ...actual,
+    fetchSemesterData: vi.fn(),
+    currentSemesterEnd: '2024-08-01T12:00:00Z'
+  }
+})
 
 describe('Calendar.vue', () => {
   let wrapper
diff --git a/src/utils/calendarUtils.js b/src/utils/calendarUtils.js
index 378113b..73270bc 100644
--- a/src/utils/calendarUtils.js
+++ b/src/utils/calendarUtils.js
@@ -4,6 +4,12 @@ import { useConfigurationStore } from '../stores/configuration.js'
 let currentSemesterStart = null
 let currentSemesterEnd = null
 
+function parseISOString (s) {
+  if (s === null) return null
+  const b = s.split(/\D+/)
+  return new Date(Date.UTC(b[0], --b[1], b[2], b[3], b[4], b[5], b[6]))
+}
+
 const getStartAndEndDatesOfCurrentSemester = (semesters) => {
   const today = new Date()
   const currentSemester = semesters.find(semester => {
@@ -30,4 +36,4 @@ const fetchSemesterData = async () => {
   })
 }
 
-export { currentSemesterStart, currentSemesterEnd, fetchSemesterData }
+export { currentSemesterStart, currentSemesterEnd, fetchSemesterData, parseISOString }