Add PATCH endpoint - update text.

Author: Mike Nikles

src/lib/todo-item.svelte

@@ -88,8 +88,8 @@
     <button aria-label="Mark done/not done" class="toggle"></button>
   </form>
 
-  <form action="" method="" class="text">
-    <input type="text" value="{todo.text}" />
+  <form action="/todos/{todo.uid}.json?_method=patch" method="post" class="text">
+    <input type="text" name="text" value="{todo.text}" />
     <button aria-label="Save todo" class="save"></button>
   </form>
 

src/routes/todos/[uid].json.ts

@@ -3,4 +3,10 @@ import { api } from "./_api";
 
 export const del: RequestHandler = (request) => {
   return api(request);
+}
+
+export const patch: RequestHandler<{}, FormData> = (request) => {
+  return api(request, {
+    text: request.body.get("text")
+  });
 }

src/routes/todos/_api.ts

@@ -3,7 +3,7 @@ import type { Request } from "@sveltejs/kit";
 // TODO: Persist in database
 let todos: Todo[] = [];
 
-export const api = (request: Request, todo?: Todo) => {
+export const api = (request: Request, data?: Record<string, unknown>) => {
   let body = {};
   let status = 500;
 
@@ -13,14 +13,23 @@ export const api = (request: Request, todo?: Todo) => {
       status = 200;
       break;
     case "POST":
-      todos.push(todo);
-      body = todo;
+      todos.push(data as Todo);
+      body = data;
       status = 201;
       break;
     case "DELETE":
       todos = todos.filter(todo => todo.uid !== request.params.uid)
       status = 200;
       break;
+    case "PATCH":
+      todos = todos.map(todo => {
+        if (todo.uid === request.params.uid) {
+          todo.text = data.text as string;
+        }
+        return todo;
+      });
+      status = 200;
+      break;
 
     default:
       break;