Merge pull request #290 from DAOmasons/fixDash

Fix dash

src/.graphclient/index.ts

@@ -10310,6 +10310,7 @@ export type getShipFundsAvailableQuery = { GrantShip: Array<Pick<GrantShip, 'tot
 
 export type getShipIdByHatIdQueryVariables = Exact<{
   hatId: Scalars['String'];
+  gameId: Scalars['String'];
 }>;
 
 
@@ -10956,8 +10957,8 @@ export const getShipFundsAvailableDocument = gql`
 }
     ` as unknown as DocumentNode<getShipFundsAvailableQuery, getShipFundsAvailableQueryVariables>;
 export const getShipIdByHatIdDocument = gql`
-    query getShipIdByHatId($hatId: String!) {
-  GrantShip(where: {hatId: {_eq: $hatId}}) {
+    query getShipIdByHatId($hatId: String!, $gameId: String!) {
+  GrantShip(where: {hatId: {_eq: $hatId}, gameManager_id: {_eq: $gameId}}) {
     id
   }
 }

src/components/grant/GrantCard.tsx

@@ -1,27 +1,47 @@
 import {
   Avatar,
+  Box,
   Group,
   Paper,
   Text,
   Tooltip,
   useMantineTheme,
 } from '@mantine/core';
 import { GrantStatus } from '../../types/common';
-import { IconCheck } from '@tabler/icons-react';
+import {
+  IconCheck,
+  IconChecks,
+  IconFileCheck,
+  IconFileDescription,
+  IconFilePlus,
+  IconFileX,
+  IconPennant,
+  IconPennantOff,
+  IconRoute,
+  IconRouteX,
+  IconShieldX,
+} from '@tabler/icons-react';
 import { Link } from 'react-router-dom';
+import { ReactNode } from 'react';
 
 export const GrantCard = ({
   avatarUrls,
   label,
   isActive,
   linkUrl,
   status,
+  hasPending,
+  hasRejected,
+  allCompleted,
 }: {
   linkUrl: string;
   isActive: boolean;
   avatarUrls: string[];
   label: string;
   status: GrantStatus;
+  hasPending: boolean;
+  hasRejected: boolean;
+  allCompleted: boolean;
 }) => {
   const theme = useMantineTheme();
 
@@ -33,22 +53,159 @@ export const GrantCard = ({
       component={Link}
       to={linkUrl}
     >
-      <Group gap={8}>
-        <Avatar.Group>
-          {avatarUrls.map((url) => (
-            <Avatar size={32} src={url} key={url} />
-          ))}
-        </Avatar.Group>
-        <Text fz="sm" fw={500}>
-          {label}
-        </Text>
-        <Tooltip label={isActive ? 'Active' : 'Inactive'}>
-          <IconCheck
-            size={16}
-            color={isActive ? theme.colors.blue[6] : theme.colors.dark[5]}
-          />
-        </Tooltip>
+      <Group justify="space-between">
+        <Group gap={8}>
+          <Avatar.Group>
+            {avatarUrls.map((url) => (
+              <Avatar size={32} src={url} key={url} />
+            ))}
+          </Avatar.Group>
+          <Text fz="sm" fw={500}>
+            {label}
+          </Text>
+          <Tooltip label={isActive ? 'Active' : 'Inactive'}>
+            <IconCheck
+              size={16}
+              color={isActive ? theme.colors.blue[6] : theme.colors.dark[5]}
+            />
+          </Tooltip>
+        </Group>
+        <GrantStatusIndicator
+          hasPending={hasPending}
+          hasRejected={hasRejected}
+          allCompleted={allCompleted}
+          status={status}
+        />
       </Group>
     </Paper>
   );
 };
+
+const GrantStatusIndicator = ({
+  status,
+  hasPending,
+  hasRejected,
+  allCompleted,
+}: {
+  status: GrantStatus;
+  hasPending: boolean;
+  hasRejected: boolean;
+  allCompleted: boolean;
+}) => {
+  const theme = useMantineTheme();
+
+  if (status === GrantStatus.ProjectInitiated)
+    return (
+      <StatusIndicator text="Grant Started" icon={<IconFilePlus size={16} />} />
+    );
+  if (status === GrantStatus.ShipInitiated) {
+    return (
+      <StatusIndicator text="Grant Started" icon={<IconFilePlus size={16} />} />
+    );
+  }
+  if (status === GrantStatus.ApplicationSubmitted) {
+    return (
+      <StatusIndicator
+        text="Application Started"
+        icon={<IconFileDescription size={16} />}
+      />
+    );
+  }
+  if (status === GrantStatus.ApplicationRejected) {
+    return (
+      <StatusIndicator
+        text="Application Not Approved"
+        icon={<IconFileX size={16} />}
+      />
+    );
+  }
+  if (status === GrantStatus.ApplicationApproved) {
+    return (
+      <StatusIndicator
+        text="Application Not Approved"
+        icon={<IconFileCheck size={16} />}
+      />
+    );
+  }
+  if (status === GrantStatus.MilestonesSubmitted) {
+    return (
+      <StatusIndicator
+        text="Milestones Submitted"
+        icon={<IconRoute size={16} />}
+      />
+    );
+  }
+  if (status === GrantStatus.MilestonesRejected) {
+    return (
+      <StatusIndicator
+        text="Milestones Not Approved"
+        icon={<IconRouteX size={16} />}
+      />
+    );
+  }
+
+  if (status === GrantStatus.MilestonesApproved) {
+    return (
+      <StatusIndicator
+        text="Milestones Approved"
+        icon={<IconRoute size={16} />}
+      />
+    );
+  }
+  if (status === GrantStatus.FacilitatorRejected) {
+    return (
+      <StatusIndicator
+        text="Facilitator Rejected"
+        icon={<IconShieldX size={16} />}
+      />
+    );
+  }
+
+  if (status === GrantStatus.Allocated) {
+    if (hasPending) {
+      return (
+        <StatusIndicator
+          text="Milestone Submitted"
+          icon={<IconPennant size={16} />}
+        />
+      );
+    }
+    if (hasRejected) {
+      return (
+        <StatusIndicator
+          text="Milestone Submitted"
+          icon={<IconPennantOff size={16} />}
+        />
+      );
+    }
+
+    // state to tell project that the milestone has been approved
+    return (
+      <StatusIndicator text="Allocated" icon={<IconPennant size={16} />} />
+    );
+  }
+
+  if (status === GrantStatus.AllMilestonesComplete) {
+    return (
+      <StatusIndicator
+        text="Milestones Complete"
+        icon={<IconCheck size={16} />}
+      />
+    );
+  }
+
+  if (status === GrantStatus.Completed) {
+    return (
+      <StatusIndicator text="Grant Complete" icon={<IconChecks size={16} />} />
+    );
+  }
+};
+
+const StatusIndicator = ({ text, icon }: { text: string; icon: ReactNode }) => {
+  return (
+    <Group gap={8}>
+      <Text fz="xs">{text}</Text>
+      <span style={{ transform: 'translateY(2px)' }}>{icon}</span>
+    </Group>
+  );
+};

src/components/grant/MilestonesDrawer.tsx

@@ -7,7 +7,6 @@ import {
   NumberInput,
   Stack,
   Text,
-  TextInput,
   Textarea,
   useMantineTheme,
 } from '@mantine/core';

src/graphql/newQueries/getShipByHatId.graphql

@@ -1,5 +1,7 @@
-query getShipIdByHatId($hatId: String!) {
-  GrantShip(where: { hatId: { _eq: $hatId } }) {
+query getShipIdByHatId($hatId: String!, $gameId: String!) {
+  GrantShip(
+    where: { hatId: { _eq: $hatId }, gameManager_id: { _eq: $gameId } }
+  ) {
     id
   }
 }

src/pages/Grant.tsx

@@ -1,13 +1,5 @@
 import { MainSection, PageTitle } from '../layout/Sections';
-import {
-  Button,
-  Center,
-  Flex,
-  SegmentedControl,
-  Stack,
-  Text,
-  useMantineTheme,
-} from '@mantine/core';
+import { Center, Flex, SegmentedControl, useMantineTheme } from '@mantine/core';
 import { useBreakpoints } from '../hooks/useBreakpoint';
 import {
   Route,
@@ -19,26 +11,13 @@ import {
 import {
   IconFileDescription,
   IconGitCommit,
-  IconPencil,
   IconPennant,
-  IconPlus,
-  IconRoute,
 } from '@tabler/icons-react';
-import { Player } from '../types/ui';
 import { TopSection } from '../components/grant/TopSection';
 import { GrantContextProvider } from '../contexts/GrantContext';
 import { useGrant } from '../hooks/useGrant';
 import { GrantTimeline } from '../components/grant/GrantTimeline';
-import { PostGrantDrawer } from '../components/grant/PostGrantDrawer';
-import { useDisclosure } from '@mantine/hooks';
-import { ApplicationDrawer } from '../components/grant/ApplicationDrawer';
-import { GameStatus, GrantStatus } from '../types/common';
-import { MilestonesDrawer } from '../components/grant/MilestonesDrawer';
 import { useUserData } from '../hooks/useUserState';
-import { FacilitatorApprovalDrawer } from '../components/grant/FacilitatorApprovalDrawer';
-import { PageDrawer } from '../components/PageDrawer';
-import { SubmitMilestoneDrawer } from '../components/grant/SubmitMilestoneDrawer';
-import { formatEther, parseEther, weiUnits } from 'viem';
 import { ProjectActions } from '../components/grant/ProjectActions';
 import { FacilitatorActions } from '../components/grant/FacilitatorActions';
 import { ShipActions } from '../components/grant/ShipActions';

src/pages/Project.tsx

@@ -381,6 +381,9 @@ export const Project = () => {
                   label={`Grant with ${grant.ship.name}`}
                   isActive={grant.status >= GrantStatus.Allocated}
                   status={grant.status}
+                  hasPending={grant.hasPendingMilestones}
+                  hasRejected={grant.hasRejectedMilestones}
+                  allCompleted={grant.allMilestonesApproved}
                 />
               ))}
             </Stack>

src/pages/Ship.tsx

@@ -293,6 +293,9 @@ export const Ship = () => {
             <Stack>
               {grants?.map((grant) => (
                 <GrantCard
+                  hasPending={grant.hasPendingMilestones}
+                  hasRejected={grant.hasRejectedMilestones}
+                  allCompleted={grant.allMilestonesApproved}
                   key={grant.id}
                   avatarUrls={[grant.project?.metadata?.imgUrl || '']}
                   label={`${grant.project.name}`}

src/queries/getUserData.ts

@@ -6,7 +6,7 @@ import {
   getBuiltGraphSDK,
 } from '../.graphclient';
 import HatsAbi from '../abi/Hats.json';
-import { HATS } from '../constants/gameSetup';
+import { GAME_MANAGER, HATS } from '../constants/gameSetup';
 import { publicClient } from '../utils/config';
 import { getIpfsJson } from '../utils/ipfs/get';
 import { ShipProfileMetadata } from '../utils/ipfs/metadataValidation';
@@ -70,6 +70,7 @@ const checkIsShipOperator = async (address: string) => {
       const { getShipIdByHatId } = getBuiltGraphSDK({});
       const result = await getShipIdByHatId({
         hatId: isOperator.hatId.toString(),
+        gameId: GAME_MANAGER.ADDRESS,
       });
 
       const shipAddress = result?.GrantShip?.[0]?.id;