DarkSingularity/KeepItGoingServer
Internal
Public Access
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 5 Wiki Activity

Add offline task CRUD, phase 1 (PWA)

Browse Source 
Lets users create, edit, and complete tasks with no network connection,
queued locally in IndexedDB and replayed via the existing /api/sync/
protocol once back online -- the same protocol the native Android app
already uses, with zero backend changes. The service worker now routes
the dashboard's offline fallback to a small client-rendered task app
instead of the generic "you're offline" page; every other route keeps
the generic fallback.

Conflicts (server row touched elsewhere since last sync) auto-resolve
as "local wins" rather than surfacing a resolution UI. Scope is title/
status/priority/due-date only -- tags, subtasks, time tracking, and
recurrence editing offline are out of scope for this phase.

Also adds the first real test coverage for sync/views.py (previously
untested): new-item creation, soft-delete-bypasses-conflict-check,
conflict detection/discarding, and both resolve_conflict paths.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Keith Smith
2026-09-04 23:01:47 -06:00
co-authored by Claude Sonnet 5
parent 9ac1c41897
commit 922d4d1bf2
9 changed files with 544 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
templates/base.html
+3 -1
View File
@@ -147,7 +147,9 @@
{% endif %}
{% endblock %}
<script src="{% static 'js/app.js' %}?v=6"></script>
<script src="{% static 'js/offline-db.js' %}?v=7"></script>
<script src="{% static 'js/offline-sync.js' %}?v=7"></script>
<script src="{% static 'js/app.js' %}?v=7"></script>
{% block extra_js %}{% endblock %}
</body>
</html>
templates/offline_tasks.html
+43
View File
@@ -0,0 +1,43 @@
{% load static %}<!DOCTYPE html>
<html lang="en" data-theme="light">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Offline - KeepItGoing</title>
<link rel="icon" type="image/svg+xml" href="{% static 'favicons/favicon.svg' %}">
<link rel="stylesheet" href="{% static 'css/app.css' %}">
<script>
(function() {
var saved = localStorage.getItem('theme');
var systemDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
if (saved === 'dark' || (!saved && systemDark)) {
document.documentElement.setAttribute('data-theme', 'dark');
}
})();
</script>
</head>
<body>
<div style="max-width: 640px; margin: 0 auto; padding: var(--space-lg);">
<div class="task-pane-header">
<h1 class="task-pane-title">Tasks (Offline)</h1>
</div>
<p class="text-muted" style="margin-bottom: var(--space-lg);">
You're offline. Changes you make here will sync automatically once you're back online.
</p>
<form id="offline-add-task-form" class="quick-add">
<input type="text" id="offline-task-title" class="quick-add-input" placeholder="Add a new task..." required>
<button type="submit" class="btn btn-primary">Add</button>
</form>
<div id="offline-empty-state" class="empty-state" hidden>
<p>Loading...</p>
</div>
<div class="task-list" id="offline-task-list"></div>
</div>
<script src="{% static 'js/offline-db.js' %}"></script>
<script src="{% static 'js/offline-tasks.js' %}"></script>
</body>
</html>
templates/sw.js
+11 -2
View File
@@ -1,15 +1,19 @@
{% load static %}const CACHE_NAME = 'keepitgoing-shell-v1';
{% load static %}const CACHE_NAME = 'keepitgoing-shell-v2';
const OFFLINE_URL = '{% url "offline" %}';
const OFFLINE_TASKS_URL = '{% url "offline-tasks" %}';
const PRECACHE_URLS = [
"{% static 'css/app.css' %}",
"{% static 'js/app.js' %}",
"{% static 'js/offline-db.js' %}",
"{% static 'js/offline-tasks.js' %}",
"{% static 'favicons/favicon.svg' %}",
"{% static 'favicons/icon-192.png' %}",
"{% static 'favicons/icon-512.png' %}",
"{% static 'favicons/icon-512-maskable.png' %}",
"{% static 'favicons/apple-touch-icon-180.png' %}",
OFFLINE_URL,
OFFLINE_TASKS_URL,
];
self.addEventListener('install', (event) => {
@@ -32,9 +36,14 @@ self.addEventListener('fetch', (event) => {
const request = event.request;
// Navigations: try the network first, fall back to the offline page.
// The dashboard route falls back to the offline-capable task app instead
// of the generic offline page, since it can still show/edit cached tasks.
if (request.mode === 'navigate') {
event.respondWith(
fetch(request).catch(() => caches.match(OFFLINE_URL))
fetch(request).catch(() => {
const path = new URL(request.url).pathname;
return caches.match(path === '/' ? OFFLINE_TASKS_URL : OFFLINE_URL);
})
);
return;
}