mirror of
https://github.com/aculix/negotium.git
synced 2026-09-11 07:28:17 +00:00
Compare commits
4 Commits
v2.2.1
..
86b985be27
| Author | SHA1 | Date | |
|---|---|---|---|
 Aculix Technologies
|
86b985be27 | ||
|
Aculix Technologies LLP
|
a1de9e9b29 | ||
|
Aculix Technologies LLP
|
5a34d69971 | ||
|
Aculix Technologies
|
3c846aad7d |
@@ -27,6 +27,9 @@ jobs:
|
||||
permissions:
|
||||
contents: read
|
||||
packages: write
|
||||
# This is used to complete the identity challenge
|
||||
# with sigstore/fulcio when running outside of PRs.
|
||||
id-token: write
|
||||
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
@@ -36,6 +39,14 @@ jobs:
|
||||
- name: Set up QEMU
|
||||
uses: docker/setup-qemu-action@68827325e0b33c7199eb31dd4e31fbe9023e06e3 # v3.0.0
|
||||
|
||||
# Install the cosign tool except on PR
|
||||
# https://github.com/sigstore/cosign-installer
|
||||
- name: Install cosign
|
||||
if: github.event_name != 'pull_request'
|
||||
uses: sigstore/cosign-installer@59acb6260d9c0ba8f4a2f9d9b48431a222b68e20 #v3.5.0
|
||||
with:
|
||||
cosign-release: 'v2.2.4'
|
||||
|
||||
# Set up BuildKit Docker container builder to be able to build
|
||||
# multi-platform images and export cache
|
||||
# https://github.com/docker/setup-buildx-action
|
||||
@@ -59,17 +70,6 @@ jobs:
|
||||
uses: docker/metadata-action@96383f45573cb7f253c731d3b3ab81c87ef81934 # v5.0.0
|
||||
with:
|
||||
images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
|
||||
# latest=auto also moves :latest onto any pushed vX.Y.Z tag, so the
|
||||
# tag people actually pull tracks the newest release as well as main.
|
||||
flavor: |
|
||||
latest=auto
|
||||
tags: |
|
||||
type=raw,value=latest,enable={{is_default_branch}}
|
||||
type=ref,event=branch
|
||||
type=ref,event=pr
|
||||
type=semver,pattern={{version}}
|
||||
type=semver,pattern={{major}}.{{minor}}
|
||||
type=semver,pattern={{major}}
|
||||
|
||||
# Build and push Docker image with Buildx (don't push on PR)
|
||||
# https://github.com/docker/build-push-action
|
||||
@@ -84,3 +84,18 @@ jobs:
|
||||
labels: ${{ steps.meta.outputs.labels }}
|
||||
cache-from: type=gha
|
||||
cache-to: type=gha,mode=max
|
||||
|
||||
# Sign the resulting Docker image digest except on PRs.
|
||||
# This will only write to the public Rekor transparency log when the Docker
|
||||
# repository is public to avoid leaking data. If you would like to publish
|
||||
# transparency data even for private images, pass --force to cosign below.
|
||||
# https://github.com/sigstore/cosign
|
||||
- name: Sign the published Docker image
|
||||
if: ${{ github.event_name != 'pull_request' }}
|
||||
env:
|
||||
# https://docs.github.com/en/actions/security-guides/security-hardening-for-github-actions#using-an-intermediate-environment-variable
|
||||
TAGS: ${{ steps.meta.outputs.tags }}
|
||||
DIGEST: ${{ steps.build-and-push.outputs.digest }}
|
||||
# This step uses the identity token to provision an ephemeral certificate
|
||||
# against the sigstore community Fulcio instance.
|
||||
run: echo "${TAGS}" | xargs -I {} cosign sign --yes {}@${DIGEST}
|
||||
|
||||
+1
-3
@@ -1,4 +1,2 @@
|
||||
.DS_Store
|
||||
/.dockerignore
|
||||
/node_modules
|
||||
/dist
|
||||
/.claude
|
||||
|
||||
+3
-28
@@ -1,40 +1,15 @@
|
||||
# Build stage
|
||||
#
|
||||
# Pinned to the *build host's* architecture, not the target's. The output is
|
||||
# static HTML, CSS and JS — byte-identical whatever the image will eventually
|
||||
# run on — so emulating the target here buys nothing and costs a QEMU-emulated
|
||||
# npm install and bundle on every extra platform.
|
||||
#
|
||||
# It is also required for linux/arm/v7: Vite bundles with Rolldown, which ships
|
||||
# no 32-bit ARM musl binary, so `npm run build` cannot run inside that image at
|
||||
# all.
|
||||
FROM --platform=$BUILDPLATFORM node:20-alpine AS builder
|
||||
FROM node:20-alpine
|
||||
|
||||
WORKDIR /app
|
||||
|
||||
# Copy package files
|
||||
COPY package*.json ./
|
||||
|
||||
# Install from the committed lockfile so builds are reproducible
|
||||
RUN npm ci --include=optional
|
||||
# Install dependencies with proper optional dependency handling
|
||||
RUN npm install
|
||||
|
||||
# Copy source code
|
||||
COPY . .
|
||||
|
||||
# Build the application
|
||||
RUN npm run build
|
||||
|
||||
# Production stage — this one is built per target platform.
|
||||
FROM nginx:alpine
|
||||
|
||||
# Copy built files from builder stage
|
||||
COPY --from=builder /app/dist /usr/share/nginx/html
|
||||
|
||||
# Copy nginx configuration (if needed)
|
||||
# COPY nginx.conf /etc/nginx/conf.d/default.conf
|
||||
|
||||
# Expose port 80
|
||||
EXPOSE 80
|
||||
|
||||
# Start nginx
|
||||
CMD ["nginx", "-g", "daemon off;"]
|
||||
|
||||
@@ -1,9 +1,7 @@
|
||||
# Negotium - Minimalist To Do App
|
||||
# Negotium
|
||||
|
||||
A beautiful, minimal to-do list application featuring smooth animations, intelligent date management, and a modern design that helps you stay organized and productive.
|
||||
|
||||
|
||||
|
||||
## 💭 Why Negotium?
|
||||
|
||||
While powerful tools like Trello and Vikunja excel at managing complex projects and long-term planning, sometimes you just need a simple, focused space for your daily tasks. That's why I built Negotium, a straightforward to-do list for today and tomorrow. Nothing more, nothing less.
|
||||
@@ -14,47 +12,20 @@ Built with Svelte for speed and simplicity. No overwhelming features, no endless
|
||||
|
||||
### Core Functionality
|
||||
- ✅ **Add, complete, and delete tasks** with smooth animations
|
||||
- ↩️ **Undo** - Deleted or moved something by mistake? An Undo button appears, and `Cmd/Ctrl+Z` works too. The task returns to its original position
|
||||
- 📅 **Today & Tomorrow lists** - Plan ahead with separate task lists
|
||||
- 🔄 **Unfinished work carries over** - When a new day begins, tasks you didn't finish move to Today; completed ones are cleared away
|
||||
- ✏️ **Edit a task** - Fix a typo without deleting and retyping it
|
||||
- ➡️ **Push a task to tomorrow** - Didn't get to it? Move it across without retyping it
|
||||
- 🎯 **Reorder by drag or keyboard** - Drag with a mouse, long-press and drag on touch, or use `Alt+↑`/`Alt+↓`
|
||||
- 🔄 **Automatic task migration** - Tomorrow's tasks automatically move to Today when a new day begins
|
||||
- 🎯 **Drag and drop reordering** - Organize tasks by dragging them into position
|
||||
- 💾 **Persistent storage** - All tasks saved locally in your browser
|
||||
- 📊 **Task statistics** - See how many tasks remain at a glance
|
||||
- 📱 **Installable and works offline** - Add it to your home screen or dock and it runs with no connection
|
||||
- 📦 **Export and import** - Take your tasks with you, or keep a backup
|
||||
- 📊 **Task statistics** - See remaining and completed tasks at a glance
|
||||
|
||||
## 🚀 Getting Started
|
||||
|
||||
### Quick Start with Docker (Recommended)
|
||||
|
||||
Pull and run the pre-built Docker image:
|
||||
|
||||
```bash
|
||||
# Pull the image
|
||||
docker pull ghcr.io/aculix/negotium:main
|
||||
|
||||
# Run the container
|
||||
docker run -d -p 3000:80 --name negotium ghcr.io/aculix/negotium:main
|
||||
```
|
||||
|
||||
Then open `http://localhost:3000` in your browser.
|
||||
|
||||
To stop the container:
|
||||
```bash
|
||||
docker stop negotium
|
||||
docker rm negotium
|
||||
```
|
||||
|
||||
### Manual Installation
|
||||
|
||||
If you prefer to run the application locally without Docker:
|
||||
### Installation
|
||||
|
||||
1. Clone the repository:
|
||||
```bash
|
||||
git clone <repository-url>
|
||||
cd negotium
|
||||
cd simple-do
|
||||
```
|
||||
|
||||
2. Install dependencies:
|
||||
@@ -69,7 +40,7 @@ npm run dev
|
||||
|
||||
4. Open `http://localhost:3000` in your browser
|
||||
|
||||
#### Build for Production
|
||||
### Build for Production
|
||||
|
||||
```bash
|
||||
npm run build
|
||||
@@ -77,48 +48,20 @@ npm run build
|
||||
|
||||
The optimized files will be in the `dist` directory.
|
||||
|
||||
#### Running the Tests
|
||||
|
||||
```bash
|
||||
npm test
|
||||
```
|
||||
|
||||
The date, storage, rollover, task and undo logic lives in `src/lib/` as plain modules that take the current time as an argument, so behaviour at a day boundary is covered by ordinary unit tests rather than by waiting for midnight.
|
||||
|
||||
## 📖 How to Use
|
||||
|
||||
### Managing Tasks
|
||||
- **Add a task**: Type in the input field and press Enter
|
||||
- **Complete a task**: Click the checkbox next to the task
|
||||
- **Edit a task**: Click its text. Enter saves, Escape cancels, and clicking away saves too
|
||||
- **Delete a task**: Click the delete icon on the task (it shows on hover, and is always visible on touch), or press `Delete` with the task focused
|
||||
- **Undo**: An Undo button appears for a few seconds after a task is deleted, cleared or moved to another day. `Cmd/Ctrl+Z` does the same. Either way the task returns to where it was
|
||||
- **Move a task to Tomorrow**: Click the arrow on the task, or press `Alt+→`. From Tomorrow, the arrow points back and `Alt+←` returns it to Today
|
||||
- **Reorder tasks**: Drag with a mouse, long-press then drag on touch, or focus a task and press `Alt+↑`/`Alt+↓`
|
||||
- **Clear input**: Press Escape while the input is focused
|
||||
- **Delete a task**: Hover over a task and click the delete icon
|
||||
- **Reorder tasks**: Click and drag any task to a new position
|
||||
- **Clear input**: Press Escape to clear the input field
|
||||
|
||||
### Date Management
|
||||
- **Switch between Today and Tomorrow**: Pick either one in the header. The current day is the highlighted one
|
||||
- **Switch between Today and Tomorrow**: Click the date button in the header
|
||||
- **Plan ahead**: Add tasks to Tomorrow's list before you need them
|
||||
- **Automatic migration**: When a new day begins, Tomorrow's tasks automatically become Today's tasks
|
||||
- **Separate lists**: Today and Tomorrow maintain independent task lists
|
||||
- **Carry-over**: When a new day begins, whatever you didn't finish moves into Today, and the app tells you how many tasks it brought forward so they don't look like they appeared from nowhere. Completed tasks are cleared away with the day they belonged to. It works across gaps too. If you don't open Negotium for a week, everything still outstanding is waiting for you.
|
||||
- **While it's open**: The app notices the day change on its own, so a tab left open overnight rolls over without a reload.
|
||||
|
||||
### Installing It
|
||||
|
||||
Negotium is a PWA, so it installs like an app and runs without a connection.
|
||||
|
||||
- **iPhone and iPad**: open it in Safari, tap Share, then Add to Home Screen
|
||||
- **Android**: Chrome offers Install from the menu, or prompts you directly
|
||||
- **Desktop**: Chrome and Edge show an install button in the address bar
|
||||
|
||||
Once installed it opens in its own window with no browser chrome, and works on a plane. The app never needed the network for anything beyond loading itself.
|
||||
|
||||
### Backing Up and Moving Between Devices
|
||||
|
||||
Everything lives in one browser's storage, so `Export` writes it all to a JSON file you can keep or carry somewhere else. `Import` reads that file back.
|
||||
|
||||
Import only ever adds. Tasks already present are left alone, so importing the same file twice changes nothing and importing into a list you're already using can't lose anything. The flip side is that import restores rather than reverts: it won't undo work you did after the export.
|
||||
|
||||
### Theme Toggle
|
||||
- Click the sun/moon icon in the header to switch themes
|
||||
@@ -127,26 +70,17 @@ Import only ever adds. Tasks already present are left alone, so importing the sa
|
||||
|
||||
### Keyboard Shortcuts
|
||||
- **Enter**: Add task (when input is focused)
|
||||
- **Escape**: Clear input field (when input is focused)
|
||||
- **Space/Enter**: Toggle task completion (when a task's checkbox is focused)
|
||||
- **Delete**: Delete the focused task
|
||||
- **Cmd/Ctrl+Z**: Undo the last delete, clear-completed, or move between days
|
||||
- **Alt+↑ / Alt+↓**: Move the focused task up or down
|
||||
- **Alt+→ / Alt+←**: Send the focused task to Tomorrow, or bring it back to Today
|
||||
|
||||
Backspace no longer deletes a task. It is too easily pressed by accident, and deletions used to be unrecoverable.
|
||||
- **Escape**: Clear input field
|
||||
- **Space/Enter**: Toggle task completion (when task is focused)
|
||||
- **Delete/Backspace**: Delete task (when task is focused)
|
||||
|
||||
## 💾 Data Storage
|
||||
|
||||
All data is stored locally in your browser using localStorage:
|
||||
- **Tasks**: One key per date, in ISO form (`negotium-tasks-2026-08-15`)
|
||||
- **Tasks**: Separate storage keys for each date (`negotium-tasks-<date>`)
|
||||
- **Theme**: Your theme preference (`negotium-theme`)
|
||||
- **No server required**: Everything runs entirely client-side
|
||||
- **Privacy first**: Your data never leaves your device
|
||||
- **Self-pruning**: Past days are removed as their unfinished tasks carry forward, so storage doesn't grow without bound
|
||||
- **Yours to take**: Export writes everything to a JSON file, so your tasks aren't trapped in one browser
|
||||
|
||||
Earlier versions keyed tasks by a different date format (`negotium-tasks-Sat Aug 15 2026`). Those convert automatically the first time you open this version. Nothing to do, and nothing is lost.
|
||||
|
||||
## 📄 License
|
||||
|
||||
|
||||
|
Before Width: | Height: | Size: 908 B After Width: | Height: | Size: 908 B |
File diff suppressed because it is too large
Load Diff
Binary file not shown.
|
Before Width: | Height: | Size: 195 KiB |
+4
-25
@@ -2,33 +2,10 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Negotium - Your Productivity Companion</title>
|
||||
<meta name="description" content="A clean, minimal to-do list application with smooth animations and dark/light mode support">
|
||||
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'><path d='M12.37 8.87988H17.62' stroke='%23607afb' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/><path d='M6.38 8.87988L7.13 9.62988L9.38 7.37988' stroke='%23607afb' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/><path d='M12.37 15.8799H17.62' stroke='%23607afb' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/><path d='M6.38 15.8799L7.13 16.6299L9.38 14.3799' stroke='%23607afb' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/><path d='M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z' stroke='%23607afb' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>">
|
||||
<link rel="manifest" href="/manifest.webmanifest">
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-title" content="Negotium">
|
||||
<!-- Two of these, so the phone's status bar matches whichever theme is on. -->
|
||||
<meta name="theme-color" content="#F8FAFB" media="(prefers-color-scheme: light)">
|
||||
<meta name="theme-color" content="#121212" media="(prefers-color-scheme: dark)">
|
||||
<script>
|
||||
// Runs before first paint so dark-mode users never see a light flash.
|
||||
// App.svelte seeds its own state from the class this sets, keeping one
|
||||
// source of truth.
|
||||
(function () {
|
||||
try {
|
||||
var stored = localStorage.getItem('negotium-theme');
|
||||
var dark = stored
|
||||
? stored === 'dark'
|
||||
: window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||
if (dark) document.documentElement.classList.add('dark');
|
||||
} catch (e) {
|
||||
// Storage unavailable; fall through to the light default.
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
<style>
|
||||
/* Prevent flash of unstyled content */
|
||||
body {
|
||||
@@ -37,12 +14,14 @@
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
||||
background-color: #F8FAFB;
|
||||
color: #1A1A1A;
|
||||
transition: background-color 300ms ease, color 300ms ease;
|
||||
}
|
||||
|
||||
html.dark body {
|
||||
.dark {
|
||||
background-color: #121212;
|
||||
color: #E0E0E0;
|
||||
}
|
||||
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
Generated
+264
-1158
File diff suppressed because it is too large
Load Diff
+9
-9
@@ -1,21 +1,18 @@
|
||||
{
|
||||
"name": "negotium-todo",
|
||||
"version": "2.2.1",
|
||||
"version": "1.0.0",
|
||||
"description": "A clean, minimal to-do list application with smooth animations and dark/light mode support",
|
||||
"type": "module",
|
||||
"main": "index.html",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview",
|
||||
"test": "vitest run",
|
||||
"test:watch": "vitest"
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@sveltejs/vite-plugin-svelte": "^7.3.0",
|
||||
"svelte": "^5.56.9",
|
||||
"vite": "^8.2.1",
|
||||
"vitest": "^4.1.10"
|
||||
"@sveltejs/vite-plugin-svelte": "^3.0.0",
|
||||
"svelte": "^4.2.0",
|
||||
"vite": "^5.0.0"
|
||||
},
|
||||
"keywords": [
|
||||
"todo",
|
||||
@@ -24,5 +21,8 @@
|
||||
"minimal"
|
||||
],
|
||||
"author": "Negotium",
|
||||
"license": "MIT"
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"lottie-web": "^5.13.0"
|
||||
}
|
||||
}
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 3.3 KiB |
@@ -1,10 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512">
|
||||
<rect width="512" height="512" fill="#607afb"/>
|
||||
<g transform="translate(115.2 115.2) scale(11.73)">
|
||||
<path d="M12.37 8.87988H17.62" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6.38 8.87988L7.13 9.62988L9.38 7.37988" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M12.37 15.8799H17.62" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6.38 15.8799L7.13 16.6299L9.38 14.3799" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 890 B |
@@ -1,10 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512">
|
||||
<rect width="512" height="512" rx="96" fill="#607afb"/>
|
||||
<g transform="translate(87.04 87.04) scale(14.58)">
|
||||
<path d="M12.37 8.87988H17.62" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6.38 8.87988L7.13 9.62988L9.38 7.37988" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M12.37 15.8799H17.62" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M6.38 15.8799L7.13 16.6299L9.38 14.3799" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M9 22H15C20 22 22 20 22 15V9C22 4 20 2 15 2H9C4 2 2 4 2 9V15C2 20 4 22 9 22Z" stroke="#FFFFFF" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 898 B |
@@ -1,30 +0,0 @@
|
||||
{
|
||||
"name": "Negotium",
|
||||
"short_name": "Negotium",
|
||||
"description": "A minimal to-do list for today and tomorrow.",
|
||||
"start_url": "/",
|
||||
"scope": "/",
|
||||
"display": "standalone",
|
||||
"background_color": "#F8FAFB",
|
||||
"theme_color": "#607afb",
|
||||
"icons": [
|
||||
{
|
||||
"src": "/icon.svg",
|
||||
"sizes": "any",
|
||||
"type": "image/svg+xml",
|
||||
"purpose": "any"
|
||||
},
|
||||
{
|
||||
"src": "/icon-maskable.svg",
|
||||
"sizes": "any",
|
||||
"type": "image/svg+xml",
|
||||
"purpose": "maskable"
|
||||
},
|
||||
{
|
||||
"src": "/apple-touch-icon.png",
|
||||
"sizes": "180x180",
|
||||
"type": "image/png",
|
||||
"purpose": "any"
|
||||
}
|
||||
]
|
||||
}
|
||||
@@ -1,80 +0,0 @@
|
||||
// Negotium's service worker. Small on purpose: this app is one HTML file, one
|
||||
// JS bundle, one stylesheet and a couple of icons.
|
||||
//
|
||||
// The strategy leans on a property of the build: Vite fingerprints assets by
|
||||
// content, so index-CE76Mg_z.js can never change meaning. That splits cleanly
|
||||
// in two:
|
||||
//
|
||||
// Documents -> network first, cache as fallback. A new deploy is picked up
|
||||
// the moment you are online, so nobody gets welded to a stale
|
||||
// build. Offline, the last good copy is served.
|
||||
// Everything -> cache first. Fingerprinted files are immutable, and a new
|
||||
// else build simply asks for new filenames.
|
||||
//
|
||||
// Bump CACHE when the caching logic itself changes; old caches are dropped on
|
||||
// activate.
|
||||
|
||||
const CACHE = 'negotium-v1'
|
||||
|
||||
self.addEventListener('install', (event) => {
|
||||
// The shell is cached on first fetch rather than precached, which keeps this
|
||||
// file free of a build-generated asset manifest.
|
||||
event.waitUntil(self.skipWaiting())
|
||||
})
|
||||
|
||||
self.addEventListener('activate', (event) => {
|
||||
event.waitUntil(
|
||||
(async () => {
|
||||
const names = await caches.keys()
|
||||
await Promise.all(names.filter((name) => name !== CACHE).map((name) => caches.delete(name)))
|
||||
await self.clients.claim()
|
||||
})(),
|
||||
)
|
||||
})
|
||||
|
||||
async function networkFirst(request) {
|
||||
const cache = await caches.open(CACHE)
|
||||
|
||||
try {
|
||||
const response = await fetch(request)
|
||||
if (response && response.ok) cache.put(request, response.clone())
|
||||
return response
|
||||
} catch {
|
||||
const cached = await cache.match(request)
|
||||
if (cached) return cached
|
||||
|
||||
// A deep link visited offline that was never cached: fall back to the app
|
||||
// shell, which is all this app needs to boot.
|
||||
const shell = await cache.match('/index.html')
|
||||
if (shell) return shell
|
||||
|
||||
throw new Error('offline and nothing cached')
|
||||
}
|
||||
}
|
||||
|
||||
async function cacheFirst(request) {
|
||||
const cache = await caches.open(CACHE)
|
||||
|
||||
const cached = await cache.match(request)
|
||||
if (cached) return cached
|
||||
|
||||
const response = await fetch(request)
|
||||
if (response && response.ok) cache.put(request, response.clone())
|
||||
return response
|
||||
}
|
||||
|
||||
self.addEventListener('fetch', (event) => {
|
||||
const { request } = event
|
||||
|
||||
if (request.method !== 'GET') return
|
||||
|
||||
const url = new URL(request.url)
|
||||
if (url.origin !== self.location.origin) return
|
||||
|
||||
if (request.mode === 'navigate' || request.destination === 'document') {
|
||||
event.respondWith(networkFirst(request))
|
||||
return
|
||||
}
|
||||
|
||||
event.respondWith(cacheFirst(request))
|
||||
})
|
||||
+231
-690
File diff suppressed because it is too large
Load Diff
@@ -1,123 +0,0 @@
|
||||
import { isKey } from './dates.js'
|
||||
|
||||
const APP = 'negotium'
|
||||
const FORMAT_VERSION = 1
|
||||
|
||||
/** Everything currently stored, as a plain object ready to serialize. */
|
||||
export function buildExport(storage, now = new Date()) {
|
||||
const days = {}
|
||||
|
||||
for (const dateKey of storage.listTaskKeys().sort()) {
|
||||
const tasks = storage.loadTasks(dateKey)
|
||||
if (tasks.length > 0) days[dateKey] = tasks
|
||||
}
|
||||
|
||||
return {
|
||||
app: APP,
|
||||
version: FORMAT_VERSION,
|
||||
exportedAt: now.toISOString(),
|
||||
days,
|
||||
}
|
||||
}
|
||||
|
||||
export function serialize(data) {
|
||||
return JSON.stringify(data, null, 2)
|
||||
}
|
||||
|
||||
/** Keeps only the fields we know about, so an edited file can't smuggle
|
||||
* anything unexpected into storage. Returns null if the task is unusable. */
|
||||
function cleanTask(raw) {
|
||||
if (!raw || typeof raw !== 'object') return null
|
||||
|
||||
const hasId = typeof raw.id === 'string' || typeof raw.id === 'number'
|
||||
const text = typeof raw.text === 'string' ? raw.text.trim() : ''
|
||||
if (!hasId || !text) return null
|
||||
|
||||
return {
|
||||
id: String(raw.id),
|
||||
text,
|
||||
completed: Boolean(raw.completed),
|
||||
createdAt: typeof raw.createdAt === 'number' ? raw.createdAt : Date.now(),
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Validates a file's contents without touching storage.
|
||||
*
|
||||
* Anything malformed is skipped rather than failing the whole import: one bad
|
||||
* row in a hand-edited file shouldn't cost someone the other two hundred.
|
||||
*/
|
||||
export function parseImport(text) {
|
||||
let raw
|
||||
try {
|
||||
raw = JSON.parse(text)
|
||||
} catch {
|
||||
return { ok: false, error: "That file isn't a valid JSON file." }
|
||||
}
|
||||
|
||||
if (!raw || typeof raw !== 'object' || Array.isArray(raw)) {
|
||||
return { ok: false, error: "That file doesn't look like a Negotium export." }
|
||||
}
|
||||
|
||||
if (raw.app !== APP || !raw.days || typeof raw.days !== 'object' || Array.isArray(raw.days)) {
|
||||
return { ok: false, error: "That file doesn't look like a Negotium export." }
|
||||
}
|
||||
|
||||
const days = {}
|
||||
let taskCount = 0
|
||||
let skipped = 0
|
||||
|
||||
for (const [dateKey, value] of Object.entries(raw.days)) {
|
||||
if (!isKey(dateKey) || !Array.isArray(value)) continue
|
||||
|
||||
const tasks = []
|
||||
for (const entry of value) {
|
||||
const task = cleanTask(entry)
|
||||
if (task) tasks.push(task)
|
||||
else skipped += 1
|
||||
}
|
||||
|
||||
if (tasks.length > 0) {
|
||||
days[dateKey] = tasks
|
||||
taskCount += tasks.length
|
||||
}
|
||||
}
|
||||
|
||||
return { ok: true, days, taskCount, skipped }
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds parsed tasks to storage. Additive by design: a task whose id is already
|
||||
* present is left alone, so importing the same file twice changes nothing and
|
||||
* importing into a live list can't lose work. The trade is that import cannot
|
||||
* be used to roll back to an earlier state.
|
||||
*/
|
||||
export function mergeImport(storage, parsed) {
|
||||
if (!parsed?.ok) return { imported: 0, duplicates: 0, days: 0 }
|
||||
|
||||
let imported = 0
|
||||
let duplicates = 0
|
||||
let days = 0
|
||||
|
||||
for (const [dateKey, incoming] of Object.entries(parsed.days)) {
|
||||
const existing = storage.loadTasks(dateKey)
|
||||
const seen = new Set(existing.map(task => String(task.id)))
|
||||
|
||||
const additions = []
|
||||
for (const task of incoming) {
|
||||
if (seen.has(task.id)) duplicates += 1
|
||||
else {
|
||||
additions.push(task)
|
||||
seen.add(task.id)
|
||||
}
|
||||
}
|
||||
|
||||
if (additions.length > 0) {
|
||||
storage.saveTasks(dateKey, [...existing, ...additions])
|
||||
imported += additions.length
|
||||
days += 1
|
||||
}
|
||||
}
|
||||
|
||||
return { imported, duplicates, days }
|
||||
}
|
||||
@@ -1,178 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { createStorage, createMemoryStore } from './storage.js'
|
||||
import { buildExport, serialize, parseImport, mergeImport } from './backup.js'
|
||||
|
||||
const task = (id, text = id, completed = false) => ({ id, text, completed, createdAt: 1000 })
|
||||
|
||||
const setup = (seed = {}) => {
|
||||
const backend = createMemoryStore()
|
||||
for (const [day, tasks] of Object.entries(seed)) {
|
||||
backend.setItem(`negotium-tasks-${day}`, JSON.stringify(tasks))
|
||||
}
|
||||
return createStorage(backend)
|
||||
}
|
||||
|
||||
const file = (days, extra = {}) =>
|
||||
JSON.stringify({ app: 'negotium', version: 1, exportedAt: '2026-08-16T00:00:00.000Z', days, ...extra })
|
||||
|
||||
describe('buildExport', () => {
|
||||
it('stamps the app, version and time', () => {
|
||||
const result = buildExport(setup(), new Date(Date.UTC(2026, 7, 16, 12)))
|
||||
expect(result.app).toBe('negotium')
|
||||
expect(result.version).toBe(1)
|
||||
expect(result.exportedAt).toBe('2026-08-16T12:00:00.000Z')
|
||||
})
|
||||
|
||||
it('includes every stored day', () => {
|
||||
const storage = setup({ '2026-08-16': [task('a')], '2026-08-17': [task('b')] })
|
||||
expect(Object.keys(buildExport(storage).days).sort()).toEqual(['2026-08-16', '2026-08-17'])
|
||||
})
|
||||
|
||||
it('omits days holding no tasks', () => {
|
||||
const storage = setup({ '2026-08-16': [task('a')], '2026-08-17': [] })
|
||||
expect(Object.keys(buildExport(storage).days)).toEqual(['2026-08-16'])
|
||||
})
|
||||
|
||||
it('exports an empty days object when nothing is stored', () => {
|
||||
expect(buildExport(setup()).days).toEqual({})
|
||||
})
|
||||
|
||||
it('serializes to text a human can read', () => {
|
||||
const text = serialize(buildExport(setup({ '2026-08-16': [task('a')] })))
|
||||
expect(text).toContain('\n')
|
||||
expect(JSON.parse(text).days['2026-08-16']).toHaveLength(1)
|
||||
})
|
||||
})
|
||||
|
||||
describe('parseImport', () => {
|
||||
it('rejects text that is not JSON', () => {
|
||||
const result = parseImport('{not json')
|
||||
expect(result.ok).toBe(false)
|
||||
expect(result.error).toMatch(/valid JSON/i)
|
||||
})
|
||||
|
||||
it('rejects a file from somewhere else', () => {
|
||||
const result = parseImport(JSON.stringify({ app: 'other', days: {} }))
|
||||
expect(result.ok).toBe(false)
|
||||
expect(result.error).toMatch(/negotium/i)
|
||||
})
|
||||
|
||||
it('rejects a file with no days object', () => {
|
||||
expect(parseImport(JSON.stringify({ app: 'negotium' })).ok).toBe(false)
|
||||
})
|
||||
|
||||
it('rejects a top-level array', () => {
|
||||
expect(parseImport('[]').ok).toBe(false)
|
||||
})
|
||||
|
||||
it('accepts a valid file and counts what it found', () => {
|
||||
const result = parseImport(file({ '2026-08-16': [task('a'), task('b')], '2026-08-17': [task('c')] }))
|
||||
expect(result.ok).toBe(true)
|
||||
expect(result.taskCount).toBe(3)
|
||||
expect(Object.keys(result.days)).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('ignores unknown top-level fields', () => {
|
||||
const result = parseImport(file({ '2026-08-16': [task('a')] }, { somethingElse: 42 }))
|
||||
expect(result.ok).toBe(true)
|
||||
expect(result.taskCount).toBe(1)
|
||||
})
|
||||
|
||||
it('skips days whose key is not a date', () => {
|
||||
const result = parseImport(file({ 'not-a-date': [task('a')], '2026-08-16': [task('b')] }))
|
||||
expect(Object.keys(result.days)).toEqual(['2026-08-16'])
|
||||
})
|
||||
|
||||
it('skips a day that is not an array', () => {
|
||||
const result = parseImport(file({ '2026-08-16': { nope: true } }))
|
||||
expect(result.days).toEqual({})
|
||||
})
|
||||
|
||||
it('skips tasks with no usable text and counts them', () => {
|
||||
const result = parseImport(file({ '2026-08-16': [task('a'), { id: 'b' }, { id: 'c', text: ' ' }] }))
|
||||
expect(result.taskCount).toBe(1)
|
||||
expect(result.skipped).toBe(2)
|
||||
})
|
||||
|
||||
it('skips tasks with no id', () => {
|
||||
const result = parseImport(file({ '2026-08-16': [{ text: 'orphan' }] }))
|
||||
expect(result.taskCount).toBe(0)
|
||||
expect(result.skipped).toBe(1)
|
||||
})
|
||||
|
||||
it('coerces completed to a boolean', () => {
|
||||
const result = parseImport(file({ '2026-08-16': [{ id: 'a', text: 'x', completed: 'yes' }] }))
|
||||
expect(result.days['2026-08-16'][0].completed).toBe(true)
|
||||
})
|
||||
|
||||
it('trims task text', () => {
|
||||
const result = parseImport(file({ '2026-08-16': [{ id: 'a', text: ' spaced ' }] }))
|
||||
expect(result.days['2026-08-16'][0].text).toBe('spaced')
|
||||
})
|
||||
|
||||
it('drops fields it does not recognise', () => {
|
||||
const result = parseImport(file({ '2026-08-16': [{ id: 'a', text: 'x', evil: '<script>' }] }))
|
||||
expect(result.days['2026-08-16'][0]).not.toHaveProperty('evil')
|
||||
})
|
||||
})
|
||||
|
||||
describe('mergeImport', () => {
|
||||
it('imports into an empty store', () => {
|
||||
const storage = setup()
|
||||
const parsed = parseImport(file({ '2026-08-16': [task('a'), task('b')] }))
|
||||
const result = mergeImport(storage, parsed)
|
||||
|
||||
expect(result.imported).toBe(2)
|
||||
expect(storage.loadTasks('2026-08-16').map(t => t.id)).toEqual(['a', 'b'])
|
||||
})
|
||||
|
||||
it('appends to a day that already has tasks', () => {
|
||||
const storage = setup({ '2026-08-16': [task('existing')] })
|
||||
mergeImport(storage, parseImport(file({ '2026-08-16': [task('new')] })))
|
||||
expect(storage.loadTasks('2026-08-16').map(t => t.id)).toEqual(['existing', 'new'])
|
||||
})
|
||||
|
||||
it('never overwrites a task already present', () => {
|
||||
const storage = setup({ '2026-08-16': [task('a', 'mine')] })
|
||||
mergeImport(storage, parseImport(file({ '2026-08-16': [task('a', 'theirs')] })))
|
||||
|
||||
const stored = storage.loadTasks('2026-08-16')
|
||||
expect(stored).toHaveLength(1)
|
||||
expect(stored[0].text).toBe('mine')
|
||||
})
|
||||
|
||||
it('reports duplicates as skipped', () => {
|
||||
const storage = setup({ '2026-08-16': [task('a')] })
|
||||
const result = mergeImport(storage, parseImport(file({ '2026-08-16': [task('a'), task('b')] })))
|
||||
expect(result.imported).toBe(1)
|
||||
expect(result.duplicates).toBe(1)
|
||||
})
|
||||
|
||||
it('is a no-op the second time the same file is imported', () => {
|
||||
const storage = setup()
|
||||
const parsed = parseImport(file({ '2026-08-16': [task('a'), task('b')] }))
|
||||
|
||||
mergeImport(storage, parsed)
|
||||
const second = mergeImport(storage, parsed)
|
||||
|
||||
expect(second.imported).toBe(0)
|
||||
expect(storage.loadTasks('2026-08-16')).toHaveLength(2)
|
||||
})
|
||||
|
||||
it('counts the days it touched', () => {
|
||||
const storage = setup()
|
||||
const parsed = parseImport(file({ '2026-08-16': [task('a')], '2026-08-17': [task('b')] }))
|
||||
expect(mergeImport(storage, parsed).days).toBe(2)
|
||||
})
|
||||
|
||||
it('round-trips an export back into an empty store', () => {
|
||||
const source = setup({ '2026-08-16': [task('a'), task('b')], '2026-08-17': [task('c')] })
|
||||
const text = serialize(buildExport(source))
|
||||
|
||||
const target = setup()
|
||||
mergeImport(target, parseImport(text))
|
||||
|
||||
expect(target.loadTasks('2026-08-16')).toEqual(source.loadTasks('2026-08-16'))
|
||||
expect(target.loadTasks('2026-08-17')).toEqual(source.loadTasks('2026-08-17'))
|
||||
})
|
||||
})
|
||||
@@ -1,38 +0,0 @@
|
||||
const KEY_PATTERN = /^\d{4}-\d{2}-\d{2}$/
|
||||
|
||||
/** A `Date` as a local-time `YYYY-MM-DD` key. Sortable, which is what the
|
||||
* rollover logic relies on to find every day earlier than today. */
|
||||
export function toKey(date) {
|
||||
const year = date.getFullYear()
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0')
|
||||
const day = String(date.getDate()).padStart(2, '0')
|
||||
return `${year}-${month}-${day}`
|
||||
}
|
||||
|
||||
/** Local midnight for a key. Built from parts rather than `new Date(key)`,
|
||||
* which parses bare ISO dates as UTC and shifts the day west of Greenwich. */
|
||||
export function fromKey(key) {
|
||||
const [year, month, day] = key.split('-').map(Number)
|
||||
return new Date(year, month - 1, day)
|
||||
}
|
||||
|
||||
/** Goes through `setDate`, so it stays on the same calendar day across a DST
|
||||
* boundary rather than adding a fixed 24 hours. */
|
||||
export function addDays(date, amount) {
|
||||
const next = new Date(date.getTime())
|
||||
next.setDate(next.getDate() + amount)
|
||||
return next
|
||||
}
|
||||
|
||||
export function isKey(value) {
|
||||
return KEY_PATTERN.test(value)
|
||||
}
|
||||
|
||||
export function formatLong(dateKey) {
|
||||
return fromKey(dateKey).toLocaleDateString('en-US', {
|
||||
weekday: 'long',
|
||||
year: 'numeric',
|
||||
month: 'long',
|
||||
day: 'numeric',
|
||||
})
|
||||
}
|
||||
@@ -1,67 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { toKey, fromKey, addDays, isKey, formatLong } from './dates.js'
|
||||
|
||||
describe('toKey', () => {
|
||||
it('formats a date as local YYYY-MM-DD', () => {
|
||||
expect(toKey(new Date(2026, 7, 15))).toBe('2026-08-15')
|
||||
})
|
||||
|
||||
it('zero-pads single-digit months and days', () => {
|
||||
expect(toKey(new Date(2026, 0, 5))).toBe('2026-01-05')
|
||||
})
|
||||
|
||||
it('uses local time, not UTC', () => {
|
||||
// 23:30 local on the 15th must not roll forward to the 16th.
|
||||
expect(toKey(new Date(2026, 7, 15, 23, 30))).toBe('2026-08-15')
|
||||
})
|
||||
})
|
||||
|
||||
describe('fromKey', () => {
|
||||
it('returns local midnight for the key', () => {
|
||||
const date = fromKey('2026-08-15')
|
||||
expect(date.getFullYear()).toBe(2026)
|
||||
expect(date.getMonth()).toBe(7)
|
||||
expect(date.getDate()).toBe(15)
|
||||
expect(date.getHours()).toBe(0)
|
||||
})
|
||||
|
||||
it('round-trips with toKey', () => {
|
||||
expect(toKey(fromKey('2026-08-15'))).toBe('2026-08-15')
|
||||
})
|
||||
})
|
||||
|
||||
describe('addDays', () => {
|
||||
it('advances across a month boundary', () => {
|
||||
expect(toKey(addDays(new Date(2026, 7, 31), 1))).toBe('2026-09-01')
|
||||
})
|
||||
|
||||
it('advances across a year boundary', () => {
|
||||
expect(toKey(addDays(new Date(2026, 11, 31), 1))).toBe('2027-01-01')
|
||||
})
|
||||
|
||||
it('does not mutate its argument', () => {
|
||||
const date = new Date(2026, 7, 15)
|
||||
addDays(date, 5)
|
||||
expect(toKey(date)).toBe('2026-08-15')
|
||||
})
|
||||
})
|
||||
|
||||
describe('isKey', () => {
|
||||
it('accepts ISO date keys', () => {
|
||||
expect(isKey('2026-08-15')).toBe(true)
|
||||
})
|
||||
|
||||
it('rejects legacy toDateString keys', () => {
|
||||
expect(isKey('Sat Aug 15 2026')).toBe(false)
|
||||
})
|
||||
|
||||
it('rejects arbitrary strings', () => {
|
||||
expect(isKey('not-a-date')).toBe(false)
|
||||
})
|
||||
})
|
||||
|
||||
describe('formatLong', () => {
|
||||
it('renders the long-form date used in the header', () => {
|
||||
expect(formatLong('2026-08-15')).toBe('Saturday, August 15, 2026')
|
||||
})
|
||||
})
|
||||
@@ -1,38 +0,0 @@
|
||||
/**
|
||||
* Moves one task from one day to another and returns what is left on the
|
||||
* source day.
|
||||
*
|
||||
* This is the verb a two-day app is built around: "not today, tomorrow". Both
|
||||
* days are written before returning, so a caller only has to reload the day it
|
||||
* is showing.
|
||||
*
|
||||
* A task already sitting at the destination is not duplicated. It still leaves
|
||||
* the source day, which is what someone dragging a stray copy around would
|
||||
* expect.
|
||||
*
|
||||
* `insertAt` places the task at a position rather than at the end. Undoing a
|
||||
* move needs it: a task sent to Tomorrow should come back to the row it left,
|
||||
* not to the bottom of the list.
|
||||
*/
|
||||
export function moveTaskToDay(storage, fromKey, toKey, taskId, insertAt = null) {
|
||||
const source = storage.loadTasks(fromKey)
|
||||
if (fromKey === toKey) return source
|
||||
|
||||
const moving = source.find(task => task.id === taskId)
|
||||
if (!moving) return source
|
||||
|
||||
const remaining = source.filter(task => task.id !== taskId)
|
||||
const destination = storage.loadTasks(toKey)
|
||||
const alreadyThere = destination.some(task => task.id === taskId)
|
||||
|
||||
storage.saveTasks(fromKey, remaining)
|
||||
|
||||
if (!alreadyThere) {
|
||||
const next = [...destination]
|
||||
const at = insertAt === null ? next.length : Math.max(0, Math.min(insertAt, next.length))
|
||||
next.splice(at, 0, moving)
|
||||
storage.saveTasks(toKey, next)
|
||||
}
|
||||
|
||||
return remaining
|
||||
}
|
||||
@@ -1,119 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { createStorage, createMemoryStore } from './storage.js'
|
||||
import { moveTaskToDay } from './defer.js'
|
||||
|
||||
const task = (id, text = id) => ({ id, text, completed: false, createdAt: 1000 })
|
||||
|
||||
const setup = (seed = {}) => {
|
||||
const backend = createMemoryStore()
|
||||
for (const [day, tasks] of Object.entries(seed)) {
|
||||
backend.setItem(`negotium-tasks-${day}`, JSON.stringify(tasks))
|
||||
}
|
||||
return createStorage(backend)
|
||||
}
|
||||
|
||||
const TODAY = '2026-08-16'
|
||||
const TOMORROW = '2026-08-17'
|
||||
|
||||
describe('moveTaskToDay', () => {
|
||||
it('removes the task from the source day', () => {
|
||||
const storage = setup({ [TODAY]: [task('a'), task('b')] })
|
||||
moveTaskToDay(storage, TODAY, TOMORROW, 'a')
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['b'])
|
||||
})
|
||||
|
||||
it('appends the task to the destination day', () => {
|
||||
const storage = setup({ [TODAY]: [task('a')], [TOMORROW]: [task('existing')] })
|
||||
moveTaskToDay(storage, TODAY, TOMORROW, 'a')
|
||||
expect(storage.loadTasks(TOMORROW).map(t => t.id)).toEqual(['existing', 'a'])
|
||||
})
|
||||
|
||||
it('works when the destination day has nothing stored yet', () => {
|
||||
const storage = setup({ [TODAY]: [task('a')] })
|
||||
moveTaskToDay(storage, TODAY, TOMORROW, 'a')
|
||||
expect(storage.loadTasks(TOMORROW).map(t => t.id)).toEqual(['a'])
|
||||
})
|
||||
|
||||
it('carries the task across unchanged', () => {
|
||||
const original = { id: 'a', text: 'buy milk', completed: true, createdAt: 42 }
|
||||
const storage = setup({ [TODAY]: [original] })
|
||||
moveTaskToDay(storage, TODAY, TOMORROW, 'a')
|
||||
expect(storage.loadTasks(TOMORROW)[0]).toEqual(original)
|
||||
})
|
||||
|
||||
it('returns the source day’s remaining tasks', () => {
|
||||
const storage = setup({ [TODAY]: [task('a'), task('b')] })
|
||||
const result = moveTaskToDay(storage, TODAY, TOMORROW, 'a')
|
||||
expect(result.map(t => t.id)).toEqual(['b'])
|
||||
})
|
||||
|
||||
it('leaves the other tasks in their original order', () => {
|
||||
const storage = setup({ [TODAY]: [task('a'), task('b'), task('c')] })
|
||||
moveTaskToDay(storage, TODAY, TOMORROW, 'b')
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['a', 'c'])
|
||||
})
|
||||
|
||||
it('is a no-op for an id that is not there', () => {
|
||||
const storage = setup({ [TODAY]: [task('a')] })
|
||||
const result = moveTaskToDay(storage, TODAY, TOMORROW, 'zzz')
|
||||
expect(result.map(t => t.id)).toEqual(['a'])
|
||||
expect(storage.loadTasks(TOMORROW)).toEqual([])
|
||||
})
|
||||
|
||||
it('is a no-op when source and destination are the same day', () => {
|
||||
const storage = setup({ [TODAY]: [task('a')] })
|
||||
const result = moveTaskToDay(storage, TODAY, TODAY, 'a')
|
||||
expect(result.map(t => t.id)).toEqual(['a'])
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['a'])
|
||||
})
|
||||
|
||||
it('moves back the other way just as well', () => {
|
||||
const storage = setup({ [TOMORROW]: [task('a')], [TODAY]: [task('b')] })
|
||||
moveTaskToDay(storage, TOMORROW, TODAY, 'a')
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['b', 'a'])
|
||||
expect(storage.loadTasks(TOMORROW)).toEqual([])
|
||||
})
|
||||
|
||||
it('does not duplicate a task already present at the destination', () => {
|
||||
const storage = setup({ [TODAY]: [task('a')], [TOMORROW]: [task('a')] })
|
||||
moveTaskToDay(storage, TODAY, TOMORROW, 'a')
|
||||
expect(storage.loadTasks(TOMORROW).map(t => t.id)).toEqual(['a'])
|
||||
expect(storage.loadTasks(TODAY)).toEqual([])
|
||||
})
|
||||
})
|
||||
|
||||
describe('moveTaskToDay with an insert position', () => {
|
||||
it('inserts at the given index rather than appending', () => {
|
||||
const storage = setup({ [TOMORROW]: [task('x')], [TODAY]: [task('a'), task('b'), task('c')] })
|
||||
moveTaskToDay(storage, TOMORROW, TODAY, 'x', 1)
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['a', 'x', 'b', 'c'])
|
||||
})
|
||||
|
||||
it('puts a task back at the front', () => {
|
||||
const storage = setup({ [TOMORROW]: [task('x')], [TODAY]: [task('a')] })
|
||||
moveTaskToDay(storage, TOMORROW, TODAY, 'x', 0)
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['x', 'a'])
|
||||
})
|
||||
|
||||
it('clamps an index past the end', () => {
|
||||
const storage = setup({ [TOMORROW]: [task('x')], [TODAY]: [task('a')] })
|
||||
moveTaskToDay(storage, TOMORROW, TODAY, 'x', 99)
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['a', 'x'])
|
||||
})
|
||||
|
||||
it('still appends when no index is given', () => {
|
||||
const storage = setup({ [TOMORROW]: [task('x')], [TODAY]: [task('a')] })
|
||||
moveTaskToDay(storage, TOMORROW, TODAY, 'x')
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['a', 'x'])
|
||||
})
|
||||
|
||||
it('round-trips a defer back to where it started', () => {
|
||||
const storage = setup({ [TODAY]: [task('a'), task('b'), task('c')] })
|
||||
moveTaskToDay(storage, TODAY, TOMORROW, 'b')
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['a', 'c'])
|
||||
|
||||
moveTaskToDay(storage, TOMORROW, TODAY, 'b', 1)
|
||||
expect(storage.loadTasks(TODAY).map(t => t.id)).toEqual(['a', 'b', 'c'])
|
||||
expect(storage.loadTasks(TOMORROW)).toEqual([])
|
||||
})
|
||||
})
|
||||
@@ -1,52 +0,0 @@
|
||||
import { toKey } from './dates.js'
|
||||
|
||||
/**
|
||||
* Applies the day-boundary rule and returns today's resulting task list.
|
||||
*
|
||||
* For every stored day earlier than `now`: unfinished tasks are carried into
|
||||
* today (oldest day first, within-day order preserved, ahead of anything
|
||||
* already in today), completed tasks are discarded, and the old key is
|
||||
* deleted. Pruning is therefore a side effect of carrying, so there is no
|
||||
* separate retention policy. Future keys, meaning Tomorrow, are never touched.
|
||||
*
|
||||
* `now` is a parameter rather than a `new Date()` call so the boundary is
|
||||
* testable. This replaces `checkAndMigrateTasks`, whose guard compared a
|
||||
* timestamp against itself and so never once executed.
|
||||
*/
|
||||
export function rollover(storage, now) {
|
||||
const todayKey = toKey(now)
|
||||
|
||||
// listTaskKeys yields only well-formed ISO keys, which is what makes this
|
||||
// string comparison safe, and is why the key format changed.
|
||||
const pastKeys = storage
|
||||
.listTaskKeys()
|
||||
.filter((key) => key < todayKey)
|
||||
.sort()
|
||||
|
||||
if (pastKeys.length === 0) return storage.loadTasks(todayKey)
|
||||
|
||||
const carried = []
|
||||
for (const key of pastKeys) {
|
||||
carried.push(...storage.loadTasks(key).filter((task) => !task.completed))
|
||||
storage.removeTasks(key)
|
||||
}
|
||||
|
||||
const merged = [...carried, ...storage.loadTasks(todayKey)]
|
||||
|
||||
// Only persist when something actually moved. Prior days holding nothing but
|
||||
// completed tasks still get pruned above, but today's list is unchanged, and
|
||||
// rollover runs on every focus and visibility change.
|
||||
if (carried.length > 0) storage.saveTasks(todayKey, merged)
|
||||
|
||||
return merged
|
||||
}
|
||||
|
||||
/**
|
||||
* Milliseconds until the next local midnight, for scheduling the rollover
|
||||
* timer. Built from local calendar parts, so a spring-forward day correctly
|
||||
* yields 23 hours rather than a flat 24.
|
||||
*/
|
||||
export function msUntilNextMidnight(now) {
|
||||
const next = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1)
|
||||
return Math.max(1000, next.getTime() - now.getTime())
|
||||
}
|
||||
@@ -1,145 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { createStorage, createMemoryStore } from './storage.js'
|
||||
import { rollover, msUntilNextMidnight } from './rollover.js'
|
||||
|
||||
const task = (id, completed = false) => ({ id, text: id, completed })
|
||||
|
||||
const setup = (seed = {}) => {
|
||||
const backend = createMemoryStore()
|
||||
for (const [dateKey, tasks] of Object.entries(seed)) {
|
||||
backend.setItem(`negotium-tasks-${dateKey}`, JSON.stringify(tasks))
|
||||
}
|
||||
return createStorage(backend)
|
||||
}
|
||||
|
||||
describe('rollover', () => {
|
||||
it('is a no-op when only today has tasks', () => {
|
||||
const storage = setup({ '2026-08-15': [task('a')] })
|
||||
const result = rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(result.map((t) => t.id)).toEqual(['a'])
|
||||
expect(storage.listTaskKeys()).toEqual(['2026-08-15'])
|
||||
})
|
||||
|
||||
it('carries unfinished tasks forward from yesterday', () => {
|
||||
const storage = setup({ '2026-08-14': [task('old')] })
|
||||
const result = rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(result.map((t) => t.id)).toEqual(['old'])
|
||||
expect(storage.loadTasks('2026-08-15').map((t) => t.id)).toEqual(['old'])
|
||||
})
|
||||
|
||||
it('drops completed tasks from prior days', () => {
|
||||
const storage = setup({ '2026-08-14': [task('done', true), task('open')] })
|
||||
const result = rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(result.map((t) => t.id)).toEqual(['open'])
|
||||
})
|
||||
|
||||
it('deletes prior-day keys after carrying', () => {
|
||||
const storage = setup({ '2026-08-14': [task('old')] })
|
||||
rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(storage.listTaskKeys()).toEqual(['2026-08-15'])
|
||||
})
|
||||
|
||||
it('spans a multi-day gap, oldest day first', () => {
|
||||
const storage = setup({
|
||||
'2026-08-12': [task('mon')],
|
||||
'2026-08-13': [task('tue')],
|
||||
'2026-08-14': [task('wed')],
|
||||
})
|
||||
const result = rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(result.map((t) => t.id)).toEqual(['mon', 'tue', 'wed'])
|
||||
})
|
||||
|
||||
it('preserves within-day order', () => {
|
||||
const storage = setup({ '2026-08-14': [task('first'), task('second'), task('third')] })
|
||||
const result = rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(result.map((t) => t.id)).toEqual(['first', 'second', 'third'])
|
||||
})
|
||||
|
||||
it('places carried tasks above tasks already in today', () => {
|
||||
const storage = setup({
|
||||
'2026-08-14': [task('carried')],
|
||||
'2026-08-15': [task('existing')],
|
||||
})
|
||||
const result = rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(result.map((t) => t.id)).toEqual(['carried', 'existing'])
|
||||
})
|
||||
|
||||
it('never touches future keys', () => {
|
||||
const storage = setup({
|
||||
'2026-08-15': [task('today')],
|
||||
'2026-08-16': [task('tomorrow')],
|
||||
})
|
||||
rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(storage.loadTasks('2026-08-16').map((t) => t.id)).toEqual(['tomorrow'])
|
||||
})
|
||||
|
||||
it('handles prior days that hold only completed tasks', () => {
|
||||
const storage = setup({ '2026-08-14': [task('done', true)] })
|
||||
const result = rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(result).toEqual([])
|
||||
expect(storage.listTaskKeys()).toEqual([])
|
||||
})
|
||||
|
||||
it('returns an empty list when nothing is stored at all', () => {
|
||||
const storage = setup()
|
||||
expect(rollover(storage, new Date(2026, 7, 15, 9, 0))).toEqual([])
|
||||
})
|
||||
|
||||
it('carries across a month boundary', () => {
|
||||
const storage = setup({ '2026-07-31': [task('july')] })
|
||||
const result = rollover(storage, new Date(2026, 7, 1, 9, 0))
|
||||
expect(result.map((t) => t.id)).toEqual(['july'])
|
||||
})
|
||||
|
||||
it('carries across a year boundary', () => {
|
||||
const storage = setup({ '2026-12-31': [task('nye')] })
|
||||
const result = rollover(storage, new Date(2027, 0, 1, 9, 0))
|
||||
expect(result.map((t) => t.id)).toEqual(['nye'])
|
||||
})
|
||||
|
||||
it('is idempotent when run twice on the same day', () => {
|
||||
const storage = setup({ '2026-08-14': [task('old')] })
|
||||
const now = new Date(2026, 7, 15, 9, 0)
|
||||
rollover(storage, now)
|
||||
const second = rollover(storage, now)
|
||||
expect(second.map((t) => t.id)).toEqual(['old'])
|
||||
expect(storage.listTaskKeys()).toEqual(['2026-08-15'])
|
||||
})
|
||||
|
||||
it('leaves an unparseable legacy key in place rather than treating it as past', () => {
|
||||
const backend = createMemoryStore()
|
||||
backend.setItem('negotium-tasks-not-a-date', '[{"id":"x"}]')
|
||||
const storage = createStorage(backend)
|
||||
rollover(storage, new Date(2026, 7, 15, 9, 0))
|
||||
expect(backend.getItem('negotium-tasks-not-a-date')).toBe('[{"id":"x"}]')
|
||||
})
|
||||
})
|
||||
|
||||
describe('msUntilNextMidnight', () => {
|
||||
it('counts down to the next local midnight', () => {
|
||||
expect(msUntilNextMidnight(new Date(2026, 7, 15, 23, 0, 0))).toBe(60 * 60 * 1000)
|
||||
})
|
||||
|
||||
it('returns a full day just after midnight', () => {
|
||||
expect(msUntilNextMidnight(new Date(2026, 7, 15, 0, 0, 0))).toBe(24 * 60 * 60 * 1000)
|
||||
})
|
||||
|
||||
it('never returns a non-positive value', () => {
|
||||
expect(msUntilNextMidnight(new Date(2026, 7, 15, 23, 59, 59, 999))).toBeGreaterThan(0)
|
||||
})
|
||||
|
||||
it('lands exactly on the next calendar day', () => {
|
||||
const now = new Date(2026, 7, 15, 17, 42, 13)
|
||||
const landing = new Date(now.getTime() + msUntilNextMidnight(now))
|
||||
expect(landing.getDate()).toBe(16)
|
||||
expect(landing.getHours()).toBe(0)
|
||||
expect(landing.getMinutes()).toBe(0)
|
||||
})
|
||||
|
||||
it('lands on the next calendar day across a month boundary', () => {
|
||||
const now = new Date(2026, 7, 31, 20, 0, 0)
|
||||
const landing = new Date(now.getTime() + msUntilNextMidnight(now))
|
||||
expect(landing.getMonth()).toBe(8)
|
||||
expect(landing.getDate()).toBe(1)
|
||||
})
|
||||
})
|
||||
@@ -1,32 +0,0 @@
|
||||
const TEXT_FIELDS = new Set(['INPUT', 'TEXTAREA'])
|
||||
|
||||
/**
|
||||
* Whether a keydown should trigger task undo.
|
||||
*
|
||||
* The subtlety is the text field. Deferring to a focused field's own undo
|
||||
* sounds right, but the add-task input is where focus normally sits. You
|
||||
* click it to add a task and focus stays there, and on macOS clicking a
|
||||
* button does not move focus. Guarding on focus alone therefore disables
|
||||
* undo in the one situation it is needed: right after deleting a task.
|
||||
*
|
||||
* So it defers only when the field actually holds text worth undoing. An
|
||||
* empty input has nothing for the browser to restore, and task undo wins.
|
||||
*/
|
||||
export function shouldHandleUndo(event) {
|
||||
const isUndoChord =
|
||||
(event.metaKey || event.ctrlKey) &&
|
||||
!event.shiftKey && // Shift+Cmd+Z means redo, which this app does not have.
|
||||
!event.altKey &&
|
||||
typeof event.key === 'string' &&
|
||||
event.key.toLowerCase() === 'z'
|
||||
|
||||
if (!isUndoChord) return false
|
||||
|
||||
const target = event.target
|
||||
if (!target) return true
|
||||
|
||||
if (target.isContentEditable) return false
|
||||
if (TEXT_FIELDS.has(target.tagName) && target.value) return false
|
||||
|
||||
return true
|
||||
}
|
||||
@@ -1,78 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { shouldHandleUndo } from './shortcuts.js'
|
||||
|
||||
const evt = (overrides = {}) => ({
|
||||
metaKey: false,
|
||||
ctrlKey: false,
|
||||
shiftKey: false,
|
||||
altKey: false,
|
||||
key: 'z',
|
||||
target: { tagName: 'BODY' },
|
||||
...overrides,
|
||||
})
|
||||
|
||||
describe('shouldHandleUndo', () => {
|
||||
it('accepts Cmd+Z', () => {
|
||||
expect(shouldHandleUndo(evt({ metaKey: true }))).toBe(true)
|
||||
})
|
||||
|
||||
it('accepts Ctrl+Z', () => {
|
||||
expect(shouldHandleUndo(evt({ ctrlKey: true }))).toBe(true)
|
||||
})
|
||||
|
||||
it('accepts an uppercase key from caps lock', () => {
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, key: 'Z' }))).toBe(true)
|
||||
})
|
||||
|
||||
it('rejects Z with no modifier', () => {
|
||||
expect(shouldHandleUndo(evt())).toBe(false)
|
||||
})
|
||||
|
||||
it('rejects a different letter', () => {
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, key: 'y' }))).toBe(false)
|
||||
})
|
||||
|
||||
it('rejects Shift+Cmd+Z, which means redo', () => {
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, shiftKey: true }))).toBe(false)
|
||||
})
|
||||
|
||||
it('rejects Alt+Cmd+Z', () => {
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, altKey: true }))).toBe(false)
|
||||
})
|
||||
|
||||
it('tolerates a missing key', () => {
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, key: undefined }))).toBe(false)
|
||||
})
|
||||
|
||||
// The regression this module exists for: the add-task input is where focus
|
||||
// normally sits, so guarding on focus alone disabled undo in the one
|
||||
// situation it is actually needed.
|
||||
it('handles undo when the focused input is empty', () => {
|
||||
const target = { tagName: 'INPUT', value: '' }
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, target }))).toBe(true)
|
||||
})
|
||||
|
||||
it('defers to the field when the focused input has text to undo', () => {
|
||||
const target = { tagName: 'INPUT', value: 'half-typed task' }
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, target }))).toBe(false)
|
||||
})
|
||||
|
||||
it('defers to a textarea holding text', () => {
|
||||
const target = { tagName: 'TEXTAREA', value: 'notes' }
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, target }))).toBe(false)
|
||||
})
|
||||
|
||||
it('defers to a contenteditable target', () => {
|
||||
const target = { tagName: 'DIV', isContentEditable: true }
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, target }))).toBe(false)
|
||||
})
|
||||
|
||||
it('handles undo when the target is a button', () => {
|
||||
const target = { tagName: 'BUTTON' }
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, target }))).toBe(true)
|
||||
})
|
||||
|
||||
it('tolerates a missing target', () => {
|
||||
expect(shouldHandleUndo(evt({ metaKey: true, target: null }))).toBe(true)
|
||||
})
|
||||
})
|
||||
@@ -1,144 +0,0 @@
|
||||
import { isKey, toKey } from './dates.js'
|
||||
|
||||
const TASK_PREFIX = 'negotium-tasks-'
|
||||
const THEME_KEY = 'negotium-theme'
|
||||
|
||||
/** Backend used in tests, and as the production fallback when localStorage is
|
||||
* unavailable (Safari private mode, disabled storage, exhausted quota). */
|
||||
export function createMemoryStore() {
|
||||
const map = new Map()
|
||||
return {
|
||||
getItem: (key) => (map.has(key) ? map.get(key) : null),
|
||||
setItem: (key, value) => {
|
||||
map.set(key, String(value))
|
||||
},
|
||||
removeItem: (key) => {
|
||||
map.delete(key)
|
||||
},
|
||||
keys: () => [...map.keys()],
|
||||
}
|
||||
}
|
||||
|
||||
function wrapWebStorage(webStorage) {
|
||||
return {
|
||||
getItem: (key) => webStorage.getItem(key),
|
||||
setItem: (key, value) => webStorage.setItem(key, value),
|
||||
removeItem: (key) => webStorage.removeItem(key),
|
||||
keys: () => Object.keys(webStorage),
|
||||
}
|
||||
}
|
||||
|
||||
function resolveBackend() {
|
||||
try {
|
||||
const probe = '__negotium_probe__'
|
||||
window.localStorage.setItem(probe, '1')
|
||||
window.localStorage.removeItem(probe)
|
||||
return wrapWebStorage(window.localStorage)
|
||||
} catch {
|
||||
return createMemoryStore()
|
||||
}
|
||||
}
|
||||
|
||||
export function createStorage(backend) {
|
||||
const store = backend ?? resolveBackend()
|
||||
|
||||
function read(key) {
|
||||
try {
|
||||
return store.getItem(key)
|
||||
} catch {
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
function write(key, value) {
|
||||
try {
|
||||
store.setItem(key, value)
|
||||
} catch {
|
||||
// Quota exhausted or storage revoked mid-session. In-memory state stays
|
||||
// authoritative; losing a write beats losing the app.
|
||||
}
|
||||
}
|
||||
|
||||
function drop(key) {
|
||||
try {
|
||||
store.removeItem(key)
|
||||
} catch {
|
||||
// Nothing actionable.
|
||||
}
|
||||
}
|
||||
|
||||
function allKeys() {
|
||||
try {
|
||||
return store.keys()
|
||||
} catch {
|
||||
return []
|
||||
}
|
||||
}
|
||||
|
||||
function parseTasks(raw) {
|
||||
if (!raw) return []
|
||||
try {
|
||||
const parsed = JSON.parse(raw)
|
||||
return Array.isArray(parsed) ? parsed : []
|
||||
} catch {
|
||||
return []
|
||||
}
|
||||
}
|
||||
|
||||
function loadTasks(dateKey) {
|
||||
return parseTasks(read(TASK_PREFIX + dateKey))
|
||||
}
|
||||
|
||||
function saveTasks(dateKey, tasks) {
|
||||
write(TASK_PREFIX + dateKey, JSON.stringify(tasks))
|
||||
}
|
||||
|
||||
function taskSuffixes() {
|
||||
return allKeys()
|
||||
.filter((key) => key.startsWith(TASK_PREFIX))
|
||||
.map((key) => key.slice(TASK_PREFIX.length))
|
||||
}
|
||||
|
||||
function listTaskKeys() {
|
||||
return taskSuffixes().filter(isKey)
|
||||
}
|
||||
|
||||
function removeTasks(dateKey) {
|
||||
drop(TASK_PREFIX + dateKey)
|
||||
}
|
||||
|
||||
function loadTheme() {
|
||||
return read(THEME_KEY)
|
||||
}
|
||||
|
||||
function saveTheme(mode) {
|
||||
write(THEME_KEY, mode)
|
||||
}
|
||||
|
||||
/** One-time conversion of `negotium-tasks-Sat Aug 15 2026` keys written by
|
||||
* versions before the ISO format. Idempotent, and deliberately conservative:
|
||||
* a suffix that will not parse is left in place rather than discarded. */
|
||||
function migrateLegacyKeys() {
|
||||
for (const suffix of taskSuffixes().filter((s) => !isKey(s))) {
|
||||
const parsed = new Date(suffix)
|
||||
if (Number.isNaN(parsed.getTime())) continue
|
||||
|
||||
const isoKey = toKey(parsed)
|
||||
const legacy = parseTasks(read(TASK_PREFIX + suffix))
|
||||
const existing = loadTasks(isoKey)
|
||||
|
||||
saveTasks(isoKey, [...legacy, ...existing])
|
||||
drop(TASK_PREFIX + suffix)
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
loadTasks,
|
||||
saveTasks,
|
||||
listTaskKeys,
|
||||
removeTasks,
|
||||
loadTheme,
|
||||
saveTheme,
|
||||
migrateLegacyKeys,
|
||||
}
|
||||
}
|
||||
@@ -1,170 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { createStorage, createMemoryStore } from './storage.js'
|
||||
|
||||
const setup = (seed = {}) => {
|
||||
const backend = createMemoryStore()
|
||||
for (const [key, value] of Object.entries(seed)) backend.setItem(key, value)
|
||||
return { backend, storage: createStorage(backend) }
|
||||
}
|
||||
|
||||
describe('loadTasks', () => {
|
||||
it('returns an empty array for a missing key', () => {
|
||||
const { storage } = setup()
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual([])
|
||||
})
|
||||
|
||||
it('returns stored tasks', () => {
|
||||
const tasks = [{ id: 'a', text: 'buy milk', completed: false }]
|
||||
const { storage } = setup({ 'negotium-tasks-2026-08-15': JSON.stringify(tasks) })
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual(tasks)
|
||||
})
|
||||
|
||||
it('returns an empty array for corrupt JSON instead of throwing', () => {
|
||||
const { storage } = setup({ 'negotium-tasks-2026-08-15': '{not json' })
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual([])
|
||||
})
|
||||
|
||||
it('returns an empty array when the stored value is not an array', () => {
|
||||
const { storage } = setup({ 'negotium-tasks-2026-08-15': '{"a":1}' })
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual([])
|
||||
})
|
||||
|
||||
it('survives a throwing backend', () => {
|
||||
const backend = createMemoryStore()
|
||||
backend.getItem = () => {
|
||||
throw new Error('storage revoked')
|
||||
}
|
||||
const storage = createStorage(backend)
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual([])
|
||||
})
|
||||
})
|
||||
|
||||
describe('saveTasks', () => {
|
||||
it('round-trips through the backend', () => {
|
||||
const { storage } = setup()
|
||||
const tasks = [{ id: 'a', text: 'x', completed: true }]
|
||||
storage.saveTasks('2026-08-15', tasks)
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual(tasks)
|
||||
})
|
||||
|
||||
it('swallows a throwing backend rather than propagating', () => {
|
||||
const backend = createMemoryStore()
|
||||
backend.setItem = () => {
|
||||
throw new Error('QuotaExceededError')
|
||||
}
|
||||
const storage = createStorage(backend)
|
||||
expect(() => storage.saveTasks('2026-08-15', [])).not.toThrow()
|
||||
})
|
||||
})
|
||||
|
||||
describe('listTaskKeys', () => {
|
||||
it('returns only date keys, with the prefix stripped', () => {
|
||||
const { storage } = setup({
|
||||
'negotium-tasks-2026-08-15': '[]',
|
||||
'negotium-tasks-2026-08-16': '[]',
|
||||
'negotium-theme': 'dark',
|
||||
unrelated: 'x',
|
||||
})
|
||||
expect(storage.listTaskKeys().sort()).toEqual(['2026-08-15', '2026-08-16'])
|
||||
})
|
||||
|
||||
it('excludes legacy-format keys', () => {
|
||||
const { storage } = setup({
|
||||
'negotium-tasks-2026-08-15': '[]',
|
||||
'negotium-tasks-Sat Aug 15 2026': '[]',
|
||||
})
|
||||
expect(storage.listTaskKeys()).toEqual(['2026-08-15'])
|
||||
})
|
||||
|
||||
it('returns an empty array when enumeration throws', () => {
|
||||
const backend = createMemoryStore()
|
||||
backend.keys = () => {
|
||||
throw new Error('nope')
|
||||
}
|
||||
expect(createStorage(backend).listTaskKeys()).toEqual([])
|
||||
})
|
||||
})
|
||||
|
||||
describe('removeTasks', () => {
|
||||
it('deletes the entry', () => {
|
||||
const { storage } = setup({ 'negotium-tasks-2026-08-15': '[]' })
|
||||
storage.removeTasks('2026-08-15')
|
||||
expect(storage.listTaskKeys()).toEqual([])
|
||||
})
|
||||
})
|
||||
|
||||
describe('theme', () => {
|
||||
it('returns null when unset', () => {
|
||||
const { storage } = setup()
|
||||
expect(storage.loadTheme()).toBe(null)
|
||||
})
|
||||
|
||||
it('round-trips', () => {
|
||||
const { storage } = setup()
|
||||
storage.saveTheme('dark')
|
||||
expect(storage.loadTheme()).toBe('dark')
|
||||
})
|
||||
})
|
||||
|
||||
describe('migrateLegacyKeys', () => {
|
||||
it('rewrites a legacy key to ISO form', () => {
|
||||
const tasks = [{ id: 'a', text: 'legacy', completed: false }]
|
||||
const { storage } = setup({ 'negotium-tasks-Sat Aug 15 2026': JSON.stringify(tasks) })
|
||||
storage.migrateLegacyKeys()
|
||||
expect(storage.listTaskKeys()).toEqual(['2026-08-15'])
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual(tasks)
|
||||
})
|
||||
|
||||
it('removes the legacy key once migrated', () => {
|
||||
const { backend, storage } = setup({ 'negotium-tasks-Sat Aug 15 2026': '[]' })
|
||||
storage.migrateLegacyKeys()
|
||||
expect(backend.getItem('negotium-tasks-Sat Aug 15 2026')).toBe(null)
|
||||
})
|
||||
|
||||
it('merges legacy before existing when the ISO key is occupied', () => {
|
||||
const legacy = [{ id: 'l', text: 'legacy', completed: false }]
|
||||
const current = [{ id: 'c', text: 'current', completed: false }]
|
||||
const { storage } = setup({
|
||||
'negotium-tasks-Sat Aug 15 2026': JSON.stringify(legacy),
|
||||
'negotium-tasks-2026-08-15': JSON.stringify(current),
|
||||
})
|
||||
storage.migrateLegacyKeys()
|
||||
expect(storage.loadTasks('2026-08-15').map((t) => t.id)).toEqual(['l', 'c'])
|
||||
})
|
||||
|
||||
it('leaves an unparseable key untouched rather than destroying it', () => {
|
||||
const { storage, backend } = setup({ 'negotium-tasks-not-a-date': '[{"id":"x"}]' })
|
||||
storage.migrateLegacyKeys()
|
||||
expect(backend.getItem('negotium-tasks-not-a-date')).toBe('[{"id":"x"}]')
|
||||
})
|
||||
|
||||
it('is idempotent', () => {
|
||||
const { storage } = setup({ 'negotium-tasks-Sat Aug 15 2026': '[{"id":"a"}]' })
|
||||
storage.migrateLegacyKeys()
|
||||
storage.migrateLegacyKeys()
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual([{ id: 'a' }])
|
||||
})
|
||||
|
||||
it('migrates several legacy days independently', () => {
|
||||
const { storage } = setup({
|
||||
'negotium-tasks-Fri Aug 14 2026': '[{"id":"fri"}]',
|
||||
'negotium-tasks-Sat Aug 15 2026': '[{"id":"sat"}]',
|
||||
})
|
||||
storage.migrateLegacyKeys()
|
||||
expect(storage.listTaskKeys().sort()).toEqual(['2026-08-14', '2026-08-15'])
|
||||
expect(storage.loadTasks('2026-08-14')).toEqual([{ id: 'fri' }])
|
||||
expect(storage.loadTasks('2026-08-15')).toEqual([{ id: 'sat' }])
|
||||
})
|
||||
|
||||
it('does nothing when there is nothing to migrate', () => {
|
||||
const { storage } = setup({ 'negotium-tasks-2026-08-15': '[]' })
|
||||
storage.migrateLegacyKeys()
|
||||
expect(storage.listTaskKeys()).toEqual(['2026-08-15'])
|
||||
})
|
||||
|
||||
it('leaves the theme key alone', () => {
|
||||
const { backend, storage } = setup({ 'negotium-theme': 'dark' })
|
||||
storage.migrateLegacyKeys()
|
||||
expect(backend.getItem('negotium-theme')).toBe('dark')
|
||||
})
|
||||
})
|
||||
@@ -1,59 +0,0 @@
|
||||
/** crypto.randomUUID requires a secure context, and Negotium over plain HTTP
|
||||
* on a LAN is a real deployment shape for this app, hence the fallback. */
|
||||
function newId() {
|
||||
if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
|
||||
return crypto.randomUUID()
|
||||
}
|
||||
return `${Date.now()}-${Math.random().toString(36).slice(2)}`
|
||||
}
|
||||
|
||||
export function createTask(text, now = Date.now()) {
|
||||
return { id: newId(), text, completed: false, createdAt: now }
|
||||
}
|
||||
|
||||
export function addTask(tasks, text, now = Date.now()) {
|
||||
const trimmed = text.trim()
|
||||
if (!trimmed) return tasks
|
||||
return [...tasks, createTask(trimmed, now)]
|
||||
}
|
||||
|
||||
export function toggleTask(tasks, id) {
|
||||
return tasks.map((task) => (task.id === id ? { ...task, completed: !task.completed } : task))
|
||||
}
|
||||
|
||||
export function deleteTask(tasks, id) {
|
||||
return tasks.filter((task) => task.id !== id)
|
||||
}
|
||||
|
||||
export function reorderTask(tasks, from, to) {
|
||||
if (from === to) return tasks
|
||||
if (from < 0 || from >= tasks.length) return tasks
|
||||
if (to < 0 || to >= tasks.length) return tasks
|
||||
|
||||
const next = [...tasks]
|
||||
const [moved] = next.splice(from, 1)
|
||||
next.splice(to, 0, moved)
|
||||
return next
|
||||
}
|
||||
|
||||
export function clearCompleted(tasks) {
|
||||
return tasks.filter((task) => !task.completed)
|
||||
}
|
||||
|
||||
/**
|
||||
* Rewrites a task's text in place, keeping its id, position and completion.
|
||||
*
|
||||
* Blank input is refused rather than treated as a delete. Someone who selects
|
||||
* all and hits enter by accident should get their task back, not lose it, and
|
||||
* an empty row would be unreadable anyway. Returning the original array when
|
||||
* nothing changed also keeps a pointless write out of storage.
|
||||
*/
|
||||
export function renameTask(tasks, id, text) {
|
||||
const trimmed = text.trim()
|
||||
if (!trimmed) return tasks
|
||||
|
||||
const current = tasks.find((task) => task.id === id)
|
||||
if (!current || current.text === trimmed) return tasks
|
||||
|
||||
return tasks.map((task) => (task.id === id ? { ...task, text: trimmed } : task))
|
||||
}
|
||||
@@ -1,182 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { addTask, toggleTask, deleteTask, reorderTask, clearCompleted, renameTask } from './tasks.js'
|
||||
|
||||
const task = (id, completed = false) => ({ id, text: id, completed })
|
||||
|
||||
describe('addTask', () => {
|
||||
it('appends a task', () => {
|
||||
const result = addTask([], 'buy milk')
|
||||
expect(result).toHaveLength(1)
|
||||
expect(result[0].text).toBe('buy milk')
|
||||
expect(result[0].completed).toBe(false)
|
||||
})
|
||||
|
||||
it('trims surrounding whitespace', () => {
|
||||
expect(addTask([], ' spaced ')[0].text).toBe('spaced')
|
||||
})
|
||||
|
||||
it('rejects whitespace-only input', () => {
|
||||
const before = [task('a')]
|
||||
expect(addTask(before, ' ')).toBe(before)
|
||||
})
|
||||
|
||||
it('rejects empty input', () => {
|
||||
const before = [task('a')]
|
||||
expect(addTask(before, '')).toBe(before)
|
||||
})
|
||||
|
||||
it('assigns unique ids', () => {
|
||||
const one = addTask([], 'a')
|
||||
const two = addTask(one, 'b')
|
||||
expect(two[0].id).not.toBe(two[1].id)
|
||||
})
|
||||
|
||||
it('assigns unique ids even when added in the same millisecond', () => {
|
||||
let tasks = []
|
||||
for (let i = 0; i < 50; i += 1) tasks = addTask(tasks, `task ${i}`, 1_000_000)
|
||||
expect(new Set(tasks.map((t) => t.id)).size).toBe(50)
|
||||
})
|
||||
|
||||
it('records the supplied creation time', () => {
|
||||
expect(addTask([], 'x', 1_234_567)[0].createdAt).toBe(1_234_567)
|
||||
})
|
||||
|
||||
it('does not mutate the input array', () => {
|
||||
const before = [task('a')]
|
||||
addTask(before, 'b')
|
||||
expect(before).toHaveLength(1)
|
||||
})
|
||||
})
|
||||
|
||||
describe('toggleTask', () => {
|
||||
it('flips completion', () => {
|
||||
expect(toggleTask([task('a')], 'a')[0].completed).toBe(true)
|
||||
})
|
||||
|
||||
it('flips back', () => {
|
||||
expect(toggleTask([task('a', true)], 'a')[0].completed).toBe(false)
|
||||
})
|
||||
|
||||
it('ignores an unknown id', () => {
|
||||
expect(toggleTask([task('a')], 'zzz')[0].completed).toBe(false)
|
||||
})
|
||||
|
||||
it('does not mutate the input array', () => {
|
||||
const before = [task('a')]
|
||||
toggleTask(before, 'a')
|
||||
expect(before[0].completed).toBe(false)
|
||||
})
|
||||
})
|
||||
|
||||
describe('deleteTask', () => {
|
||||
it('removes the matching task', () => {
|
||||
expect(deleteTask([task('a'), task('b')], 'a').map((t) => t.id)).toEqual(['b'])
|
||||
})
|
||||
|
||||
it('ignores an unknown id', () => {
|
||||
expect(deleteTask([task('a')], 'zzz')).toHaveLength(1)
|
||||
})
|
||||
})
|
||||
|
||||
describe('reorderTask', () => {
|
||||
const three = [task('a'), task('b'), task('c')]
|
||||
|
||||
it('moves an item later', () => {
|
||||
expect(reorderTask(three, 0, 2).map((t) => t.id)).toEqual(['b', 'c', 'a'])
|
||||
})
|
||||
|
||||
it('moves an item earlier', () => {
|
||||
expect(reorderTask(three, 2, 0).map((t) => t.id)).toEqual(['c', 'a', 'b'])
|
||||
})
|
||||
|
||||
it('moves an item into the middle', () => {
|
||||
expect(reorderTask(three, 0, 1).map((t) => t.id)).toEqual(['b', 'a', 'c'])
|
||||
})
|
||||
|
||||
it('is a no-op when indices match', () => {
|
||||
expect(reorderTask(three, 1, 1)).toBe(three)
|
||||
})
|
||||
|
||||
it('is a no-op for an out-of-range destination', () => {
|
||||
expect(reorderTask(three, 0, 9)).toBe(three)
|
||||
})
|
||||
|
||||
it('is a no-op for an out-of-range source', () => {
|
||||
expect(reorderTask(three, -1, 0)).toBe(three)
|
||||
})
|
||||
|
||||
it('does not mutate the input array', () => {
|
||||
const before = [task('a'), task('b')]
|
||||
reorderTask(before, 0, 1)
|
||||
expect(before.map((t) => t.id)).toEqual(['a', 'b'])
|
||||
})
|
||||
})
|
||||
|
||||
describe('clearCompleted', () => {
|
||||
it('removes completed tasks', () => {
|
||||
const result = clearCompleted([task('a', true), task('b'), task('c', true)])
|
||||
expect(result.map((t) => t.id)).toEqual(['b'])
|
||||
})
|
||||
|
||||
it('is a no-op when nothing is completed', () => {
|
||||
expect(clearCompleted([task('a')])).toHaveLength(1)
|
||||
})
|
||||
|
||||
it('can empty the list entirely', () => {
|
||||
expect(clearCompleted([task('a', true)])).toEqual([])
|
||||
})
|
||||
})
|
||||
|
||||
describe('renameTask', () => {
|
||||
const task = (id, text = id, completed = false) => ({ id, text, completed, createdAt: 1 })
|
||||
|
||||
it('replaces the text', () => {
|
||||
expect(renameTask([task('a', 'old')], 'a', 'new')[0].text).toBe('new')
|
||||
})
|
||||
|
||||
it('trims what it is given', () => {
|
||||
expect(renameTask([task('a', 'old')], 'a', ' spaced ')[0].text).toBe('spaced')
|
||||
})
|
||||
|
||||
it('refuses to blank a task', () => {
|
||||
const before = [task('a', 'keep me')]
|
||||
expect(renameTask(before, 'a', '')).toBe(before)
|
||||
expect(renameTask(before, 'a', ' ')).toBe(before)
|
||||
})
|
||||
|
||||
it('keeps completion, id and creation time', () => {
|
||||
const before = [{ id: 'a', text: 'old', completed: true, createdAt: 99 }]
|
||||
expect(renameTask(before, 'a', 'new')[0]).toEqual({ id: 'a', text: 'new', completed: true, createdAt: 99 })
|
||||
})
|
||||
|
||||
it('leaves the other tasks alone', () => {
|
||||
const result = renameTask([task('a'), task('b'), task('c')], 'b', 'changed')
|
||||
expect(result.map(t => t.text)).toEqual(['a', 'changed', 'c'])
|
||||
})
|
||||
|
||||
it('keeps the task in place', () => {
|
||||
const result = renameTask([task('a'), task('b')], 'a', 'changed')
|
||||
expect(result.map(t => t.id)).toEqual(['a', 'b'])
|
||||
})
|
||||
|
||||
it('ignores an unknown id', () => {
|
||||
const before = [task('a')]
|
||||
expect(renameTask(before, 'zzz', 'nope')).toBe(before)
|
||||
})
|
||||
|
||||
it('is a no-op when the text has not changed', () => {
|
||||
const before = [task('a', 'same')]
|
||||
expect(renameTask(before, 'a', 'same')).toBe(before)
|
||||
})
|
||||
|
||||
it('handles emoji and non-latin text', () => {
|
||||
expect(renameTask([task('a')], 'a', '買い物 🛒')[0].text).toBe('買い物 🛒')
|
||||
expect(renameTask([task('a')], 'a', 'اشتر الحليب')[0].text).toBe('اشتر الحليب')
|
||||
})
|
||||
|
||||
it('does not mutate the input array', () => {
|
||||
const before = [task('a', 'old')]
|
||||
renameTask(before, 'a', 'new')
|
||||
expect(before[0].text).toBe('old')
|
||||
})
|
||||
})
|
||||
@@ -1,51 +0,0 @@
|
||||
/** Bounded stack of reversible operations. Kept separate from tasks.js so that
|
||||
* module stays purely functional while this one holds the state. */
|
||||
export function createUndoStack(limit = 10) {
|
||||
const entries = []
|
||||
|
||||
return {
|
||||
push(entry) {
|
||||
entries.push(entry)
|
||||
if (entries.length > limit) entries.shift()
|
||||
},
|
||||
pop() {
|
||||
return entries.length > 0 ? entries.pop() : null
|
||||
},
|
||||
get size() {
|
||||
return entries.length
|
||||
},
|
||||
clear() {
|
||||
entries.length = 0
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Reverses one entry against the current task list.
|
||||
*
|
||||
* Indices are clamped because the list may have changed since the entry was
|
||||
* recorded. A task deleted from position 5 can be restored into a list that
|
||||
* has since shrunk to two items, and landing at the end beats throwing.
|
||||
*
|
||||
* `clearCompleted` entries must record `removed` in ascending index order, so
|
||||
* re-inserting front to back puts each task back where it was.
|
||||
*/
|
||||
export function applyUndo(tasks, entry) {
|
||||
if (!entry) return tasks
|
||||
|
||||
if (entry.type === 'delete') {
|
||||
const next = [...tasks]
|
||||
next.splice(Math.min(entry.index, next.length), 0, entry.task)
|
||||
return next
|
||||
}
|
||||
|
||||
if (entry.type === 'clearCompleted') {
|
||||
const next = [...tasks]
|
||||
for (const { task, index } of entry.removed) {
|
||||
next.splice(Math.min(index, next.length), 0, task)
|
||||
}
|
||||
return next
|
||||
}
|
||||
|
||||
return tasks
|
||||
}
|
||||
@@ -1,100 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { createUndoStack, applyUndo } from './undo.js'
|
||||
|
||||
const task = (id, completed = false) => ({ id, text: id, completed })
|
||||
|
||||
describe('createUndoStack', () => {
|
||||
it('pops the most recent entry', () => {
|
||||
const stack = createUndoStack()
|
||||
stack.push({ type: 'delete', task: task('a'), index: 0 })
|
||||
stack.push({ type: 'delete', task: task('b'), index: 1 })
|
||||
expect(stack.pop().task.id).toBe('b')
|
||||
})
|
||||
|
||||
it('returns null when empty', () => {
|
||||
expect(createUndoStack().pop()).toBe(null)
|
||||
})
|
||||
|
||||
it('reports its size', () => {
|
||||
const stack = createUndoStack()
|
||||
expect(stack.size).toBe(0)
|
||||
stack.push({ type: 'delete', task: task('a'), index: 0 })
|
||||
expect(stack.size).toBe(1)
|
||||
})
|
||||
|
||||
it('is bounded, discarding the oldest entries', () => {
|
||||
const stack = createUndoStack(3)
|
||||
for (const id of ['a', 'b', 'c', 'd']) {
|
||||
stack.push({ type: 'delete', task: task(id), index: 0 })
|
||||
}
|
||||
expect(stack.size).toBe(3)
|
||||
expect(stack.pop().task.id).toBe('d')
|
||||
expect(stack.pop().task.id).toBe('c')
|
||||
expect(stack.pop().task.id).toBe('b')
|
||||
expect(stack.pop()).toBe(null)
|
||||
})
|
||||
|
||||
it('clears', () => {
|
||||
const stack = createUndoStack()
|
||||
stack.push({ type: 'delete', task: task('a'), index: 0 })
|
||||
stack.clear()
|
||||
expect(stack.size).toBe(0)
|
||||
})
|
||||
})
|
||||
|
||||
describe('applyUndo', () => {
|
||||
it('restores a deleted task at its original index', () => {
|
||||
const after = [task('a'), task('c')]
|
||||
const entry = { type: 'delete', task: task('b'), index: 1 }
|
||||
expect(applyUndo(after, entry).map((t) => t.id)).toEqual(['a', 'b', 'c'])
|
||||
})
|
||||
|
||||
it('restores a task deleted from the front', () => {
|
||||
const entry = { type: 'delete', task: task('a'), index: 0 }
|
||||
expect(applyUndo([task('b')], entry).map((t) => t.id)).toEqual(['a', 'b'])
|
||||
})
|
||||
|
||||
it('restores at the end when the list has since shrunk', () => {
|
||||
const entry = { type: 'delete', task: task('b'), index: 5 }
|
||||
expect(applyUndo([task('a')], entry).map((t) => t.id)).toEqual(['a', 'b'])
|
||||
})
|
||||
|
||||
it('restores a cleared batch in original positions', () => {
|
||||
const after = [task('b')]
|
||||
const entry = {
|
||||
type: 'clearCompleted',
|
||||
removed: [
|
||||
{ task: task('a', true), index: 0 },
|
||||
{ task: task('c', true), index: 2 },
|
||||
],
|
||||
}
|
||||
expect(applyUndo(after, entry).map((t) => t.id)).toEqual(['a', 'b', 'c'])
|
||||
})
|
||||
|
||||
it('restores a batch cleared from an entirely completed list', () => {
|
||||
const entry = {
|
||||
type: 'clearCompleted',
|
||||
removed: [
|
||||
{ task: task('a', true), index: 0 },
|
||||
{ task: task('b', true), index: 1 },
|
||||
],
|
||||
}
|
||||
expect(applyUndo([], entry).map((t) => t.id)).toEqual(['a', 'b'])
|
||||
})
|
||||
|
||||
it('is a no-op for a null entry', () => {
|
||||
const tasks = [task('a')]
|
||||
expect(applyUndo(tasks, null)).toBe(tasks)
|
||||
})
|
||||
|
||||
it('is a no-op for an unrecognised entry type', () => {
|
||||
const tasks = [task('a')]
|
||||
expect(applyUndo(tasks, { type: 'nonsense' })).toBe(tasks)
|
||||
})
|
||||
|
||||
it('does not mutate the input array', () => {
|
||||
const before = [task('a')]
|
||||
applyUndo(before, { type: 'delete', task: task('b'), index: 0 })
|
||||
expect(before).toHaveLength(1)
|
||||
})
|
||||
})
|
||||
+3
-11
@@ -1,15 +1,7 @@
|
||||
import { mount } from 'svelte';
|
||||
import App from './App.svelte';
|
||||
|
||||
// Production only. A service worker in dev caches your own edits back at you.
|
||||
if (import.meta.env.PROD && 'serviceWorker' in navigator) {
|
||||
window.addEventListener('load', () => {
|
||||
navigator.serviceWorker.register('/sw.js').catch(() => {
|
||||
// Offline support is a bonus; the app works without it.
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
export default mount(App, {
|
||||
const app = new App({
|
||||
target: document.getElementById('app'),
|
||||
});
|
||||
|
||||
export default app;
|
||||
|
||||
+102
-505
@@ -4,9 +4,6 @@
|
||||
--text-primary: #1A1A1A;
|
||||
--text-secondary: #666666;
|
||||
--accent: #607afb;
|
||||
/* Darker sibling of --accent for text. The brand blue reads 3.54:1 on the
|
||||
light background, under the 4.5:1 needed for body-sized text. */
|
||||
--accent-text: #4C5FD5;
|
||||
--border: #E0E0E0;
|
||||
--hover: #F5F5F5;
|
||||
--completed-bg: #EEF1FF;
|
||||
@@ -15,13 +12,12 @@
|
||||
--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
|
||||
}
|
||||
|
||||
html.dark {
|
||||
.dark {
|
||||
--bg-primary: #121212;
|
||||
--bg-surface: #1E1E1E;
|
||||
--text-primary: #E0E0E0;
|
||||
--text-secondary: #999999;
|
||||
--accent: #7B93FF;
|
||||
--accent-text: #8FA5FF;
|
||||
--border: #333333;
|
||||
--hover: #2A2A2A;
|
||||
--completed-bg: rgba(96, 122, 251, 0.15);
|
||||
@@ -50,9 +46,7 @@ body {
|
||||
.header {
|
||||
background-color: var(--bg-surface);
|
||||
border-bottom: 1px solid var(--border);
|
||||
/* The extra top padding is the iOS status bar when the app is installed to
|
||||
the home screen. Without it the header sits underneath the clock. */
|
||||
padding: calc(24px + env(safe-area-inset-top)) 48px 24px;
|
||||
padding: 24px 48px;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
@@ -92,45 +86,30 @@ body {
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
/* Both days are shown with the current one marked, so the control states
|
||||
where you are and what the alternative is without being clicked. */
|
||||
.day-switch {
|
||||
.today-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 8px 16px;
|
||||
background: transparent;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 8px;
|
||||
padding: 3px;
|
||||
gap: 2px;
|
||||
height: 40px;
|
||||
transition: border-color 200ms ease;
|
||||
}
|
||||
|
||||
.day-option {
|
||||
padding: 0 14px;
|
||||
height: 100%;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
background: transparent;
|
||||
font-family: inherit;
|
||||
font-size: 14px;
|
||||
color: var(--text-secondary);
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
transition: background-color 200ms ease, color 200ms ease;
|
||||
white-space: nowrap;
|
||||
transition: all 200ms ease;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.day-option:hover {
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.day-option.selected {
|
||||
.today-btn:hover {
|
||||
background-color: var(--hover);
|
||||
color: var(--text-primary);
|
||||
font-weight: 500;
|
||||
border-color: var(--accent);
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
html.dark .day-option.selected {
|
||||
background-color: var(--hover);
|
||||
.today-btn svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.theme-toggle {
|
||||
@@ -170,7 +149,7 @@ html.dark .day-option.selected {
|
||||
}
|
||||
|
||||
.main {
|
||||
padding: 40px 0 calc(40px + env(safe-area-inset-bottom));
|
||||
padding: 40px 0;
|
||||
}
|
||||
|
||||
.container {
|
||||
@@ -196,7 +175,7 @@ html.dark .day-option.selected {
|
||||
.date-display {
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: var(--accent-text);
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
.task-input-container {
|
||||
@@ -263,24 +242,16 @@ html.dark .day-option.selected {
|
||||
}
|
||||
|
||||
.task-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
min-height: 400px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
/* A real list, so screen readers announce item counts and position. */
|
||||
.task-items {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.task-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
padding: 16px 20px;
|
||||
background-color: var(--bg-surface);
|
||||
@@ -295,36 +266,22 @@ html.dark .day-option.selected {
|
||||
cursor: grabbing;
|
||||
}
|
||||
|
||||
/* The lifted card. It stays fully opaque and sits above the list. The old
|
||||
ghosted 0.4 opacity read as "this card is disabled" rather than "you are
|
||||
holding this card". The gap that opens beneath it is the drop indicator. */
|
||||
.task-item.dragging {
|
||||
opacity: 0.4;
|
||||
cursor: grabbing;
|
||||
z-index: 20;
|
||||
box-shadow:
|
||||
0 12px 28px rgba(0, 0, 0, 0.18),
|
||||
0 4px 8px rgba(0, 0, 0, 0.1);
|
||||
border-color: var(--accent);
|
||||
/* Only while a drag is in flight, so an ordinary touch still scrolls. */
|
||||
touch-action: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
html.dark .task-item.dragging {
|
||||
box-shadow:
|
||||
0 12px 28px rgba(0, 0, 0, 0.5),
|
||||
0 4px 8px rgba(0, 0, 0, 0.35);
|
||||
}
|
||||
|
||||
/* The released card easing back into its slot. It keeps the raised z-index so
|
||||
it stays above its neighbours on the way down, and supplies the transition
|
||||
that the lifted state deliberately withheld. */
|
||||
.task-item.settling {
|
||||
z-index: 20;
|
||||
transition:
|
||||
transform 240ms cubic-bezier(0.2, 0, 0, 1),
|
||||
box-shadow 240ms ease,
|
||||
border-color 240ms ease;
|
||||
.task-item.drag-over::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -6px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 3px;
|
||||
background-color: var(--accent);
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 0 8px rgba(96, 122, 251, 0.4);
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.task-item:hover {
|
||||
@@ -333,20 +290,14 @@ html.dark .task-item.dragging {
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.task-items:has(.dragging) .task-item:not(.dragging):hover {
|
||||
background-color: var(--bg-surface);
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.task-item.completed {
|
||||
background-color: var(--completed-bg);
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
/* Pads the 24px box out to the 32px first-line band set by the row buttons. */
|
||||
margin-block: 4px;
|
||||
border: 2px solid var(--border);
|
||||
border-radius: 6px;
|
||||
background: transparent;
|
||||
@@ -384,21 +335,7 @@ html.dark .task-item.dragging {
|
||||
|
||||
.task-text {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
text-align: left;
|
||||
background: transparent;
|
||||
border: none;
|
||||
padding-inline: 0;
|
||||
/* Pads the 24px line box out to the 32px first-line band the row buttons
|
||||
set, so the text centres against the checkbox. Declared as a longhand
|
||||
because a `padding: 0` shorthand here would reset it. */
|
||||
padding-block: 4px;
|
||||
font-family: inherit;
|
||||
cursor: text;
|
||||
font-size: 16px;
|
||||
/* 24px line box, the same height as the checkbox, so the two align on the
|
||||
first line without nudging either. */
|
||||
line-height: 1.5;
|
||||
color: var(--text-primary);
|
||||
transition: all 300ms ease;
|
||||
word-break: break-word;
|
||||
@@ -409,28 +346,10 @@ html.dark .task-item.dragging {
|
||||
color: var(--completed-text);
|
||||
}
|
||||
|
||||
/* Sized and spaced to match .task-text exactly, so committing an edit does
|
||||
not shift the row by a pixel. */
|
||||
.task-edit {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
font-family: inherit;
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
color: var(--text-primary);
|
||||
background: var(--bg-primary);
|
||||
border: 1px solid var(--accent);
|
||||
border-radius: 6px;
|
||||
padding: 0 6px;
|
||||
margin: 0 -7px;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.row-btn {
|
||||
.delete-btn {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border: none;
|
||||
position: relative;
|
||||
background: transparent;
|
||||
color: var(--text-secondary);
|
||||
cursor: pointer;
|
||||
@@ -443,16 +362,7 @@ html.dark .task-item.dragging {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.defer-btn:hover {
|
||||
background-color: var(--hover);
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
/* focus-within matters as much as hover here: the button is opacity 0 by
|
||||
default, so a keyboard user tabbing to it previously saw nothing at all:
|
||||
the focus outline was drawn on an invisible element. */
|
||||
.task-item:hover .row-btn,
|
||||
.task-item:focus-within .row-btn {
|
||||
.task-item:hover .delete-btn {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
@@ -462,11 +372,55 @@ html.dark .task-item.dragging {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
.row-btn svg {
|
||||
.delete-btn svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.loading-overlay {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: var(--bg-primary);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.loading {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.loading-logo {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
color: var(--accent);
|
||||
animation: pulse 1.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
@keyframes pulse {
|
||||
0%, 100% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
50% {
|
||||
opacity: 0.5;
|
||||
transform: scale(0.95);
|
||||
}
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
color: var(--text-secondary);
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
text-align: center;
|
||||
padding: 60px 20px;
|
||||
@@ -482,59 +436,15 @@ html.dark .task-item.dragging {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Replaces a 305 KB Lottie player that existed to draw this one picture.
|
||||
Same 200px box, so the empty state keeps its original proportions. */
|
||||
.empty-art {
|
||||
.lottie-animation {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
margin: 0 auto 24px;
|
||||
color: var(--accent);
|
||||
filter: brightness(0) saturate(100%) invert(46%) sepia(89%) saturate(2445%) hue-rotate(224deg) brightness(101%) contrast(98%);
|
||||
}
|
||||
|
||||
.empty-art-box {
|
||||
animation: empty-float 4s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.empty-art-motes path {
|
||||
animation: empty-mote 4s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.empty-art-motes path:nth-child(2) {
|
||||
animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
.empty-art-motes path:nth-child(3) {
|
||||
animation-delay: 1s;
|
||||
}
|
||||
|
||||
@keyframes empty-float {
|
||||
0%, 100% { transform: translateY(0); }
|
||||
50% { transform: translateY(-4px); }
|
||||
}
|
||||
|
||||
@keyframes empty-mote {
|
||||
0%, 100% { opacity: 0.15; transform: translateY(0); }
|
||||
50% { opacity: 0.6; transform: translateY(-6px); }
|
||||
}
|
||||
|
||||
/* Decorative only, so respect a reduced-motion preference. */
|
||||
/* Svelte's transitions run in JavaScript and never see this query, so
|
||||
App.svelte checks the same preference and zeroes its durations. This half
|
||||
covers everything driven by CSS. */
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.empty-art-box,
|
||||
.empty-art-motes path {
|
||||
animation: none;
|
||||
}
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
animation-duration: 0.01ms !important;
|
||||
animation-iteration-count: 1 !important;
|
||||
transition-duration: 0.01ms !important;
|
||||
scroll-behavior: auto !important;
|
||||
}
|
||||
.dark .lottie-animation {
|
||||
filter: brightness(0) saturate(100%) invert(59%) sepia(51%) saturate(3127%) hue-rotate(218deg) brightness(103%) contrast(101%);
|
||||
}
|
||||
|
||||
.empty-state p {
|
||||
@@ -542,195 +452,39 @@ html.dark .task-item.dragging {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Deliberately quiet. Export and import get reached for once in a blue moon,
|
||||
so they sit below the list in secondary text rather than taking a slot in
|
||||
the header next to things you use constantly. */
|
||||
.data-footer {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-top: 32px;
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid var(--border);
|
||||
font-size: 13px;
|
||||
color: var(--text-secondary);
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.data-link {
|
||||
background: transparent;
|
||||
border: none;
|
||||
padding: 4px 6px;
|
||||
margin: 0;
|
||||
border-radius: 4px;
|
||||
font-family: var(--font-family);
|
||||
font-size: 13px;
|
||||
color: var(--text-secondary);
|
||||
cursor: pointer;
|
||||
transition: color 200ms ease, background-color 200ms ease;
|
||||
}
|
||||
|
||||
.data-link:hover {
|
||||
color: var(--accent);
|
||||
background-color: var(--hover);
|
||||
}
|
||||
|
||||
.data-sep {
|
||||
color: var(--border);
|
||||
}
|
||||
|
||||
.data-status {
|
||||
margin-left: 4px;
|
||||
opacity: 0;
|
||||
transition: opacity 200ms ease;
|
||||
}
|
||||
|
||||
.data-status:not(:empty) {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.data-status.error {
|
||||
color: #d14343;
|
||||
}
|
||||
|
||||
html.dark .data-status.error {
|
||||
color: #ff8a8a;
|
||||
}
|
||||
|
||||
/* Touch devices.
|
||||
*
|
||||
* The delete button is revealed on hover, which does not exist here. Without
|
||||
* this it stays at zero opacity and a task cannot be deleted on a phone at
|
||||
* all, which is what the README told people to do.
|
||||
*
|
||||
* The rest widens hit areas to the 44px minimum. The overlays are positioned
|
||||
* so nothing moves: the controls keep the size they were drawn at, they are
|
||||
* just easier to hit. Kept behind the media query so a mouse still gets small,
|
||||
* precise targets and the full row stays available to drag. */
|
||||
@media (hover: none) {
|
||||
.row-btn {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@media (pointer: coarse) {
|
||||
/* Smaller drawn box, same 44px target from the overlay below, and the
|
||||
margin keeps it in the 32px first-line band. */
|
||||
.row-btn {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
margin-block: 2px;
|
||||
}
|
||||
|
||||
.checkbox::after,
|
||||
.row-btn::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
/* 46 rather than 44, because the switch's own padding and border eat into
|
||||
the height its buttons actually get. The theme toggle follows so the two
|
||||
stay level in the header. */
|
||||
.day-switch {
|
||||
height: 46px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.day-option {
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.theme-toggle {
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
/* Grows the tappable area of the task text to 44px without moving the text
|
||||
itself, so it stays aligned with the checkbox on the first line. */
|
||||
.task-text {
|
||||
padding-block: 10px;
|
||||
margin-block: -6px;
|
||||
}
|
||||
|
||||
.clear-completed,
|
||||
.data-link {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-height: 44px;
|
||||
}
|
||||
}
|
||||
|
||||
.visually-hidden {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.header {
|
||||
padding: calc(12px + env(safe-area-inset-top)) 20px 12px;
|
||||
padding: 16px 24px;
|
||||
}
|
||||
|
||||
/* One row rather than two. Stacking cost a whole row of height on the
|
||||
screen with the least of it to spare. */
|
||||
.header-content {
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.logo-section {
|
||||
gap: 10px;
|
||||
min-width: 0;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
margin-left: auto;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.main {
|
||||
padding-top: 24px;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 0 20px;
|
||||
padding: 0 24px;
|
||||
}
|
||||
|
||||
/* Wraps rather than stacking unconditionally, so the date only drops to
|
||||
its own line when it genuinely cannot share one. */
|
||||
.content-header {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: baseline;
|
||||
gap: 2px 12px;
|
||||
margin-bottom: 20px;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 22px;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.task-input {
|
||||
padding: 16px 18px;
|
||||
}
|
||||
|
||||
/* Both row actions stay visible on touch because there is no hover to
|
||||
reveal them, and at this width they were eating 44% of the row. Tighter
|
||||
gaps and padding hand that back to the text. */
|
||||
.task-item {
|
||||
padding: 14px 16px;
|
||||
gap: 10px;
|
||||
padding: 20px;
|
||||
min-height: 48px;
|
||||
}
|
||||
|
||||
.task-input {
|
||||
@@ -741,22 +495,7 @@ html.dark .data-status.error {
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.header {
|
||||
padding: calc(12px + env(safe-area-inset-top)) 16px 12px;
|
||||
}
|
||||
|
||||
/* The wordmark is what stops the header fitting on one line here: it needs
|
||||
422px of row and there are 343. The logo carries the identity, and the
|
||||
installed app already has the name under its icon. Kept in the
|
||||
accessibility tree so the page still has its h1. */
|
||||
.app-title {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
padding: 12px 16px;
|
||||
}
|
||||
|
||||
.container {
|
||||
@@ -772,158 +511,16 @@ html.dark .data-status.error {
|
||||
}
|
||||
}
|
||||
|
||||
/* Every control, listed once. The previous version named a handful by hand
|
||||
and had already gone stale: it still pointed at .today-btn, which no
|
||||
longer exists, while five newer controls had no focus ring at all. */
|
||||
.checkbox:focus-visible,
|
||||
.row-btn:focus-visible,
|
||||
.task-text:focus-visible,
|
||||
.task-edit:focus-visible,
|
||||
.delete-btn:focus-visible,
|
||||
.theme-toggle:focus-visible,
|
||||
.day-option:focus-visible,
|
||||
.clear-completed:focus-visible,
|
||||
.data-link:focus-visible,
|
||||
.undo-action:focus-visible,
|
||||
.carried-dismiss:focus-visible {
|
||||
.today-btn:focus-visible,
|
||||
.clear-completed:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* Hidden controls cannot show a focus ring, so reveal them when tabbed to. */
|
||||
.row-btn:focus-visible {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
|
||||
/* Shown only after something is removed, and only long enough to act on.
|
||||
It carries a real button because Cmd/Ctrl+Z does not exist on a phone,
|
||||
so on touch this is the only way back. */
|
||||
.undo-toast {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: calc(24px + env(safe-area-inset-bottom));
|
||||
z-index: 200;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
max-width: calc(100vw - 32px);
|
||||
padding: 12px 12px 12px 18px;
|
||||
border-radius: 12px;
|
||||
background-color: var(--bg-surface);
|
||||
border: 1px solid var(--border);
|
||||
box-shadow:
|
||||
0 12px 28px rgba(0, 0, 0, 0.16),
|
||||
0 4px 8px rgba(0, 0, 0, 0.08);
|
||||
font-size: 14px;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
html.dark .undo-toast {
|
||||
box-shadow:
|
||||
0 12px 28px rgba(0, 0, 0, 0.55),
|
||||
0 4px 8px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.undo-message {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.undo-action {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
flex-shrink: 0;
|
||||
padding: 6px 12px;
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
background: transparent;
|
||||
font-family: inherit;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: var(--accent-text);
|
||||
cursor: pointer;
|
||||
transition: background-color 200ms ease;
|
||||
}
|
||||
|
||||
.undo-action:hover {
|
||||
background-color: var(--hover);
|
||||
}
|
||||
|
||||
/* Teaching the shortcut is the point, so it only shows where one exists. */
|
||||
.undo-key {
|
||||
font-family: var(--font-family);
|
||||
font-size: 12px;
|
||||
color: var(--text-secondary);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 4px;
|
||||
padding: 1px 5px;
|
||||
}
|
||||
|
||||
@media (pointer: coarse) {
|
||||
.undo-key {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.undo-action {
|
||||
min-height: 44px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Says out loud what rollover just did. Without it, opening the app after a
|
||||
few days away looks like tasks appearing from nowhere. */
|
||||
.carried-notice {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
margin-bottom: 20px;
|
||||
padding: 10px 10px 10px 14px;
|
||||
border-radius: 8px;
|
||||
background-color: var(--completed-bg);
|
||||
color: var(--completed-text);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.carried-notice span {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.carried-dismiss {
|
||||
flex-shrink: 0;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: none;
|
||||
border-radius: 6px;
|
||||
background: transparent;
|
||||
color: inherit;
|
||||
cursor: pointer;
|
||||
opacity: 0.7;
|
||||
transition: opacity 200ms ease, background-color 200ms ease;
|
||||
}
|
||||
|
||||
.carried-dismiss:hover {
|
||||
opacity: 1;
|
||||
background-color: var(--hover);
|
||||
}
|
||||
|
||||
.carried-dismiss svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
@media (pointer: coarse) {
|
||||
.carried-dismiss {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
}
|
||||
}
|
||||
|
||||
+1
-1
@@ -3,7 +3,7 @@ import { svelte } from '@sveltejs/vite-plugin-svelte'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [svelte()],
|
||||
publicDir: 'public',
|
||||
publicDir: 'assets',
|
||||
server: {
|
||||
port: 3000,
|
||||
open: true
|
||||
|
||||
@@ -1,8 +0,0 @@
|
||||
import { defineConfig } from 'vitest/config'
|
||||
|
||||
export default defineConfig({
|
||||
test: {
|
||||
include: ['src/**/*.test.js'],
|
||||
environment: 'node',
|
||||
},
|
||||
})
|
||||
Reference in New Issue
Block a user