add edit profile

PotLock · Oct 26, 2023 · 6e5615a · 6e5615a
1 parent 6e8ced5
commit 6e5615a
Show file tree

Hide file tree

Showing 8 changed files with 212 additions and 156 deletions.
diff --git a/apps/potlock/widget/Index.jsx b/apps/potlock/widget/Index.jsx
@@ -1,6 +1,8 @@
 const ownerId = "potlock.near";
 
 const CREATE_PROJECT_TAB = "createproject";
+const EDIT_PROJECT_TAB = "editproject";
+const PROJECTS_LIST_TAB = "projects";
 const PROJECT_DETAIL_TAB = "project";
 
 const monaSansCss = fetch("https://fonts.cdnfonts.com/css/mona-sans").body;
@@ -22,7 +24,8 @@ State.init({
 
 const tabContentWidget = {
   [CREATE_PROJECT_TAB]: "Project.Create",
-  projects: "Project.ListPage",
+  [EDIT_PROJECT_TAB]: "Project.Create",
+  [PROJECTS_LIST_TAB]: "Project.ListPage",
   [PROJECT_DETAIL_TAB]: "Project.Detail",
 };
 
@@ -42,15 +45,16 @@ const getTabWidget = (tab) => {
   return "Project.ListPage";
 };
 
-const tabContent = (
-  <Widget
-    src={`${ownerId}/widget/${getTabWidget(props.tab)}`}
-    props={{
-      ...props,
-      urlProps: props,
-    }}
-  />
-);
+const props = {
+  ...props,
+  urlProps: props,
+};
+
+if (props.tab === EDIT_PROJECT_TAB) {
+  props.edit = true;
+}
+
+const tabContent = <Widget src={`${ownerId}/widget/${getTabWidget(props.tab)}`} props={props} />;
 
 const Content = styled.div`
   width: 100%;

diff --git a/apps/potlock/widget/Project/Create.jsx b/apps/potlock/widget/Project/Create.jsx
@@ -5,15 +5,16 @@ return (
     <Widget
       src={`${ownerId}/widget/Components.Header`}
       props={{
-        title1: "Create new project",
-        description:
-          "Create a profile for your impact project to receive direct donations, qualify for funding rounds, join NEAR's accelerator, and get discovered across social platforms.",
+        title1: props.edit ? "Edit your project" : "Create new project",
+        description: `${
+          props.edit ? "Update your " : "Create a "
+        } profile for your impact project to receive direct donations, qualify for funding rounds, join NEAR's accelerator, and get discovered across social platforms.`,
         centered: false,
         containerStyle: {
           background: "#FEF6EE",
         },
       }}
     />
-    <Widget src={`${ownerId}/widget/Project.CreateForm`} />
+    <Widget src={`${ownerId}/widget/Project.CreateForm`} props={props} />
   </>
 );
diff --git a/apps/potlock/widget/Project/CreateForm.jsx b/apps/potlock/widget/Project/CreateForm.jsx
@@ -27,6 +27,8 @@ if (!context.accountId) {
   );
 }
 
+const projects = Near.view(registryId, "get_projects", {});
+
 const imageHeightPx = 120;
 const profileImageTranslateYPx = 220;
 
@@ -431,20 +433,24 @@ const handleCreateProject = (e) => {
       deposit: Big(JSON.stringify(socialArgs).length * 16).mul(Big(10).pow(20)),
       args: socialArgs,
     },
-    // register on NEAR Horizon
-    {
-      contractName: "nearhorizon.near",
-      methodName: "add_project",
-      args: horizonArgs,
-    },
-    // register project on potlock
-    {
-      contractName: registryId,
-      methodName: "register",
-      deposit: Big(JSON.stringify(potlockRegistryArgs).length * 16).mul(Big(10).pow(20)), // TODO: update this, it isn't correct
-      args: potlockRegistryArgs,
-    },
   ];
+  if (!props.edit) {
+    transactions.push(
+      // register on NEAR Horizon
+      {
+        contractName: "nearhorizon.near",
+        methodName: "add_project",
+        args: horizonArgs,
+      },
+      // register project on potlock
+      {
+        contractName: registryId,
+        methodName: "register",
+        deposit: Big(JSON.stringify(potlockRegistryArgs).length * 16).mul(Big(10).pow(20)), // TODO: update this, it isn't correct
+        args: potlockRegistryArgs,
+      }
+    );
+  }
   const res = Near.call(transactions);
 };
 
@@ -533,9 +539,13 @@ const FormSectionLeft = (title, description, isRequired) => {
   );
 };
 
