How nextcloud/tasks works
Nextcloud Tasks is a web task manager backed by calendars and CalDAV, with desktop/mobile sync clients as documented consumers. The principal workflow loads calendars and tasks into the Vuex store, presents calendar and smart-collection views, and writes task changes back through CalDAV. Users can edit task properties, organize subtasks, drag tasks between calendars, manage alarms and recurrence, and use upcoming-task dashboard integration. PHP routes and services provide collection visibility and settings. Some frontend subsystem wiring is inferred from the documented product scope and tree; only sampled call paths are linked.
Main entry points: App.vue App shell · tasks.js Task state/actions · store.js Vuex store · cdav.js CalDAV client
Components 23
Application entry
- Vue app bootstrap
src/main.js - App shell
src/App.vue
Task experience
- Calendar navigation
src/views/AppNavigation.vue - Task views
src/views/AppContent - Task editing UI
src/components/TaskBody.vue - Bulk task creation
src/components/CreateMultipleTasksDialog.vue - Upcoming widget
lib/Dashboard/TasksWidget.php
Calendar sync
- Vuex store
src/store/store.js - Task state/actions
src/store/tasks.js - Calendar state
src/store/calendars.js - CalDAV client
src/services/cdav.js - CalDAV requests
src/store/cdav-requests.js - Task model
src/models/task.js
Nextcloud services
- Page/API routes
appinfo/routes.php - Page controller
lib/Controller/PageController.php - Settings API
lib/Controller/SettingsController.php - Settings service
lib/Service/SettingsService.php - Collections API
lib/Controller/CollectionsController.php - Collections service
lib/Service/CollectionsService.php - User configuration
Other components
- Nextcloud user
- CalDAV clients
- Nextcloud platform
Connections 27
- Nextcloud user → Vue app bootstrap: opens app
- Vue app bootstrap → App shell: mounts
- App shell → Vuex store: dispatches loads
- App shell → CalDAV client: connects
- App shell → Calendar state: loads calendars
- App shell → Task state/actions: loads tasks
- App shell → Calendar navigation: renders
- App shell → Task views: routes views
- Nextcloud user → Task editing UI: edits tasks
- Task editing UI → Vuex store: dispatches actions
- Bulk task creation → Task state/actions: creates tasks
- Vuex store → Task state/actions: dispatches
- Vuex store → Calendar state: dispatches
- Task state/actions → Task model: constructs
- Task state/actions → CalDAV requests: queries tasks
- Task state/actions → CalDAV client: updates and deletes
- CalDAV client → CalDAV clients: syncs task data
- CalDAV clients → CalDAV client: syncs task data
- Page/API routes → Page controller: dispatches pages
- Page controller → Settings service: reads settings
- Page/API routes → Settings API: dispatches API
- Settings API → Settings service: sets values
- Settings service → User configuration: reads and writes
- Page/API routes → Collections API: dispatches API
- Collections API → Collections service: gets and sets
- Nextcloud platform → Upcoming widget: registers widget
- Upcoming widget → Nextcloud platform: loads widget