✨ (card) add failed repetition to reset to level 1

src/modules/card/components/FlipCardList.vue

@@ -6,6 +6,7 @@ import { computed, ref } from 'vue'
 const props = defineProps<{ cards: Repetition[] }>()
 const emits = defineEmits<{
   success: [id: string]
+  fail: [id: string]
 }>()
 
 const cards = ref(props.cards)
@@ -17,14 +18,16 @@ const cardsToDisplay = computed(() => {
 })
 
 const goToNextCard = (success: boolean) => {
+  const id = cardsToDisplay.value[currentIndex.value].repetition._id ?? ''
+
   if (success) {
-    const id = cardsToDisplay.value[currentIndex.value].repetition._id ?? ''
     emits('success', id)
   } else {
     const failedCard = cards.value.at(currentIndex.value)
     if (failedCard) {
       cards.value.push(failedCard)
     }
+    emits('fail', id)
   }
 
   currentIndex.value++

src/modules/card/hooks/useSpacedRepetitionCards.ts

@@ -96,6 +96,24 @@ export const useSpacedRepetitionCards = () => {
       repeatDate: addDays(new Date(), newLevel)
     })
   }
+  const failRepetition = async (cardId: string) => {
+    const repetition = await data.get<DataType.RepetitionCard, RepetitionCard>(
+      cardId
+    )
+    if (!repetition) {
+      return
+    }
+
+    const level = 1
+
+    await data.update<DataType.RepetitionCard, RepetitionCard>({
+      ...repetition,
+      level,
+      repeatDate: addDays(new Date(), level)
+    })
+
+    await execute()
+  }
 
   watch(
     cards,
@@ -108,5 +126,5 @@ export const useSpacedRepetitionCards = () => {
 
   watch(cardFiles, () => execute())
 
-  return { cards, successRepetition, isLoading: !isReady }
+  return { cards, successRepetition, failRepetition, isLoading: !isReady }
 }

src/views/SpacedRepetitionCard.vue

@@ -8,7 +8,8 @@ defineProps<{
   repo: string
 }>()
 
-const { cards, isLoading, successRepetition } = useSpacedRepetitionCards()
+const { cards, isLoading, successRepetition, failRepetition } =
+  useSpacedRepetitionCards()
 </script>
 
 <template>
@@ -22,7 +23,11 @@ const { cards, isLoading, successRepetition } = useSpacedRepetitionCards()
     >
       <section v-if="isLoading">Loading...</section>
       <section v-else-if="cards.length" class="cards">
-        <flip-card-list :cards="cards" @success="successRepetition" />
+        <flip-card-list
+          :cards="cards"
+          @success="successRepetition"
+          @fail="failRepetition"
+        />
       </section>
       <section v-else>No cards to review!</section>
     </flux-note>