+if (props.edit && !registeredProject) {
+  return <div style={{ textAlign: "center", paddingTop: "12px" }}>Unauthorized</div>;
+}
+
 return (
   <Container>
-    {!state.socialDataFetched ? (
+    {!state.socialDataFetched || !projects ? (
       <div class="spinner-border text-secondary" role="status" />
     ) : registeredProject ? (
       <Container>
@@ -792,7 +802,7 @@ return (
                 props={{
                   type: "primary",
                   prefix: "https://",
-                  text: "Create new project",
+                  text: props.edit ? "Update your project" : "Create new project",
                   disabled: isCreateProjectDisabled,
                   onClick: handleCreateProject,
                 }}

diff --git a/apps/potlock/widget/Project/Detail.jsx b/apps/potlock/widget/Project/Detail.jsx
@@ -1,11 +1,18 @@
 const ownerId = "potlock.near";
+const registryId = "registry.potlock.near";
 
 const profile = props.profile ?? Social.getr(`${props.projectId}/profile`);
 
-if (profile === null) {
+const projects = props.projects ?? Near.view(registryId, "get_projects", {});
+
+if (!profile || !projects) {
   return "Loading";
 }
 
+const registeredProject = projects.find(
+  (project) => project.id == props.projectId && project.status == "Approved"
+);
+
 const name = profile.name || "No-name profile";
 const image = profile.image;
 const backgroundImage = profile.backgroundImage;
@@ -20,54 +27,60 @@ const profileImageTranslateYPx = 220;
 
 return (
   <Wrapper>
-    <Widget
-      src={`${ownerId}/widget/Project.BannerHeader`}
-      props={{
-        ...props,
-        profile,
-        profileImageTranslateYPx,
-        containerStyle: {
-          paddingLeft: "64px",
-        },
-        backgroundStyle: {
-          objectFit: "cover",
-          left: 0,
-          top: 0,
-          height: "280px",
-        },
-        imageStyle: {
-          width: `${imageHeightPx}px`,
-          height: `${imageHeightPx}px`,
-        },
-      }}
-    />
-    <div style={{ padding: `${profileImageTranslateYPx}px 68px` }}>
-      <div class="row align-items-start">
-        <div class="col-3">
-          <Widget
-            src={`${ownerId}/widget/Project.NavOptions`}
-            props={{
-              ...props,
-            }}
-          />
-          <Widget
-            src={`${ownerId}/widget/Project.Linktree`}
-            props={{
-              ...props,
-              linktree: profile.linktree,
-            }}
-          />
-        </div>
-        <div class="col-9">
-          <Widget
-            src={`${ownerId}/widget/Project.Body`}
-            props={{
-              ...props,
-              profile,
-            }}
-          />
+    {!registeredProject ? (
+      <div style={{ textAlign: "center", paddingTop: "12px" }}>Project not found</div>
+    ) : (
+      <>
+        <Widget
+          src={`${ownerId}/widget/Project.BannerHeader`}
+          props={{
+            ...props,
+            profile,
+            profileImageTranslateYPx,
+            containerStyle: {
+              paddingLeft: "64px",
+            },
+            backgroundStyle: {
+              objectFit: "cover",
+              left: 0,
+              top: 0,
+              height: "280px",
+            },
+            imageStyle: {
+              width: `${imageHeightPx}px`,
+              height: `${imageHeightPx}px`,
+            },
+          }}
+        />
+        <div style={{ padding: `${profileImageTranslateYPx}px 68px` }}>
+          <div class="row align-items-start">
+            <div class="col-3">
+              <Widget
+                src={`${ownerId}/widget/Project.NavOptions`}
+                props={{
+                  ...props,
+                }}
+              />
+              <Widget
+                src={`${ownerId}/widget/Project.Linktree`}
+                props={{
+                  ...props,
+                  linktree: profile.linktree,
+                }}
+              />
+            </div>
+            <div class="col-9">
+              <Widget
+                src={`${ownerId}/widget/Project.Body`}
+                props={{
+                  ...props,
+                  profile,
+                }}
+              />
+            </div>
+          </div>
         </div>
-      </div>
-    </div>
+      </>
+    )}
   </Wrapper>
 );
diff --git a/build/potlock/src/Index.jsx b/build/potlock/src/Index.jsx
@@ -1,6 +1,8 @@
 const ownerId = "potlock.near";
 
 const CREATE_PROJECT_TAB = "createproject";
+const EDIT_PROJECT_TAB = "editproject";
+const PROJECTS_LIST_TAB = "projects";
 const PROJECT_DETAIL_TAB = "project";
 
 const monaSansCss = fetch("https://fonts.cdnfonts.com/css/mona-sans").body;
@@ -22,7 +24,8 @@ State.init({
 
 const tabContentWidget = {
   [CREATE_PROJECT_TAB]: "Project.Create",
-  projects: "Project.ListPage",
+  [EDIT_PROJECT_TAB]: "Project.Create",
+  [PROJECTS_LIST_TAB]: "Project.ListPage",
   [PROJECT_DETAIL_TAB]: "Project.Detail",
 };
 
@@ -42,15 +45,16 @@ const getTabWidget = (tab) => {
   return "Project.ListPage";
 };
 
-const tabContent = (
-  <Widget
-    src={`${ownerId}/widget/${getTabWidget(props.tab)}`}
-    props={{
-      ...props,
-      urlProps: props,
-    }}
-  />
-);
+const props = {
+  ...props,
+  urlProps: props,
+};
+
+if (props.tab === EDIT_PROJECT_TAB) {
+  props.edit = true;
+}
+
+const tabContent = <Widget src={`${ownerId}/widget/${getTabWidget(props.tab)}`} props={props} />;
 
 const Content = styled.div`
   width: 100%;

diff --git a/build/potlock/src/Project/Create.jsx b/build/potlock/src/Project/Create.jsx
@@ -5,15 +5,16 @@ return (
     <Widget
       src={`${ownerId}/widget/Components.Header`}
       props={{
-        title1: "Create new project",
-        description:
-          "Create a profile for your impact project to receive direct donations, qualify for funding rounds, join NEAR's accelerator, and get discovered across social platforms.",
+        title1: props.edit ? "Edit your project" : "Create new project",
+        description: `${
+          props.edit ? "Update your " : "Create a "
+        } profile for your impact project to receive direct donations, qualify for funding rounds, join NEAR's accelerator, and get discovered across social platforms.`,
         centered: false,
         containerStyle: {
           background: "#FEF6EE",
         },
       }}
     />
-    <Widget src={`${ownerId}/widget/Project.CreateForm`} />
+    <Widget src={`${ownerId}/widget/Project.CreateForm`} props={props} />
   </>
 );