From 7f99d55a0f8a03b81c3fc5da9f0145eb52a5d43b Mon Sep 17 00:00:00 2001
From: Corantin <corantin.noll@gmail.com>
Date: Tue, 22 Aug 2023 22:40:49 -0400
Subject: [PATCH 1/2] Sync

---
 .../react-app/src/components/address-list.tsx | 26 ++++++++++++-------
 .../components/modals/create-quest-modal.tsx  | 20 +++++++++++++-
 packages/react-app/src/components/quest.tsx   | 14 +---------
 .../react-app/src/models/transaction.model.ts |  1 +
 .../react-app/src/queries/quests.query.ts     |  1 +
 .../react-app/src/services/quest.service.ts   |  2 +-
 6 files changed, 39 insertions(+), 25 deletions(-)

diff --git a/packages/react-app/src/components/address-list.tsx b/packages/react-app/src/components/address-list.tsx
index 1fcbb97d..deda6d8f 100644
--- a/packages/react-app/src/components/address-list.tsx
+++ b/packages/react-app/src/components/address-list.tsx
@@ -5,8 +5,10 @@ import { noop } from 'lodash-es';
 import { QuestModel } from 'src/models/quest.model';
 import React, { BaseSyntheticEvent } from 'react';
 import { AddressFieldInput } from './field-input/address-field-input';
+import { FieldInput } from './field-input/field-input';
 
-const PlayerWrapperStyled = styled.div`
+const AddressListWrapperStyled = styled.div`
+  width: 100%;
   display: flex;
   flex-direction: row;
   align-items: flex-end;
