grouped and sorted licence categories display

frontend/src/routes/auth/about/[id]/+page.server.js

@@ -24,6 +24,18 @@ export const actions = {
   updateUser: async ({ request, fetch, cookies, locals }) => {
     let formData = await request.formData();
 
+    const licenceCategories = formData
+      .getAll("licence_categories[]")
+      .filter((value) => typeof value === "string")
+      .map((value) => {
+        try {
+          return JSON.parse(value);
+        } catch (e) {
+          console.error("Failed to parse licence category:", value);
+          return null;
+        }
+      })
+      .filter(Boolean);
     /** @type {Partial<App.Locals['user']>} */
     const updateData = {
       id: Number(formData.get("id")),
@@ -67,19 +79,15 @@ export const actions = {
         issued_date: toRFC3339(formData.get("issued_date")),
         expiration_date: toRFC3339(formData.get("expiration_date")),
         country: String(formData.get("country")),
-        licence_categories: formData
-          .getAll("licence_categories[]")
-          .map((category) => ({
-            id: -1, // Use -1 as a placeholder for new categories
-            category: String(category),
-          })),
+        licence_categories: licenceCategories,
       },
     };
-
     // Remove undefined or null properties
-    const cleanUpdateData = Object.fromEntries(
-      Object.entries(updateData).filter(([_, v]) => v != null)
+    const cleanUpdateData = JSON.parse(
+      JSON.stringify(updateData),
+      (key, value) => (value !== null && value !== "" ? value : undefined)
     );
+    console.dir(formData);
     console.dir(cleanUpdateData);
     const apiURL = `${BASE_API_URI}/backend/users/update/`;
     const res = await fetch(apiURL, {