Sync staging (#275)

Co-authored-by: Andrew <[email protected]> Co-authored-by: Thomas <[email protected]> Co-authored-by: Peter Salomonsen <[email protected]>
NEAR-DevHub · Jan 30, 2025 · a981876 · a981876
2 parents 2ab20fa + 44be153
commit a981876
Show file tree

Hide file tree

Showing 9 changed files with 154 additions and 44 deletions.
diff --git a/instances/bootstrap.treasury-factory.near/widget/app.jsx b/instances/bootstrap.treasury-factory.near/widget/app.jsx
@@ -10,11 +10,9 @@ const { AppLayout } = VM.require(
   "${REPL_BASE_DEPLOYMENT_ACCOUNT}/widget/components.templates.AppLayout"
 ) || { AppLayout: () => <></> };
 
-const widgetSrc = (
-  context?.widgetSrc ?? `${REPL_BOOTSTRAP_ACCOUNT}/widget/app`
-).split("/app")[0];
-
-const { instance, treasuryDaoID } = VM.require(`${widgetSrc}/config.data`);
+const { instance, treasuryDaoID } = VM.require(
+  `${REPL_BOOTSTRAP_ACCOUNT}/widget/config.data`
+);
 
 if (!instance || !treasuryDaoID) {
   return <></>;

diff --git a/instances/bootstrap.treasury-factory.near/widget/config/data.jsx b/instances/bootstrap.treasury-factory.near/widget/config/data.jsx
@@ -1,7 +1,4 @@
-const widgetSrc = context.widgetSrc
-  ? context.widgetSrc
-  : "testing-app2.near/widget/app";
-const instance = widgetSrc.split("/")[0];
+const instance = `${REPL_BOOTSTRAP_ACCOUNT}`;
 const treasuryDaoID = instance.split(".near")[0] + ".sputnik-dao.near";
 
 return {

diff --git a/instances/treasury-factory.near/widget/components/create-treasury/SummaryStep.jsx b/instances/treasury-factory.near/widget/components/create-treasury/SummaryStep.jsx
@@ -1,8 +1,14 @@
+const { TransactionLoader } = VM.require(
+  `${REPL_DEVDAO_ACCOUNT}/widget/components.TransactionLoader`
+) || { TransactionLoader: () => <></> };
+
 const { formFields } = props;
 
 const REQUIRED_BALANCE = 9;
 
 const [showCongratsModal, setShowCongratsModal] = useState(false);
+const [showErrorToast, setShowErrorToast] = useState(false);
+const [isTxnCreated, setTxnCreated] = useState(false);
 
 const Section = styled.div`
   display: flex;
@@ -82,20 +88,50 @@ const PERMISSIONS = {
   vote: "Vote",
 };
 
-const storageAccountName = useMemo(() => Storage.privateGet("accountName"));
-
-const checkAccountCreation = async () => {
-  console.log(storageAccountName);
-  const web4 = Near.view(`${storageAccountName}.near`, "web4_get", {
-    request: { path: "/" },
-  });
-
-  if (web4) setShowCongratsModal(true);
-};
+const storageAccountName = Storage.get(
+  "TreasuryAccountName",
+  `${REPL_BASE_DEPLOYMENT_ACCOUNT}/widget/components.create-treasury.SummaryStep`
+);
 
-useEffect(async () => {
-  if (storageAccountName) checkAccountCreation();
-}, [storageAccountName]);
+useEffect(() => {
+  if (isTxnCreated) {
+    let checkTxnTimeout = null;
+    let errorTimeout = null;
+
+    const checkAccountCreation = async () => {
+      Near.asyncView(`${formFields.accountName}.near`, "web4_get", {
+        request: { path: "/" },
+      })
+        .then((web4) => {
+          if (web4) {
+            setTxnCreated(false);
+            setShowCongratsModal(true);
+            clearTimeout(errorTimeout);
+            clearTimeout(checkTxnTimeout);
+            Storage.set("TreasuryAccountName", formFields.accountName);
+          } else {
+            checkTxnTimeout = setTimeout(checkAccountCreation, 1000);
+          }
+        })
+        .catch(() => {
+          checkTxnTimeout = setTimeout(checkAccountCreation, 1000);
+        });
+    };
+    checkAccountCreation();
+
+    // if in 40 seconds there is no change, show error condition
+    errorTimeout = setTimeout(() => {
+      setShowErrorToast(true);
+      setTxnCreated(false);
+      clearTimeout(checkTxnTimeout);
+    }, 40_000);
+
+    return () => {
+      clearTimeout(checkTxnTimeout);
+      clearTimeout(errorTimeout);
+    };
+  }
+}, [isTxnCreated]);
 
 function filterMemberByPermission(permission) {
   return formFields.members
@@ -105,6 +141,7 @@ function filterMemberByPermission(permission) {
 
 // Permissions are set using https://github.com/near-daos/sputnik-dao-contract/blob/main/sputnikdao2/src/proposals.rs#L119
 function createDao() {
+  setTxnCreated(true);
   const createDaoConfig = {
     config: {
       name: `${formFields.accountName}`,
@@ -186,8 +223,6 @@ function createDao() {
       deposit: Big(REQUIRED_BALANCE).mul(Big(10).pow(24)).toFixed(),
     },
   ]);
-
-  Storage.privateSet("accountName", formFields.accountName);
 }
 
 const CongratsItem = ({ title, link }) => (
@@ -247,6 +282,11 @@ const ListItem = ({ member }) => (
 
 return (
   <>
+    <TransactionLoader
+      showInProgress={isTxnCreated}
+      showError={showErrorToast}
+      toggleToast={() => setShowErrorToast(false)}
+    />
     <div className="d-flex flex-column w-100 gap-3">
       <h3>Summary</h3>
 
@@ -339,13 +379,19 @@ return (
       <button
         className="btn btn-primary w-100"
         onClick={createDao}
-        disabled={!formFields.members || !formFields.accountName}
+        disabled={
+          !formFields.members ||
+          !formFields.accountName ||
+          isTxnCreated ||
+          storageAccountName ||
+          showCongratsModal
+        }
       >
         Confirm and Create
       </button>
     </div>
 
-    {showCongratsModal && (
+    {(showCongratsModal || storageAccountName) && (
       <Widget
         src={`${REPL_BASE_DEPLOYMENT_ACCOUNT}/widget/components.Modal`}
         props={{
@@ -360,17 +406,30 @@ return (
               <div>
                 <CongratsItem
                   title="near.org"
-                  link={`https://near.org/${storageAccountName}.near/widget/app`}
+                  link={`https://near.org/${
+                    storageAccountName ?? formFields.accountName
+                  }.near/widget/app`}
                 />
                 <CongratsItem
                   title="near.social"
-                  link={`https://social.near/${storageAccountName}.near/widget/app`}
+                  link={`https://social.near/${
+                    storageAccountName ?? formFields.accountName
+                  }.near/widget/app`}
                 />
                 <CongratsItem
                   title="web4"
-                  link={`https://${storageAccountName}.near.page`}
+                  link={`https://${
+                    storageAccountName ?? formFields.accountName
+                  }.near.page`}
                 />
               </div>
+              <a
+                href="?page=create-treasury"
+                className="btn btn-primary w-100"
+                onClick={() => Storage.set("TreasuryAccountName", null)}
+              >
+                Create another Treasury
+              </a>
             </div>
           ),
           onClose: () => setShowCongratsModal(false),

diff --git a/instances/treasury-factory.near/widget/pages/treasury/Create.jsx b/instances/treasury-factory.near/widget/pages/treasury/Create.jsx
@@ -4,14 +4,22 @@ const { isNearSocial } = VM.require(
   isNearSocial: false,
 };
 
-const { step } = props;
+let { step } = props;
 
 const STATIC_IMAGES = {
   social:
     "https://ipfs.near.social/ipfs/bafkreicse7okbzvbsy2s6ykp7vj6sgwbkx4gnbsjlfeeepev3ams6ckbfa",
   near: "https://ipfs.near.social/ipfs/bafkreihfzqpk2t3663foue7bgarjpnpp75pfohr2f7isgm4h6izieqi6ui",
 };
 const widgetBasePath = `${REPL_BASE_DEPLOYMENT_ACCOUNT}/widget/components.create-treasury`;
+const alreadyCreatedATreasury = Storage.get(
+  "TreasuryAccountName",
+  `${REPL_BASE_DEPLOYMENT_ACCOUNT}/widget/components.create-treasury.SummaryStep`
+);
+
+if (alreadyCreatedATreasury) {
+  step = 3;
+}
 const [formFields, setFormFields] = useState({});
 
 const STEPS = [

diff --git a/instances/widgets.treasury-factory.near/widget/pages/dashboard/Chart.jsx b/instances/widgets.treasury-factory.near/widget/pages/dashboard/Chart.jsx
@@ -431,7 +431,10 @@ return (
                   id={contract}
                   type="radio"
                   value={contract}
-                  onClick={() => setSelectedToken(contract)}
+                  onClick={() => {
+                    setBalanceDate(null);
+                    setSelectedToken(contract);
+                  }}
                   selected={contract === selectedToken}
                 />
                 <label

diff --git a/instances/widgets.treasury-factory.near/widget/pages/dashboard/index.jsx b/instances/widgets.treasury-factory.near/widget/pages/dashboard/index.jsx
@@ -141,11 +141,16 @@ function formatNearAmount(amount) {
 useEffect(() => {
   if (lockupContract) {
     Near.asyncView(lockupContract, "get_locked_amount").then((res) => {
-      const locked = Big(res).minus(LOCKUP_MIN_BALANCE_FOR_STORAGE).toFixed(2);
+      let locked = Big(res).minus(LOCKUP_MIN_BALANCE_FOR_STORAGE).toFixed(2);
+      let lockedParsed = formatNearAmount(locked);
+      if (parseFloat(lockedParsed) < 0) {
+        locked = 0;
+        lockedParsed = 0;
+      }
       setLockupNearBalances((prev) => ({
         ...prev,
         locked,
-        lockedParsed: formatNearAmount(locked),
+        lockedParsed,
         storage: LOCKUP_MIN_BALANCE_FOR_STORAGE,
         storageParsed: formatNearAmount(LOCKUP_MIN_BALANCE_FOR_STORAGE),
       }));
@@ -177,7 +182,7 @@ useEffect(() => {
 const totalBalance = Big(nearBalances?.totalParsed ?? "0")
   .mul(nearPrice ?? 1)
   .plus(Big(lockupNearBalances?.totalParsed ?? "0").mul(nearPrice ?? 1))
-  .plus(Big(userFTTokens?.totalCummulativeAmt ?? "0"))
+  .plus(Big(userFTTokens?.totalCumulativeAmt ?? "0"))
   .toFixed(2);
 
 function formatCurrency(amount) {

diff --git a/instances/widgets.treasury-factory.near/widget/pages/payments/CreatePaymentRequest.jsx b/instances/widgets.treasury-factory.near/widget/pages/payments/CreatePaymentRequest.jsx
@@ -50,7 +50,7 @@ const [isReceiverRegistered, setReceiverRegister] = useState(false);
 const [isLoadingProposals, setLoadingProposals] = useState(false);
 const [showCancelModal, setShowCancelModal] = useState(false);
 const [showErrorToast, setShowErrorToast] = useState(false);
-const [nearPrice, setNearPrice] = useState(null);
+const [nearPrice, setNearPrice] = useState("1"); // setting 1 as default, so VM doesn't throw any error
 
 useEffect(() => {
   if (!showProposalSelection) {

diff --git a/instances/widgets.treasury-factory.near/widget/pages/settings/Thresholds.jsx b/instances/widgets.treasury-factory.near/widget/pages/settings/Thresholds.jsx
@@ -321,14 +321,16 @@ return (
             content: (
               <div className="d-flex flex-column gap-2">
                 This action will result in significant changes to the system.
-                <div className="d-flex gap-3 warning px-3 py-2 rounded-3">
-                  <i class="bi bi-exclamation-triangle warning-icon h5"></i>
-                  <div>
-                    Changing this setting will require {requiredVotes} vote(s)
-                    to approve requests. You will no longer be able to approve
-                    requests with {selectedGroup.requiredVotes} vote(s).
+                {requiredVotes != selectedGroup.requiredVotes && (
+                  <div className="d-flex gap-3 warning px-3 py-2 rounded-3">
+                    <i class="bi bi-exclamation-triangle warning-icon h5"></i>
+                    <div>
+                      Changing this setting will require {requiredVotes} vote(s)
+                      to approve requests. You will no longer be able to approve
+                      requests with {selectedGroup.requiredVotes} vote(s).
+                    </div>
                   </div>
-                </div>
+                )}
               </div>
             ),
             confirmLabel: "Confirm",
@@ -420,14 +422,14 @@ return (
                       if (number > 100)
                         setValueError("Maximum percentage allowed is 100.");
                       else if (number < 1)
-                        setValueError("Minimum percentage allowed is 1.");
+                        setValueError("The minimum allowed percentage is 1%.");
                     } else {
                       if (number > selectedGroup.members.length)
                         setValueError(
                           `Maximum members allowed is ${selectedGroup.members.length}.`
                         );
                       if (number < 1)
-                        setValueError("Minimum members allowed is 1.");
+                        setValueError("At least 1 member is required.");
                     }
                   },
                   value: selectedVoteValue,

diff --git a/playwright-tests/tests/settings/create-threshold-request.spec.js b/playwright-tests/tests/settings/create-threshold-request.spec.js
@@ -273,4 +273,42 @@ test.describe("User is logged in", function () {
     ).toBeVisible();
     await expect(page.getByText("Enter Percentage")).toBeVisible();
   });
+
+  test("should show minimum threshold 1 vote and percentage is 1", async ({
+    page,
+  }) => {
+    test.setTimeout(150_000);
+    const submitBtn = page.getByText("Submit Request");
+    // Number of votes
+    await page.getByTestId("dropdown-btn").click();
+    await page.getByRole("list").getByText("Number of votes").click();
+    const thresholdInput = page.getByTestId("threshold-input");
+    await thresholdInput.fill("1", { force: true });
+    await thresholdInput.fill("0");
+
+    await expect(
+      page.getByText("At least 1 member is required.")
+    ).toBeVisible();
+    await expect(submitBtn).toBeDisabled();
+    // Percentage
+    await page.getByTestId("dropdown-btn").click();
+    await page.getByRole("list").getByText("Percentage of members").click();
+    await thresholdInput.fill("1");
+    await thresholdInput.fill("", { force: true });
+    await thresholdInput.pressSequentially("0", { delay: 100 });
+    await expect(
+      page.getByText("The minimum allowed percentage is 1%.")
+    ).toBeVisible();
+    await expect(submitBtn).toBeDisabled();
+    await thresholdInput.fill("20");
+    await expect(page.getByText("Warning!")).toBeVisible();
+    await submitBtn.click();
+    await expect(
+      page.getByText(
+        "Changing this setting will require 2 vote(s) to approve requests. You will no longer be able to approve requests with 1 vote(s)."
+      )
+    ).toBeVisible();
+    await page.getByRole("button", { name: "Confirm" }).click();
+    await expect(page.getByText("Processing your request ...")).toBeVisible();
+  });
 });