UI options for validation pool duration

client/package-lock.json

@@ -9,6 +9,7 @@
       "version": "0.0.0",
       "dependencies": {
         "@metamask/sdk-react": "^0.16.0",
+        "@tanstack/react-table": "^8.13.2",
         "axios": "^1.6.7",
         "bootstrap": "^5.3.3",
         "bootswatch": "^5.3.3",
@@ -4884,6 +4885,37 @@
         "tslib": "^2.4.0"
       }
     },
+    "node_modules/@tanstack/react-table": {
+      "version": "8.13.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-table/-/react-table-8.13.2.tgz",
+      "integrity": "sha512-b6mR3mYkjRtJ443QZh9sc7CvGTce81J35F/XMr0OoWbx0KIM7TTTdyNP2XKObvkLpYnLpCrYDwI3CZnLezWvpg==",
+      "dependencies": {
+        "@tanstack/table-core": "8.13.2"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      },
+      "peerDependencies": {
+        "react": ">=16",
+        "react-dom": ">=16"
+      }
+    },
+    "node_modules/@tanstack/table-core": {
+      "version": "8.13.2",
+      "resolved": "https://registry.npmjs.org/@tanstack/table-core/-/table-core-8.13.2.tgz",
+      "integrity": "sha512-/2saD1lWBUV6/uNAwrsg2tw58uvMJ07bO2F1IWMxjFRkJiXKQRuc3Oq2aufeobD3873+4oIM/DRySIw7+QsPPw==",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/tannerlinsley"
+      }
+    },
     "node_modules/@types/babel__core": {
       "version": "7.20.5",
       "resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",

client/package.json

@@ -11,6 +11,7 @@
   },
   "dependencies": {
     "@metamask/sdk-react": "^0.16.0",
+    "@tanstack/react-table": "^8.13.2",
     "axios": "^1.6.7",
     "bootstrap": "^5.3.3",
     "bootswatch": "^5.3.3",

client/src/App.jsx

@@ -2,7 +2,7 @@ import { useEffect, useRef, useState } from 'react';
 import { useSDK } from '@metamask/sdk-react';
 import { Web3 } from 'web3';
 import Button from 'react-bootstrap/Button';
-// import './App.css';
+
 import DAOArtifact from './assets/DAO.json';
 // import work1Artifact from './assets/Work1.json';
 
@@ -188,9 +188,8 @@ function App() {
     });
   };
 
-  const initiateValidationPool = async (postIndex) => {
-    const poolDuration = 3600;
-    await DAO.methods.initiateValidationPool(postIndex, poolDuration).send({
+  const initiateValidationPool = async (postIndex, poolDuration) => {
+    await DAO.methods.initiateValidationPool(postIndex, poolDuration ?? 3600).send({
       from: account,
       gas: 1000000,
       value: 100,
@@ -263,8 +262,18 @@ function App() {
                     <td>{post.id.toString()}</td>
                     <td>{post.author}</td>
                     <td>
-                      <Button onClick={() => initiateValidationPool(post.id)}>
-                        Initiate Validation Pool
+                      Initiate Validation Pool
+                      {' '}
+                      <Button onClick={() => initiateValidationPool(post.id, 60)}>
+                        1 Min.
+                      </Button>
+                      {' '}
+                      <Button onClick={() => initiateValidationPool(post.id, 3600)}>
+                        1 Hr.
+                      </Button>
+                      {' '}
+                      <Button onClick={() => initiateValidationPool(post.id, 86400)}>
+                        1 Day
                       </Button>
                     </td>
                   </tr>