Introduce tomorrow section in todos

resources/js/components/Todos.vue

@@ -37,6 +37,11 @@ const groupedTodos = computed(() => {
                 if (!groups['today']) groups['today'] = []
                 groups['today'].push(todo)
             }
+            // tomorrow
+            if (daysFromNow(dueDate) === 1) {
+                if (!groups['tomorrow']) groups['tomorrow'] = []
+                groups['tomorrow'].push(todo)
+            }
             // overdue
             else if (daysFromNow(dueDate) < 0) {
                 if (!groups['overdue']) groups['overdue'] = []
@@ -54,6 +59,13 @@ const groupedTodos = computed(() => {
     return groups
 })
 
+const groupNameForKey = (key: string) => {
+    if (key === 'today') return 'Heute'
+    if (key === 'tomorrow') return 'Morgen'
+    if (key === 'overdue') return 'Überfällig'
+    return key
+}
+
 const todosEmpty = (todos: Todo[]) => {
     if (todos.length === 0) return true
     if (!props.showCompleted && !todos.some(todo => todo.status?.toLowerCase() !== 'completed')) return true
@@ -100,7 +112,7 @@ const shouldDisplay = (todo: Todo) => {
                 'text-destructive! font-bold': groupKey === 'overdue',
                 'text-warning! font-bold': groupKey === 'today'
             }">
-                {{ groupKey === 'today' ? 'Heute' : groupKey === 'overdue' ? 'Verspätet' : groupKey }}
+                {{ groupNameForKey(groupKey) }}
             </h3>
 
             <hr>