chore: 1.0.5

Dockerfile

@@ -25,7 +25,6 @@ RUN uv pip install . --system
 
 ENV APP_ENV=production
 ENV PORT=5000
-EXPOSE ${PORT}
 ENV BIND=0.0.0.0
 
 COPY --from=front-end /app/dist ./dist

README.md

@@ -4,6 +4,8 @@
 
 > A shareable task list with auto resetting items.
 
+![](./public/assets/preview.jpg)
+
 **[todo.klemek.fr](https://todo.klemek.fr)**
 
 ## Running your own

app/migrations/0002_auto_20260714_1541.py

@@ -0,0 +1,21 @@
+from tortoise import migrations
+from tortoise.migrations import operations as ops
+from tortoise import fields
+
+class Migration(migrations.Migration):
+    dependencies = [('models', '0001_initial')]
+
+    initial = False
+
+    operations = [
+        ops.AlterField(
+            model_name='Task',
+            name='list_name',
+            field=fields.CharField(db_index=True, max_length=128),
+        ),
+        ops.AlterField(
+            model_name='Task',
+            name='reset_cron',
+            field=fields.CharField(null=True, max_length=64),
+        ),
+    ]

app/models/task.py

@@ -10,7 +10,7 @@ CRONTAB_REGEX = r"^(@(annually|yearly|monthly|weekly|daily|hourly|reboot))|(@eve
 
 
 class Task(AbstractModel):
-    list_name = tortoise.fields.CharField(max_length=32, db_index=True, null=False)
+    list_name = tortoise.fields.CharField(max_length=128, db_index=True, null=False)
     name = tortoise.fields.TextField(null=False)
     reset_cron = tortoise.fields.CharField(
         max_length=64,

app/server.py

@@ -58,13 +58,13 @@ class Server(gunicorn.app.base.BaseApplication):
 
         @self.app.route("/api/lists/<list_name>/tasks", methods=["GET"])
         async def get_tasks(list_name: str) -> list:
-            return await Task.filter(list_name=list_name).values()
+            return await Task.filter(list_name=list_name[:128]).values()
 
         @self.app.route("/api/lists/<list_name>/tasks", methods=["POST"])
         async def post_task(list_name: str) -> typing.Any:
             data = flask.request.get_json()
             logging.getLogger(self.__class__.__name__).info("%s", data)
-            data["list_name"] = list_name
+            data["list_name"] = list_name[:128]
             parsed_data = Task.validate_create(data)
             if parsed_data is None:
                 flask.abort(400)

index.html

@@ -16,7 +16,7 @@
         <!-- card related -->
         <meta property="og:title" content="{{ title }}">
         <meta property="og:description" content="{{ lang('home') }}">
-        <meta property="og:image" content="{{ app_url }}/assets/favicon-96x96.jpg">
+        <meta property="og:image" content="{{ app_url }}/assets/preview.jpg">
         <meta property="og:url" content="{{ app_url }}/{{ path }}">
 
         <script

package.json

@@ -1,6 +1,6 @@
 {
     "name": "tout-doux",
-    "version": "1.0.1",
+    "version": "1.0.5",
     "private": true,
     "type": "module",
     "engines": {

pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "tout-doux"
-version = "1.0.1"
+version = "1.0.5"
 description = ""
 requires-python = ">=3.14"
 dependencies = [

resources/css/style.css

@@ -10,3 +10,29 @@ body {
     font-style: normal;
     font-variation-settings: "wdth" 100;
 }
+
+.bg-hero {
+    --size: 5vh;
+    --angle: 45deg;
+    background: repeating-linear-gradient(
+        var(--angle),
+        var(--color-base-200) calc(0 * var(--size)),
+        var(--color-base-200) calc(1 * var(--size)),
+        var(--color-secondary) calc(1 * var(--size)),
+        var(--color-secondary) calc(2 * var(--size)),
+        var(--color-base-200) calc(2 * var(--size)),
+        var(--color-base-200) calc(3 * var(--size)),
+        var(--color-accent) calc(3 * var(--size)),
+        var(--color-accent) calc(4 * var(--size)),
+        var(--color-base-200) calc(4 * var(--size))
+    );
+    background-size: calc(4 * var(--size) / sin(var(--angle)))
+        calc(4 * var(--size) / sin(var(--angle)));
+    animation: BackgroundAnimate 10s linear infinite reverse;
+}
+
+@keyframes BackgroundAnimate {
+    0% {
+        background-position: calc(4 * var(--size) / sin(var(--angle))) 0;
+    }
+}

resources/ts/App.vue

@@ -22,7 +22,7 @@ onMounted(() => {
         :style="{ display: visible ? 'flex' : 'none' }"
         class="min-h-screen flex-col w-screen"
     >
-        <div class="hero bg-base-200 grow">
+        <div class="hero bg-hero grow">
             <div class="hero-content text-center p-0">
                 <div
                     class="max-w-md min-w-96 bg-base-100 rounded-box shadow-md"

resources/ts/components/TaskItem.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onBeforeMount, ref, watch, computed, defineAsyncComponent } from "vue";
+import { onBeforeMount, ref, watch, computed, defineAsyncComponent, nextTick } from "vue";
 import type { Task } from "@/types";
 import { CopyIcon, TrashIcon, SaveIcon, XIcon } from "@lucide/vue";
 import { updateTask } from "@/api/tasks";
@@ -11,7 +11,8 @@ import { relativeTime } from "@/lib/dates";
 import { useAlertStore } from "@/stores/alerts";
 import { useI18n } from "vue-i18n";
 
-const emit = defineEmits<(e: "clone" | "delete" | "updated", task: Task) => void>();
+const emit =
+    defineEmits<(e: "clone" | "delete" | "updated", task: Task) => void>();
 
 const task = defineModel<Task>({ required: true });
 defineProps<{ showLastChecked: boolean; showNextReset: boolean }>();
@@ -20,6 +21,7 @@ const editMode = ref<boolean>(false);
 const editName = ref<string>("");
 const editCron = ref<string | null>(null);
 const refreshKey = ref<number>(0);
+const editNameInput = ref<HTMLInputElement | null>(null);
 
 const checked = computed<boolean>(() => taskCompleted(task.value));
 const nextReset = computed<Date | null>(() => taskNextReset(task.value));
@@ -28,26 +30,36 @@ const i18n = useI18n();
 
 const { alertSuccess, alertError } = useAlertStore();
 
+async function onOpen() {
+    editMode.value = true;
+    await nextTick();
+    editNameInput.value?.focus();
+}
+
 function onClose() {
+    editName.value = task.value.name;
+    editCron.value = task.value.reset_cron;
     editMode.value = false;
 }
 
 function onSave() {
-    updateTask(task.value.id, {
+    if (editName.value.trim()) {
-        name: editName.value,
+        updateTask(task.value.id, {
-        reset_cron: editCron.value,
+            name: editName.value.trim(),
-    })
+            reset_cron: editCron.value,
-        .then((newTask) => {
-            task.value = newTask;
-            emit("updated", newTask);
-            alertSuccess(i18n.t("alerts.task_updated"));
         })
-        .catch(() => {
+            .then((newTask) => {
-            alertError(i18n.t("alerts.task_update_error"));
+                task.value = newTask;
-        });
+                emit("updated", newTask);
-    task.value.name = editName.value;
+                alertSuccess(i18n.t("alerts.task_updated"));
-    task.value.reset_cron = editCron.value;
+            })
-    editMode.value = false;
+            .catch(() => {
+                alertError(i18n.t("alerts.task_update_error"));
+            });
+        task.value.name = editName.value;
+        task.value.reset_cron = editCron.value;
+        editMode.value = false;
+    }
 }
 
 function onCheck() {
@@ -105,7 +117,7 @@ watch(task, () => {
 
 <template>
     <div class="list-row text-left">
-        <template  v-if="!editMode">
+        <template v-if="!editMode">
             <div class="content-center">
                 <input
                     :id="refreshKey.toFixed(0)"
@@ -117,7 +129,7 @@ watch(task, () => {
             </div>
             <div
                 class="cursor-pointer text-lg select-none"
-                @click.prevent="editMode = true"
+                @click.prevent="onOpen"
             >
                 <div>{{ task.name }}</div>
                 <div
@@ -131,7 +143,8 @@ watch(task, () => {
                     v-if="showNextReset && checked && nextReset"
                     class="font-light text-xs italic"
                 >
-                    {{ $t("resets") }} {{ relativeTime(nextReset, $i18n.locale) }}
+                    {{ $t("resets") }}
+                    {{ relativeTime(nextReset, $i18n.locale) }}
                 </div>
             </div>
         </template>
@@ -141,7 +154,13 @@ watch(task, () => {
                     <button class="btn btn-square me-1" @click="onClose">
                         <x-icon />
                     </button>
-                    <button class="btn btn-square me-1" @click="onSave">
+                    <button
+                        class="btn btn-square me-1"
+                        :class="
+                            editName.trim().length === 0 ? 'btn-disabled' : ''
+                        "
+                        @click="onSave"
+                    >
                         <save-icon />
                     </button>
                     <button class="btn btn-square me-1" @click="onClone">
@@ -151,7 +170,13 @@ watch(task, () => {
                         <trash-icon />
                     </button>
                 </div>
-                <input v-model="editName" type="text" class="input w-full" />
+                <input
+                    ref="editNameInput"
+                    v-model="editName"
+                    type="text"
+                    class="input w-full"
+                    @keyup.enter="onSave"
+                />
                 <cron-input v-model="editCron" :edit-mode="editMode" />
             </div>
         </template>

resources/ts/views/ListView.vue

@@ -25,6 +25,7 @@ import { shareLink } from "@/lib/share";
 const route = useRoute();
 
 const list = ref<string | null>(null);
+const loading = ref<boolean>(true);
 const taskInput = ref<string>("");
 const tasks = ref<Task[]>([]);
 
@@ -54,6 +55,7 @@ function fetchTasks() {
             .then((data: Task[]) => {
                 tasks.value = data;
                 reSortTasks();
+                loading.value = false;
                 setTimeout(fetchTasks, 10000);
             })
             .catch(() => {
@@ -72,7 +74,7 @@ function reSortTasks() {
 }
 
 function onNewTask() {
-    if (taskInput.value.trim() && list.value) {
+    if (taskInput.value.trim() && list.value && !loading.value) {
         createTask(list.value, {
             name: taskInput.value.trim(),
             reset_cron: null,
@@ -150,12 +152,12 @@ function updateTitle() {
 }
 
 onBeforeMount(() => {
-    list.value = route.params.list as string;
+    list.value = (route.params.list as string).slice(0, 128);
     fetchTasks();
 });
 
 onBeforeRouteUpdate((to) => {
-    list.value = to.params.list as string;
+    list.value = (to.params.list as string).slice(0, 128);
     fetchTasks();
 });
 </script>
@@ -179,7 +181,7 @@ onBeforeRouteUpdate((to) => {
             </li>
         </template>
         <li
-            v-if="empty"
+            v-if="!loading && empty"
             class="list-row italic text-xl font-extralight self-center"
         >
             <span
@@ -188,7 +190,7 @@ onBeforeRouteUpdate((to) => {
             ></span>
         </li>
         <li
-            v-else-if="allCompleted && separateCompleted"
+            v-else-if="!loading && allCompleted && separateCompleted"
             class="list-row italic text-xl font-extralight self-center"
         >
             <span
@@ -196,26 +198,6 @@ onBeforeRouteUpdate((to) => {
                 <span v-html="$t('all_completed_hint')"></span
             ></span>
         </li>
-        <li class="list-row">
-            <div class="list-col-grow">
-                <input
-                    v-model="taskInput"
-                    type="text"
-                    :placeholder="$t('new_task_hint')"
-                    class="input w-full"
-                    @keyup.enter="onNewTask"
-                />
-            </div>
-            <div>
-                <button
-                    class="btn btn-square"
-                    :disabled="taskInput.trim().length === 0"
-                    @click="onNewTask"
-                >
-                    <circle-plus-icon />
-                </button>
-            </div>
-        </li>
     </ul>
     <div
         v-if="separateCompleted && hasCompleted"
@@ -245,6 +227,22 @@ onBeforeRouteUpdate((to) => {
             </ul>
         </div>
     </div>
+    <div class="flex gap-2 p-4">
+        <input
+            v-model="taskInput"
+            type="text"
+            :placeholder="$t('new_task_hint')"
+            class="input grow"
+            @keyup.enter="onNewTask"
+        />
+        <button
+            class="btn btn-square"
+            :disabled="loading || taskInput.trim().length === 0"
+            @click="onNewTask"
+        >
+            <circle-plus-icon />
+        </button>
+    </div>
     <div>
         <button class="btn btn-sm px-4" @click="onShare">
             <share-2-icon class="inline" :size="16" /> {{ $t('share_button') }}

uv.lock

@@ -323,7 +323,7 @@ asyncpg = [
 
 [[package]]
 name = "tout-doux"
-version = "1.0.1"
+version = "1.0.5"
 source = { editable = "." }
 dependencies = [
     { name = "flask", extra = ["async"] },