From 7c9d4f4a27bba8ba436505e282ca744af86b7c8a Mon Sep 17 00:00:00 2001 From: jordan Date: Wed, 29 May 2024 00:34:07 -0700 Subject: [PATCH 01/26] display portfolio review with textbox in ship dash --- .../dashboard/ship/PortfolioReport.tsx | 227 ++++++++++++++++++ src/pages/ShipOpDashboard.tsx | 12 +- src/types/common.ts | 5 + 3 files changed, 239 insertions(+), 5 deletions(-) create mode 100644 src/components/dashboard/ship/PortfolioReport.tsx diff --git a/src/components/dashboard/ship/PortfolioReport.tsx b/src/components/dashboard/ship/PortfolioReport.tsx new file mode 100644 index 00000000..23c94ef9 --- /dev/null +++ b/src/components/dashboard/ship/PortfolioReport.tsx @@ -0,0 +1,227 @@ +import { + Accordion, + Avatar, + Blockquote, + Box, + Group, + Skeleton, + Stack, + Text, + Textarea, + useMantineTheme, +} from '@mantine/core'; +import { useQuery } from '@tanstack/react-query'; +import { Link } from 'react-router-dom'; +import { getShipGrants } from '../../../queries/getShipGrants'; +import { formatEther } from 'viem'; +import { GAME_TOKEN } from '../../../constants/gameSetup'; +import { IconExclamationCircle, IconExternalLink } from '@tabler/icons-react'; +import { SCAN_URL } from '../../../constants/enpoints'; +import { AppAlert } from '../../UnderContruction'; +import { DashGrant } from '../../../resolvers/grantResolvers'; +import { AlloStatus, ReportStatus } from '../../../types/common'; +import { FacilitatorBadge, ShipBadge } from '../../RoleBadges'; + +export const PortfolioReport = ({ + shipId, + reportStatus, +}: { + shipId: string; + reportStatus: ReportStatus; +}) => { + const theme = useMantineTheme(); + + const { + data: grants, + error, + isLoading, + } = useQuery({ + queryKey: [`portfolio-${shipId}`], + queryFn: () => getShipGrants(shipId as string), + enabled: !!shipId, + }); + + if (isLoading) + return ( + + + + + 2{' '} + + ); + 2; + if (error || !grants) + return ( + } + description={error?.message || 'Grant Data failed to load'} + bg={theme.colors.pink[8]} + /> + ); + + if (grants.length === 0) + return ( + + ); + + return ( + + + {grants.map((grant) => ( + + } + > + {grant.projectId.name} ( + {formatEther(grant.applicationData.grantAmount)}{' '} + {GAME_TOKEN.SYMBOL}) + + + + + + ))} + + + ); +}; + +const PortfolioItem = ({ + grant, + reportStatus, +}: { + grant: DashGrant; + reportStatus: ReportStatus; +}) => { + const theme = useMantineTheme(); + const completedMilestones = grant.milestones + ? grant.milestones.filter( + (ms) => ms.milestoneStatus === AlloStatus.Accepted + ).length + : []; + + const status = + completedMilestones === grant.milestones?.length ? 'Completed' : 'Active'; + + return ( + + + + Link To Project:{' '} + + + {grant.projectId.name} + + + + + Status:{' '} + + {status} + + + + Receiving Address:{' '} + + + + {grant.applicationData.receivingAddress}{' '} + + + + + + Project Description + + + {grant.projectMetadata.description} + + + Grant Details + +
    + +
  • + + Amount:{' '} + + {formatEther(grant.applicationData.grantAmount)} {GAME_TOKEN.SYMBOL} +
  • +
    + +
  • + + Milestones:{' '} + + {completedMilestones}/{grant.milestones?.length} milestones + completed +
  • +
    + +
  • + + Reason for funding:{' '} + +
    } + iconSize={16} + > + {grant.shipApprovalReason} +
    +
  • +
    + +
  • + + Facilitator Approval Reason:{' '} + +
    } + iconSize={18} + > + {grant.facilitatorReason} +
    +
  • +
    + {reportStatus === ReportStatus.Review && ( +