details on challenge creator

Web-BDE · Feb 24, 2022 · 0fa9c58 · 0fa9c58
1 parent c9d0d45
commit 0fa9c58
Show file tree

Hide file tree

Showing 4 changed files with 64 additions and 23 deletions.
diff --git a/app/components/challenge/challengeDisplay.tsx b/app/components/challenge/challengeDisplay.tsx
@@ -1,7 +1,14 @@
 import { Typography } from "@mui/material";
 import { Challenge } from "~/models/Challenge";
+import { User } from "~/models/User";
 
-export default function ChallengeDisplay({ challenge }: { challenge: Challenge }) {
+export default function ChallengeDisplay({
+  challenge,
+  creator,
+}: {
+  challenge: Challenge;
+  creator?: User;
+}) {
   return (
     <div>
       <Typography variant="h3" style={{ marginTop: "10px" }}>
@@ -16,6 +23,11 @@ export default function ChallengeDisplay({ challenge }: { challenge: Challenge }
       <Typography variant="body1" style={{ marginTop: "10px" }}>
         Creation date : {new Date(challenge.createdAt).toLocaleDateString()}
       </Typography>
+      {creator && (
+        <Typography variant="body1" style={{ marginTop: "10px" }}>
+          Creator : {creator?.pseudo}
+        </Typography>
+      )}
     </div>
   );
 }
diff --git a/app/components/challenge/forms/updateChallengeForm.tsx b/app/components/challenge/forms/updateChallengeForm.tsx
@@ -1,13 +1,16 @@
 import { TextField, Button, Typography } from "@mui/material";
 import { Form } from "remix";
 import { Challenge, CreateChallengeFormData } from "~/models/Challenge";
+import { User } from "~/models/User";
 
 export default function UpdateChallengeForm({
   challenge,
   formData,
+  creator,
 }: {
   challenge: Challenge;
   formData?: CreateChallengeFormData;
+  creator?: User;
 }) {
   return (
     <Form method="patch" action={`/challenges/${challenge.id}`}>
@@ -55,6 +58,11 @@ export default function UpdateChallengeForm({
       <Typography variant="h6" align="center" style={{ marginTop: "10px" }}>
         Creation date : {new Date(challenge.createdAt).toLocaleDateString()}
       </Typography>
+      {creator && (
+        <Typography variant="h6" align="center" style={{ marginTop: "10px" }}>
+          Creator : {creator?.pseudo}
+        </Typography>
+      )}
       <Button
         type="submit"
         fullWidth

diff --git a/app/routes/challenges/$challengeId.tsx b/app/routes/challenges/$challengeId.tsx
@@ -47,14 +47,15 @@ import {
   DeleteAccomplishmentFormData,
 } from "~/models/Accomplishment";
 import { ContextData } from "~/root";
-import { Params } from "react-router";
-import { getSelft } from "~/services/user";
+import { getSelft, getUser } from "~/services/user";
+import { User } from "~/models/User";
 
 type LoaderData = {
   challengeResponse?: {
     challenge?: Challenge;
     error?: string;
     success?: string;
+    creatorResponse?: { error?: string; success?: string; user?: User };
   };
   accomplishmentResponse?: {
     accomplishments?: Accomplishment[];
@@ -91,28 +92,26 @@ type ActionData = {
   };
 };
 
-async function loadAccomplishment(
+async function loadAccomplishments(
   token: string,
-  challengeResponse: {
-    error?: string;
-    success?: string;
-    challenge?: Challenge;
-  },
-  challengeCode: number,
+  challengeId?: number,
   userId?: number
 ) {
   const { code, ...accomplishmentResponse } = await getManyAccomplishment(
     token,
     100,
     0,
-    challengeResponse.challenge?.id,
+    challengeId,
     userId
   );
 
-  return json(
-    { challengeResponse, accomplishmentResponse } as LoaderData,
-    challengeCode
-  );
+  return accomplishmentResponse;
+}
+
+async function loadChallengeCreator(token: string, creatorId: number) {
+  const { code, ...userResponse } = await getUser(token, creatorId);
+
+  return userResponse;
 }
 
 async function loadChallenge(
@@ -122,7 +121,25 @@ async function loadChallenge(
 ) {
   const { code, ...challengeResponse } = await getChallenge(token, challengeId);
 
-  return loadAccomplishment(token, challengeResponse, code, userId);
+  return json(
+    {
+      challengeResponse: {
+        ...challengeResponse,
+        creatorResponse:
+          challengeResponse.challenge?.creatorId &&
+          (await loadChallengeCreator(
+            token,
+            challengeResponse.challenge?.creatorId
+          )),
+      },
+      purchaseResponse: await loadAccomplishments(
+        token,
+        challengeResponse.challenge?.id,
+        userId
+      ),
+    } as LoaderData,
+    code
+  );
 }
 
 export const loader: LoaderFunction = async ({ request, params }) => {
@@ -420,14 +437,16 @@ function displayChallenge(
     updateForm?: CreateChallengeFormData;
     deleteForm?: DeleteChallengeFormData;
   },
-  userId?: number
+  userId?: number,
+  creator?: User
 ) {
   if (userId === challenge.creatorId) {
     return (
       <Container maxWidth="xs">
         <UpdateChallengeForm
           challenge={challenge}
           formData={formData?.updateForm}
+          creator={creator}
         />
         <DeleteChallengeForm
           challenge={challenge}
@@ -438,7 +457,7 @@ function displayChallenge(
   } else {
     return (
       <Container maxWidth="xs">
-        <ChallengeDisplay challenge={challenge} />
+        <ChallengeDisplay creator={creator} challenge={challenge} />
       </Container>
     );
   }
@@ -467,7 +486,8 @@ export default function Challenge() {
                 updateForm: actionData?.updateChallengeResponse?.formData,
                 deleteForm: actionData?.deleteChallengeResponse?.formData,
               },
-              userInfo?.id
+              userInfo?.id,
+              loaderData.challengeResponse.creatorResponse?.user
             )}
             <Typography marginTop="50px" variant="h4">
               Submit Proof

diff --git a/app/routes/goodies/$goodiesId.tsx b/app/routes/goodies/$goodiesId.tsx
@@ -41,7 +41,6 @@ import {
   PurchaseGoodiesFormData,
   RefundGoodiesFormData,
 } from "~/models/Purchase";
-import { Params } from "react-router";
 import { ContextData } from "~/root";
 import { User } from "~/models/User";
 import { getSelft, getUser } from "~/services/user";
@@ -83,7 +82,7 @@ type ActionData = {
   };
 };
 
-async function loadPurchase(
+async function loadPurchases(
   token: string,
   goodiesId?: number,
   userId?: number
@@ -114,9 +113,9 @@ async function loadGoodies(token: string, goodiesId: number, userId?: number) {
         ...goodiesResponse,
         creatorResponse:
           goodiesResponse.goodies?.creatorId &&
-          loadGoodiesCreator(token, goodiesResponse.goodies?.creatorId),
+          (await loadGoodiesCreator(token, goodiesResponse.goodies?.creatorId)),
       },
-      purchaseResponse: loadPurchase(
+      purchaseResponse: await loadPurchases(
         token,
         goodiesResponse.goodies?.id,
         userId
@@ -358,6 +357,8 @@ export default function Goodies() {
   const loaderData = useLoaderData<LoaderData>();
   const actionData = useActionData<ActionData>();
 
+  console.log(loaderData);
+
   const { userInfo } = useOutletContext<ContextData>();
 
   return (