diff --git a/src/components/ListCard.vue b/src/components/ListCard.vue index 05f7703..8c343b8 100644 --- a/src/components/ListCard.vue +++ b/src/components/ListCard.vue @@ -14,10 +14,6 @@ const listsStore = useListsStore() const isMenuOpen = ref(false) const menuContainerRef = ref(null) -// The server now reports total_items/completed_items directly on the list, -// so the overview can show progress without having to load every item of -// every list. Fall back to counting locally cached items for lists that -// haven't synced to the server yet (e.g. just created while offline). const items = computed(() => listsStore.itemsForList(props.list.id)) const totalCount = computed(() => props.list.total_items ?? items.value.length) const completedCount = computed( diff --git a/src/router/index.ts b/src/router/index.ts index 8ffdb8e..3d02a73 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -26,9 +26,6 @@ const router = createRouter({ { path: '/about', name: 'about', - // route level code-splitting - // this generates a separate chunk (About.[hash].js) for this route - // which is lazy-loaded when the route is visited. component: () => import('../views/AboutView.vue'), }, ], diff --git a/src/stores/lists.ts b/src/stores/lists.ts index 30d09a8..776fb1c 100644 --- a/src/stores/lists.ts +++ b/src/stores/lists.ts @@ -50,10 +50,6 @@ export const useListsStore = defineStore('lists', () => { if (!isLoaded.value) { await refresh() } - // The server is the source of truth: even though we already have a - // local snapshot to render instantly (including while offline), always - // kick off a background sync/pull so views reflect the latest server - // state on every visit, not just on the first load of the session. void sync() } diff --git a/src/views/ListDetailView.vue b/src/views/ListDetailView.vue index 3c8838d..b7dbe95 100644 --- a/src/views/ListDetailView.vue +++ b/src/views/ListDetailView.vue @@ -2,6 +2,7 @@ import { ref, computed, onMounted, onUnmounted } from 'vue' import { useRouter } from 'vue-router' import { useListsStore } from '@/stores/lists' +import type { LocalListItem } from '@/database/db' import ListItemRow from '@/components/ListItemRow.vue' import DeleteListModal from '@/components/DeleteListModal.vue' @@ -43,8 +44,17 @@ onUnmounted(() => { const list = computed(() => listsStore.lists.find((entry) => entry.id === props.id)) const items = computed(() => listsStore.itemsForList(props.id)) -const pendingItems = computed(() => items.value.filter((item) => !item.is_completed)) -const completedItems = computed(() => items.value.filter((item) => item.is_completed)) + +function byModifiedDesc(a: LocalListItem, b: LocalListItem) { + return (b.modified_at ?? '').localeCompare(a.modified_at ?? '') +} + +const pendingItems = computed(() => + items.value.filter((item) => !item.is_completed).sort(byModifiedDesc), +) +const completedItems = computed(() => + items.value.filter((item) => item.is_completed).sort(byModifiedDesc), +) function toggleMenu(event: Event) { event.preventDefault()