Compare commits
8 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 64967c19a0 | |||
| 8091c7d94d | |||
| e7c092f35d | |||
| d6bd8500e3 | |||
| 0487bc7e4e | |||
| 035a114e58 | |||
| ad16522461 | |||
| 4d6031d007 |
@@ -28,14 +28,19 @@ jobs:
|
||||
node --version
|
||||
|
||||
- name: Install Android SDK
|
||||
# $HOME/android-sdk is a persistent runner volume — skip when warm.
|
||||
run: |
|
||||
mkdir -p "$HOME/android-sdk/cmdline-tools"
|
||||
curl -sLo /tmp/ct.zip https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip
|
||||
unzip -q /tmp/ct.zip -d /tmp
|
||||
mv /tmp/cmdline-tools "$HOME/android-sdk/cmdline-tools/latest"
|
||||
yes | "$HOME/android-sdk/cmdline-tools/latest/bin/sdkmanager" --sdk_root="$HOME/android-sdk" --licenses >/dev/null 2>&1 || true
|
||||
"$HOME/android-sdk/cmdline-tools/latest/bin/sdkmanager" --sdk_root="$HOME/android-sdk" \
|
||||
"platform-tools" "platforms;android-36" "build-tools;36.0.0" >/dev/null
|
||||
if [ ! -d "$HOME/android-sdk/platforms/android-36" ]; then
|
||||
mkdir -p "$HOME/android-sdk/cmdline-tools"
|
||||
curl -sLo /tmp/ct.zip https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip
|
||||
unzip -q /tmp/ct.zip -d /tmp
|
||||
mv /tmp/cmdline-tools "$HOME/android-sdk/cmdline-tools/latest"
|
||||
yes | "$HOME/android-sdk/cmdline-tools/latest/bin/sdkmanager" --sdk_root="$HOME/android-sdk" --licenses >/dev/null 2>&1 || true
|
||||
"$HOME/android-sdk/cmdline-tools/latest/bin/sdkmanager" --sdk_root="$HOME/android-sdk" \
|
||||
"platform-tools" "platforms;android-36" "build-tools;36.0.0" >/dev/null
|
||||
else
|
||||
echo "SDK cache warm — skipping install"
|
||||
fi
|
||||
|
||||
- name: Install app dependencies
|
||||
run: cd app && npm ci --no-audit --no-fund
|
||||
|
||||
@@ -1,6 +1,18 @@
|
||||
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<item android:drawable="@color/splashscreen_background"/>
|
||||
<item>
|
||||
<bitmap android:gravity="center" android:src="@drawable/splashscreen_logo"/>
|
||||
</item>
|
||||
</layer-list>
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<vector xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
xmlns:aapt="http://schemas.android.com/aapt"
|
||||
android:width="108dp"
|
||||
android:height="108dp"
|
||||
android:viewportWidth="108"
|
||||
android:viewportHeight="108">
|
||||
<path android:pathData="M0,0h108v108H0z">
|
||||
<aapt:attr name="android:fillColor">
|
||||
<gradient
|
||||
android:type="linear"
|
||||
android:startX="54" android:startY="0"
|
||||
android:endX="54" android:endY="108"
|
||||
android:startColor="#1A1F2B"
|
||||
android:endColor="#0B0D12" />
|
||||
</aapt:attr>
|
||||
</path>
|
||||
</vector>
|
||||
|
||||
@@ -0,0 +1,63 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<!-- The four GTD quadrants (next/waiting/someday/projects) with a check in
|
||||
"next" — matches the app's home screen. Grid spans 32..76 to stay inside
|
||||
the adaptive-icon safe zone. -->
|
||||
<vector xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
xmlns:aapt="http://schemas.android.com/aapt"
|
||||
android:width="108dp"
|
||||
android:height="108dp"
|
||||
android:viewportWidth="108"
|
||||
android:viewportHeight="108">
|
||||
<!-- top-left: next (green) -->
|
||||
<path android:pathData="M37,32 h11 a5,5 0 0 1 5,5 v11 a5,5 0 0 1 -5,5 h-11 a5,5 0 0 1 -5,-5 v-11 a5,5 0 0 1 5,-5 z">
|
||||
<aapt:attr name="android:fillColor">
|
||||
<gradient
|
||||
android:type="linear"
|
||||
android:startX="34" android:startY="34"
|
||||
android:endX="53" android:endY="53"
|
||||
android:startColor="#4FD48C"
|
||||
android:endColor="#2E9E60" />
|
||||
</aapt:attr>
|
||||
</path>
|
||||
<!-- top-right: waiting (amber) -->
|
||||
<path android:pathData="M60,32 h11 a5,5 0 0 1 5,5 v11 a5,5 0 0 1 -5,5 h-11 a5,5 0 0 1 -5,-5 v-11 a5,5 0 0 1 5,-5 z">
|
||||
<aapt:attr name="android:fillColor">
|
||||
<gradient
|
||||
android:type="linear"
|
||||
android:startX="57" android:startY="34"
|
||||
android:endX="76" android:endY="53"
|
||||
android:startColor="#EDBB55"
|
||||
android:endColor="#C8912B" />
|
||||
</aapt:attr>
|
||||
</path>
|
||||
<!-- bottom-left: someday (violet) -->
|
||||
<path android:pathData="M37,55 h11 a5,5 0 0 1 5,5 v11 a5,5 0 0 1 -5,5 h-11 a5,5 0 0 1 -5,-5 v-11 a5,5 0 0 1 5,-5 z">
|
||||
<aapt:attr name="android:fillColor">
|
||||
<gradient
|
||||
android:type="linear"
|
||||
android:startX="34" android:startY="57"
|
||||
android:endX="53" android:endY="76"
|
||||
android:startColor="#AC9FF0"
|
||||
android:endColor="#7E6DD6" />
|
||||
</aapt:attr>
|
||||
</path>
|
||||
<!-- bottom-right: projects (blue) -->
|
||||
<path android:pathData="M60,55 h11 a5,5 0 0 1 5,5 v11 a5,5 0 0 1 -5,5 h-11 a5,5 0 0 1 -5,-5 v-11 a5,5 0 0 1 5,-5 z">
|
||||
<aapt:attr name="android:fillColor">
|
||||
<gradient
|
||||
android:type="linear"
|
||||
android:startX="57" android:startY="57"
|
||||
android:endX="76" android:endY="76"
|
||||
android:startColor="#6FAAEE"
|
||||
android:endColor="#3F7DC4" />
|
||||
</aapt:attr>
|
||||
</path>
|
||||
<!-- checkmark in the green quadrant -->
|
||||
<path
|
||||
android:pathData="M38,42.8 L42,46.8 L48.5,38.8"
|
||||
android:strokeColor="#FFFFFF"
|
||||
android:strokeWidth="3"
|
||||
android:strokeLineCap="round"
|
||||
android:strokeLineJoin="round"
|
||||
android:fillColor="#00000000" />
|
||||
</vector>
|
||||
@@ -0,0 +1,27 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<vector xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
android:width="108dp"
|
||||
android:height="108dp"
|
||||
android:viewportWidth="108"
|
||||
android:viewportHeight="108">
|
||||
<path
|
||||
android:pathData="M37,33.5 h11 a3.5,3.5 0 0 1 3.5,3.5 v11 a3.5,3.5 0 0 1 -3.5,3.5 h-11 a3.5,3.5 0 0 1 -3.5,-3.5 v-11 a3.5,3.5 0 0 1 3.5,-3.5 z"
|
||||
android:strokeColor="#FFFFFF"
|
||||
android:strokeWidth="3"
|
||||
android:fillColor="#00000000" />
|
||||
<path
|
||||
android:pathData="M60,33.5 h11 a3.5,3.5 0 0 1 3.5,3.5 v11 a3.5,3.5 0 0 1 -3.5,3.5 h-11 a3.5,3.5 0 0 1 -3.5,-3.5 v-11 a3.5,3.5 0 0 1 3.5,-3.5 z"
|
||||
android:strokeColor="#FFFFFF"
|
||||
android:strokeWidth="3"
|
||||
android:fillColor="#00000000" />
|
||||
<path
|
||||
android:pathData="M37,56.5 h11 a3.5,3.5 0 0 1 3.5,3.5 v11 a3.5,3.5 0 0 1 -3.5,3.5 h-11 a3.5,3.5 0 0 1 -3.5,-3.5 v-11 a3.5,3.5 0 0 1 3.5,-3.5 z"
|
||||
android:strokeColor="#FFFFFF"
|
||||
android:strokeWidth="3"
|
||||
android:fillColor="#00000000" />
|
||||
<path
|
||||
android:pathData="M60,56.5 h11 a3.5,3.5 0 0 1 3.5,3.5 v11 a3.5,3.5 0 0 1 -3.5,3.5 h-11 a3.5,3.5 0 0 1 -3.5,-3.5 v-11 a3.5,3.5 0 0 1 3.5,-3.5 z"
|
||||
android:strokeColor="#FFFFFF"
|
||||
android:strokeWidth="3"
|
||||
android:fillColor="#FFFFFF" />
|
||||
</vector>
|
||||
@@ -1,6 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<background android:drawable="@mipmap/ic_launcher_background"/>
|
||||
<foreground android:drawable="@mipmap/ic_launcher_foreground"/>
|
||||
<monochrome android:drawable="@mipmap/ic_launcher_monochrome"/>
|
||||
</adaptive-icon>
|
||||
<background android:drawable="@drawable/ic_launcher_background"/>
|
||||
<foreground android:drawable="@drawable/ic_launcher_foreground"/>
|
||||
<monochrome android:drawable="@drawable/ic_launcher_monochrome"/>
|
||||
</adaptive-icon>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<background android:drawable="@mipmap/ic_launcher_background"/>
|
||||
<foreground android:drawable="@mipmap/ic_launcher_foreground"/>
|
||||
<monochrome android:drawable="@mipmap/ic_launcher_monochrome"/>
|
||||
</adaptive-icon>
|
||||
<background android:drawable="@drawable/ic_launcher_background"/>
|
||||
<foreground android:drawable="@drawable/ic_launcher_foreground"/>
|
||||
<monochrome android:drawable="@drawable/ic_launcher_monochrome"/>
|
||||
</adaptive-icon>
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
# Specifies the JVM arguments used for the daemon process.
|
||||
# The setting is particularly useful for tweaking memory settings.
|
||||
# Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
|
||||
org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m
|
||||
org.gradle.jvmargs=-Xmx8192m -XX:MaxMetaspaceSize=1024m
|
||||
|
||||
# When configured, Gradle will run in incubating parallel mode.
|
||||
# This option should only be used with decoupled projects. More details, visit
|
||||
@@ -28,7 +28,9 @@ android.enablePngCrunchInReleaseBuilds=true
|
||||
# Use this property to specify which architecture you want to build.
|
||||
# You can also override it from the CLI using
|
||||
# ./gradlew <task> -PreactNativeArchitectures=x86_64
|
||||
reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
|
||||
# arm64 only: Pixel is arm64-v8a; x86/v7a builds are wasted time + APK bloat.
|
||||
# Add back x86_64 temporarily if an emulator build is ever needed.
|
||||
reactNativeArchitectures=arm64-v8a
|
||||
|
||||
# Use this property to enable support to the new architecture.
|
||||
# This will allow you to use TurboModules and the Fabric render in
|
||||
|
||||
35
app/package-lock.json
generated
35
app/package-lock.json
generated
@@ -12,9 +12,11 @@
|
||||
"@react-native-async-storage/async-storage": "2.2.0",
|
||||
"expo": "~57.0.11",
|
||||
"expo-constants": "~57.0.9",
|
||||
"expo-crypto": "~57.0.1",
|
||||
"expo-device": "~57.0.1",
|
||||
"expo-font": "~57.0.1",
|
||||
"expo-glass-effect": "~57.0.1",
|
||||
"expo-haptics": "~57.0.1",
|
||||
"expo-image": "~57.0.2",
|
||||
"expo-linking": "~57.0.5",
|
||||
"expo-router": "~57.0.11",
|
||||
@@ -26,6 +28,7 @@
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3",
|
||||
"react-native": "0.86.2",
|
||||
"react-native-draggable-flatlist": "^4.0.3",
|
||||
"react-native-gesture-handler": "~2.32.0",
|
||||
"react-native-reanimated": "4.5.1",
|
||||
"react-native-safe-area-context": "~5.7.0",
|
||||
@@ -3713,6 +3716,15 @@
|
||||
"react-native": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-crypto": {
|
||||
"version": "57.0.1",
|
||||
"resolved": "https://registry.npmjs.org/expo-crypto/-/expo-crypto-57.0.1.tgz",
|
||||
"integrity": "sha512-xwegXQw3ATgeL1ZuqbSNrGzOeG+zNeh6Z6DSJk825Qpa3TEQQ1kG3ioE1p3g/SNF373BAVz2iBKUTSytlIbBRA==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"expo": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-device": {
|
||||
"version": "57.0.1",
|
||||
"resolved": "https://registry.npmjs.org/expo-device/-/expo-device-57.0.1.tgz",
|
||||
@@ -3761,6 +3773,15 @@
|
||||
"react-native": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-haptics": {
|
||||
"version": "57.0.1",
|
||||
"resolved": "https://registry.npmjs.org/expo-haptics/-/expo-haptics-57.0.1.tgz",
|
||||
"integrity": "sha512-8VhbnxlIrfXjP0syZr1JT197nafYicQu9119adOJnX62osU9Cw+PdDnAx/6LxuKJRzQdwxOMq7b7eWjhNL5zAQ==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"expo": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/expo-image": {
|
||||
"version": "57.0.2",
|
||||
"resolved": "https://registry.npmjs.org/expo-image/-/expo-image-57.0.2.tgz",
|
||||
@@ -6424,6 +6445,20 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-draggable-flatlist": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmjs.org/react-native-draggable-flatlist/-/react-native-draggable-flatlist-4.0.3.tgz",
|
||||
"integrity": "sha512-2F4x5BFieWdGq9SetD2nSAR7s7oQCSgNllYgERRXXtNfSOuAGAVbDb/3H3lP0y5f7rEyNwabKorZAD/SyyNbDw==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/preset-typescript": "^7.17.12"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react-native": ">=0.64.0",
|
||||
"react-native-gesture-handler": ">=2.0.0",
|
||||
"react-native-reanimated": ">=2.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-native-drawer-layout": {
|
||||
"version": "4.2.10",
|
||||
"resolved": "https://registry.npmjs.org/react-native-drawer-layout/-/react-native-drawer-layout-4.2.10.tgz",
|
||||
|
||||
@@ -7,9 +7,11 @@
|
||||
"@react-native-async-storage/async-storage": "2.2.0",
|
||||
"expo": "~57.0.11",
|
||||
"expo-constants": "~57.0.9",
|
||||
"expo-crypto": "~57.0.1",
|
||||
"expo-device": "~57.0.1",
|
||||
"expo-font": "~57.0.1",
|
||||
"expo-glass-effect": "~57.0.1",
|
||||
"expo-haptics": "~57.0.1",
|
||||
"expo-image": "~57.0.2",
|
||||
"expo-linking": "~57.0.5",
|
||||
"expo-router": "~57.0.11",
|
||||
@@ -21,6 +23,7 @@
|
||||
"react": "19.2.3",
|
||||
"react-dom": "19.2.3",
|
||||
"react-native": "0.86.2",
|
||||
"react-native-draggable-flatlist": "^4.0.3",
|
||||
"react-native-gesture-handler": "~2.32.0",
|
||||
"react-native-reanimated": "4.5.1",
|
||||
"react-native-safe-area-context": "~5.7.0",
|
||||
|
||||
@@ -1,36 +0,0 @@
|
||||
import { Link, Tabs } from "expo-router";
|
||||
import { Text } from "react-native";
|
||||
import { C } from "../../lib/theme";
|
||||
|
||||
function icon(glyph: string) {
|
||||
return ({ focused }: { focused: boolean }) => (
|
||||
<Text style={{ fontSize: 20, opacity: focused ? 1 : 0.45 }}>{glyph}</Text>
|
||||
);
|
||||
}
|
||||
|
||||
export default function TabsLayout() {
|
||||
return (
|
||||
<Tabs
|
||||
screenOptions={{
|
||||
headerStyle: { backgroundColor: C.bg },
|
||||
headerTintColor: C.text,
|
||||
headerShadowVisible: false,
|
||||
sceneStyle: { backgroundColor: C.bg },
|
||||
tabBarStyle: { backgroundColor: C.bg, borderTopColor: C.border },
|
||||
tabBarActiveTintColor: C.text,
|
||||
tabBarInactiveTintColor: C.muted,
|
||||
headerRight: () => (
|
||||
<Link href="/settings" style={{ paddingHorizontal: 16, fontSize: 18 }}>
|
||||
⚙️
|
||||
</Link>
|
||||
),
|
||||
}}
|
||||
>
|
||||
<Tabs.Screen name="index" options={{ title: "Inbox", tabBarIcon: icon("📥") }} />
|
||||
<Tabs.Screen name="next" options={{ title: "Next", tabBarIcon: icon("▶️") }} />
|
||||
<Tabs.Screen name="waiting" options={{ title: "Waiting", tabBarIcon: icon("⏳") }} />
|
||||
<Tabs.Screen name="someday" options={{ title: "Someday", tabBarIcon: icon("💭") }} />
|
||||
<Tabs.Screen name="projects" options={{ title: "Projects", tabBarIcon: icon("📁") }} />
|
||||
</Tabs>
|
||||
);
|
||||
}
|
||||
@@ -1,5 +0,0 @@
|
||||
import TaskListScreen from "../../components/TaskListScreen";
|
||||
|
||||
export default function Inbox() {
|
||||
return <TaskListScreen status="inbox" capture emptyHint="Inbox zero. Capture anything above." />;
|
||||
}
|
||||
@@ -1,5 +0,0 @@
|
||||
import TaskListScreen from "../../components/TaskListScreen";
|
||||
|
||||
export default function Next() {
|
||||
return <TaskListScreen status="next" capture emptyHint="No next actions. Clarify your inbox." />;
|
||||
}
|
||||
@@ -1,5 +0,0 @@
|
||||
import TaskListScreen from "../../components/TaskListScreen";
|
||||
|
||||
export default function Someday() {
|
||||
return <TaskListScreen status="someday" emptyHint="No someday/maybe items." />;
|
||||
}
|
||||
@@ -1,5 +0,0 @@
|
||||
import TaskListScreen from "../../components/TaskListScreen";
|
||||
|
||||
export default function Waiting() {
|
||||
return <TaskListScreen status="waiting" emptyHint="Not waiting on anyone." />;
|
||||
}
|
||||
@@ -1,10 +1,23 @@
|
||||
import { Stack } from "expo-router";
|
||||
import { Link, Stack } from "expo-router";
|
||||
import { StatusBar } from "expo-status-bar";
|
||||
import { useEffect } from "react";
|
||||
import { AppState } from "react-native";
|
||||
import { GestureHandlerRootView } from "react-native-gesture-handler";
|
||||
import { hydrate, sync } from "../lib/store";
|
||||
import { C } from "../lib/theme";
|
||||
|
||||
export default function RootLayout() {
|
||||
useEffect(() => {
|
||||
void hydrate();
|
||||
// Re-sync whenever the app returns to the foreground.
|
||||
const sub = AppState.addEventListener("change", (s) => {
|
||||
if (s === "active") void sync();
|
||||
});
|
||||
return () => sub.remove();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
<GestureHandlerRootView style={{ flex: 1 }}>
|
||||
<StatusBar style="light" />
|
||||
<Stack
|
||||
screenOptions={{
|
||||
@@ -14,11 +27,25 @@ export default function RootLayout() {
|
||||
contentStyle: { backgroundColor: C.bg },
|
||||
}}
|
||||
>
|
||||
<Stack.Screen name="(tabs)" options={{ headerShown: false }} />
|
||||
<Stack.Screen
|
||||
name="index"
|
||||
options={{
|
||||
title: "GTD",
|
||||
headerRight: () => (
|
||||
<Link href="/settings" style={{ paddingHorizontal: 8, fontSize: 18 }}>
|
||||
⚙️
|
||||
</Link>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
<Stack.Screen name="list/[status]" />
|
||||
<Stack.Screen name="today" options={{ title: "Today" }} />
|
||||
<Stack.Screen name="add" options={{ title: "New task", presentation: "modal" }} />
|
||||
<Stack.Screen name="projects" options={{ title: "Projects" }} />
|
||||
<Stack.Screen name="task/[id]" options={{ title: "Clarify", presentation: "modal" }} />
|
||||
<Stack.Screen name="project/[id]" options={{ title: "Project" }} />
|
||||
<Stack.Screen name="settings" options={{ title: "Settings", presentation: "modal" }} />
|
||||
</Stack>
|
||||
</>
|
||||
</GestureHandlerRootView>
|
||||
);
|
||||
}
|
||||
|
||||
139
app/src/app/add.tsx
Normal file
139
app/src/app/add.tsx
Normal file
@@ -0,0 +1,139 @@
|
||||
import { useRouter } from "expo-router";
|
||||
import { useState } from "react";
|
||||
import { Pressable, ScrollView, StyleSheet, Text, View } from "react-native";
|
||||
import DateField from "../components/DateField";
|
||||
import PriorityChips from "../components/PriorityChips";
|
||||
import { Chips, Field } from "../components/ui";
|
||||
import { haptic } from "../lib/haptics";
|
||||
import { activeProjects, createTask } from "../lib/store";
|
||||
import { C } from "../lib/theme";
|
||||
import { useStore } from "../lib/useStore";
|
||||
import type { Task, TaskStatus } from "../lib/types";
|
||||
|
||||
const BOXES: { key: TaskStatus; label: string }[] = [
|
||||
{ key: "next", label: "Next up" },
|
||||
{ key: "waiting", label: "Waiting" },
|
||||
{ key: "someday", label: "Someday" },
|
||||
];
|
||||
|
||||
const ESTIMATES = [15, 30, 45, 60, 90, 120];
|
||||
|
||||
export default function AddTask() {
|
||||
const router = useRouter();
|
||||
const store = useStore();
|
||||
const [title, setTitle] = useState("");
|
||||
const [notes, setNotes] = useState("");
|
||||
const [priority, setPriority] = useState<Task["priority"] | null>(null);
|
||||
const [estimate, setEstimate] = useState<number | null>(null);
|
||||
const [due, setDue] = useState("");
|
||||
const [box, setBox] = useState<TaskStatus>("next");
|
||||
const [projectId, setProjectId] = useState<string | null>(null);
|
||||
|
||||
const projects = activeProjects(store).filter((p) => p.status === "active");
|
||||
const projectOptions = ["none", ...projects.map((p) => p.id)];
|
||||
const projectLabels = Object.fromEntries([["none", "None"], ...projects.map((p) => [p.id, p.name])]);
|
||||
|
||||
// Every task must be born fully scoped: title + priority + due date.
|
||||
const dueValid = /^\d{4}-\d{2}-\d{2}$/.test(due.trim());
|
||||
const ready = title.trim().length > 0 && priority !== null && dueValid;
|
||||
|
||||
const save = () => {
|
||||
if (!ready || priority === null) return;
|
||||
createTask({
|
||||
title: title.trim(),
|
||||
notes,
|
||||
status: box,
|
||||
priority,
|
||||
estimate_min: estimate,
|
||||
due_date: due.trim(),
|
||||
project_id: projectId,
|
||||
});
|
||||
haptic.success();
|
||||
router.back();
|
||||
};
|
||||
|
||||
return (
|
||||
<ScrollView style={{ flex: 1, backgroundColor: C.bg }} contentContainerStyle={{ padding: 16 }}>
|
||||
<Field label="Task" value={title} onChangeText={setTitle} placeholder="What needs doing?" autoFocus />
|
||||
<Field
|
||||
label="Description"
|
||||
value={notes}
|
||||
onChangeText={setNotes}
|
||||
placeholder="Details, links, notes…"
|
||||
multiline
|
||||
style={{ minHeight: 64, textAlignVertical: "top" }}
|
||||
/>
|
||||
<PriorityChips value={priority} onChange={setPriority} />
|
||||
<DateField label="Due date" value={due || null} onChange={(v) => setDue(v ?? "")} />
|
||||
<View style={{ marginBottom: 14 }}>
|
||||
<Text style={s.label}>Estimated time</Text>
|
||||
<View style={s.rowWrap}>
|
||||
{ESTIMATES.map((m) => {
|
||||
const active = estimate === m;
|
||||
return (
|
||||
<Pressable
|
||||
key={m}
|
||||
style={[s.chip, active && s.chipActive]}
|
||||
onPress={() => {
|
||||
haptic.select();
|
||||
setEstimate(active ? null : m);
|
||||
}}
|
||||
>
|
||||
<Text style={[s.chipText, active && { color: C.text }]}>
|
||||
{m < 60 ? `${m}m` : m % 60 ? `${Math.floor(m / 60)}h${m % 60}` : `${m / 60}h`}
|
||||
</Text>
|
||||
</Pressable>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
</View>
|
||||
<Chips
|
||||
label="Box"
|
||||
options={BOXES.map((b) => b.key)}
|
||||
labels={Object.fromEntries(BOXES.map((b) => [b.key, b.label]))}
|
||||
value={box}
|
||||
onChange={(b) => {
|
||||
haptic.select();
|
||||
setBox(b);
|
||||
}}
|
||||
/>
|
||||
<Chips
|
||||
label="Project"
|
||||
options={projectOptions}
|
||||
labels={projectLabels}
|
||||
value={projectId ?? "none"}
|
||||
onChange={(v) => setProjectId(v === "none" ? null : v)}
|
||||
/>
|
||||
<Pressable style={[s.save, !ready && s.saveDisabled]} onPress={save} disabled={!ready}>
|
||||
<Text style={[s.saveText, !ready && { color: C.muted }]}>
|
||||
{ready ? "Add task" : "Needs a title, priority & due date"}
|
||||
</Text>
|
||||
</Pressable>
|
||||
</ScrollView>
|
||||
);
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
label: { color: C.muted, fontSize: 13, marginBottom: 6, textTransform: "uppercase", letterSpacing: 0.5 },
|
||||
rowWrap: { flexDirection: "row", flexWrap: "wrap", gap: 8, marginBottom: 12 },
|
||||
chip: {
|
||||
paddingVertical: 8,
|
||||
paddingHorizontal: 14,
|
||||
borderRadius: 20,
|
||||
backgroundColor: C.surface,
|
||||
borderWidth: 1,
|
||||
borderColor: C.border,
|
||||
},
|
||||
chipActive: { backgroundColor: C.surface2, borderColor: C.accent },
|
||||
chipText: { color: C.muted, fontSize: 14 },
|
||||
save: {
|
||||
backgroundColor: C.accent,
|
||||
borderRadius: 10,
|
||||
padding: 14,
|
||||
alignItems: "center",
|
||||
marginTop: 8,
|
||||
marginBottom: 24,
|
||||
},
|
||||
saveDisabled: { backgroundColor: C.surface },
|
||||
saveText: { color: C.text, fontSize: 16, fontWeight: "600" },
|
||||
});
|
||||
107
app/src/app/index.tsx
Normal file
107
app/src/app/index.tsx
Normal file
@@ -0,0 +1,107 @@
|
||||
import { useRouter } from "expo-router";
|
||||
import { Pressable, StyleSheet, Text, View } from "react-native";
|
||||
import TaskRow from "../components/TaskRow";
|
||||
import { haptic } from "../lib/haptics";
|
||||
import { tasksByStatus, todayTasks } from "../lib/store";
|
||||
import { C } from "../lib/theme";
|
||||
import { useStore } from "../lib/useStore";
|
||||
|
||||
const MENU = [
|
||||
{ icon: "📅", label: "Today", href: "/today" },
|
||||
{ icon: "▶️", label: "Next", href: "/list/next" },
|
||||
{ icon: "⏳", label: "Waiting", href: "/list/waiting" },
|
||||
{ icon: "💭", label: "Someday", href: "/list/someday" },
|
||||
{ icon: "📁", label: "Projects", href: "/projects" },
|
||||
] as const;
|
||||
|
||||
export default function Home() {
|
||||
const router = useRouter();
|
||||
const store = useStore();
|
||||
const next = tasksByStatus(store, "next");
|
||||
const { overdue } = todayTasks(store);
|
||||
|
||||
return (
|
||||
<View style={s.screen}>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={s.sectionTitle}>Next up</Text>
|
||||
{next.slice(0, 3).map((t) => (
|
||||
<TaskRow key={t.id} task={t} />
|
||||
))}
|
||||
{next.length === 0 && <Text style={s.empty}>Nothing next. Tap + to add.</Text>}
|
||||
{next.length > 3 && (
|
||||
<Pressable onPress={() => router.push("/list/next")}>
|
||||
<Text style={s.viewAll}>all next actions ({next.length}) →</Text>
|
||||
</Pressable>
|
||||
)}
|
||||
{overdue.length > 0 && (
|
||||
<Pressable onPress={() => router.push("/today")}>
|
||||
<Text style={s.overdue}>{overdue.length} overdue →</Text>
|
||||
</Pressable>
|
||||
)}
|
||||
{store.syncError && <Text style={s.error}>{store.syncError}</Text>}
|
||||
</View>
|
||||
<View style={s.menu}>
|
||||
{MENU.map((m) => (
|
||||
<Pressable key={m.label} style={s.menuItem} onPress={() => router.push(m.href)}>
|
||||
<Text style={s.menuIcon}>{m.icon}</Text>
|
||||
<Text style={s.menuLabel}>{m.label}</Text>
|
||||
</Pressable>
|
||||
))}
|
||||
</View>
|
||||
<Pressable
|
||||
style={s.fab}
|
||||
onPress={() => {
|
||||
haptic.tap();
|
||||
router.push("/add");
|
||||
}}
|
||||
>
|
||||
<Text style={s.fabText}>+</Text>
|
||||
</Pressable>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
screen: { flex: 1, backgroundColor: C.bg },
|
||||
sectionTitle: {
|
||||
color: C.muted,
|
||||
fontSize: 13,
|
||||
textTransform: "uppercase",
|
||||
letterSpacing: 1,
|
||||
paddingHorizontal: 16,
|
||||
paddingTop: 18,
|
||||
paddingBottom: 6,
|
||||
},
|
||||
empty: { color: C.muted, textAlign: "center", marginTop: 48, fontSize: 15 },
|
||||
viewAll: { color: C.muted, fontSize: 14, padding: 16 },
|
||||
overdue: { color: C.danger, fontSize: 14, paddingHorizontal: 16, paddingBottom: 8 },
|
||||
error: { color: C.danger, paddingHorizontal: 16, paddingTop: 8 },
|
||||
menu: {
|
||||
flexDirection: "row",
|
||||
borderTopWidth: StyleSheet.hairlineWidth,
|
||||
borderTopColor: C.border,
|
||||
paddingTop: 10,
|
||||
paddingBottom: 18,
|
||||
backgroundColor: C.bg,
|
||||
},
|
||||
menuItem: { flex: 1, alignItems: "center", gap: 3 },
|
||||
menuIcon: { fontSize: 20 },
|
||||
menuLabel: { color: C.muted, fontSize: 11 },
|
||||
fab: {
|
||||
position: "absolute",
|
||||
right: 20,
|
||||
bottom: 92,
|
||||
width: 58,
|
||||
height: 58,
|
||||
borderRadius: 29,
|
||||
backgroundColor: C.accent,
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
elevation: 6,
|
||||
shadowColor: "#000",
|
||||
shadowOpacity: 0.35,
|
||||
shadowRadius: 8,
|
||||
shadowOffset: { width: 0, height: 4 },
|
||||
},
|
||||
fabText: { color: "#FFFFFF", fontSize: 28, lineHeight: 32, fontWeight: "600" },
|
||||
});
|
||||
30
app/src/app/list/[status].tsx
Normal file
30
app/src/app/list/[status].tsx
Normal file
@@ -0,0 +1,30 @@
|
||||
import { Stack, useLocalSearchParams } from "expo-router";
|
||||
import TaskListScreen from "../../components/TaskListScreen";
|
||||
import type { TaskStatus } from "../../lib/types";
|
||||
|
||||
const TITLES: Record<string, string> = {
|
||||
next: "Next up",
|
||||
waiting: "Waiting for",
|
||||
scheduled: "Scheduled",
|
||||
someday: "Someday",
|
||||
done: "Done",
|
||||
};
|
||||
|
||||
const HINTS: Record<string, string> = {
|
||||
next: "Nothing next. Tap + on the home screen.",
|
||||
waiting: "Not waiting on anyone.",
|
||||
scheduled: "Nothing scheduled.",
|
||||
someday: "No someday/maybe items.",
|
||||
done: "Nothing done yet.",
|
||||
};
|
||||
|
||||
export default function ListByStatus() {
|
||||
const { status } = useLocalSearchParams<{ status: string }>();
|
||||
const st = (status in TITLES ? status : "next") as TaskStatus;
|
||||
return (
|
||||
<>
|
||||
<Stack.Screen options={{ title: TITLES[st] }} />
|
||||
<TaskListScreen status={st} emptyHint={HINTS[st]} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -1,46 +1,32 @@
|
||||
import { Stack, useFocusEffect, useLocalSearchParams, useRouter } from "expo-router";
|
||||
import { useCallback, useState } from "react";
|
||||
import { Stack, useLocalSearchParams, useRouter } from "expo-router";
|
||||
import { useState } from "react";
|
||||
import { FlatList, Pressable, StyleSheet, Text, TextInput, View } from "react-native";
|
||||
import { Button, Chips } from "../../components/ui";
|
||||
import { api } from "../../lib/api";
|
||||
import { createTask, dropProject, updateProject, updateTask } from "../../lib/store";
|
||||
import { C } from "../../lib/theme";
|
||||
import type { Project, ProjectStatus, Task } from "../../lib/types";
|
||||
import { useStore } from "../../lib/useStore";
|
||||
import type { ProjectStatus } from "../../lib/types";
|
||||
|
||||
const STATUSES: ProjectStatus[] = ["active", "someday", "completed"];
|
||||
|
||||
export default function ProjectDetail() {
|
||||
const { id } = useLocalSearchParams<{ id: string }>();
|
||||
const router = useRouter();
|
||||
const [project, setProject] = useState<Project | null>(null);
|
||||
const [tasks, setTasks] = useState<Task[]>([]);
|
||||
const store = useStore();
|
||||
const [draft, setDraft] = useState("");
|
||||
|
||||
const load = useCallback(async () => {
|
||||
const [ps, ts] = await Promise.all([api.projects.list(), api.tasks.list({ project_id: id })]);
|
||||
setProject(ps.find((p) => p.id === id) ?? null);
|
||||
setTasks(ts.filter((t) => t.status !== "done"));
|
||||
}, [id]);
|
||||
const project = store.projects.find((p) => p.id === id);
|
||||
if (!project) return <Text style={{ color: C.muted, margin: 16 }}>Project not found.</Text>;
|
||||
|
||||
useFocusEffect(
|
||||
useCallback(() => {
|
||||
load();
|
||||
}, [load]),
|
||||
);
|
||||
const tasks = store.tasks
|
||||
.filter((t) => t.project_id === id && t.status !== "done" && t.status !== "trashed")
|
||||
.sort((a, b) => a.sort_order - b.sort_order || b.created_at.localeCompare(a.created_at));
|
||||
|
||||
if (!project) return <Text style={{ color: C.muted, margin: 16 }}>Loading…</Text>;
|
||||
|
||||
const add = async () => {
|
||||
const add = () => {
|
||||
const title = draft.trim();
|
||||
if (!title) return;
|
||||
setDraft("");
|
||||
await api.tasks.create({ title, status: "next", project_id: id });
|
||||
load();
|
||||
};
|
||||
|
||||
const complete = async (t: Task) => {
|
||||
setTasks((cur) => cur.filter((x) => x.id !== t.id));
|
||||
await api.tasks.update(t.id, { status: "done" });
|
||||
load();
|
||||
createTask({ title, status: "next", project_id: id });
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -51,10 +37,7 @@ export default function ProjectDetail() {
|
||||
label="Status"
|
||||
options={STATUSES}
|
||||
value={project.status}
|
||||
onChange={async (status) => {
|
||||
setProject({ ...project, status });
|
||||
await api.projects.update(project.id, { status });
|
||||
}}
|
||||
onChange={(status) => updateProject(project.id, { status })}
|
||||
/>
|
||||
</View>
|
||||
<TextInput
|
||||
@@ -64,6 +47,7 @@ export default function ProjectDetail() {
|
||||
value={draft}
|
||||
onChangeText={setDraft}
|
||||
onSubmitEditing={add}
|
||||
submitBehavior="submit"
|
||||
returnKeyType="done"
|
||||
/>
|
||||
<FlatList
|
||||
@@ -71,7 +55,11 @@ export default function ProjectDetail() {
|
||||
keyExtractor={(t) => t.id}
|
||||
renderItem={({ item }) => (
|
||||
<Pressable style={s.row} onPress={() => router.push(`/task/${item.id}`)}>
|
||||
<Pressable style={s.checkbox} hitSlop={10} onPress={() => complete(item)} />
|
||||
<Pressable
|
||||
style={s.checkbox}
|
||||
hitSlop={10}
|
||||
onPress={() => updateTask(item.id, { status: "done" })}
|
||||
/>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={s.title}>{item.title}</Text>
|
||||
<Text style={s.meta}>{[item.status, item.context].filter(Boolean).join(" · ")}</Text>
|
||||
@@ -84,8 +72,8 @@ export default function ProjectDetail() {
|
||||
<Button
|
||||
title="Drop project"
|
||||
danger
|
||||
onPress={async () => {
|
||||
await api.projects.drop(project.id);
|
||||
onPress={() => {
|
||||
dropProject(project.id);
|
||||
router.back();
|
||||
}}
|
||||
/>
|
||||
|
||||
@@ -1,37 +1,21 @@
|
||||
import { useFocusEffect, useRouter } from "expo-router";
|
||||
import { useCallback, useState } from "react";
|
||||
import { useRouter } from "expo-router";
|
||||
import { useState } from "react";
|
||||
import { FlatList, Pressable, StyleSheet, Text, TextInput, View } from "react-native";
|
||||
import { api } from "../../lib/api";
|
||||
import { C } from "../../lib/theme";
|
||||
import type { Project } from "../../lib/types";
|
||||
import { activeProjects, createProject, openTaskCount } from "../lib/store";
|
||||
import { C } from "../lib/theme";
|
||||
import { useStore } from "../lib/useStore";
|
||||
|
||||
export default function Projects() {
|
||||
const router = useRouter();
|
||||
const [projects, setProjects] = useState<Project[]>([]);
|
||||
const store = useStore();
|
||||
const [draft, setDraft] = useState("");
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const projects = activeProjects(store);
|
||||
|
||||
const load = useCallback(async () => {
|
||||
try {
|
||||
setProjects(await api.projects.list());
|
||||
setError(null);
|
||||
} catch (e) {
|
||||
setError(e instanceof Error ? e.message : String(e));
|
||||
}
|
||||
}, []);
|
||||
|
||||
useFocusEffect(
|
||||
useCallback(() => {
|
||||
load();
|
||||
}, [load]),
|
||||
);
|
||||
|
||||
const add = async () => {
|
||||
const add = () => {
|
||||
const name = draft.trim();
|
||||
if (!name) return;
|
||||
setDraft("");
|
||||
await api.projects.create({ name });
|
||||
load();
|
||||
createProject({ name });
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -45,7 +29,6 @@ export default function Projects() {
|
||||
onSubmitEditing={add}
|
||||
returnKeyType="done"
|
||||
/>
|
||||
{error && <Text style={s.error}>{error}</Text>}
|
||||
<FlatList
|
||||
data={projects}
|
||||
keyExtractor={(p) => p.id}
|
||||
@@ -54,8 +37,7 @@ export default function Projects() {
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={s.title}>{item.name}</Text>
|
||||
<Text style={s.meta}>
|
||||
{item.status}
|
||||
{item.open_tasks != null && ` · ${item.open_tasks} open`}
|
||||
{item.status} · {openTaskCount(store, item.id)} open
|
||||
</Text>
|
||||
</View>
|
||||
<Text style={{ color: C.muted }}>›</Text>
|
||||
@@ -91,5 +73,4 @@ const s = StyleSheet.create({
|
||||
title: { color: C.text, fontSize: 16 },
|
||||
meta: { color: C.muted, fontSize: 13, marginTop: 2 },
|
||||
empty: { color: C.muted, textAlign: "center", marginTop: 48 },
|
||||
error: { color: C.danger, marginHorizontal: 16, marginTop: 8 },
|
||||
});
|
||||
@@ -4,6 +4,7 @@ import { ScrollView, Text } from "react-native";
|
||||
import { Button, Field } from "../components/ui";
|
||||
import { api } from "../lib/api";
|
||||
import { DEFAULT_URL, getConfig, setConfig } from "../lib/config";
|
||||
import { sync } from "../lib/store";
|
||||
import { C } from "../lib/theme";
|
||||
|
||||
export default function Settings() {
|
||||
@@ -23,6 +24,7 @@ export default function Settings() {
|
||||
await setConfig(url, token);
|
||||
try {
|
||||
await api.tasks.list({ status: "inbox" });
|
||||
void sync();
|
||||
router.back();
|
||||
} catch (e) {
|
||||
setStatus(`Connection failed: ${e instanceof Error ? e.message : e}`);
|
||||
|
||||
@@ -1,109 +1,100 @@
|
||||
import { useLocalSearchParams, useRouter } from "expo-router";
|
||||
import { useEffect, useState } from "react";
|
||||
import { useState } from "react";
|
||||
import { ScrollView, Text } from "react-native";
|
||||
import DateField from "../../components/DateField";
|
||||
import PriorityChips from "../../components/PriorityChips";
|
||||
import { Button, Chips, Field } from "../../components/ui";
|
||||
import { api } from "../../lib/api";
|
||||
import { activeProjects, trashTask, updateTask } from "../../lib/store";
|
||||
import { C } from "../../lib/theme";
|
||||
import type { Project, Task, TaskStatus } from "../../lib/types";
|
||||
import { useStore } from "../../lib/useStore";
|
||||
import type { Task, TaskStatus } from "../../lib/types";
|
||||
|
||||
const STATUSES: TaskStatus[] = ["inbox", "next", "waiting", "scheduled", "someday", "done"];
|
||||
const STATUSES: TaskStatus[] = ["next", "waiting", "someday", "done"];
|
||||
|
||||
export default function TaskDetail() {
|
||||
const { id } = useLocalSearchParams<{ id: string }>();
|
||||
const router = useRouter();
|
||||
const [task, setTask] = useState<Task | null>(null);
|
||||
const [projects, setProjects] = useState<Project[]>([]);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const store = useStore();
|
||||
const original = store.tasks.find((t) => t.id === id);
|
||||
// Draft is local to the screen; nothing is written until Save.
|
||||
const [draft, setDraft] = useState<Task | null>(original ?? null);
|
||||
|
||||
useEffect(() => {
|
||||
Promise.all([api.tasks.get(id), api.projects.list()])
|
||||
.then(([t, ps]) => {
|
||||
setTask(t);
|
||||
setProjects(ps.filter((p) => p.status === "active" || p.id === t.project_id));
|
||||
})
|
||||
.catch((e) => setError(e instanceof Error ? e.message : String(e)));
|
||||
}, [id]);
|
||||
if (!draft) return <Text style={{ color: C.muted, margin: 16 }}>Task not found.</Text>;
|
||||
|
||||
if (error) return <Text style={{ color: C.danger, margin: 16 }}>{error}</Text>;
|
||||
if (!task) return <Text style={{ color: C.muted, margin: 16 }}>Loading…</Text>;
|
||||
const set = (patch: Partial<Task>) => setDraft({ ...draft, ...patch });
|
||||
|
||||
const set = (patch: Partial<Task>) => setTask({ ...task, ...patch });
|
||||
|
||||
const save = async () => {
|
||||
try {
|
||||
await api.tasks.update(task.id, {
|
||||
title: task.title,
|
||||
notes: task.notes,
|
||||
status: task.status,
|
||||
project_id: task.project_id,
|
||||
context: task.context,
|
||||
waiting_for: task.waiting_for,
|
||||
due_date: task.due_date,
|
||||
defer_date: task.defer_date,
|
||||
});
|
||||
router.back();
|
||||
} catch (e) {
|
||||
setError(e instanceof Error ? e.message : String(e));
|
||||
}
|
||||
};
|
||||
|
||||
const trash = async () => {
|
||||
await api.tasks.trash(task.id);
|
||||
const save = () => {
|
||||
updateTask(draft.id, {
|
||||
title: draft.title,
|
||||
notes: draft.notes,
|
||||
status: draft.status,
|
||||
project_id: draft.project_id,
|
||||
context: draft.context,
|
||||
waiting_for: draft.waiting_for,
|
||||
due_date: draft.due_date,
|
||||
defer_date: draft.defer_date,
|
||||
priority: draft.priority,
|
||||
estimate_min: draft.estimate_min,
|
||||
});
|
||||
router.back();
|
||||
};
|
||||
|
||||
const projects = activeProjects(store).filter((p) => p.status === "active" || p.id === draft.project_id);
|
||||
const projectOptions = ["none", ...projects.map((p) => p.id)];
|
||||
const projectLabels = Object.fromEntries([["none", "None"], ...projects.map((p) => [p.id, p.name])]);
|
||||
|
||||
return (
|
||||
<ScrollView style={{ flex: 1, backgroundColor: C.bg }} contentContainerStyle={{ padding: 16 }}>
|
||||
<Field label="Title" value={task.title} onChangeText={(v) => set({ title: v })} />
|
||||
<Chips label="List" options={STATUSES} value={task.status} onChange={(status) => set({ status })} />
|
||||
<Field label="Title" value={draft.title} onChangeText={(v) => set({ title: v })} />
|
||||
<PriorityChips value={draft.priority} onChange={(priority) => set({ priority })} />
|
||||
<Field
|
||||
label="Estimate (minutes)"
|
||||
value={draft.estimate_min ? String(draft.estimate_min) : ""}
|
||||
onChangeText={(v) => set({ estimate_min: Number(v.replace(/\D/g, "")) || null })}
|
||||
placeholder="30"
|
||||
keyboardType="number-pad"
|
||||
/>
|
||||
<Chips label="List" options={STATUSES} value={draft.status} onChange={(status) => set({ status })} />
|
||||
<Chips
|
||||
label="Project"
|
||||
options={projectOptions}
|
||||
labels={projectLabels}
|
||||
value={task.project_id ?? "none"}
|
||||
value={draft.project_id ?? "none"}
|
||||
onChange={(v) => set({ project_id: v === "none" ? null : v })}
|
||||
/>
|
||||
<Field
|
||||
label="Context"
|
||||
value={task.context ?? ""}
|
||||
value={draft.context ?? ""}
|
||||
onChangeText={(v) => set({ context: v || null })}
|
||||
placeholder="@home, @computer, @errands…"
|
||||
autoCapitalize="none"
|
||||
/>
|
||||
{task.status === "waiting" && (
|
||||
{draft.status === "waiting" && (
|
||||
<Field
|
||||
label="Waiting for"
|
||||
value={task.waiting_for ?? ""}
|
||||
value={draft.waiting_for ?? ""}
|
||||
onChangeText={(v) => set({ waiting_for: v || null })}
|
||||
placeholder="Who or what?"
|
||||
/>
|
||||
)}
|
||||
<Field
|
||||
label="Due date"
|
||||
value={task.due_date ?? ""}
|
||||
onChangeText={(v) => set({ due_date: v || null })}
|
||||
placeholder="YYYY-MM-DD"
|
||||
autoCapitalize="none"
|
||||
/>
|
||||
<Field
|
||||
label="Defer until"
|
||||
value={task.defer_date ?? ""}
|
||||
onChangeText={(v) => set({ defer_date: v || null })}
|
||||
placeholder="YYYY-MM-DD"
|
||||
autoCapitalize="none"
|
||||
/>
|
||||
<DateField label="Due date" value={draft.due_date} onChange={(v) => set({ due_date: v })} clearable />
|
||||
<DateField label="Defer until" value={draft.defer_date} onChange={(v) => set({ defer_date: v })} clearable />
|
||||
<Field
|
||||
label="Notes"
|
||||
value={task.notes}
|
||||
value={draft.notes}
|
||||
onChangeText={(v) => set({ notes: v })}
|
||||
multiline
|
||||
style={{ minHeight: 80, textAlignVertical: "top" }}
|
||||
/>
|
||||
<Button title="Save" onPress={save} />
|
||||
<Button title="Delete" onPress={trash} danger />
|
||||
<Button
|
||||
title="Delete"
|
||||
danger
|
||||
onPress={() => {
|
||||
trashTask(draft.id);
|
||||
router.back();
|
||||
}}
|
||||
/>
|
||||
</ScrollView>
|
||||
);
|
||||
}
|
||||
|
||||
34
app/src/app/today.tsx
Normal file
34
app/src/app/today.tsx
Normal file
@@ -0,0 +1,34 @@
|
||||
import { SectionList, StyleSheet, Text } from "react-native";
|
||||
import TaskRow from "../components/TaskRow";
|
||||
import { todayTasks } from "../lib/store";
|
||||
import { C } from "../lib/theme";
|
||||
import { useStore } from "../lib/useStore";
|
||||
|
||||
export default function Today() {
|
||||
const store = useStore();
|
||||
const { overdue, today } = todayTasks(store);
|
||||
const sections = [
|
||||
...(overdue.length ? [{ title: "Overdue", data: overdue, color: C.danger }] : []),
|
||||
{ title: "Today", data: today, color: C.text },
|
||||
];
|
||||
|
||||
return (
|
||||
<SectionList
|
||||
style={{ flex: 1, backgroundColor: C.bg }}
|
||||
sections={sections}
|
||||
keyExtractor={(t) => t.id}
|
||||
renderItem={({ item }) => <TaskRow task={item} showStatus />}
|
||||
renderSectionHeader={({ section }) => (
|
||||
<Text style={[s.header, { color: section.color }]}>{section.title}</Text>
|
||||
)}
|
||||
ListEmptyComponent={<Text style={s.empty}>Nothing due. Clear runway.</Text>}
|
||||
contentContainerStyle={{ paddingBottom: 32 }}
|
||||
stickySectionHeadersEnabled={false}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
header: { fontSize: 15, fontWeight: "700", paddingHorizontal: 16, paddingTop: 18, paddingBottom: 6 },
|
||||
empty: { color: C.muted, textAlign: "center", marginTop: 48, fontSize: 15 },
|
||||
});
|
||||
228
app/src/components/DateField.tsx
Normal file
228
app/src/components/DateField.tsx
Normal file
@@ -0,0 +1,228 @@
|
||||
// Interactive date field: quick chips (Today / Tomorrow / Next week) plus an
|
||||
// expandable month calendar. Pure RN views — identical on Android, iOS, web.
|
||||
import { useMemo, useState } from "react";
|
||||
import { Pressable, StyleSheet, Text, View } from "react-native";
|
||||
import { haptic } from "../lib/haptics";
|
||||
import { C } from "../lib/theme";
|
||||
|
||||
const DAY_MS = 86_400_000;
|
||||
const WEEKDAYS = ["M", "T", "W", "T", "F", "S", "S"];
|
||||
const MONTHS = [
|
||||
"January", "February", "March", "April", "May", "June",
|
||||
"July", "August", "September", "October", "November", "December",
|
||||
];
|
||||
|
||||
function iso(d: Date): string {
|
||||
return `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
|
||||
}
|
||||
|
||||
function fromIso(s: string): Date {
|
||||
const [y, m, d] = s.split("-").map(Number);
|
||||
return new Date(y, m - 1, d);
|
||||
}
|
||||
|
||||
function pretty(s: string): string {
|
||||
const d = fromIso(s);
|
||||
const today = new Date();
|
||||
const diff = Math.round((d.getTime() - new Date(today.getFullYear(), today.getMonth(), today.getDate()).getTime()) / DAY_MS);
|
||||
if (diff === 0) return "Today";
|
||||
if (diff === 1) return "Tomorrow";
|
||||
if (diff === -1) return "Yesterday";
|
||||
const wd = d.toLocaleDateString("en-AU", { weekday: "short" });
|
||||
return `${wd} ${d.getDate()} ${MONTHS[d.getMonth()].slice(0, 3)}${d.getFullYear() !== today.getFullYear() ? ` ${d.getFullYear()}` : ""}`;
|
||||
}
|
||||
|
||||
function Calendar({ value, onPick }: { value: string | null; onPick: (v: string) => void }) {
|
||||
const initial = value ? fromIso(value) : new Date();
|
||||
const [year, setYear] = useState(initial.getFullYear());
|
||||
const [month, setMonth] = useState(initial.getMonth());
|
||||
const todayIso = iso(new Date());
|
||||
|
||||
const weeks = useMemo(() => {
|
||||
const first = new Date(year, month, 1);
|
||||
const start = new Date(first);
|
||||
start.setDate(1 - ((first.getDay() + 6) % 7)); // back to Monday
|
||||
return Array.from({ length: 6 }, (_, w) =>
|
||||
Array.from({ length: 7 }, (_, i) => {
|
||||
const d = new Date(start);
|
||||
d.setDate(start.getDate() + w * 7 + i);
|
||||
return d;
|
||||
}),
|
||||
);
|
||||
}, [year, month]);
|
||||
|
||||
const shift = (delta: number) => {
|
||||
haptic.select();
|
||||
const d = new Date(year, month + delta, 1);
|
||||
setYear(d.getFullYear());
|
||||
setMonth(d.getMonth());
|
||||
};
|
||||
|
||||
return (
|
||||
<View style={s.calendar}>
|
||||
<View style={s.calHead}>
|
||||
<Pressable onPress={() => shift(-1)} hitSlop={10} style={s.arrow}>
|
||||
<Text style={s.arrowText}>‹</Text>
|
||||
</Pressable>
|
||||
<Text style={s.calTitle}>
|
||||
{MONTHS[month]} {year}
|
||||
</Text>
|
||||
<Pressable onPress={() => shift(1)} hitSlop={10} style={s.arrow}>
|
||||
<Text style={s.arrowText}>›</Text>
|
||||
</Pressable>
|
||||
</View>
|
||||
<View style={s.week}>
|
||||
{WEEKDAYS.map((w, i) => (
|
||||
<Text key={i} style={s.weekday}>
|
||||
{w}
|
||||
</Text>
|
||||
))}
|
||||
</View>
|
||||
{weeks.map((week, wi) => (
|
||||
<View key={wi} style={s.week}>
|
||||
{week.map((d) => {
|
||||
const dIso = iso(d);
|
||||
const inMonth = d.getMonth() === month;
|
||||
const selected = dIso === value;
|
||||
const isToday = dIso === todayIso;
|
||||
return (
|
||||
<Pressable
|
||||
key={dIso}
|
||||
style={[s.day, selected && s.daySelected, !selected && isToday && s.dayToday]}
|
||||
onPress={() => {
|
||||
haptic.select();
|
||||
onPick(dIso);
|
||||
}}
|
||||
>
|
||||
<Text
|
||||
style={[
|
||||
s.dayText,
|
||||
!inMonth && { color: C.border },
|
||||
selected && { color: "#FFFFFF", fontWeight: "700" },
|
||||
!selected && isToday && { color: C.accent },
|
||||
]}
|
||||
>
|
||||
{d.getDate()}
|
||||
</Text>
|
||||
</Pressable>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
export default function DateField({
|
||||
label,
|
||||
value,
|
||||
onChange,
|
||||
clearable,
|
||||
}: {
|
||||
label: string;
|
||||
value: string | null;
|
||||
onChange: (v: string | null) => void;
|
||||
clearable?: boolean;
|
||||
}) {
|
||||
const [open, setOpen] = useState(false);
|
||||
const today = new Date();
|
||||
const quick = [
|
||||
{ label: "Today", v: iso(today) },
|
||||
{ label: "Tomorrow", v: iso(new Date(today.getTime() + DAY_MS)) },
|
||||
{ label: "Next week", v: iso(new Date(today.getTime() + 7 * DAY_MS)) },
|
||||
];
|
||||
|
||||
return (
|
||||
<View style={{ marginBottom: 14 }}>
|
||||
<View style={s.labelRow}>
|
||||
<Text style={s.label}>{label}</Text>
|
||||
{value != null && <Text style={s.chosen}>{pretty(value)}</Text>}
|
||||
</View>
|
||||
<View style={s.rowWrap}>
|
||||
{quick.map((q) => (
|
||||
<Pressable
|
||||
key={q.label}
|
||||
style={[s.chip, value === q.v && s.chipActive]}
|
||||
onPress={() => {
|
||||
haptic.select();
|
||||
onChange(value === q.v && clearable ? null : q.v);
|
||||
}}
|
||||
>
|
||||
<Text style={[s.chipText, value === q.v && { color: C.text }]}>{q.label}</Text>
|
||||
</Pressable>
|
||||
))}
|
||||
<Pressable
|
||||
style={[s.chip, open && s.chipActive]}
|
||||
onPress={() => {
|
||||
haptic.select();
|
||||
setOpen(!open);
|
||||
}}
|
||||
>
|
||||
<Text style={[s.chipText, open && { color: C.text }]}>📆 Pick…</Text>
|
||||
</Pressable>
|
||||
{clearable && value != null && (
|
||||
<Pressable
|
||||
style={s.chip}
|
||||
onPress={() => {
|
||||
haptic.tap();
|
||||
onChange(null);
|
||||
}}
|
||||
>
|
||||
<Text style={s.chipText}>Clear</Text>
|
||||
</Pressable>
|
||||
)}
|
||||
</View>
|
||||
{open && (
|
||||
<Calendar
|
||||
value={value}
|
||||
onPick={(v) => {
|
||||
onChange(v);
|
||||
setOpen(false);
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
labelRow: { flexDirection: "row", justifyContent: "space-between", alignItems: "baseline", marginBottom: 6 },
|
||||
label: { color: C.muted, fontSize: 13, textTransform: "uppercase", letterSpacing: 0.5 },
|
||||
chosen: { color: C.accent, fontSize: 14, fontWeight: "600" },
|
||||
rowWrap: { flexDirection: "row", flexWrap: "wrap", gap: 8 },
|
||||
chip: {
|
||||
paddingVertical: 8,
|
||||
paddingHorizontal: 14,
|
||||
borderRadius: 20,
|
||||
backgroundColor: C.surface,
|
||||
borderWidth: 1,
|
||||
borderColor: C.border,
|
||||
},
|
||||
chipActive: { backgroundColor: C.surface2, borderColor: C.accent },
|
||||
chipText: { color: C.muted, fontSize: 14 },
|
||||
calendar: {
|
||||
marginTop: 10,
|
||||
backgroundColor: C.surface,
|
||||
borderRadius: 14,
|
||||
borderWidth: 1,
|
||||
borderColor: C.border,
|
||||
padding: 10,
|
||||
},
|
||||
calHead: { flexDirection: "row", justifyContent: "space-between", alignItems: "center", marginBottom: 6 },
|
||||
calTitle: { color: C.text, fontSize: 15, fontWeight: "600" },
|
||||
arrow: { paddingHorizontal: 14, paddingVertical: 4 },
|
||||
arrowText: { color: C.accent, fontSize: 22, fontWeight: "600" },
|
||||
week: { flexDirection: "row" },
|
||||
weekday: { flex: 1, textAlign: "center", color: C.muted, fontSize: 11, paddingVertical: 4 },
|
||||
day: {
|
||||
flex: 1,
|
||||
aspectRatio: 1.15,
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
borderRadius: 999,
|
||||
margin: 1,
|
||||
},
|
||||
daySelected: { backgroundColor: C.accent },
|
||||
dayToday: { borderWidth: 1, borderColor: C.accent },
|
||||
dayText: { color: C.text, fontSize: 14 },
|
||||
});
|
||||
56
app/src/components/PriorityChips.tsx
Normal file
56
app/src/components/PriorityChips.tsx
Normal file
@@ -0,0 +1,56 @@
|
||||
import { Pressable, StyleSheet, Text, View } from "react-native";
|
||||
import { haptic } from "../lib/haptics";
|
||||
import { PRIORITIES, PRIORITY_COLOR, PRIORITY_LABEL } from "../lib/priority";
|
||||
import { C } from "../lib/theme";
|
||||
import type { Task } from "../lib/types";
|
||||
|
||||
export default function PriorityChips({
|
||||
value,
|
||||
onChange,
|
||||
}: {
|
||||
value: Task["priority"] | null;
|
||||
onChange: (p: Task["priority"]) => void;
|
||||
}) {
|
||||
return (
|
||||
<View style={{ marginBottom: 14 }}>
|
||||
<Text style={s.label}>Priority</Text>
|
||||
<View style={s.rowWrap}>
|
||||
{PRIORITIES.map((p) => {
|
||||
const active = value === p;
|
||||
const color = PRIORITY_COLOR[p];
|
||||
return (
|
||||
<Pressable
|
||||
key={p}
|
||||
style={[s.chip, active && { borderColor: color, backgroundColor: `${color}22` }]}
|
||||
onPress={() => {
|
||||
haptic.select();
|
||||
onChange(p);
|
||||
}}
|
||||
>
|
||||
<View style={[s.flag, { backgroundColor: color }]} />
|
||||
<Text style={[s.text, active && { color: C.text }]}>{PRIORITY_LABEL[p]}</Text>
|
||||
</Pressable>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
label: { color: C.muted, fontSize: 13, marginBottom: 6, textTransform: "uppercase", letterSpacing: 0.5 },
|
||||
rowWrap: { flexDirection: "row", flexWrap: "wrap", gap: 8 },
|
||||
chip: {
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
gap: 7,
|
||||
paddingVertical: 8,
|
||||
paddingHorizontal: 13,
|
||||
borderRadius: 20,
|
||||
backgroundColor: C.surface,
|
||||
borderWidth: 1,
|
||||
borderColor: C.border,
|
||||
},
|
||||
flag: { width: 10, height: 10, borderRadius: 5 },
|
||||
text: { color: C.muted, fontSize: 14 },
|
||||
});
|
||||
@@ -1,115 +1,51 @@
|
||||
import { useFocusEffect, useRouter } from "expo-router";
|
||||
import { useCallback, useState } from "react";
|
||||
import {
|
||||
FlatList,
|
||||
Pressable,
|
||||
RefreshControl,
|
||||
StyleSheet,
|
||||
Text,
|
||||
TextInput,
|
||||
View,
|
||||
} from "react-native";
|
||||
import { api } from "../lib/api";
|
||||
import { useState } from "react";
|
||||
import { RefreshControl, StyleSheet, Text, View } from "react-native";
|
||||
import DraggableFlatList, { ScaleDecorator } from "react-native-draggable-flatlist";
|
||||
import { haptic } from "../lib/haptics";
|
||||
import { reorderTask, sync, tasksByStatus } from "../lib/store";
|
||||
import { C } from "../lib/theme";
|
||||
import type { Task, TaskStatus } from "../lib/types";
|
||||
|
||||
function TaskRow({ task, onToggle }: { task: Task; onToggle: (t: Task) => void }) {
|
||||
const router = useRouter();
|
||||
const meta = [task.context, task.waiting_for && `→ ${task.waiting_for}`, task.due_date && `due ${task.due_date}`]
|
||||
.filter(Boolean)
|
||||
.join(" · ");
|
||||
return (
|
||||
<Pressable style={s.row} onPress={() => router.push(`/task/${task.id}`)}>
|
||||
<Pressable style={s.checkbox} hitSlop={10} onPress={() => onToggle(task)}>
|
||||
{task.status === "done" && <View style={s.checkboxFill} />}
|
||||
</Pressable>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={s.title} numberOfLines={2}>
|
||||
{task.title}
|
||||
</Text>
|
||||
{!!meta && <Text style={s.meta}>{meta}</Text>}
|
||||
</View>
|
||||
</Pressable>
|
||||
);
|
||||
}
|
||||
import { useStore } from "../lib/useStore";
|
||||
import type { TaskStatus } from "../lib/types";
|
||||
import TaskRow from "./TaskRow";
|
||||
|
||||
export default function TaskListScreen({
|
||||
status,
|
||||
capture,
|
||||
emptyHint,
|
||||
}: {
|
||||
status: TaskStatus;
|
||||
capture?: boolean;
|
||||
emptyHint: string;
|
||||
}) {
|
||||
const [tasks, setTasks] = useState<Task[]>([]);
|
||||
const store = useStore();
|
||||
const [refreshing, setRefreshing] = useState(false);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
const [draft, setDraft] = useState("");
|
||||
|
||||
const load = useCallback(async () => {
|
||||
try {
|
||||
setTasks(await api.tasks.list({ status }));
|
||||
setError(null);
|
||||
} catch (e) {
|
||||
setError(e instanceof Error ? e.message : String(e));
|
||||
}
|
||||
}, [status]);
|
||||
|
||||
useFocusEffect(
|
||||
useCallback(() => {
|
||||
load();
|
||||
}, [load]),
|
||||
);
|
||||
|
||||
const add = async () => {
|
||||
const title = draft.trim();
|
||||
if (!title) return;
|
||||
setDraft("");
|
||||
setTasks((cur) => [{ id: `tmp-${title}`, title, status } as Task, ...cur]);
|
||||
try {
|
||||
await api.tasks.create({ title, status });
|
||||
} finally {
|
||||
load();
|
||||
}
|
||||
};
|
||||
|
||||
const toggle = async (task: Task) => {
|
||||
const done = task.status !== "done";
|
||||
setTasks((cur) => cur.filter((t) => t.id !== task.id));
|
||||
try {
|
||||
await api.tasks.update(task.id, { status: done ? "done" : status });
|
||||
} finally {
|
||||
load();
|
||||
}
|
||||
};
|
||||
const tasks = tasksByStatus(store, status);
|
||||
|
||||
return (
|
||||
<View style={s.screen}>
|
||||
{capture && (
|
||||
<TextInput
|
||||
style={s.capture}
|
||||
placeholder="Capture anything…"
|
||||
placeholderTextColor={C.muted}
|
||||
value={draft}
|
||||
onChangeText={setDraft}
|
||||
onSubmitEditing={add}
|
||||
submitBehavior="submit"
|
||||
returnKeyType="done"
|
||||
/>
|
||||
)}
|
||||
{error && <Text style={s.error}>{error}</Text>}
|
||||
<FlatList
|
||||
<DraggableFlatList
|
||||
data={tasks}
|
||||
keyExtractor={(t) => t.id}
|
||||
renderItem={({ item }) => <TaskRow task={item} onToggle={toggle} />}
|
||||
activationDistance={12}
|
||||
onDragBegin={() => haptic.pickup()}
|
||||
onDragEnd={({ data, from, to }) => {
|
||||
if (from !== to) {
|
||||
haptic.success();
|
||||
reorderTask(data[to].id, status, to);
|
||||
}
|
||||
}}
|
||||
renderItem={({ item, drag, isActive }) => (
|
||||
<ScaleDecorator activeScale={1.03}>
|
||||
<View style={isActive && s.activeRow}>
|
||||
<TaskRow task={item} uncheckTo={status} onLongPress={drag} />
|
||||
</View>
|
||||
</ScaleDecorator>
|
||||
)}
|
||||
refreshControl={
|
||||
<RefreshControl
|
||||
refreshing={refreshing}
|
||||
tintColor={C.muted}
|
||||
onRefresh={async () => {
|
||||
setRefreshing(true);
|
||||
await load();
|
||||
await sync();
|
||||
setRefreshing(false);
|
||||
}}
|
||||
/>
|
||||
@@ -123,38 +59,6 @@ export default function TaskListScreen({
|
||||
|
||||
const s = StyleSheet.create({
|
||||
screen: { flex: 1, backgroundColor: C.bg },
|
||||
capture: {
|
||||
margin: 12,
|
||||
marginBottom: 4,
|
||||
padding: 14,
|
||||
borderRadius: 12,
|
||||
backgroundColor: C.surface,
|
||||
color: C.text,
|
||||
fontSize: 16,
|
||||
borderWidth: 1,
|
||||
borderColor: C.border,
|
||||
},
|
||||
row: {
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
gap: 12,
|
||||
paddingVertical: 14,
|
||||
paddingHorizontal: 16,
|
||||
borderBottomWidth: StyleSheet.hairlineWidth,
|
||||
borderBottomColor: C.border,
|
||||
},
|
||||
checkbox: {
|
||||
width: 22,
|
||||
height: 22,
|
||||
borderRadius: 11,
|
||||
borderWidth: 2,
|
||||
borderColor: C.muted,
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
},
|
||||
checkboxFill: { width: 12, height: 12, borderRadius: 6, backgroundColor: C.done },
|
||||
title: { color: C.text, fontSize: 16 },
|
||||
meta: { color: C.muted, fontSize: 13, marginTop: 2 },
|
||||
activeRow: { backgroundColor: C.surface2, borderRadius: 12 },
|
||||
empty: { color: C.muted, textAlign: "center", marginTop: 48, fontSize: 15 },
|
||||
error: { color: C.danger, marginHorizontal: 16, marginTop: 8 },
|
||||
});
|
||||
|
||||
83
app/src/components/TaskRow.tsx
Normal file
83
app/src/components/TaskRow.tsx
Normal file
@@ -0,0 +1,83 @@
|
||||
import { useRouter } from "expo-router";
|
||||
import { Pressable, StyleSheet, Text, View } from "react-native";
|
||||
import Animated, { FadeIn } from "react-native-reanimated";
|
||||
import { haptic } from "../lib/haptics";
|
||||
import { formatEstimate, PRIORITY_COLOR } from "../lib/priority";
|
||||
import { updateTask } from "../lib/store";
|
||||
import { C } from "../lib/theme";
|
||||
import type { Task, TaskStatus } from "../lib/types";
|
||||
|
||||
export default function TaskRow({
|
||||
task,
|
||||
uncheckTo = "next",
|
||||
showStatus,
|
||||
onLongPress,
|
||||
}: {
|
||||
task: Task;
|
||||
/** Status to revert to when un-checking a done task. */
|
||||
uncheckTo?: TaskStatus;
|
||||
showStatus?: boolean;
|
||||
/** Drag handle for reorderable lists. */
|
||||
onLongPress?: () => void;
|
||||
}) {
|
||||
const router = useRouter();
|
||||
const meta = [
|
||||
showStatus ? task.status : null,
|
||||
task.context,
|
||||
task.waiting_for && `→ ${task.waiting_for}`,
|
||||
formatEstimate(task.estimate_min),
|
||||
task.due_date && `due ${task.due_date}`,
|
||||
]
|
||||
.filter(Boolean)
|
||||
.join(" · ");
|
||||
|
||||
const toggle = () => {
|
||||
const done = task.status !== "done";
|
||||
if (done) haptic.success();
|
||||
else haptic.tap();
|
||||
updateTask(task.id, { status: done ? "done" : uncheckTo });
|
||||
};
|
||||
|
||||
return (
|
||||
<Animated.View entering={FadeIn.duration(150)}>
|
||||
<Pressable style={s.row} onPress={() => router.push(`/task/${task.id}`)} onLongPress={onLongPress} delayLongPress={200}>
|
||||
<Pressable
|
||||
style={[s.checkbox, { borderColor: PRIORITY_COLOR[task.priority] }]}
|
||||
hitSlop={10}
|
||||
onPress={toggle}
|
||||
>
|
||||
{task.status === "done" && <View style={s.checkboxFill} />}
|
||||
</Pressable>
|
||||
<View style={{ flex: 1 }}>
|
||||
<Text style={s.title} numberOfLines={2}>
|
||||
{task.title}
|
||||
</Text>
|
||||
{!!meta && <Text style={s.meta}>{meta}</Text>}
|
||||
</View>
|
||||
</Pressable>
|
||||
</Animated.View>
|
||||
);
|
||||
}
|
||||
|
||||
const s = StyleSheet.create({
|
||||
row: {
|
||||
flexDirection: "row",
|
||||
alignItems: "center",
|
||||
gap: 12,
|
||||
paddingVertical: 14,
|
||||
paddingHorizontal: 16,
|
||||
borderBottomWidth: StyleSheet.hairlineWidth,
|
||||
borderBottomColor: C.border,
|
||||
},
|
||||
checkbox: {
|
||||
width: 22,
|
||||
height: 22,
|
||||
borderRadius: 11,
|
||||
borderWidth: 2,
|
||||
alignItems: "center",
|
||||
justifyContent: "center",
|
||||
},
|
||||
checkboxFill: { width: 12, height: 12, borderRadius: 6, backgroundColor: C.done },
|
||||
title: { color: C.text, fontSize: 16 },
|
||||
meta: { color: C.muted, fontSize: 13, marginTop: 2 },
|
||||
});
|
||||
@@ -34,7 +34,7 @@ export const api = {
|
||||
return req<Task[]>(`/v1/tasks${q ? `?${q}` : ""}`);
|
||||
},
|
||||
get: (id: string) => req<Task>(`/v1/tasks/${id}`),
|
||||
create: (data: Partial<Task> & { title: string }) =>
|
||||
create: (data: Partial<Task> & { title: string; id?: string }) =>
|
||||
req<Task>("/v1/tasks", { method: "POST", body: JSON.stringify(data) }),
|
||||
update: (id: string, data: Partial<Task>) =>
|
||||
req<Task>(`/v1/tasks/${id}`, { method: "PATCH", body: JSON.stringify(data) }),
|
||||
@@ -42,7 +42,7 @@ export const api = {
|
||||
},
|
||||
projects: {
|
||||
list: () => req<Project[]>("/v1/projects"),
|
||||
create: (data: Partial<Project> & { name: string }) =>
|
||||
create: (data: Partial<Project> & { name: string; id?: string }) =>
|
||||
req<Project>("/v1/projects", { method: "POST", body: JSON.stringify(data) }),
|
||||
update: (id: string, data: Partial<Project>) =>
|
||||
req<Project>(`/v1/projects/${id}`, { method: "PATCH", body: JSON.stringify(data) }),
|
||||
|
||||
24
app/src/lib/haptics.ts
Normal file
24
app/src/lib/haptics.ts
Normal file
@@ -0,0 +1,24 @@
|
||||
// Haptics that silently no-op on web.
|
||||
import * as Haptics from "expo-haptics";
|
||||
import { Platform } from "react-native";
|
||||
|
||||
const canBuzz = Platform.OS !== "web";
|
||||
|
||||
export const haptic = {
|
||||
/** Light tick — captures, small confirmations. */
|
||||
tap: () => {
|
||||
if (canBuzz) void Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Light);
|
||||
},
|
||||
/** Medium thunk — picking up a draggable. */
|
||||
pickup: () => {
|
||||
if (canBuzz) void Haptics.impactAsync(Haptics.ImpactFeedbackStyle.Medium);
|
||||
},
|
||||
/** Success notification — completing a task, landing a drop. */
|
||||
success: () => {
|
||||
if (canBuzz) void Haptics.notificationAsync(Haptics.NotificationFeedbackType.Success);
|
||||
},
|
||||
/** Selection change — flicking through chips. */
|
||||
select: () => {
|
||||
if (canBuzz) void Haptics.selectionAsync();
|
||||
},
|
||||
};
|
||||
24
app/src/lib/priority.ts
Normal file
24
app/src/lib/priority.ts
Normal file
@@ -0,0 +1,24 @@
|
||||
import type { Task } from "./types";
|
||||
|
||||
export const PRIORITIES: Task["priority"][] = [1, 2, 3, 4];
|
||||
|
||||
export const PRIORITY_LABEL: Record<Task["priority"], string> = {
|
||||
1: "Urgent",
|
||||
2: "High",
|
||||
3: "Medium",
|
||||
4: "Low",
|
||||
};
|
||||
|
||||
export const PRIORITY_COLOR: Record<Task["priority"], string> = {
|
||||
1: "#E05B5B",
|
||||
2: "#E0A93E",
|
||||
3: "#5B8DEF",
|
||||
4: "#6B7280",
|
||||
};
|
||||
|
||||
export function formatEstimate(min: number | null): string | null {
|
||||
if (!min) return null;
|
||||
const h = Math.floor(min / 60);
|
||||
const m = min % 60;
|
||||
return h ? (m ? `${h}h${m}` : `${h}h`) : `${m}m`;
|
||||
}
|
||||
92
app/src/lib/quickadd.ts
Normal file
92
app/src/lib/quickadd.ts
Normal file
@@ -0,0 +1,92 @@
|
||||
// Natural-language quick add, Todoist style:
|
||||
// "Pay rent tomorrow p1 @home #Sydney ~30m"
|
||||
// → title "Pay rent", due tomorrow, priority 1, context @home,
|
||||
// project "Sydney" (matched by name prefix), estimate 30 min.
|
||||
import type { Project, Task } from "./types";
|
||||
|
||||
export interface ParsedQuickAdd {
|
||||
title: string;
|
||||
priority?: Task["priority"];
|
||||
due_date?: string;
|
||||
context?: string;
|
||||
project_id?: string;
|
||||
estimate_min?: number;
|
||||
}
|
||||
|
||||
const WEEKDAYS = ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"];
|
||||
|
||||
function iso(d: Date): string {
|
||||
const y = d.getFullYear();
|
||||
const m = String(d.getMonth() + 1).padStart(2, "0");
|
||||
const day = String(d.getDate()).padStart(2, "0");
|
||||
return `${y}-${m}-${day}`;
|
||||
}
|
||||
|
||||
function parseDateWord(word: string): string | undefined {
|
||||
const w = word.toLowerCase();
|
||||
const today = new Date();
|
||||
if (w === "today" || w === "tod") return iso(today);
|
||||
if (w === "tomorrow" || w === "tmr" || w === "tom") {
|
||||
const d = new Date(today);
|
||||
d.setDate(d.getDate() + 1);
|
||||
return iso(d);
|
||||
}
|
||||
if (/^\d{4}-\d{2}-\d{2}$/.test(w)) return w;
|
||||
const wd = WEEKDAYS.findIndex((n) => n === w || n.slice(0, 3) === w);
|
||||
if (wd >= 0) {
|
||||
const d = new Date(today);
|
||||
const delta = (wd - d.getDay() + 7) % 7 || 7; // always the *next* occurrence
|
||||
d.setDate(d.getDate() + delta);
|
||||
return iso(d);
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
|
||||
function parseEstimate(token: string): number | undefined {
|
||||
const m = token.match(/^~(?:(\d+)h)?(\d+)?m?$/i);
|
||||
if (!m || (!m[1] && !m[2])) return undefined;
|
||||
return (Number(m[1] ?? 0) * 60 + Number(m[2] ?? 0)) || undefined;
|
||||
}
|
||||
|
||||
export function parseQuickAdd(input: string, projects: Project[]): ParsedQuickAdd {
|
||||
const out: ParsedQuickAdd = { title: "" };
|
||||
const rest: string[] = [];
|
||||
|
||||
for (const token of input.trim().split(/\s+/)) {
|
||||
const p = token.match(/^p([1-4])$/i);
|
||||
if (p && out.priority === undefined) {
|
||||
out.priority = Number(p[1]) as Task["priority"];
|
||||
continue;
|
||||
}
|
||||
if (token.startsWith("@") && token.length > 1 && out.context === undefined) {
|
||||
out.context = token;
|
||||
continue;
|
||||
}
|
||||
if (token.startsWith("#") && token.length > 1 && out.project_id === undefined) {
|
||||
const name = token.slice(1).toLowerCase();
|
||||
const match = projects.find(
|
||||
(pr) => pr.status === "active" && pr.name.toLowerCase().startsWith(name),
|
||||
);
|
||||
if (match) {
|
||||
out.project_id = match.id;
|
||||
continue;
|
||||
}
|
||||
}
|
||||
const est = parseEstimate(token);
|
||||
if (est && out.estimate_min === undefined) {
|
||||
out.estimate_min = est;
|
||||
continue;
|
||||
}
|
||||
if (out.due_date === undefined) {
|
||||
const due = parseDateWord(token);
|
||||
if (due) {
|
||||
out.due_date = due;
|
||||
continue;
|
||||
}
|
||||
}
|
||||
rest.push(token);
|
||||
}
|
||||
|
||||
out.title = rest.join(" ");
|
||||
return out;
|
||||
}
|
||||
298
app/src/lib/store.ts
Normal file
298
app/src/lib/store.ts
Normal file
@@ -0,0 +1,298 @@
|
||||
// Local-first store — the single source of truth for the UI.
|
||||
//
|
||||
// Screens render synchronously from the in-memory state (hydrated from
|
||||
// AsyncStorage at launch). Mutations apply locally immediately and enqueue an
|
||||
// op; a background worker drains the queue to the API and then pulls the
|
||||
// server state, so the network is never on the interaction path. Single-user
|
||||
// last-write-wins: rows with queued local ops keep their local version during
|
||||
// a pull; everything else takes the server's.
|
||||
import AsyncStorage from "@react-native-async-storage/async-storage";
|
||||
import * as Crypto from "expo-crypto";
|
||||
import { api } from "./api";
|
||||
import { getConfig } from "./config";
|
||||
import type { Project, Task } from "./types";
|
||||
|
||||
export interface State {
|
||||
tasks: Task[];
|
||||
projects: Project[];
|
||||
hydrated: boolean;
|
||||
syncing: boolean;
|
||||
pending: number;
|
||||
syncError: string | null;
|
||||
}
|
||||
|
||||
type Op =
|
||||
| { kind: "task.create" | "task.update"; id: string; data: Partial<Task> }
|
||||
| { kind: "project.create" | "project.update"; id: string; data: Partial<Project> };
|
||||
|
||||
const DATA_KEY = "store_v1";
|
||||
const QUEUE_KEY = "queue_v1";
|
||||
|
||||
let state: State = {
|
||||
tasks: [],
|
||||
projects: [],
|
||||
hydrated: false,
|
||||
syncing: false,
|
||||
pending: 0,
|
||||
syncError: null,
|
||||
};
|
||||
let queue: Op[] = [];
|
||||
const listeners = new Set<() => void>();
|
||||
|
||||
export function getState(): State {
|
||||
return state;
|
||||
}
|
||||
|
||||
export function subscribe(listener: () => void): () => void {
|
||||
listeners.add(listener);
|
||||
return () => listeners.delete(listener);
|
||||
}
|
||||
|
||||
function setState(patch: Partial<State>) {
|
||||
state = { ...state, ...patch, pending: queue.length };
|
||||
for (const l of listeners) l();
|
||||
}
|
||||
|
||||
function persistData() {
|
||||
void AsyncStorage.setItem(DATA_KEY, JSON.stringify({ tasks: state.tasks, projects: state.projects }));
|
||||
}
|
||||
|
||||
function persistQueue() {
|
||||
void AsyncStorage.setItem(QUEUE_KEY, JSON.stringify(queue));
|
||||
}
|
||||
|
||||
export async function hydrate() {
|
||||
if (state.hydrated) return;
|
||||
const [data, q] = await Promise.all([AsyncStorage.getItem(DATA_KEY), AsyncStorage.getItem(QUEUE_KEY)]);
|
||||
if (q) queue = JSON.parse(q);
|
||||
const parsed = data ? JSON.parse(data) : { tasks: [], projects: [] };
|
||||
setState({ tasks: parsed.tasks, projects: parsed.projects, hydrated: true });
|
||||
void sync();
|
||||
}
|
||||
|
||||
// ---- mutations (instant; network happens later) ----
|
||||
|
||||
function now() {
|
||||
return new Date().toISOString();
|
||||
}
|
||||
|
||||
// Fields the API accepts — everything else (timestamps, completed_at) is local
|
||||
// bookkeeping until the server's authoritative row arrives via pull().
|
||||
const TASK_FIELDS = ["title", "notes", "status", "project_id", "context", "waiting_for", "due_date", "defer_date", "priority", "estimate_min", "sort_order"] as const;
|
||||
const PROJECT_FIELDS = ["name", "status", "notes", "sort_order"] as const;
|
||||
|
||||
function pickFields<T>(data: Partial<T>, fields: readonly (keyof T & string)[]): Partial<T> {
|
||||
const out: Partial<T> = {};
|
||||
for (const f of fields) if (f in data) out[f] = data[f];
|
||||
return out;
|
||||
}
|
||||
|
||||
function enqueue(op: Op) {
|
||||
// Coalesce consecutive updates to the same row into one op.
|
||||
const last = queue[queue.length - 1];
|
||||
if (last && op.kind === last.kind && op.kind.endsWith("update") && last.id === op.id) {
|
||||
last.data = { ...last.data, ...op.data };
|
||||
} else {
|
||||
queue.push(op);
|
||||
}
|
||||
persistQueue();
|
||||
setState({});
|
||||
void sync();
|
||||
}
|
||||
|
||||
export function createTask(data: Partial<Task> & { title: string }): Task {
|
||||
const task: Task = {
|
||||
id: Crypto.randomUUID(),
|
||||
title: data.title,
|
||||
notes: data.notes ?? "",
|
||||
status: data.status ?? "inbox",
|
||||
project_id: data.project_id ?? null,
|
||||
context: data.context ?? null,
|
||||
waiting_for: data.waiting_for ?? null,
|
||||
due_date: data.due_date ?? null,
|
||||
defer_date: data.defer_date ?? null,
|
||||
priority: data.priority ?? 4,
|
||||
estimate_min: data.estimate_min ?? null,
|
||||
completed_at: null,
|
||||
// New tasks land at the top of their list.
|
||||
sort_order:
|
||||
data.sort_order ??
|
||||
Math.min(0, ...state.tasks.filter((t) => t.status === (data.status ?? "next")).map((t) => t.sort_order)) - 1,
|
||||
created_at: now(),
|
||||
updated_at: now(),
|
||||
};
|
||||
setState({ tasks: [task, ...state.tasks] });
|
||||
persistData();
|
||||
enqueue({ kind: "task.create", id: task.id, data: pickFields(task, TASK_FIELDS) });
|
||||
return task;
|
||||
}
|
||||
|
||||
export function updateTask(id: string, patch: Partial<Task>) {
|
||||
setState({
|
||||
tasks: state.tasks.map((t) => {
|
||||
if (t.id !== id) return t;
|
||||
const next = { ...t, ...patch, updated_at: now() };
|
||||
// Mirror the server's completed_at rule so the UI is right pre-sync.
|
||||
next.completed_at = next.status === "done" ? (t.completed_at ?? now()) : null;
|
||||
return next;
|
||||
}),
|
||||
});
|
||||
persistData();
|
||||
enqueue({ kind: "task.update", id, data: pickFields(patch, TASK_FIELDS) });
|
||||
}
|
||||
|
||||
export function trashTask(id: string) {
|
||||
updateTask(id, { status: "trashed" });
|
||||
}
|
||||
|
||||
export function createProject(data: Partial<Project> & { name: string }): Project {
|
||||
const project: Project = {
|
||||
id: Crypto.randomUUID(),
|
||||
name: data.name,
|
||||
status: data.status ?? "active",
|
||||
notes: data.notes ?? "",
|
||||
sort_order: data.sort_order ?? 0,
|
||||
created_at: now(),
|
||||
updated_at: now(),
|
||||
};
|
||||
setState({ projects: [project, ...state.projects] });
|
||||
persistData();
|
||||
enqueue({ kind: "project.create", id: project.id, data: pickFields(project, PROJECT_FIELDS) });
|
||||
return project;
|
||||
}
|
||||
|
||||
export function updateProject(id: string, patch: Partial<Project>) {
|
||||
setState({ projects: state.projects.map((p) => (p.id === id ? { ...p, ...patch, updated_at: now() } : p)) });
|
||||
persistData();
|
||||
enqueue({ kind: "project.update", id, data: pickFields(patch, PROJECT_FIELDS) });
|
||||
}
|
||||
|
||||
export function dropProject(id: string) {
|
||||
updateProject(id, { status: "dropped" });
|
||||
}
|
||||
|
||||
// ---- sync ----
|
||||
|
||||
let syncRunning = false;
|
||||
let syncAgain = false;
|
||||
|
||||
export async function sync() {
|
||||
if (syncRunning) {
|
||||
syncAgain = true;
|
||||
return;
|
||||
}
|
||||
const { token } = await getConfig();
|
||||
if (!token) return;
|
||||
syncRunning = true;
|
||||
setState({ syncing: true });
|
||||
try {
|
||||
while (queue.length) {
|
||||
await push(queue[0]);
|
||||
queue.shift();
|
||||
persistQueue();
|
||||
setState({});
|
||||
}
|
||||
await pull();
|
||||
setState({ syncError: null });
|
||||
} catch (e) {
|
||||
setState({ syncError: e instanceof Error ? e.message : String(e) });
|
||||
} finally {
|
||||
syncRunning = false;
|
||||
setState({ syncing: false });
|
||||
if (syncAgain) {
|
||||
syncAgain = false;
|
||||
void sync();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
async function push(op: Op) {
|
||||
try {
|
||||
if (op.kind === "task.create") await api.tasks.create({ id: op.id, ...op.data } as never);
|
||||
else if (op.kind === "task.update") await api.tasks.update(op.id, op.data as Partial<Task>);
|
||||
else if (op.kind === "project.create") await api.projects.create({ id: op.id, ...op.data } as never);
|
||||
else await api.projects.update(op.id, op.data as Partial<Project>);
|
||||
} catch (e) {
|
||||
// 4xx (bad data, row gone) would poison the queue forever — drop the op.
|
||||
// Anything else (offline, 5xx) rethrows and we retry on the next sync.
|
||||
const status = (e as { status?: number }).status;
|
||||
if (status && status >= 400 && status < 500 && status !== 401) return;
|
||||
throw e;
|
||||
}
|
||||
}
|
||||
|
||||
async function pull() {
|
||||
const [tasks, projects] = await Promise.all([api.tasks.list(), api.projects.list()]);
|
||||
// Rows with ops still queued keep their local version; the next sync pass
|
||||
// pushes those ops and then this merge converges to the server state.
|
||||
const dirty = new Set(queue.map((o) => o.id));
|
||||
const keepLocal = <T extends { id: string }>(local: T[], server: T[]) => {
|
||||
const serverIds = new Set(server.map((r) => r.id));
|
||||
return [
|
||||
...server.map((r) => (dirty.has(r.id) ? local.find((l) => l.id === r.id) ?? r : r)),
|
||||
...local.filter((l) => dirty.has(l.id) && !serverIds.has(l.id)),
|
||||
];
|
||||
};
|
||||
setState({
|
||||
tasks: keepLocal(state.tasks, tasks),
|
||||
projects: keepLocal(state.projects, projects),
|
||||
});
|
||||
persistData();
|
||||
}
|
||||
|
||||
// ---- selectors ----
|
||||
|
||||
function byPriorityDue(a: Task, b: Task): number {
|
||||
return (
|
||||
a.priority - b.priority ||
|
||||
(a.due_date ?? "9999").localeCompare(b.due_date ?? "9999") ||
|
||||
a.sort_order - b.sort_order ||
|
||||
b.created_at.localeCompare(a.created_at)
|
||||
);
|
||||
}
|
||||
|
||||
// Manual arrangement wins: sort_order is the canonical list order (set by
|
||||
// drag-to-reorder); priority/due only break ties for rows that never moved.
|
||||
function byManualOrder(a: Task, b: Task): number {
|
||||
return a.sort_order - b.sort_order || byPriorityDue(a, b);
|
||||
}
|
||||
|
||||
export function tasksByStatus(s: State, status: Task["status"]): Task[] {
|
||||
return s.tasks.filter((t) => t.status === status).sort(byManualOrder);
|
||||
}
|
||||
|
||||
/** Re-slot a task at `index` within its status list (fractional sort_order). */
|
||||
export function reorderTask(id: string, status: Task["status"], index: number) {
|
||||
const list = tasksByStatus(getState(), status).filter((t) => t.id !== id);
|
||||
const prev = list[index - 1]?.sort_order;
|
||||
const next = list[index]?.sort_order;
|
||||
const sort_order =
|
||||
prev !== undefined && next !== undefined ? (prev + next) / 2
|
||||
: prev !== undefined ? prev + 1
|
||||
: next !== undefined ? next - 1
|
||||
: 0;
|
||||
updateTask(id, { sort_order });
|
||||
}
|
||||
|
||||
/** Overdue + due-today + deferred-arriving-today, across all open lists. */
|
||||
export function todayTasks(s: State): { overdue: Task[]; today: Task[] } {
|
||||
const now = new Date();
|
||||
const todayIso = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, "0")}-${String(now.getDate()).padStart(2, "0")}`;
|
||||
const open = s.tasks.filter((t) => t.status !== "done" && t.status !== "trashed");
|
||||
return {
|
||||
overdue: open.filter((t) => t.due_date && t.due_date < todayIso).sort(byPriorityDue),
|
||||
today: open
|
||||
.filter((t) => t.due_date === todayIso || (t.defer_date === todayIso && !t.due_date))
|
||||
.sort(byPriorityDue),
|
||||
};
|
||||
}
|
||||
|
||||
export function activeProjects(s: State): Project[] {
|
||||
return s.projects
|
||||
.filter((p) => p.status !== "dropped")
|
||||
.sort((a, b) => a.sort_order - b.sort_order || b.created_at.localeCompare(a.created_at));
|
||||
}
|
||||
|
||||
export function openTaskCount(s: State, projectId: string): number {
|
||||
return s.tasks.filter((t) => t.project_id === projectId && t.status !== "done" && t.status !== "trashed").length;
|
||||
}
|
||||
@@ -11,6 +11,8 @@ export interface Task {
|
||||
waiting_for: string | null;
|
||||
due_date: string | null;
|
||||
defer_date: string | null;
|
||||
priority: 1 | 2 | 3 | 4;
|
||||
estimate_min: number | null;
|
||||
completed_at: string | null;
|
||||
sort_order: number;
|
||||
created_at: string;
|
||||
|
||||
8
app/src/lib/useStore.ts
Normal file
8
app/src/lib/useStore.ts
Normal file
@@ -0,0 +1,8 @@
|
||||
import { useSyncExternalStore } from "react";
|
||||
import { getState, subscribe, type State } from "./store";
|
||||
|
||||
// Subscribe a component to the local-first store. The whole state object is
|
||||
// the snapshot (replaced immutably on every change), so derive lists inline.
|
||||
export function useStore(): State {
|
||||
return useSyncExternalStore(subscribe, getState, getState);
|
||||
}
|
||||
@@ -7,11 +7,12 @@ if (!API_TOKEN) throw new Error("API_TOKEN not set");
|
||||
|
||||
const TASK_COLS = `id, title, notes, status, project_id, context, waiting_for,
|
||||
due_date::text as due_date, defer_date::text as defer_date,
|
||||
completed_at, sort_order, created_at, updated_at`;
|
||||
priority, estimate_min, completed_at, sort_order, created_at, updated_at`;
|
||||
const PROJECT_COLS = `id, name, status, notes, sort_order, created_at, updated_at`;
|
||||
|
||||
const TASK_STATUSES = ["inbox", "next", "waiting", "scheduled", "someday", "done", "trashed"];
|
||||
const PROJECT_STATUSES = ["active", "someday", "completed", "dropped"];
|
||||
const UUID_RE = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/;
|
||||
|
||||
const CORS = {
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
@@ -27,12 +28,15 @@ function err(message: string, status: number) {
|
||||
}
|
||||
|
||||
// Fields a client may set. completed_at is derived from status server-side.
|
||||
const TASK_FIELDS = ["title", "notes", "status", "project_id", "context", "waiting_for", "due_date", "defer_date", "sort_order"];
|
||||
const TASK_FIELDS = ["title", "notes", "status", "project_id", "context", "waiting_for", "due_date", "defer_date", "priority", "estimate_min", "sort_order"];
|
||||
const PROJECT_FIELDS = ["name", "status", "notes", "sort_order"];
|
||||
|
||||
// Only these may be cleared to NULL; notes/title are NOT NULL and keep "".
|
||||
const NULLABLE = new Set(["project_id", "context", "waiting_for", "due_date", "defer_date", "estimate_min"]);
|
||||
|
||||
function pick(body: Record<string, unknown>, fields: string[]) {
|
||||
const out: Record<string, unknown> = {};
|
||||
for (const f of fields) if (f in body) out[f] = body[f] === "" ? null : body[f];
|
||||
for (const f of fields) if (f in body) out[f] = body[f] === "" && NULLABLE.has(f) ? null : body[f];
|
||||
return out;
|
||||
}
|
||||
|
||||
@@ -69,13 +73,19 @@ async function handle(req: Request): Promise<Response> {
|
||||
const t = pick(body, TASK_FIELDS);
|
||||
if (typeof t.title !== "string" || !t.title.trim()) return err("title required", 400);
|
||||
if (t.status && !TASK_STATUSES.includes(t.status as string)) return err("bad status", 400);
|
||||
const id = typeof body.id === "string" && UUID_RE.test(body.id) ? body.id : null;
|
||||
// Client-supplied id + on-conflict no-op make offline-queue retries idempotent.
|
||||
const rows = await sql.unsafe(
|
||||
`insert into tasks (title, notes, status, project_id, context, waiting_for, due_date, defer_date, sort_order)
|
||||
values ($1, $2, $3, $4, $5, $6, $7, $8, $9)
|
||||
`insert into tasks (id, title, notes, status, project_id, context, waiting_for, due_date, defer_date, priority, estimate_min, sort_order)
|
||||
values (coalesce($1::uuid, gen_random_uuid()), $2, $3, $4, $5, $6, $7, $8, $9, $10, $11, $12)
|
||||
on conflict (id) do nothing
|
||||
returning ${TASK_COLS}`,
|
||||
[t.title, t.notes ?? "", t.status ?? "inbox", t.project_id ?? null, t.context ?? null,
|
||||
t.waiting_for ?? null, t.due_date ?? null, t.defer_date ?? null, t.sort_order ?? 0]);
|
||||
return json(rows[0], 201);
|
||||
[id, t.title, t.notes ?? "", t.status ?? "inbox", t.project_id ?? null, t.context ?? null,
|
||||
t.waiting_for ?? null, t.due_date ?? null, t.defer_date ?? null, t.priority ?? 4,
|
||||
t.estimate_min ?? null, t.sort_order ?? 0]);
|
||||
if (rows.length) return json(rows[0], 201);
|
||||
const existing = await sql.unsafe(`select ${TASK_COLS} from tasks where id = $1`, [id]);
|
||||
return json(existing[0], 200);
|
||||
}
|
||||
|
||||
let m = path.match(/^\/v1\/tasks\/([0-9a-f-]{36})$/);
|
||||
@@ -93,10 +103,11 @@ async function handle(req: Request): Promise<Response> {
|
||||
const completedAt = cur.status === "done" ? (existing[0].completed_at ?? new Date()) : null;
|
||||
const rows = await sql.unsafe(
|
||||
`update tasks set title=$2, notes=$3, status=$4, project_id=$5, context=$6, waiting_for=$7,
|
||||
due_date=$8, defer_date=$9, completed_at=$10, sort_order=$11, updated_at=now()
|
||||
due_date=$8, defer_date=$9, priority=$10, estimate_min=$11, completed_at=$12, sort_order=$13,
|
||||
updated_at=now()
|
||||
where id=$1 returning ${TASK_COLS}`,
|
||||
[id, cur.title, cur.notes, cur.status, cur.project_id, cur.context, cur.waiting_for,
|
||||
cur.due_date, cur.defer_date, completedAt, cur.sort_order]);
|
||||
cur.due_date, cur.defer_date, cur.priority, cur.estimate_min, completedAt, cur.sort_order]);
|
||||
return json(rows[0]);
|
||||
}
|
||||
|
||||
@@ -115,11 +126,16 @@ async function handle(req: Request): Promise<Response> {
|
||||
const p = pick(body, PROJECT_FIELDS);
|
||||
if (typeof p.name !== "string" || !p.name.trim()) return err("name required", 400);
|
||||
if (p.status && !PROJECT_STATUSES.includes(p.status as string)) return err("bad status", 400);
|
||||
const id = typeof body.id === "string" && UUID_RE.test(body.id) ? body.id : null;
|
||||
const rows = await sql.unsafe(
|
||||
`insert into projects (name, status, notes, sort_order) values ($1, $2, $3, $4)
|
||||
`insert into projects (id, name, status, notes, sort_order)
|
||||
values (coalesce($1::uuid, gen_random_uuid()), $2, $3, $4, $5)
|
||||
on conflict (id) do nothing
|
||||
returning ${PROJECT_COLS}`,
|
||||
[p.name, p.status ?? "active", p.notes ?? "", p.sort_order ?? 0]);
|
||||
return json(rows[0], 201);
|
||||
[id, p.name, p.status ?? "active", p.notes ?? "", p.sort_order ?? 0]);
|
||||
if (rows.length) return json(rows[0], 201);
|
||||
const existing = await sql.unsafe(`select ${PROJECT_COLS} from projects where id = $1`, [id]);
|
||||
return json(existing[0], 200);
|
||||
}
|
||||
|
||||
m = path.match(/^\/v1\/projects\/([0-9a-f-]{36})$/);
|
||||
@@ -153,6 +169,10 @@ Bun.serve({
|
||||
fetch: (req) =>
|
||||
handle(req).catch((e) => {
|
||||
console.error(e);
|
||||
// Constraint violations are bad input, not server faults — 400 so
|
||||
// offline clients drop the op instead of retrying it forever.
|
||||
const errno = (e as { errno?: string }).errno ?? "";
|
||||
if (errno.startsWith("23")) return err(`constraint violation: ${(e as Error).message}`, 400);
|
||||
return err("internal error", 500);
|
||||
}),
|
||||
});
|
||||
|
||||
@@ -23,6 +23,8 @@ create table if not exists tasks (
|
||||
waiting_for text, -- who/what is being waited on when status = 'waiting'
|
||||
due_date date,
|
||||
defer_date date, -- hide from lists until this date
|
||||
priority int not null default 4 check (priority between 1 and 4), -- 1=urgent … 4=low
|
||||
estimate_min int check (estimate_min > 0),
|
||||
completed_at timestamptz,
|
||||
sort_order double precision not null default 0,
|
||||
created_at timestamptz not null default now(),
|
||||
|
||||
Reference in New Issue
Block a user