docs: Simplify ProfileEdit in homepage demo

reactive · Jul 31, 2024 · e5a5ccc · e5a5ccc
1 parent 277c38c
commit e5a5ccc
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 17 deletions.
diff --git a/website/src/components/Demo/code/profile-edit/graphql/PostList.tsx b/website/src/components/Demo/code/profile-edit/graphql/PostList.tsx
@@ -7,7 +7,7 @@ function PostList() {
   const { posts } = useSuspense(PostResource.getList, { userId });
   return (
     <div>
-      <ProfileEdit userId={userId} />
+      <ProfileEdit id={userId} />
       <br />
       <br />
       {posts.map(post => (

diff --git a/website/src/components/Demo/code/profile-edit/graphql/ProfileEdit.tsx b/website/src/components/Demo/code/profile-edit/graphql/ProfileEdit.tsx
@@ -1,13 +1,11 @@
 import { UserResource } from './resources';
 
-export default function ProfileEdit({ userId }: { userId: number }) {
-  const { user } = useSuspense(UserResource.get, { id: userId });
+export default function ProfileEdit({ id }: { id: number }) {
+  const { user } = useSuspense(UserResource.get, { id });
   const controller = useController();
-  const handleChange = ({ currentTarget: { value } }) =>
-    controller.fetch(UserResource.update, {
-      id: userId,
-      name: value,
-    });
+  const handleChange = ({ currentTarget: { value: name } }) =>
+    controller.fetch(UserResource.update, { id, name });
+
   return (
     <label>
       Name:{' '}

diff --git a/website/src/components/Demo/code/profile-edit/rest/PostList.tsx b/website/src/components/Demo/code/profile-edit/rest/PostList.tsx
@@ -7,7 +7,7 @@ function PostList() {
   const posts = useSuspense(PostResource.getList, { userId });
   return (
     <div>
-      <ProfileEdit userId={userId} />
+      <ProfileEdit id={userId} />
       <br />
       <br />
       {posts.map(post => (

diff --git a/website/src/components/Demo/code/profile-edit/rest/ProfileEdit.tsx b/website/src/components/Demo/code/profile-edit/rest/ProfileEdit.tsx
@@ -1,14 +1,11 @@
 import { UserResource } from './resources';
 
-export default function ProfileEdit({ userId }: { userId: number }) {
-  const user = useSuspense(UserResource.get, { id: userId });
+export default function ProfileEdit({ id }: { id: number }) {
+  const user = useSuspense(UserResource.get, { id });
   const controller = useController();
-  const handleChange = ({ currentTarget: { value } }) =>
-    controller.fetch(
-      UserResource.partialUpdate,
-      { id: userId },
-      { name: value },
-    );
+  const handleChange = ({ currentTarget: { value: name } }) =>
+    controller.fetch(UserResource.partialUpdate, { id }, { name });
+
   return (
     <label>
       Name:{' '}