feat: lists are now sorted by modified_at desc

src/components/ListCard.vue

@@ -14,10 +14,6 @@ const listsStore = useListsStore()
 const isMenuOpen = ref(false)
 const menuContainerRef = ref<HTMLElement | null>(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(

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'),
     },
   ],

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()
   }
 

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()