From 45a907867516e67b2d67df4581b37613b55f440b Mon Sep 17 00:00:00 2001
From: Leo Vasanko <leo@git>
Date: Thu, 21 Aug 2025 16:47:16 -0600
Subject: [PATCH] Weekday repeats, better splitting, moving and deletion of
 repeated events.

---
 src/components/CalendarView.vue |   4 +-
 src/components/EventDialog.vue  | 223 ++++++++++++++++++++++++++++----
 src/components/EventOverlay.vue | 150 ++++++++++++---------
 src/stores/CalendarStore.js     | 168 ++++++++++++++++++++++--
 4 files changed, 449 insertions(+), 96 deletions(-)

diff --git a/src/components/CalendarView.vue b/src/components/CalendarView.vue
index 9f8d963..c3c484d 100644
--- a/src/components/CalendarView.vue
+++ b/src/components/CalendarView.vue
@@ -308,9 +308,9 @@ const handleDayTouchEnd = (dateStr) => {
   }
 }
 
-const handleEventClick = (eventId) => {
+const handleEventClick = (eventInstanceId) => {
   if (eventDialog.value) {
-    eventDialog.value.openEditDialog(eventId)
+    eventDialog.value.openEditDialog(eventInstanceId)
   }
 }
 </script>
diff --git a/src/components/EventDialog.vue b/src/components/EventDialog.vue
index caecb77..8a750ae 100644
--- a/src/components/EventDialog.vue
+++ b/src/components/EventDialog.vue
@@ -1,6 +1,6 @@
 <script setup>
 import { useCalendarStore } from '@/stores/CalendarStore'
-import { ref, computed, watch, onMounted, onUnmounted } from 'vue'
+import { ref, computed, watch, onMounted, onUnmounted, nextTick } from 'vue'
 
 const props = defineProps({
   selection: { type: Object, default: () => ({ start: null, end: null }) }
@@ -12,11 +12,14 @@ const calendarStore = useCalendarStore()
 
 const showDialog = ref(false)
 const dialogMode = ref('create') // 'create' or 'edit'
-const editingEventId = ref(null)
+const editingEventId = ref(null) // base event id if repeating occurrence clicked
+const occurrenceContext = ref(null) // { baseId, occurrenceIndex, weekday, occurrenceDate }
 const title = ref('')
 const repeat = ref('none')
+const repeatWeekdays = ref([false, false, false, false, false, false, false]) // Sun-Sat
 const colorId = ref(0)
 const eventSaved = ref(false)
+const titleInput = ref(null)
 
 const selectedColor = computed({
   get: () => colorId.value,
@@ -30,9 +33,11 @@ const selectedColor = computed({
 })
 
 function openCreateDialog() {
+  occurrenceContext.value = null
   dialogMode.value = 'create'
   title.value = ''
   repeat.value = 'none'
+  repeatWeekdays.value = [false, false, false, false, false, false, false]
   colorId.value = calendarStore.selectEventColorId(props.selection.start, props.selection.end)
   eventSaved.value = false
   
@@ -42,22 +47,71 @@ function openCreateDialog() {
     startDate: props.selection.start,
     endDate: props.selection.end,
     colorId: colorId.value,
-    repeat: repeat.value
+    repeat: repeat.value,
+    repeatWeekdays: repeatWeekdays.value
   })
   
   showDialog.value = true
+  
+  // Focus and select text after dialog is shown
+  nextTick(() => {
+    if (titleInput.value) {
+      titleInput.value.focus()
+      if (title.value) {
+        titleInput.value.select()
+      }
+    }
+  })
 }
 
-function openEditDialog(eventId) {
-  const event = calendarStore.getEventById(eventId)
+function openEditDialog(eventInstanceId) {
+  occurrenceContext.value = null
+  let baseId = eventInstanceId
+  let occurrenceIndex = 0
+  let weekday = null
+  let occurrenceDate = null
+  if (typeof eventInstanceId === 'string' && eventInstanceId.includes('_repeat_')) {
+    const [bid, suffix] = eventInstanceId.split('_repeat_')
+    baseId = bid
+    const parts = suffix.split('_')
+    occurrenceIndex = parseInt(parts[0], 10) || 0
+    if (parts.length > 1) weekday = parseInt(parts[1], 10)
+  }
+  const event = calendarStore.getEventById(baseId)
   if (!event) return
+  // Derive occurrence date if weekly occurrence
+  if (weekday != null) {
+    // Recompute occurrence date: iterate days accumulating selected weekdays
+    const repeatWeekdaysLocal = event.repeatWeekdays
+    let idx = 0
+    let cur = new Date(event.startDate + 'T00:00:00')
+    while (idx < occurrenceIndex && idx < 10000) { // safety bound
+      cur.setDate(cur.getDate() + 1)
+      if (repeatWeekdaysLocal[cur.getDay()]) idx++
+    }
+    occurrenceDate = cur
+  }
   dialogMode.value = 'edit'
-  editingEventId.value = eventId
+  editingEventId.value = baseId
   title.value = event.title
   repeat.value = event.repeat
+  repeatWeekdays.value = event.repeatWeekdays
   colorId.value = event.colorId
   eventSaved.value = false
+  if (event.isRepeating && occurrenceIndex >= 0 && weekday != null) {
+    occurrenceContext.value = { baseId, occurrenceIndex, weekday, occurrenceDate }
+  }
   showDialog.value = true
+  
+  // Focus and select text after dialog is shown
+  nextTick(() => {
+    if (titleInput.value) {
+      titleInput.value.focus()
+      if (title.value) {
+        titleInput.value.select()
+      }
+    }
+  })
 }
 
 function closeDialog() {
@@ -79,6 +133,7 @@ function updateEventInStore() {
         event.title = title.value
         event.colorId = colorId.value
         event.repeat = repeat.value
+        event.repeatWeekdays = [...repeatWeekdays.value]
         // Update repeat status
         event.isRepeating = (repeat.value && repeat.value !== 'none')
       }
@@ -100,13 +155,27 @@ function saveEvent() {
   closeDialog()
 }
 
-function deleteEvent() {
-  if (editingEventId.value) {
-    calendarStore.deleteEvent(editingEventId.value)
+function deleteEventAll() {
+  if (editingEventId.value) calendarStore.deleteEvent(editingEventId.value)
+  closeDialog()
+}
+
+function deleteEventOne() {
+  if (occurrenceContext.value) {
+    calendarStore.deleteSingleOccurrence(occurrenceContext.value)
+  } else if (isRepeatingBaseEdit.value && editingEventId.value) {
+    // Delete the first occurrence of the repeating series
+    calendarStore.deleteFirstOccurrence(editingEventId.value)
   }
   closeDialog()
 }
 
+function deleteEventFrom() {
+  if (!occurrenceContext.value) return
+  calendarStore.deleteFromOccurrence(occurrenceContext.value)
+  closeDialog()
+}
+
 // Watch for title changes and update the event immediately
 watch(title, (newTitle) => {
   if (editingEventId.value && showDialog.value) {
@@ -117,10 +186,25 @@ watch(title, (newTitle) => {
 // Watch for repeat changes and update the event immediately
 watch(repeat, (newRepeat) => {
   if (editingEventId.value && showDialog.value) {
+    // If switching to weekly, default to the current weekday
+    if (newRepeat === 'weekly' && !repeatWeekdays.value.some(Boolean)) {
+      const event = calendarStore.getEventById(editingEventId.value)
+      if (event) {
+        const startDate = new Date(event.startDate + 'T00:00:00')
+        repeatWeekdays.value[startDate.getDay()] = true
+      }
+    }
     updateEventInStore()
   }
 })
 
+// Watch for repeatWeekdays changes and update the event immediately
+watch(repeatWeekdays, () => {
+  if (editingEventId.value && showDialog.value && repeat.value === 'weekly') {
+    updateEventInStore()
+  }
+}, { deep: true })
+
 // Handle Esc key to close dialog
 function handleKeydown(event) {
   if (event.key === 'Escape' && showDialog.value) {
@@ -140,6 +224,27 @@ defineExpose({
   openCreateDialog,
   openEditDialog
 })
+
+// Computed helpers for delete UI
+const isRepeatingEdit = computed(() => dialogMode.value === 'edit' && repeat.value !== 'none')
+const showDeleteVariants = computed(() => isRepeatingEdit.value && occurrenceContext.value)
+const isRepeatingBaseEdit = computed(() => isRepeatingEdit.value && !occurrenceContext.value)
+const formattedOccurrenceShort = computed(() => {
+  if (occurrenceContext.value?.occurrenceDate) {
+    try {
+      return occurrenceContext.value.occurrenceDate.toLocaleDateString(undefined, { month: 'short', day: 'numeric' })
+    } catch { /* noop */ }
+  }
+  if (isRepeatingBaseEdit.value && editingEventId.value) {
+    const ev = calendarStore.getEventById(editingEventId.value)
+    if (ev?.startDate) {
+      try {
+        return new Date(ev.startDate + 'T00:00:00').toLocaleDateString(undefined, { month: 'short', day: 'numeric' })
+      } catch { /* noop */ }
+    }
+  }
+  return ''
+})
 </script>
 
 <template>
@@ -152,18 +257,7 @@ defineExpose({
         <div class="ec-body">
           <label class="ec-field">
             <span>Title</span>
-            <input type="text" v-model="title" autocomplete="off" />
-          </label>
-          <label class="ec-field">
-            <span>Repeat</span>
-            <select v-model="repeat">
-              <option value="none">No repeat</option>
-              <option value="daily">Daily</option>
-              <option value="weekly">Weekly</option>
-              <option value="biweekly">Every 2 weeks</option>
-              <option value="monthly">Monthly</option>
-              <option value="yearly">Yearly</option>
-            </select>
+            <input type="text" v-model="title" autocomplete="off" ref="titleInput" />
           </label>
           <div class="ec-color-swatches">
             <label v-for="i in 8" :key="i-1" class="swatch-label">
@@ -177,16 +271,54 @@ defineExpose({
               >
             </label>
           </div>
+          <label class="ec-field">
+            <span>Repeat</span>
+            <select v-model="repeat">
+              <option value="none">No repeat</option>
+              <option value="weekly">Weekly</option>
+              <option value="biweekly">Every 2 weeks</option>
+              <option value="monthly">Monthly</option>
+              <option value="yearly">Yearly</option>
+            </select>
+          </label>
+          <div v-if="repeat === 'weekly'" class="ec-weekday-selector">
+            <span class="ec-field-label">Repeat on:</span>
+            <div class="ec-weekdays">
+              <label v-for="(day, index) in ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']" 
+                     :key="index" 
+                     class="ec-weekday-label">
+                <input 
+                  type="checkbox" 
+                  v-model="repeatWeekdays[index]"
+                  class="ec-weekday-checkbox"
+                >
+                <span class="ec-weekday-text">{{ day }}</span>
+              </label>
+            </div>
+          </div>
         </div>
         <footer class="ec-footer">
-          <!-- Create mode: Delete and Save buttons -->
           <template v-if="dialogMode === 'create'">
-            <button type="button" class="ec-btn delete-btn" @click="deleteEvent">Delete</button>
+            <button type="button" class="ec-btn delete-btn" @click="deleteEventAll">Delete</button>
             <button type="submit" class="ec-btn save-btn">Save</button>
           </template>
-          <!-- Edit mode: Delete and Close buttons -->
           <template v-else>
-            <button type="button" class="ec-btn delete-btn" @click="deleteEvent">Delete</button>
+            <template v-if="showDeleteVariants">
+              <div class="ec-delete-group">
+                <button type="button" class="ec-btn delete-btn" @click="deleteEventOne">Delete {{ formattedOccurrenceShort }}</button>
+                <button type="button" class="ec-btn delete-btn" @click="deleteEventFrom">Rest</button>
+                <button type="button" class="ec-btn delete-btn" @click="deleteEventAll">All</button>
+              </div>
+            </template>
+            <template v-else-if="isRepeatingBaseEdit">
+              <div class="ec-delete-group">
+                <button type="button" class="ec-btn delete-btn" @click="deleteEventOne">Delete {{ formattedOccurrenceShort }}</button>
+                <button type="button" class="ec-btn delete-btn" @click="deleteEventAll">All</button>
+              </div>
+            </template>
+            <template v-else>
+              <button type="button" class="ec-btn delete-btn" @click="deleteEventAll">Delete</button>
+            </template>
             <button type="button" class="ec-btn close-btn" @click="closeDialog">Close</button>
           </template>
         </footer>
@@ -339,4 +471,45 @@ defineExpose({
 .ec-btn.delete-btn:hover { 
   background: hsl(0, 70%, 45%);
 }
+
+.ec-weekday-selector {
+  display: grid;
+  gap: 0.5rem;
+}
+
+.ec-field-label {
+  font-size: 0.85em;
+  color: var(--muted);
+}
+
+.ec-weekdays {
+  display: grid;
+  grid-template-columns: repeat(7, 1fr);
+  gap: 0.25rem;
+}
+
+.ec-weekday-label {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 0.25rem;
+  cursor: pointer;
+  padding: 0.5rem 0.25rem;
+  border-radius: 0.3rem;
+  transition: background-color 0.2s ease;
+}
+
+.ec-weekday-label:hover {
+  background: var(--muted);
+}
+
+.ec-weekday-checkbox {
+  margin: 0;
+}
+
+.ec-weekday-text {
+  font-size: 0.8em;
+  font-weight: 500;
+  text-align: center;
+}
 </style>
diff --git a/src/components/EventOverlay.vue b/src/components/EventOverlay.vue
index b5c7add..9180f7b 100644
--- a/src/components/EventOverlay.vue
+++ b/src/components/EventOverlay.vue
@@ -60,73 +60,99 @@ function generateRepeatOccurrencesForDate(targetDateStr) {
       const baseEndDate = new Date(fromLocalString(baseEvent.endDate))
       const spanDays = Math.floor((baseEndDate - baseStartDate) / (24 * 60 * 60 * 1000))
       
-      // Calculate how many intervals have passed since the base event
-      let intervalsPassed = 0
-      const timeDiff = targetDate - baseStartDate
-      
-      switch (baseEvent.repeat) {
-        case 'daily':
-          intervalsPassed = Math.floor(timeDiff / (24 * 60 * 60 * 1000))
-          break
-        case 'weekly':
-          intervalsPassed = Math.floor(timeDiff / (7 * 24 * 60 * 60 * 1000))
-          break
-        case 'biweekly':
-          intervalsPassed = Math.floor(timeDiff / (14 * 24 * 60 * 60 * 1000))
-          break
-        case 'monthly':
-          intervalsPassed = Math.floor((targetDate.getFullYear() - baseStartDate.getFullYear()) * 12 + 
-                                     (targetDate.getMonth() - baseStartDate.getMonth()))
-          break
-        case 'yearly':
-          intervalsPassed = targetDate.getFullYear() - baseStartDate.getFullYear()
-          break
-      }
-      
-      // Check a few occurrences around the target date
-      for (let i = Math.max(0, intervalsPassed - 2); i <= intervalsPassed + 2; i++) {
+      if (baseEvent.repeat === 'weekly') {
+        const repeatWeekdays = baseEvent.repeatWeekdays
+        const targetWeekday = targetDate.getDay()
+        if (!repeatWeekdays[targetWeekday]) continue
+        if (targetDate < baseStartDate) continue
         const maxOccurrences = baseEvent.repeatCount === 'unlimited' ? Infinity : parseInt(baseEvent.repeatCount, 10)
-        if (i >= maxOccurrences) break
-        
-        const currentStart = new Date(baseStartDate)
+        if (maxOccurrences === 0) continue
+        // Count occurrences from start up to (and including) target
+        let occIdx = 0
+        const cursor = new Date(baseStartDate)
+        while (cursor < targetDate && occIdx < maxOccurrences) {
+          if (repeatWeekdays[cursor.getDay()]) occIdx++
+          cursor.setDate(cursor.getDate() + 1)
+        }
+        // If target itself is the base start and it's selected, occIdx == 0 => base event (skip)
+        if (cursor.getTime() === targetDate.getTime()) {
+          // We haven't advanced past target, so if its weekday is selected and this is the first occurrence, skip
+          if (occIdx === 0) continue
+        } else {
+          // We advanced past target; if target weekday is selected this is the next occurrence index already counted, so decrement for proper index
+          // Ensure occIdx corresponds to this occurrence (already counted earlier occurrences only)
+        }
+        if (occIdx >= maxOccurrences) continue
+        const occStart = new Date(targetDate)
+        const occEnd = new Date(occStart); occEnd.setDate(occStart.getDate() + spanDays)
+        const occStartStr = toLocalString(occStart)
+        const occEndStr = toLocalString(occEnd)
+        occurrences.push({
+          ...baseEvent,
+          id: `${baseEvent.id}_repeat_${occIdx}_${targetWeekday}`,
+          startDate: occStartStr,
+          endDate: occEndStr,
+          isRepeatOccurrence: true,
+          repeatIndex: occIdx
+        })
+        continue
+      } else {
+        // Handle other repeat types (biweekly, monthly, yearly)
+        let intervalsPassed = 0
+        const timeDiff = targetDate - baseStartDate
         
         switch (baseEvent.repeat) {
-          case 'daily':
-            currentStart.setDate(baseStartDate.getDate() + i)
-            break
-          case 'weekly':
-            currentStart.setDate(baseStartDate.getDate() + i * 7)
-            break
           case 'biweekly':
-            currentStart.setDate(baseStartDate.getDate() + i * 14)
+            intervalsPassed = Math.floor(timeDiff / (14 * 24 * 60 * 60 * 1000))
             break
           case 'monthly':
-            currentStart.setMonth(baseStartDate.getMonth() + i)
+            intervalsPassed = Math.floor((targetDate.getFullYear() - baseStartDate.getFullYear()) * 12 + 
+                                       (targetDate.getMonth() - baseStartDate.getMonth()))
             break
           case 'yearly':
-            currentStart.setFullYear(baseStartDate.getFullYear() + i)
+            intervalsPassed = targetDate.getFullYear() - baseStartDate.getFullYear()
             break
         }
         
-        const currentEnd = new Date(currentStart)
-        currentEnd.setDate(currentStart.getDate() + spanDays)
-        
-        // Check if this occurrence intersects with the target date
-        const currentStartStr = toLocalString(currentStart)
-        const currentEndStr = toLocalString(currentEnd)
-        
-        if (currentStartStr <= targetDateStr && targetDateStr <= currentEndStr) {
-          // Skip the original occurrence (i === 0) since it's already in the base events
-          if (i === 0) continue
+        // Check a few occurrences around the target date
+        for (let i = Math.max(0, intervalsPassed - 2); i <= intervalsPassed + 2; i++) {
+          const maxOccurrences = baseEvent.repeatCount === 'unlimited' ? Infinity : parseInt(baseEvent.repeatCount, 10)
+          if (i >= maxOccurrences) break
           
-          occurrences.push({
-            ...baseEvent,
-            id: `${baseEvent.id}_repeat_${i}`,
-            startDate: currentStartStr,
-            endDate: currentEndStr,
-            isRepeatOccurrence: true,
-            repeatIndex: i
-          })
+          const currentStart = new Date(baseStartDate)
+          
+          switch (baseEvent.repeat) {
+            case 'biweekly':
+              currentStart.setDate(baseStartDate.getDate() + i * 14)
+              break
+            case 'monthly':
+              currentStart.setMonth(baseStartDate.getMonth() + i)
+              break
+            case 'yearly':
+              currentStart.setFullYear(baseStartDate.getFullYear() + i)
+              break
+          }
+          
+          const currentEnd = new Date(currentStart)
+          currentEnd.setDate(currentStart.getDate() + spanDays)
+          
+          // Check if this occurrence intersects with the target date
+          const currentStartStr = toLocalString(currentStart)
+          const currentEndStr = toLocalString(currentEnd)
+          
+          if (currentStartStr <= targetDateStr && targetDateStr <= currentEndStr) {
+            // Skip the original occurrence (i === 0) since it's already in the base events
+            if (i === 0) continue
+            
+            occurrences.push({
+              ...baseEvent,
+              id: `${baseEvent.id}_repeat_${i}`,
+              startDate: currentStartStr,
+              endDate: currentEndStr,
+              isRepeatOccurrence: true,
+              repeatIndex: i
+            })
+          }
         }
       }
     }
@@ -145,9 +171,9 @@ function getOriginalEventId(eventId) {
 
 // Handle event click
 function handleEventClick(span) {
-  // Only emit click if we didn't just finish dragging
   if (justDragged.value) return
-  emit('event-click', getOriginalEventId(span.id))
+  // Emit the actual span id (may include repeat suffix) so edit dialog knows occurrence context
+  emit('event-click', span.id)
 }
 
 // Handle event pointer down for dragging
@@ -384,13 +410,17 @@ function applyRangeDuringDrag(st, startDate, endDate) {
   const ev = store.getEventById(st.id)
   if (!ev) return
   if (ev.isRepeatOccurrence) {
-    const [baseId, idxStr] = String(st.id).split('_repeat_')
-    const repeatIndex = parseInt(idxStr, 10) || 0
+    const idParts = String(st.id).split('_repeat_')
+    const baseId = idParts[0]
+    const repeatParts = idParts[1].split('_')
+    const repeatIndex = parseInt(repeatParts[0], 10) || 0
+    const grabbedWeekday = repeatParts.length > 1 ? parseInt(repeatParts[1], 10) : null
+    
     if (repeatIndex === 0) {
       store.setEventRange(baseId, startDate, endDate)
     } else {
       if (!st.splitNewBaseId) {
-        const newId = store.splitRepeatSeries(baseId, repeatIndex, startDate, endDate)
+        const newId = store.splitRepeatSeries(baseId, repeatIndex, startDate, endDate, grabbedWeekday)
         if (newId) {
           st.splitNewBaseId = newId
           st.id = newId
diff --git a/src/stores/CalendarStore.js b/src/stores/CalendarStore.js
index 94456dd..fb6a0e5 100644
--- a/src/stores/CalendarStore.js
+++ b/src/stores/CalendarStore.js
@@ -54,6 +54,7 @@ export const useCalendarStore = defineStore('calendar', {
         durationMinutes: singleDay ? (eventData.durationMinutes || 60) : null,
         repeat: eventData.repeat || 'none',
         repeatCount: eventData.repeatCount || 'unlimited',
+        repeatWeekdays: eventData.repeatWeekdays,
         isRepeating: (eventData.repeat && eventData.repeat !== 'none')
       }
 
@@ -120,6 +121,97 @@ export const useCalendarStore = defineStore('calendar', {
       datesToCleanup.forEach(dateStr => this.events.delete(dateStr))
     },
 
+    deleteSingleOccurrence(ctx) {
+      const { baseId, occurrenceIndex, weekday } = ctx
+      const base = this.getEventById(baseId)
+      if (!base || base.repeat !== 'weekly') return
+      // Strategy: clone pattern into two: reduce base repeatCount to exclude this occurrence; create new series for remainder excluding this one
+      // Simpler: convert base to explicit exception by creating a one-off non-repeating event? For now: create exception by inserting a blocking dummy? Instead just split by shifting repeatCount logic: decrement repeatCount and create a new series starting after this single occurrence.
+      // Implementation (approx): terminate at occurrenceIndex; create a new series starting next occurrence with remaining occurrences.
+      const remaining = base.repeatCount === 'unlimited' ? 'unlimited' : String(Math.max(0, parseInt(base.repeatCount,10) - (occurrenceIndex+1)))
+      this._terminateRepeatSeriesAtIndex(baseId, occurrenceIndex)
+      if (remaining === '0') return
+      // Find date of next occurrence
+      const startDate = new Date(base.startDate + 'T00:00:00')
+      let idx = 0
+      let cur = new Date(startDate)
+      while (idx <= occurrenceIndex && idx < 10000) {
+        cur.setDate(cur.getDate() + 1)
+        if (base.repeatWeekdays[cur.getDay()]) idx++
+      }
+      const nextStartStr = toLocalString(cur)
+      this.createEvent({
+        title: base.title,
+        startDate: nextStartStr,
+        endDate: nextStartStr,
+        colorId: base.colorId,
+        repeat: 'weekly',
+        repeatCount: remaining,
+        repeatWeekdays: base.repeatWeekdays
+      })
+    },
+
+    deleteFromOccurrence(ctx) {
+      const { baseId, occurrenceIndex } = ctx
+      this._terminateRepeatSeriesAtIndex(baseId, occurrenceIndex)
+    },
+
+    deleteFirstOccurrence(baseId) {
+      const base = this.getEventById(baseId)
+      if (!base || !base.isRepeating) return
+      const oldStart = new Date(fromLocalString(base.startDate))
+      const oldEnd = new Date(fromLocalString(base.endDate))
+      const spanDays = Math.round((oldEnd - oldStart) / (24 * 60 * 60 * 1000))
+      let newStart = null
+
+      if (base.repeat === 'weekly' && base.repeatWeekdays) {
+        const probe = new Date(oldStart)
+        for (let i = 0; i < 14; i++) { // search ahead up to 2 weeks
+          probe.setDate(probe.getDate() + 1)
+            if (base.repeatWeekdays[probe.getDay()]) { newStart = new Date(probe); break }
+        }
+      } else if (base.repeat === 'biweekly') {
+        newStart = new Date(oldStart)
+        newStart.setDate(newStart.getDate() + 14)
+      } else if (base.repeat === 'monthly') {
+        newStart = new Date(oldStart)
+        newStart.setMonth(newStart.getMonth() + 1)
+      } else if (base.repeat === 'yearly') {
+        newStart = new Date(oldStart)
+        newStart.setFullYear(newStart.getFullYear() + 1)
+      } else {
+        // Unknown pattern: delete entire series
+        this.deleteEvent(baseId)
+        return
+      }
+
+      if (!newStart) {
+        // No subsequent occurrence -> delete entire series
+        this.deleteEvent(baseId)
+        return
+      }
+
+      if (base.repeatCount !== 'unlimited') {
+        const rc = parseInt(base.repeatCount, 10)
+        if (!isNaN(rc)) {
+          const newRc = Math.max(0, rc - 1)
+          if (newRc === 0) {
+            this.deleteEvent(baseId)
+            return
+          }
+          base.repeatCount = String(newRc)
+        }
+      }
+
+      const newEnd = new Date(newStart)
+      newEnd.setDate(newEnd.getDate() + spanDays)
+      base.startDate = toLocalString(newStart)
+      base.endDate = toLocalString(newEnd)
+      // Reindex across map
+      this._removeEventFromAllDatesById(baseId)
+      this._addEventToDateRangeWithId(baseId, base, base.startDate, base.endDate)
+    },
+
     updateEvent(eventId, updates) {
       // Remove event from current dates
       for (const [dateStr, eventList] of this.events) {
@@ -143,23 +235,77 @@ export const useCalendarStore = defineStore('calendar', {
     setEventRange(eventId, startDate, endDate) {
       const snapshot = this._snapshotBaseEvent(eventId)
       if (!snapshot) return
+      
+      // Calculate rotated weekdays for weekly repeats
+      if (snapshot.repeat === 'weekly' && snapshot.repeatWeekdays) {
+        const originalStartDate = new Date(fromLocalString(snapshot.startDate))
+        const newStartDate = new Date(fromLocalString(startDate))
+        const dayShift = newStartDate.getDay() - originalStartDate.getDay()
+        
+        if (dayShift !== 0) {
+          const rotatedWeekdays = [false, false, false, false, false, false, false]
+          
+          for (let i = 0; i < 7; i++) {
+            if (snapshot.repeatWeekdays[i]) {
+              let newDay = (i + dayShift) % 7
+              if (newDay < 0) newDay += 7
+              rotatedWeekdays[newDay] = true
+            }
+          }
+          snapshot.repeatWeekdays = rotatedWeekdays
+        }
+      }
+      
       this._removeEventFromAllDatesById(eventId)
       this._addEventToDateRangeWithId(eventId, snapshot, startDate, endDate)
     },
 
-    splitRepeatSeries(baseId, index, startDate, endDate) {
+    splitRepeatSeries(baseId, index, startDate, endDate, grabbedWeekday = null) {
       const base = this.getEventById(baseId)
       if (!base) return null
 
       const originalRepeatCount = base.repeatCount
-      
+      // Always cap original series at the split occurrence index (occurrences 0..index-1)
+      // Keep its weekday pattern unchanged.
       this._terminateRepeatSeriesAtIndex(baseId, index)
 
       let newRepeatCount = 'unlimited'
       if (originalRepeatCount !== 'unlimited') {
         const originalCount = parseInt(originalRepeatCount, 10)
-        const remaining = originalCount - index
-        newRepeatCount = remaining > 0 ? String(remaining) : '0'
+        if (!isNaN(originalCount)) {
+          const remaining = originalCount - index
+          // remaining occurrences go to new series; ensure at least 1 (the dragged occurrence itself)
+          newRepeatCount = remaining > 0 ? String(remaining) : '1'
+        }
+      } else {
+        // Original was unlimited: original now capped, new stays unlimited
+        newRepeatCount = 'unlimited'
+      }
+
+      // Handle weekdays for weekly repeats
+      let newRepeatWeekdays = base.repeatWeekdays
+      if (base.repeat === 'weekly' && base.repeatWeekdays) {
+        const newStartDate = new Date(fromLocalString(startDate))
+        let dayShift = 0
+        if (grabbedWeekday != null) {
+          // Rotate so that the grabbed weekday maps to the new start weekday
+            dayShift = newStartDate.getDay() - grabbedWeekday
+        } else {
+          // Fallback: rotate by difference between new and original start weekday
+          const originalStartDate = new Date(fromLocalString(base.startDate))
+          dayShift = newStartDate.getDay() - originalStartDate.getDay()
+        }
+        if (dayShift !== 0) {
+          const rotatedWeekdays = [false, false, false, false, false, false, false]
+          for (let i = 0; i < 7; i++) {
+            if (base.repeatWeekdays[i]) {
+              let nd = (i + dayShift) % 7
+              if (nd < 0) nd += 7
+              rotatedWeekdays[nd] = true
+            }
+          }
+          newRepeatWeekdays = rotatedWeekdays
+        }
       }
 
       const newId = this.createEvent({
@@ -168,7 +314,8 @@ export const useCalendarStore = defineStore('calendar', {
         endDate,
         colorId: base.colorId,
         repeat: base.repeat,
-        repeatCount: newRepeatCount
+        repeatCount: newRepeatCount,
+        repeatWeekdays: newRepeatWeekdays
       })
       return newId
     },
@@ -229,13 +376,16 @@ export const useCalendarStore = defineStore('calendar', {
     },
 
     _terminateRepeatSeriesAtIndex(baseId, index) {
-      // Reduce repeatCount of base series to the given index
+      // Cap repeatCount to 'index' total occurrences (0-based index means index occurrences before split)
       for (const [, list] of this.events) {
         for (const ev of list) {
           if (ev.id === baseId && ev.isRepeating) {
-            const rc = ev.repeatCount === 'unlimited' ? Infinity : parseInt(ev.repeatCount, 10)
-            const newCount = Math.min(isFinite(rc) ? rc : index, index)
-            ev.repeatCount = String(newCount)
+            if (ev.repeatCount === 'unlimited') {
+              ev.repeatCount = String(index)
+            } else {
+              const rc = parseInt(ev.repeatCount, 10)
+              if (!isNaN(rc)) ev.repeatCount = String(Math.min(rc, index))
+            }
           }
         }
       }