feat: add project partners (#2301)

regen-network · Mar 2, 2024 · 45abc16 · 45abc16
1 parent f8ac8f4
commit 45abc16
Show file tree

Hide file tree

Showing 9 changed files with 19,511 additions and 10,486 deletions.
diff --git a/web-marketplace/graphql.schema.json b/web-marketplace/graphql.schema.json
diff --git a/web-marketplace/src/components/organisms/Stakeholders/Stakeholders.tsx b/web-marketplace/src/components/organisms/Stakeholders/Stakeholders.tsx
@@ -13,17 +13,16 @@ export type Stakeholder = {
 
 type Props = {
   stakeholders: Stakeholder[];
-  minSm: number;
 };
 
-export const Stakeholders = ({ stakeholders, minSm }: Props) => {
+export const Stakeholders = ({ stakeholders }: Props) => {
   const filtered = stakeholders.filter(u =>
     Array.isArray(u.accounts) ? u.accounts.length > 0 : Boolean(u.accounts),
   );
-  const sm = Math.min(12 / filtered.length, minSm);
+  const sm = filtered.length === 4 ? 3 : 4;
 
   return (
-    <Grid container columnSpacing={{ xs: 0, sm: 5 }}>
+    <Grid container columnSpacing={{ xs: 0, sm: 5 }} rowSpacing={{ sm: 10.75 }}>
       {filtered.map(({ accounts, title, tooltip }, i) => {
         const sx =
           i !== filtered.length - 1 ? { mb: { xs: 8.25, sm: 0 } } : undefined;
@@ -36,7 +35,7 @@ export const Stakeholders = ({ stakeholders, minSm }: Props) => {
                   title={title}
                   tooltip={tooltip}
                   fontFamily={defaultFontFamily}
-                  sx={{ mb: 7.5 }}
+                  sx={{ mb: accounts.length > 1 ? { xs: 5, sm: 7.5 } : 7.5 }}
                 />
                 {accounts.length > 1 && (
                   <CollapseList
@@ -46,7 +45,7 @@ export const Stakeholders = ({ stakeholders, minSm }: Props) => {
                         user={account}
                         key={account?.name}
                         fontFamily={defaultFontFamily}
-                        sx={{ mb: 7.5 }}
+                        sx={{ mb: { xs: 5, sm: 7.5 } }}
                       />
                     ))}
                   />

diff --git a/web-marketplace/src/components/templates/ProjectDetails/ProjectDetails.Stakeholders.tsx b/web-marketplace/src/components/templates/ProjectDetails/ProjectDetails.Stakeholders.tsx
@@ -7,13 +7,15 @@ type Props = {
   projectDeveloper?: Account;
   projectVerifier?: Account;
   program?: Account;
+  partners?: Account[];
 };
 
 export const ProjectDetailsStakeholders: React.FC<Props> = ({
   program,
   admin,
   projectDeveloper,
   projectVerifier,
+  partners,
 }) => {
   const stakeholders = [
     {
@@ -59,7 +61,17 @@ export const ProjectDetailsStakeholders: React.FC<Props> = ({
         </>
       ),
     },
+    {
+      accounts: partners,
+      title: 'partners',
+      tooltip: (
+        <>
+          <b>Partners</b> can offer crucial financial support or monitor
+          progress and ensure environmental standards are met.
+        </>
+      ),
+    },
   ];
 
-  return <Stakeholders stakeholders={stakeholders} minSm={4} />;
+  return <Stakeholders stakeholders={stakeholders} />;
 };
diff --git a/web-marketplace/src/components/templates/ProjectDetails/ProjectDetails.tsx b/web-marketplace/src/components/templates/ProjectDetails/ProjectDetails.tsx
@@ -259,14 +259,13 @@ function ProjectDetails(): JSX.Element {
     ? anchoredMetadata
     : offChainProjectMetadata;
 
-  const { projectDeveloper, projectVerifier, program, admin } = useStakeholders(
-    {
+  const { projectDeveloper, projectVerifier, program, admin, partners } =
+    useStakeholders({
       anchoredMetadata,
       offChainProject,
       onChainProject,
       creditClassMetadata,
-    },
-  );
+    });
   const { geojson, isGISFile } = useGeojson({
     projectMetadata,
     projectPageMetadata: offChainProjectMetadata,
@@ -467,6 +466,7 @@ function ProjectDetails(): JSX.Element {
           projectVerifier={projectVerifier}
           program={program}
           admin={admin}
+          partners={partners}
         />
       </DetailsSection>
 

diff --git a/web-marketplace/src/components/templates/ProjectDetails/ProjectDetails.utils.tsx b/web-marketplace/src/components/templates/ProjectDetails/ProjectDetails.utils.tsx
@@ -228,11 +228,11 @@ const getAccountFromMetadata = (
 
 export function getDisplayAccount(
   metadataRole?: ProjectStakeholder,
-  party?: Maybe<AccountFieldsFragment>,
+  account?: Maybe<AccountFieldsFragment>,
 ): Account | undefined {
-  const dbAccount = getAccount(party);
+  const dbAccount = getAccount(account);
   if (dbAccount) return dbAccount;
-  // If no party info available for this role, check the metadata
+  // If no account info available for this role, check the metadata
   if (metadataRole) return getAccountFromMetadata(metadataRole);
   return undefined;
 }

diff --git a/web-marketplace/src/components/templates/ProjectDetails/hooks/useStakeholders.ts b/web-marketplace/src/components/templates/ProjectDetails/hooks/useStakeholders.ts
@@ -5,6 +5,7 @@ import {
 } from '@apollo/client';
 import { ProjectInfo } from '@regen-network/api/lib/generated/regen/ecocredit/v1/query';
 import { useQuery } from '@tanstack/react-query';
+import { Account } from 'web-components/src/components/user/UserInfo';
 
 import { Maybe, ProjectFieldsFragment } from 'generated/graphql';
 import {
@@ -17,7 +18,7 @@ import { getAccountByAddrQuery } from 'lib/queries/react-query/registry-server/g
 import { useAccountInfo } from 'pages/ProfileEdit/hooks/useAccountInfo';
 import { getDisplayAccountOrAddress } from 'components/organisms/DetailsSection/DetailsSection.utils';
 
-import { getDisplayAccount } from '../ProjectDetails.utils';
+import { getAccount, getDisplayAccount } from '../ProjectDetails.utils';
 
 type Params = {
   anchoredMetadata?: AnchoredProjectMetadataLD;
@@ -62,10 +63,15 @@ export const useStakeholders = ({
   const { account } = useAccountInfo({ accountByAddr });
   const admin = getDisplayAccountOrAddress(adminAddr, account);
 
+  const partners = offChainProject?.projectPartnersByProjectId?.nodes?.map(
+    partner => getAccount(partner?.accountByAccountId),
+  ) as Account[];
+
   return {
     projectDeveloper,
     projectVerifier,
     program,
     admin,
+    partners,
   };
 };