Add an environment variable to set minimum voting period allowed

This can use any human readable string for defining the voting period. By
default it will be 30m (same as before this PR).

Fixed #268

.env.test

@@ -28,3 +28,6 @@ NEXT_PUBLIC_OSMOSIS_RPC_URL=
 # Axelar RPC URLs
 NEXT_PUBLIC_AXELAR_API_URL=
 NEXT_PUBLIC_AXELAR_RPC_URL=
+
+# Minimum voting period
+NEXT_PUBLIC_MINIMUM_VOTING_PERIOD=3m

bun.lock

@@ -42,6 +42,7 @@
         "next": "^14.2.8",
         "obscenity": "^0.4.1",
         "octokit": "^4.0.2",
+        "parse-duration": "^2.1.3",
         "postcss": "^8.4.45",
         "qrcode": "^1.5.4",
         "react": "18.3.1",
@@ -2100,6 +2101,8 @@
 
     "parent-module": ["[email protected]", "", { "dependencies": { "callsites": "^3.0.0" } }, "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g=="],
 
+    "parse-duration": ["[email protected]", "", {}, "sha512-MtbharL7Bets65qDBXuDOHHWyY1BxTJZmJ/xGmS90iEbKE0gZ6yZpZtCda7O79GeOi/f0NwBaplIuReExIoVsw=="],
+
     "parse-entities": ["[email protected]", "", { "dependencies": { "character-entities": "^1.0.0", "character-entities-legacy": "^1.0.0", "character-reference-invalid": "^1.0.0", "is-alphanumerical": "^1.0.0", "is-decimal": "^1.0.0", "is-hexadecimal": "^1.0.0" } }, "sha512-kkywGpCcRYhqQIchaWqZ875wzpS/bMKhz5HnN3p7wveJTkTtyAB/AlnS0f8DFSqYW1T82t6yEAkEcB+A1I3MbQ=="],
 
     "parse-json": ["[email protected]", "", { "dependencies": { "@babel/code-frame": "^7.0.0", "error-ex": "^1.3.1", "json-parse-even-better-errors": "^2.3.0", "lines-and-columns": "^1.1.6" } }, "sha512-ayCKvm/phCGxOkYRSCM82iDwct8/EonSEgCSxWxD7ve6jHggsFl4fZVQBPRNgQoKiuV/odhFrGzQXZwbifC8Rg=="],

components/groups/forms/groups/GroupPolicyForm.tsx

@@ -1,9 +1,11 @@
+import env from '@/config/env';
 import React, { useEffect } from 'react';
 import { Form, Formik, useFormikContext } from 'formik';
 import { NumberInput } from '@/components/react/inputs';
 
 import { Action, FormData } from '@/helpers/formReducer';
 import Yup from '@/utils/yupExtensions';
+import { secondsToHumanReadable } from '@/utils';
 
 const createGroupPolicySchema = (maxVotingThreshold: number) =>
   Yup.object().shape({
@@ -14,12 +16,16 @@ const createGroupPolicySchema = (maxVotingThreshold: number) =>
         minutes: Yup.number().min(0).required('Required'),
         seconds: Yup.number().min(0).required('Required'),
       })
-      .test('min-total-time', 'Voting period must be at least 30 minutes', value => {
-        const { days, hours, minutes, seconds } = value || {};
-        const totalSeconds =
-          (days || 0) * 86400 + (hours || 0) * 3600 + (minutes || 0) * 60 + (seconds || 0);
-        return totalSeconds >= 1800;
-      }),
+      .test(
+        'min-total-time',
+        () => `Voting period must be at least ${secondsToHumanReadable(env.minimumVotingPeriod)}`,
+        value => {
+          const { days, hours, minutes, seconds } = value || {};
+          const totalSeconds =
+            (days || 0) * 86400 + (hours || 0) * 3600 + (minutes || 0) * 60 + (seconds || 0);
+          return totalSeconds >= env.minimumVotingPeriod;
+        }
+      ),
     votingThreshold: Yup.number()
       .required('Required')
       .min(1)

components/groups/modals/updateGroupModal.tsx

@@ -13,7 +13,7 @@ import { Any } from '@liftedinit/manifestjs/dist/codegen/google/protobuf/any';
 import env from '@/config/env';
 import { createPortal } from 'react-dom';
 
-import { isValidManifestAddress } from '@/utils/string';
+import { isValidManifestAddress, secondsToHumanReadable } from '@/utils/string';
 import { TrashIcon, PlusIcon } from '@/components/icons';
 import { MdContacts } from 'react-icons/md';
 import { TailwindModal } from '@/components/react/modal';
@@ -256,18 +256,22 @@ export function UpdateGroupModal({
           minutes: Yup.number().min(0, 'Must be 0 or greater').required('Required'),
           seconds: Yup.number().min(0, 'Must be 0 or greater').required('Required'),
         })
-        .test('min-total-time', 'Voting period must be at least 30 minutes', function (value) {
-          // Only validate if voting period is being updated
-          if (!value || Object.values(value).every(v => v === 0)) return true;
-
-          const { days, hours, minutes, seconds } = value;
-          const totalSeconds =
-            (Number(days) || 0) * 86400 +
-            (Number(hours) || 0) * 3600 +
-            (Number(minutes) || 0) * 60 +
-            (Number(seconds) || 0);
-          return totalSeconds >= 1800;
-        }),
+        .test(
+          'min-total-time',
+          () => `Voting period must be at least ${secondsToHumanReadable(env.minimumVotingPeriod)}`,
+          function (value) {
+            // Only validate if voting period is being updated
+            if (!value || Object.values(value).every(v => v === 0)) return true;
+
+            const { days, hours, minutes, seconds } = value;
+            const totalSeconds =
+              (Number(days) || 0) * 86400 +
+              (Number(hours) || 0) * 3600 +
+              (Number(minutes) || 0) * 60 +
+              (Number(seconds) || 0);
+            return totalSeconds >= env.minimumVotingPeriod;
+          }
+        ),
     })
     .test(
       'metadata-total-length',

config/env.ts

@@ -1,3 +1,14 @@
+import parse from 'parse-duration';
+
+function parseDuration(duration: string | undefined, defaultValue: number): number {
+  const d = parse(duration ?? '');
+  if (d === null) {
+    return defaultValue;
+  }
+  // Convert to seconds.
+  return d / 1000;
+}
+
 const env = {
   // Wallet
   walletConnectKey: process.env.NEXT_PUBLIC_WALLETCONNECT_KEY ?? '',
@@ -31,6 +42,14 @@ const env = {
   // Axelar RPC URLs
   axelarApiUrl: process.env.NEXT_PUBLIC_AXELAR_API_URL ?? '',
   axelarRpcUrl: process.env.NEXT_PUBLIC_AXELAR_RPC_URL ?? '',
+
+  // Frontend development specific variables.
+
+  /**
+   * Minimum allowed voting period for proposals. This is a number of seconds.
+   * By default, it is set to 30 minutes.
+   */
+  minimumVotingPeriod: parseDuration(process.env.NEXT_PUBLIC_MINIMUM_VOTING_PERIOD, 1800),
 };
 
 export default env;

package.json

@@ -71,6 +71,7 @@
     "next": "^14.2.8",
     "obscenity": "^0.4.1",
     "octokit": "^4.0.2",
+    "parse-duration": "^2.1.3",
     "postcss": "^8.4.45",
     "qrcode": "^1.5.4",
     "react": "18.3.1",