From aafebedd05ea5082048cdbb42c7346b0547d2259 Mon Sep 17 00:00:00 2001
From: captaincrunch <kevin@wecreativeagency.com>
Date: Wed, 2 Aug 2023 12:55:37 -0700
Subject: [PATCH] Issue #59 (#64)

* update

* Update index.tsx

* update

* Update index.tsx

* Update index.tsx

* Update index.tsx

* fix: add missing auth header

* fix: pool page taking in params

* fix: add mongo types + fix patch request

---------

Co-authored-by: marcuspang <marcuspangyuyang@gmail.com>
---
 hooks/useGetCurrentUser.tsx    | 25 ++++++++++++++++
 pages/pool/[id]/index.tsx      |  6 ++--
 pages/update-profile/index.tsx | 55 ++++++++++++++++++++++++++++++----
 types/mongo.ts                 | 21 +++++++++++--
 4 files changed, 97 insertions(+), 10 deletions(-)
 create mode 100644 hooks/useGetCurrentUser.tsx

diff --git a/hooks/useGetCurrentUser.tsx b/hooks/useGetCurrentUser.tsx
new file mode 100644
index 0000000..5005359
--- /dev/null
+++ b/hooks/useGetCurrentUser.tsx
@@ -0,0 +1,25 @@
+import { AuthContext } from "@/components/AuthProvider";
+import { User } from "@/types/mongo";
+import { useContext } from "react";
+import { useQuery } from "wagmi";
+
+async function getCurrentUser(idToken: string): Promise<User | undefined> {
+  try {
+    return fetch(`${process.env.BACKEND_URL}/users/@me`, {
+      headers: {
+        Authorization: `Bearer ${idToken}`,
+      }
+    }).then((res) =>
+      res.json()
+    );
+  } catch (e) {
+    console.error(e);
+    return;
+  }
+}
+
+export function useGetCurrentUser() {
+  const { idToken } = useContext(AuthContext);
+
+  return useQuery(["users"], () => getCurrentUser(idToken), { enabled: idToken !== '' });
+}
diff --git a/pages/pool/[id]/index.tsx b/pages/pool/[id]/index.tsx
index a536293..8ba6a2b 100644
--- a/pages/pool/[id]/index.tsx
+++ b/pages/pool/[id]/index.tsx
@@ -1,11 +1,11 @@
 import { FundingPoolProjectHeader } from "@/devlink";
 import { ReadyToLaunchComponent } from "@/devlink/ReadyToLaunchComponent";
 
-export default function PoolPage({ params }: { params: { slug: string } }) {
+export default function PoolPage() {
   return (
     <>
-       <FundingPoolProjectHeader />
-       <ReadyToLaunchComponent />
+      <FundingPoolProjectHeader />
+      <ReadyToLaunchComponent />
     </>
   );
 }
diff --git a/pages/update-profile/index.tsx b/pages/update-profile/index.tsx
index 675fdf9..2238827 100644
--- a/pages/update-profile/index.tsx
+++ b/pages/update-profile/index.tsx
@@ -1,15 +1,48 @@
 import { AdminNav } from "@/components/AdminNav";
 import { useForm, SubmitHandler } from "react-hook-form";
 import { User } from "@/types/mongo";
+import { useGetCurrentUser } from "@/hooks/useGetCurrentUser";
+import { useContext } from "react";
+import { AuthContext } from "@/components/AuthProvider";
 
+async function updateUser(values: User, idToken: string) {
+  const res = await fetch(`${process.env.BACKEND_URL}/users/${values._id}`, {
+    method: "PATCH",
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${idToken}`,
+    },
+    body: JSON.stringify(values),
+  });
+  return await res.json();
+}
+
+// TODO: create separate form schema distinct from User
 export default function UpdateProfile() {
+  const { data } = useGetCurrentUser()
+  const { idToken } = useContext(AuthContext)
   const {
     register,
     handleSubmit,
     watch,
     formState: { errors },
-  } = useForm<User>();
-  const onSubmit: SubmitHandler<User> = (data) => console.log(data);
+  } = useForm<User>({
+    mode: "onBlur",
+    defaultValues: {
+      name: data ? data.name : '',
+      socials: data ? data.socials : '',
+      bio: data ? data.bio : ''
+    }
+  });
+
+  const onSubmit: SubmitHandler<User> = (formData) => {
+    try {
+      if (data)
+        updateUser({ ...formData, _id: data._id }, idToken)
+    } catch (error) {
+      console.log(error)
+    }
+  };
 
   return (
     <form
@@ -29,27 +62,39 @@ export default function UpdateProfile() {
           <div className="grow pr-4">
             <label>Your name</label>
             <input
-              {...register(`name`)}
+              {...register(`name`, { required: "Name is required" })}
               className="w-full input-field mb-2"
               placeholder="Name"
             />
+            <span className="text-red-600 text-xs">
+              {" "}
+              {errors.name && errors.name.message}
+            </span>
           </div>
           <div className="grow">
             <label>Where people can find you</label>
             <input
-              {...register(`socials`)}
+              {...register(`socials`, { required: "Social is required" })}
               className="w-full input-field mb-2"
               placeholder="https://"
             />
+            <span className="text-red-600 text-xs">
+              {" "}
+              {errors.socials && errors.socials.message}
+            </span>
           </div>
         </div>
         <hr className="border-b-1 border-slate-200 my-8" />
         <label>Your Bio</label>
         <textarea
-          {...register(`bio`)}
+          {...register(`bio`, { required: "Bio is required" })}
           className="w-full input-field mb-2"
           placeholder="Something about yourself..."
         />
+        <span className="text-red-600 text-xs">
+          {" "}
+          {errors.bio && errors.bio.message}
+        </span>
         <hr className="border-b-1 border-slate-200 my-8" />
         <button
           className="bg-black text-white rounded leading-10 px-5"
diff --git a/types/mongo.ts b/types/mongo.ts
index 1277e59..5e2c242 100644
--- a/types/mongo.ts
+++ b/types/mongo.ts
@@ -41,15 +41,32 @@ export type Pool = {
 };
 
 export type User = {
+  _id: string;
   name: string;
   profile?: string;
   bio?: string;
   socials?: string;
-  wallet_address: string;
+  wallets: WalletResolvable[];
   email?: string;
-  session_cookie: string;
 };
 
+export type Wallet = {
+  type: string;
+};
+
+export type SocialLoginWallet = {
+  public_key: string;
+  curve: string;
+} & Wallet;
+
+export type ExternalWallet = {
+  address: string;
+} & Wallet;
+
+export type WalletResolvable = Partial<SocialLoginWallet> &
+  Partial<ExternalWallet> &
+  Wallet;
+
 type Sponsor = {
   logo: string;
   name: string;