Moving on...

package-lock.json

@@ -5,6 +5,10 @@
   "packages": {
     "": {
       "name": "backend",
+      "dependencies": {
+        "@felte/reporter-solid": "^1.2.5",
+        "@felte/solid": "^1.2.7"
+      },
       "devDependencies": {
         "@solidjs/meta": "^0.28.2",
         "@solidjs/router": "^0.7.0",
@@ -1818,6 +1822,53 @@
         "node": ">=12"
       }
     },
+    "node_modules/@felte/common": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/@felte/common/-/common-1.1.4.tgz",
+      "integrity": "sha512-4jNB4EwRpaGZppwV/YqbGF7SVRwehWw+hyTGmw2N+pL86LuqVTTSrgVOGXwPaLTju1BxAptcoAXjxZbBf0XB4Q==",
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      }
+    },
+    "node_modules/@felte/core": {
+      "version": "1.3.7",
+      "resolved": "https://registry.npmjs.org/@felte/core/-/core-1.3.7.tgz",
+      "integrity": "sha512-/AkIEZu/Yg/K+YEdnup5c3Bb0xyr9ONdZnS0us6V/b9DgfiEqbcm1xgglD/mtwh+IH7KOhIuQecjBdPQfpNViQ==",
+      "dependencies": {
+        "@felte/common": "1.1.4"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      }
+    },
+    "node_modules/@felte/reporter-solid": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/@felte/reporter-solid/-/reporter-solid-1.2.5.tgz",
+      "integrity": "sha512-6foQqKRzz9ubZSEPhAbc9apMg8HOthZpvvbRhLDsyP3WnM5WXdVmEd7HuFsNTWx3Qd1JDc/QWi0BzYdtFJRtUw==",
+      "dependencies": {
+        "@felte/common": "1.1.4"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "peerDependencies": {
+        "solid-js": "^1.2.0"
+      }
+    },
+    "node_modules/@felte/solid": {
+      "version": "1.2.7",
+      "resolved": "https://registry.npmjs.org/@felte/solid/-/solid-1.2.7.tgz",
+      "integrity": "sha512-kVCmIBxJiemAcklJ61yxW7WCo+r4sGDSfuUws3t9pFQyKHENT+7HEfUU3hpEqx+BA5xd4bczS8MrOhf9L429rw==",
+      "dependencies": {
+        "@felte/core": "1.3.7"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      },
+      "peerDependencies": {
+        "solid-js": "^1.2.0"
+      }
+    },
     "node_modules/@hapi/address": {
       "version": "5.1.0",
       "resolved": "https://registry.npmjs.org/@hapi/address/-/address-5.1.0.tgz",
@@ -3109,8 +3160,7 @@
     "node_modules/csstype": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.1.tgz",
-      "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw==",
-      "dev": true
+      "integrity": "sha512-DJR/VvkAvSZW9bTouZue2sSxDwdTN92uHjqeKVm+0dAqdfNykRzQ95tay8aXMBAAPpUiq4Qcug2L7neoRh2Egw=="
     },
     "node_modules/data-urls": {
       "version": "3.0.2",
@@ -6108,7 +6158,6 @@
       "version": "1.6.11",
       "resolved": "https://registry.npmjs.org/solid-js/-/solid-js-1.6.11.tgz",
       "integrity": "sha512-JquQQHPArGq+i2PLURxJ99Pcz2/1docpbycSio/cKSA0SeI3z5zRjy0TNcH4NRYvbOLrcini+iovXwnexKabyw==",
-      "dev": true,
       "dependencies": {
         "csstype": "^3.1.0"
       }

package.json

@@ -26,5 +26,9 @@
     "undici": "^5.15.1",
     "vite": "^3.2.5",
     "vitest": "^0.26.3"
+  },
+  "dependencies": {
+    "@felte/reporter-solid": "^1.2.5",
+    "@felte/solid": "^1.2.7"
   }
-}
+}

src/components/invitation/Invitation.tsx

@@ -0,0 +1,26 @@
+import { createForm } from "@felte/solid";
+import { Component } from "solid-js";
+
+interface Props {}
+
+const Invitation: Component<Props> = (props) => {
+  const submitHandler = (values: any, context: any) => {
+    console.log({
+      caller: "Invitation / submitHandler",
+      props,
+      values,
+      context,
+    });
+  };
+
+  const { form } = createForm({ onSubmit: submitHandler });
+
+  return (
+    <form use:form>
+      <label for="database">Database</label>
+      <input type="url" name="database" required={true} />
+    </form>
+  );
+};
+
+export default Invitation;

src/components/invitation/index.ts

@@ -0,0 +1 @@
+export { default } from "./Invitation";

src/routes/invitations/index.tsx

@@ -0,0 +1,7 @@
+export default () => {
+  return (
+    <main>
+      <h1>Invitations</h1>
+    </main>
+  );
+};

src/routes/invitations/new.tsx

@@ -0,0 +1,10 @@
+import Invitation from "~/components/invitation";
+
+export default () => {
+  return (
+    <main>
+      <h1>New invitation</h1>
+      <Invitation />
+    </main>
+  );
+};