added history and pending request page

instances/treasury-devdao.near/aliases.mainnet.json

@@ -6,5 +6,7 @@
   "REPL_NEAR": "near",
   "REPL_MOB": "mob.near",
   "REPL_SOCIAL_CONTRACT": "social.near",
-  "REPL_RPC_URL": "https://rpc.mainnet.near.org"
+  "REPL_RPC_URL": "https://rpc.mainnet.near.org",
+  "REPL_PROPOSAL_CONTRACT": "devhub.near",
+  "REPL_NEAR_TOKEN_ICON": "https://ipfs.near.social/ipfs/bafkreiaafwuojgz5fu3y5n4ehcjuvsni2ieosra7pta6sgimztbjyew2me"
 }

instances/treasury-devdao.near/widget/components/Pagination.jsx

@@ -0,0 +1,92 @@
+const totalPages = props.totalPages ?? 12; // Assume you have 12 pages
+const maxVisiblePages = props.maxVisiblePages ?? 5;
+const onPageClick = props.onPageClick
+  ? props.onPageClick
+  : () => console.log("clicked");
+const pagesToShow = Math.min(totalPages, maxVisiblePages);
+const [selectedPage, setSelectedPage] = useState(props.selectedPage ?? 1);
+const totalPageSets = Math.ceil(totalPages / maxVisiblePages);
+const [currentPageSet, setCurrentPageSet] = useState(1);
+
+const Pagination = styled.div`
+  display: flex;
+  gap: 12px;
+  div {
+    display: flex;
+    height: 30px;
+    min-width: 30px;
+    padding: 12px;
+    justify-content: center;
+    align-items: center;
+    gap: 10px;
+    border-radius: 8px;
+    transition: all 300ms;
+    cursor: pointer;
+    /* Other/Button_text */
+    font-size: 14px;
+    font-style: normal;
+    font-weight: 500;
+    line-height: normal;
+    &.selected,
+    &:hover {
+      background-color: #23242b;
+      color: white;
+    }
+    &.arrow {
+      border: 1px solid rgba(255, 255, 255, 0.2);
+    }
+    &.disabled {
+      cursor: not-allowed;
+    }
+  }
+`;
+
+const handlePageClick = (pageNumber) => {
+  onPageClick(pageNumber);
+};
+
+const handleArrowClick = (direction) => {
+  if (direction === "left") {
+    setCurrentPageSet(Math.max(currentPageSet - 1, 1));
+  } else {
+    setCurrentPageSet(
+      Math.min(currentPageSet + 1, Math.ceil(totalPages / maxVisiblePages))
+    );
+  }
+};
+
+const getPageNumber = (index) =>
+  (currentPageSet - 1) * maxVisiblePages + index + 1;
+
+return (
+  <Pagination>
+    <div
+      className={`arrow ${currentPageSet === 1 ? "disabled" : undefined}`}
+      onClick={() => handleArrowClick("left")}
+    >
+      <i className="bi bi-arrow-left"></i>
+    </div>
+    {Array.from({ length: pagesToShow }).map((_, index) => {
+      const pageNumber = getPageNumber(index);
+      return (
+        <div
+          key={pageNumber}
+          className={pageNumber === selectedPage ? "selected" : undefined}
+          onClick={() => handlePageClick(pageNumber)}
+        >
+          {pageNumber}
+        </div>
+      );
+    })}
+    <div
+      className={`arrow ${
+        currentPageSet === Math.ceil(totalPages / maxVisiblePages)
+          ? "disabled"
+          : undefined
+      }`}
+      onClick={() => handleArrowClick("right")}
+    >
+      <i className="bi bi-arrow-right"></i>
+    </div>
+  </Pagination>
+);

instances/treasury-devdao.near/widget/components/TokenAmount.jsx

@@ -0,0 +1,42 @@
+const address = props.address ?? ""; // Empty string for NEAR
+const amountWithDecimals = props.amountWithDecimals ?? 0;
+const amountWithoutDecimals = props.amountWithoutDecimals; // Automatically converted to the correct value
+
+const isNEAR = address === "" || address.toLowerCase() === "near";
+
+let ftMetadata = {
+  symbol: "NEAR",
+  decimals: 24,
+};
+if (!isNEAR) {
+  ftMetadata = Near.view(address, "ft_metadata", {});
+  if (ftMetadata === null) return null;
+}
+let amount = amountWithDecimals;
+if (amountWithoutDecimals !== undefined) {
+  amount = Big(amountWithoutDecimals)
+    .div(Big(10).pow(ftMetadata.decimals ?? 1))
+    .toString();
+}
+
+const Wrapper = styled.div`
+  .amount {
+    font-size: 14px;
+    font-weight: 500;
+    line-height: 1.15;
+  }
+`;
+return (
+  <Wrapper className="d-flex gap-1 align-items-center">
+    <div>
+      <img
+        width="14px"
+        height="14px"
+        src={isNEAR ? "${REPL_NEAR_TOKEN_ICON}" : ftMetadata.icon}
+      />
+    </div>
+    <div className="d-flex gap-1 align-items-center">
+      <span className="amount">{amount}</span>
+    </div>
+  </Wrapper>
+);

instances/treasury-devdao.near/widget/lib/common.jsx

@@ -0,0 +1,23 @@
+function getApproversGroup(){
+
+const daoPolicy = Near.view(treasuryDaoID, "get_policy", {});
+const groupWithTransferPermission = (daoPolicy.roles ?? []).filter((role) => {
+    const transferPermissions = [
+      "transfer:*",
+      "transfer:VoteApprove",
+      "transfer:VoteReject",
+      "transfer:VoteRemove",
+    ];
+    return (role?.permissions ?? []).some((i) => transferPermissions.includes(i));
+  });
+
+  let approversGroup = [];
+  groupWithTransferPermission.map(
+    (i) => (approversGroup = approversGroup.concat(i.kind.Group))
+  );
+  return approversGroup
+}
+
+return {
+    getApproversGroup
+}