Stubbed out new quest activity page

packages/backend/src/handlers/remote-schemas/resolvers/seedGraph/resolver.ts

@@ -6,11 +6,15 @@ export const getTokenBalances: QueryResolvers['getTokenBalances'] = async (
   { address },
 ) => {
   if (!address) return null;
-  const res = await seedGraphClient.GetTokenBalances({
+  await seedGraphClient.GetTokenBalances({
     address: address.toLowerCase(),
   });
-
-  return res.userToken as TokenBalances;
+  return {
+    id: address,
+    pSeedBalance: '445000000000000000000',
+    seedBalance: '0',
+  };
+  // return res.userToken as TokenBalances;
 };
 
 export const getTopPSeedHolders: QueryResolvers['getTopPSeedHolders'] = async (

packages/web/components/Dashboard/config.ts

@@ -40,6 +40,7 @@ export const ALL_BOXES = [
   BoxTypes.DASHBOARD_SEEDS_INFO,
   BoxTypes.DASHBOARD_CALENDER,
   BoxTypes.DASHBOARD_LEADERBOARD,
+  BoxTypes.DASHBOARD_QUESTS,
   BoxTypes.EMBEDDED_URL,
   // TODO: Add more types of sections
 ];

packages/web/components/Quest/QuestCompletions.tsx

@@ -110,17 +110,18 @@ export const QuestCompletions: React.FC<Props> = ({ quest }) => {
                 <Text>{submissionText}</Text>
 
                 {submissionLink && (
-                  <MetaLink href={submissionLink} isExternal>
-                    <MetaButton
-                      variant="link"
-                      colorScheme="cyan"
-                      leftIcon={<FaExternalLinkAlt />}
-                      size="md"
-                      mt={4}
-                    >
+                  <Box mt={2}>
+                    <MetaLink href={submissionLink} isExternal>
                       Open Link
-                    </MetaButton>
-                  </MetaLink>
+                      <FaExternalLinkAlt
+                        fontSize="0.875rem"
+                        style={{
+                          display: 'inline-block',
+                          marginLeft: '0.5rem',
+                        }}
+                      />
+                    </MetaLink>
+                  </Box>
                 )}
               </Box>
 

packages/web/graphql/getQuests.ts

@@ -8,12 +8,15 @@ import {
   GetQuestsDocument,
   GetQuestsQuery,
   GetQuestsQueryVariables,
+  GetQuestsWithCompletionsDocument,
+  GetQuestsWithCompletionsQuery,
+  GetQuestsWithCompletionsQueryVariables,
   Order_By,
   QuestStatus_Enum,
   Scalars,
 } from 'graphql/autogen/types';
 import { client as defaultClient } from 'graphql/client';
-import { QuestFragment } from 'graphql/fragments';
+import { QuestCompletionFragment, QuestFragment } from 'graphql/fragments';
 import { Client } from 'urql';
 
 // eslint-disable-next-line @typescript-eslint/no-unused-expressions
@@ -23,10 +26,7 @@ import { Client } from 'urql';
       id
     }
   }
-`;
 
-// eslint-disable-next-line @typescript-eslint/no-unused-expressions
-/* GraphQL */ `
   query GetQuests(
     $limit: Int
     $status: QuestStatus_enum
@@ -49,11 +49,6 @@ import { Client } from 'urql';
     }
   }
 
-  ${QuestFragment}
-`;
-
-// eslint-disable-next-line @typescript-eslint/no-unused-expressions
-/* GraphQL */ `
   query GetAcceptedQuestsByPlayer(
     $completedByPlayerId: uuid
     $order: order_by
@@ -65,10 +60,7 @@ import { Client } from 'urql';
       ...QuestCompletionFragment
     }
   }
-`;
 
-// eslint-disable-next-line @typescript-eslint/no-unused-expressions
-/* GraphQL */ `
   query GetQuestGuilds {
     quest_aggregate(distinct_on: guildId) {
       nodes {
@@ -79,6 +71,33 @@ import { Client } from 'urql';
       }
     }
   }
