A single null from queryFileContent silently exited cacheAllNotes, leaving every later note uncached while the success toast still fired. Skip the failing file, count failures, and surface them via errorMessage.
61 lines
1.8 KiB
Vue
61 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
import { useOfflineNotes } from "@/hooks/useOfflineNotes.hook"
|
|
import { confirmMessage, errorMessage } from "@/utils/notif"
|
|
|
|
const { cacheAllNotes, isLoading, totalOfNotes, noteCompleted, failedNotes } =
|
|
useOfflineNotes()
|
|
|
|
const confirmBeforeCachingAllNotes = async () => {
|
|
confirm("Do you want to cache all notes?")
|
|
await cacheAllNotes()
|
|
if (failedNotes.value > 0) {
|
|
errorMessage(
|
|
`${failedNotes.value} of ${totalOfNotes.value} note(s) could not be cached — try again`
|
|
)
|
|
} else {
|
|
confirmMessage("✅ All notes have been locally saved")
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="isLoading" class="cache-all-notes">
|
|
<progress
|
|
:value="noteCompleted"
|
|
class="progress progress-accent w-56"
|
|
:max="totalOfNotes"
|
|
></progress>
|
|
<div class="numeric">{{ noteCompleted }}/{{ totalOfNotes }}</div>
|
|
</div>
|
|
<button v-else class="button" @click="() => confirmBeforeCachingAllNotes()">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
class="icon icon-tabler icon-tabler-cloud-off"
|
|
width="30"
|
|
height="30"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="1.5"
|
|
stroke="currentColor"
|
|
fill="none"
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
>
|
|
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
|
|
<path
|
|
d="M9.58 5.548c.24 -.11 .492 -.207 .752 -.286c1.88 -.572 3.956 -.193 5.444 1c1.488 1.19 2.162 3.007 1.77 4.769h.99c1.913 0 3.464 1.56 3.464 3.486c0 .957 -.383 1.824 -1.003 2.454m-2.997 1.033h-11.343c-2.572 -.004 -4.657 -2.011 -4.657 -4.487c0 -2.475 2.085 -4.482 4.657 -4.482c.13 -.582 .37 -1.128 .7 -1.62"
|
|
/>
|
|
<path d="M3 3l18 18" />
|
|
</svg>
|
|
</button>
|
|
</template>
|
|
|
|
<style scoped lang="scss">
|
|
.cache-all-notes {
|
|
text-align: center;
|
|
}
|
|
|
|
.numeric {
|
|
font-family: "Courier Prime", monospace;
|
|
}
|
|
</style>
|