Update Whitelist dashboard > Instantiate UI

pages/contracts/whitelist/instantiate.tsx

@@ -5,6 +5,8 @@ import { Conditional } from 'components/Conditional'
 import { ContractPageHeader } from 'components/ContractPageHeader'
 import { FormControl } from 'components/FormControl'
 import { FormGroup } from 'components/FormGroup'
+import { AddressList } from 'components/forms/AddressList'
+import { useAddressListState } from 'components/forms/AddressList.hooks'
 import { NumberInput } from 'components/forms/FormInput'
 import { useNumberInputState } from 'components/forms/FormInput.hooks'
 import { InputDateTime } from 'components/InputDateTime'
@@ -21,6 +23,7 @@ import { type FormEvent, useState } from 'react'
 import { toast } from 'react-hot-toast'
 import { FaAsterisk } from 'react-icons/fa'
 import { useMutation } from 'react-query'
+import { isValidAddress } from 'utils/isValidAddress'
 import { withMetadata } from 'utils/layout'
 import { links } from 'utils/links'
 
@@ -30,6 +33,7 @@ const WhitelistInstantiatePage: NextPage = () => {
 
   const [startDate, setStartDate] = useState<Date | undefined>(undefined)
   const [endDate, setEndDate] = useState<Date | undefined>(undefined)
+  const [adminsMutable, setAdminsMutable] = useState<boolean>(false)
 
   const [whitelistArray, setWhitelistArray] = useState<string[]>([])
 
@@ -57,6 +61,8 @@ const WhitelistInstantiatePage: NextPage = () => {
     placeholder: '5',
   })
 
+  const addressListState = useAddressListState()
+
   const { data, isLoading, mutate } = useMutation(
     async (event: FormEvent): Promise<InstantiateResponse | null> => {
       event.preventDefault()
@@ -78,6 +84,14 @@ const WhitelistInstantiatePage: NextPage = () => {
         mint_price: coin(String(Number(unitPriceState.value) * 1000000), 'ustars'),
         per_address_limit: perAddressLimitState.value,
         member_limit: memberLimitState.value,
+        admins: [
+          ...(new Set(
+            addressListState.values
+              .map((a) => a.address.trim())
+              .filter((address) => address !== '' && isValidAddress(address.trim()) && address.startsWith('stars')),
+          ) || [wallet.address]),
+        ],
+        admins_mutable: adminsMutable,
       }
       return toast.promise(contract.instantiate(1835, msg, 'Stargaze Whitelist Contract', wallet.address), {
         loading: 'Instantiating contract...',
@@ -115,6 +129,29 @@ const WhitelistInstantiatePage: NextPage = () => {
         <br />
       </Conditional>
 
+      <div className="mt-2 ml-3 w-full form-control">
+        <label className="justify-start cursor-pointer label">
+          <span className="mr-4 font-bold">Mutable Administrator Addresses</span>
+          <input
+            checked={adminsMutable}
+            className={`toggle ${adminsMutable ? `bg-stargaze` : `bg-gray-600`}`}
+            onClick={() => setAdminsMutable(!adminsMutable)}
+            type="checkbox"
+          />
+        </label>
+      </div>
+      <div className="my-4 ml-4 w-1/2">
+        <AddressList
+          entries={addressListState.entries}
+          isRequired
+          onAdd={addressListState.add}
+          onChange={addressListState.update}
+          onRemove={addressListState.remove}
+          subtitle="The list of administrator addresses"
+          title="Administrator Addresses"
+        />
+      </div>
+
       <FormGroup subtitle="Your whitelisted addresses" title="Whitelist File">
         <WhitelistUpload onChange={whitelistFileOnChange} />
         <Conditional test={whitelistArray.length > 0}>