@@ -49,7 +51,6 @@ export default function AddressListFieldInput({
   formikValues,
   setValuesFormik,
 }: Props) {
-  // const [addressList, setAddressList] = useState<string[]>(values);
   const addPlayerToWhitelist = () => {
     values!.push('');
     setValuesFormik?.(formikValues);
@@ -60,25 +61,30 @@ export default function AddressListFieldInput({
   };
 
   return (
-    <>
+    <FieldInput
+      id="players"
+      label="Players"
+      error={touched && error}
+      direction="column"
+      align="flex-start"
+      wide
+    >
       {formikValues ? (
         <>
           {values.map((player, i) => (
-            <PlayerWrapperStyled>
+            <AddressListWrapperStyled>
               <AddressFieldInput
                 id={`${id}[${i}]`}
-                label={`${label} #${i + 1}`}
                 isEdit={isEdit}
                 value={player}
                 onChange={onChange}
                 onBlur={onBlur}
                 wide
-                error={touched && error && touched[i] && error[i]}
               />
               {isEdit && (
                 <Button icon={<IconCross />} onClick={() => removePlayerFromWhitelist(i)} />
               )}
-            </PlayerWrapperStyled>
+            </AddressListWrapperStyled>
           ))}
 
           {isEdit && (
@@ -90,7 +96,7 @@ export default function AddressListFieldInput({
       ) : (
         <>
           {values.map((player, i) => (
-            <PlayerWrapperStyled>
+            <AddressListWrapperStyled>
               <AddressFieldInput
                 id={`${id}[${i}]`}
                 label={`${label} #${i + 1}`}
@@ -102,7 +108,7 @@ export default function AddressListFieldInput({
               {isEdit && (
                 <Button icon={<IconCross />} onClick={() => removePlayerFromWhitelist(i)} />
               )}
-            </PlayerWrapperStyled>
+            </AddressListWrapperStyled>
           ))}
 
           {isEdit && (
@@ -112,6 +118,6 @@ export default function AddressListFieldInput({
           )}
         </>
       )}
-    </>
+    </FieldInput>
   );
 }
diff --git a/packages/react-app/src/components/modals/create-quest-modal.tsx b/packages/react-app/src/components/modals/create-quest-modal.tsx
index 51f1511d..6688d19e 100644
--- a/packages/react-app/src/components/modals/create-quest-modal.tsx
+++ b/packages/react-app/src/components/modals/create-quest-modal.tsx
@@ -198,6 +198,17 @@ export default function QuestModal({
 
     if (data.expireTime.getTime() < Date.now())
       errors.expireTime = 'Expiration have to be later than now';
+
+    if (data.isWhitelist && data.players?.length) {
+      data.players.forEach((player) => {
+        try {
+          toChecksumAddress(player);
+        } catch (error) {
+          errors.players = 'One of the player address is not valid';
+        }
+      });
+    }
+
     debounceSave(data);
 
     setIsFormValid(Object.keys(errors).length === 0);
@@ -282,7 +293,7 @@ export default function QuestModal({
         if (values.isWhitelist && values.players?.length) {
           let whitelistTxPayload: TransactionModel = {
             modalId,
-            message: `Setting whitelisted players...`,
+            message: `Setting quest players (${totalTransactionSteps}/${totalTransactionSteps})`,
             status: TransactionStatus.WaitingForSignature,
             type: TransactionType.QuestSetWhitelist,
           };
@@ -299,6 +310,13 @@ export default function QuestModal({
               });
             },
           );
+          setTransaction({
+            ...txPayload,
+            status: txReceiptSaveQuest?.status
+              ? TransactionStatus.Confirmed
+              : TransactionStatus.Failed,
+            args: { questAddress: newQuestAddress, players: values.players },
+          });
         }
       } catch (e: any) {
         setTransaction(
diff --git a/packages/react-app/src/components/quest.tsx b/packages/react-app/src/components/quest.tsx
index cf2a0f9b..5f0cd6ee 100644
--- a/packages/react-app/src/components/quest.tsx
+++ b/packages/react-app/src/components/quest.tsx
@@ -74,10 +74,6 @@ const PlayersWrapperStyled = styled.div`
   align-items: center;
 `;
 
-const PlayersModalWrapperStyled = styled.div`
-  /* margin-left: ${GUpx(3)}; */
-`;
-
 const QuestFooterStyled = styled.div`
   width: 100%;
   text-align: right;
@@ -255,7 +251,7 @@ export default function Quest({
         if (!depositReleased && questData.createDeposit) {
           depositLocked.push(questData.createDeposit);
         }
-        if (players.length && questData.playDeposit) {
+        if (players.length && questData.playDeposit && !questData.isWhitelist) {
           // Multiply by the number of players (each one has a deposit locked)
           questData.playDeposit.amount = questData.playDeposit.amount.mul(players.length);
           depositLocked.push(questData.playDeposit);
@@ -363,14 +359,6 @@ export default function Quest({
                   isLoading={isLoading || !questData}
                   value={`${players.length} / ${questData.unlimited ? '∞' : questData.maxPlayers}`}
                 />
-                {/* {players.length > 0 && !isSummary && (
-                  <PlayersModalWrapperStyled>
-                    <PlayerListModal
-                      playerList={players}
-                      isEdit={walletAddress === questData.creatorAddress}
-                    />
-                  </PlayersModalWrapperStyled>
-                )} */}
               </PlayersWrapperStyled>
             )}
             <DateFieldInput
diff --git a/packages/react-app/src/models/transaction.model.ts b/packages/react-app/src/models/transaction.model.ts
index abd3b7cf..fe85a406 100644
--- a/packages/react-app/src/models/transaction.model.ts
+++ b/packages/react-app/src/models/transaction.model.ts
@@ -11,6 +11,7 @@ export type TransactionModel = {
     containerId?: string;
     disputeState?: number;
     player?: string;
+    players?: string;
   };
   type: TransactionType;
 };
diff --git a/packages/react-app/src/queries/quests.query.ts b/packages/react-app/src/queries/quests.query.ts
index 122570dc..3eed3d53 100644
--- a/packages/react-app/src/queries/quests.query.ts
+++ b/packages/react-app/src/queries/quests.query.ts
@@ -29,6 +29,7 @@ const QuestEntityQuery = gql`
       questFundsRecoveryAddress
       questMaxPlayers
       questPlayers
+      questIsWhiteListed
     }
   }
 `;
diff --git a/packages/react-app/src/services/quest.service.ts b/packages/react-app/src/services/quest.service.ts
index 7f7f3b7c..16df998d 100644
--- a/packages/react-app/src/services/quest.service.ts
+++ b/packages/react-app/src/services/quest.service.ts
@@ -96,7 +96,7 @@ async function mapQuest(questEntity: any, claimCountMap: Map<string, number>) {
       activeClaimCount: claimCountMap.get(questAddress) ?? 0,
       maxPlayers: questEntity.questMaxPlayers ? +questEntity.questMaxPlayers : undefined, // If null put undefined
       unlimited: questEntity.questMaxPlayers ? +questEntity.questMaxPlayers === 0 : undefined,
-      isWhitelist: questEntity.isWhitelist,
+      isWhitelist: questEntity.questIsWhiteListed,
       status: QuestStatus.Active,
       players: questEntity.questPlayers ?? [],
       governAddress: toChecksumAddress(questEntity.questGovernAddress),

From 880b68e247501fa472cfb6fc2c39050d97b81fb8 Mon Sep 17 00:00:00 2001
From: Corantin <corantin.noll@gmail.com>
Date: Tue, 22 Aug 2023 22:44:14 -0400
Subject: [PATCH 2/2] sync

---
 .../react-app/src/components/modals/player-list-modal.tsx  | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/react-app/src/components/modals/player-list-modal.tsx b/packages/react-app/src/components/modals/player-list-modal.tsx
index 0313de66..2e92c3ce 100644
--- a/packages/react-app/src/components/modals/player-list-modal.tsx
+++ b/packages/react-app/src/components/modals/player-list-modal.tsx
@@ -109,6 +109,7 @@ export default function PlayerListModal({
           status: TransactionStatus.Pending,
         });
       });
+      onSubmit();
     }
   };
 
@@ -122,7 +123,11 @@ export default function PlayerListModal({
             <OpenButtonStyled
               onClick={() => setOpened(true)}
               icon={<IconGroup />}
-              label="View Player List"
+              label={
+                walletAddress === questData.creatorAddress && questData.isWhitelist
+                  ? 'Edit Player List'
+                  : 'View Player List'
+              }
               mode="strong"
               title="Player List"
             />