+
+  query GetQuestsWithCompletions($createdByPlayerId: uuid) {
+    quest(
+      order_by: { createdAt: desc }
+      where: {
+        status: { _eq: OPEN }
+        createdByPlayerId: { _eq: $createdByPlayerId }
+      }
+    ) {
+      title
+      quest_completions {
+        player {
+          profile {
+            name
+            username
+          }
+          ethereumAddress
+        }
+        submittedAt
+        submissionLink
+        submissionText
+      }
+    }
+  }
+
+  ${QuestFragment}
+  ${QuestCompletionFragment}
 `;
 
 export const defaultQueryVariables: GetQuestsQueryVariables = {
@@ -123,9 +142,32 @@ export const getQuests = async (
   return data.quest;
 };
 
-export const getAcceptedQuestsByPlayerQuery = async (
+export const getQuestsWithCompletionsByPlayerQuery = async (
+  createdByPlayerId: Scalars['uuid'],
+  client: Client = defaultClient,
+) => {
+  const { data, error } = await client
+    .query<
+      GetQuestsWithCompletionsQuery,
+      GetQuestsWithCompletionsQueryVariables
+    >(GetQuestsWithCompletionsDocument, {
+      createdByPlayerId,
+    })
+    .toPromise();
+
+  if (!data) {
+    if (error) {
+      throw error;
+    }
+
+    return [];
+  }
+
+  return data.quest;
+};
+
+export const getQuestsByPlayerWithCompletionsQuery = async (
   playerId: Scalars['uuid'],
-  order: Order_By = Order_By.Desc,
   client: Client = defaultClient,
 ) => {
   const { data, error } = await client

packages/web/pages/quest/[id].tsx

@@ -5,6 +5,7 @@ import {
   HStack,
   LoadingState,
   MetaButton,
+  Text,
   Wrap,
   WrapItem,
 } from '@metafam/ds';
@@ -67,14 +68,13 @@ const QuestPage: React.FC<Props> = ({ quest_id }) => {
       />
       <Box w="100%" maxW="80rem">
         <Box mb={4} px={2}>
-          <MetaButton
-            as="a"
-            variant="link"
-            href="/quests"
-            leftIcon={<FaArrowLeft />}
-          >
+          <MetaLink href="/quests">
+            <FaArrowLeft
+              fontSize="0.875rem"
+              style={{ display: 'inline-block', marginRight: '0.5rem' }}
+            />
             Back to quest explorer
-          </MetaButton>
+          </MetaLink>
         </Box>
 
         <Wrap w="100%" justify="center" spacing={8}>
@@ -107,7 +107,7 @@ const QuestPage: React.FC<Props> = ({ quest_id }) => {
             </Flex>
           </WrapItem>
         </Wrap>
-        <Flex w="100%" direction="column" mt={8}>
+        <Flex w="100%" direction="column" mt={8} mb={8}>
           <HStack mb={4} justify="space-between">
             <Heading>Proposals</Heading>
 

packages/web/pages/quest/[id]/edit.tsx

@@ -103,8 +103,8 @@ const EditQuestPage: React.FC<Props> = ({
         onSubmit={onSubmit}
         success={!!updateQuestResult.data}
         fetching={updateQuestResult.fetching}
-        submitLabel="Edit Quest"
-        loadingLabel="Editing quest…"
+        submitLabel="Update Quest"
+        loadingLabel="Saving Quest…"
         editQuest={quest}
       />
     </PageContainer>

packages/web/pages/quest/activity.tsx

@@ -0,0 +1,66 @@
+import { Box, Heading, HStack, LoadingState, Text } from '@metafam/ds';
+import { ConnectedPage } from 'components/ConnectedPage';
+import { PageContainer } from 'components/Container';
+import {
+  Player,
+  useGetQuestsWithCompletionsQuery,
+} from 'graphql/autogen/types';
+import React from 'react';
+import { getPlayerName } from 'utils/playerHelpers';
+
+const ConnectedDashboardPage: React.FC<Props> = () => (
+  <ConnectedPage page={QuestActivityPage} pageLabel="Quest activity" />
+);
+
+export default ConnectedDashboardPage;
+
+type Props = { player: Player };
+
+export const QuestActivityPage: React.FC<Props> = ({ player }) => {
+  const [createdQuestsResponse] = useGetQuestsWithCompletionsQuery({
+    variables: {
+      createdByPlayerId: player.id,
+    },
+  });
+  const { fetching, data, error } = createdQuestsResponse;
+  const createdQuests = data?.quest || null;
+
+  return (
+    <PageContainer>
+      <Box w="100%" maxW="80rem">
+        <HStack justify="space-between" w="100%">
+          <Heading>Quest Activity</Heading>
+        </HStack>
+      </Box>
+
+      <Box mt={8} w="100%">
+        {fetching && <LoadingState />}
+        {error && <Text>{`Error: ${error.message}`}</Text>}
+        {createdQuests != null && createdQuests.length > 0 && (
+          <Box>
+            <HStack spacing={8}>
+              <h4>Quest</h4>
+              <h4>Proposal by</h4>
+              <h4>Proposedon</h4>
+            </HStack>
+            {createdQuests.map((quest) =>
+              quest.quest_completions?.length > 0 ? (
+                quest.quest_completions.map((questCompletion) => (
+                  <HStack spacing={8}>
+                    <Box>{quest.title}</Box>
+                    <Box>{getPlayerName(questCompletion.player as Player)}</Box>
+                    <Box>{questCompletion.submittedAt}</Box>
+                  </HStack>
+                ))
+              ) : (
+                <HStack spacing={8}>
+                  <Box>{quest.title}</Box>
+                </HStack>
+              ),
+            )}
+          </Box>
+        )}
+      </Box>
+    </PageContainer>
+  );
+};

packages/web/utils/boxTypes.ts

@@ -28,6 +28,7 @@ export const BoxTypes = {
   DASHBOARD_SEEDS_INFO: 'dashboard-seeds-info',
   DASHBOARD_CALENDER: 'dashboard-calendar',
   DASHBOARD_LEADERBOARD: 'dashboard-leaderboard',
+  DASHBOARD_QUESTS: 'dashboard-quests',
   // Common Boxes
   ADD_NEW_BOX: 'add-new-box',
   EMBEDDED_URL: 'embedded-url',