Support active threshold in creation and display on DAO page

packages/i18n/locales/en/translation.json

@@ -240,6 +240,7 @@
     "downArrow": "Down arrow",
     "family": "Family",
     "fileFolder": "File folder",
+    "filmSlate": "Film slate",
     "fire": "Fire",
     "gas": "Gas",
     "gear": "Gear",
@@ -295,6 +296,9 @@
     "counterpartyBalanceInsufficient": "The counterparty's balance of {{amount}} ${{tokenSymbol}} is insufficient. They may be unable to complete this swap.",
     "daoAndSubDaosAlreadyOnV2": "This DAO (and all of its SubDAOs, if it has any) have already been upgraded.",
     "daoFeatureUnsupported": "{{name}} does not support {{feature}} yet.",
+    "daoIsInactive_absolute_one": "This DAO is inactive. Proposals cannot be created until {{count}} token is staked.",
+    "daoIsInactive_absolute_other": "This DAO is inactive. Proposals cannot be created until {{count}} tokens are staked.",
+    "daoIsInactive_percent": "This DAO is inactive. Proposals cannot be created until {{percent}} of voting power is staked.",
     "daoIsPaused": "You cannot create a proposal when the DAO is paused.",
     "discordAuthFailed": "Discord authentication unexpectedly failed. Try again or reach out to us for assistance.",
     "emptyFile": "File is empty.",
@@ -672,6 +676,7 @@
     "actionWithdrawsTokenSwap_pending": "This action withdraws {{amount}} ${{tokenSymbol}} from the token swap contract below.",
     "actions_one": "{{count}} action",
     "actions_other": "{{count}} actions",
+    "activeThresholdDescription": "The amount of voting power that needs to be staked in order for the DAO to become active (i.e. proposal creation is allowed).",
     "addCw20ToTreasuryActionDescription": "Display the DAO's balance of a CW20 token in the treasury view.",
     "addCw721ToTreasuryActionDescription": "Display the NFTs owned by the DAO from a CW721 NFT collection in the treasury view.",
     "addedToDaoFollowPrompt": "This DAO has added you as a member. Follow it to receive updates.",
@@ -710,6 +715,7 @@
     "copiedLinkToClipboard": "Copied link to clipboard.",
     "copiedToClipboard": "Copied to clipboard.",
     "copyWalletAddressTooltip": "Copy wallet address",
+    "count": "Count",
     "createADaoDescription": "Create a new project, organization, or community organized the way you want.",
     "createCrossChainAccountDescription": "Create an account for this DAO on another chain.",
     "createCrossChainAccountExplanation": "This action creates an account on another chain, allowing this DAO to perform actions on that chain.",
@@ -1109,6 +1115,7 @@
     "actions_one": "Action",
     "actions_other": "Actions",
     "active": "Active",
+    "activeThreshold": "Active Threshold",
     "addCw20ToTreasury": "Display Token Balance in Treasury",
     "addCw721ToTreasury": "Display NFT Collection in Treasury",
     "advancedConfiguration": "Advanced configuration",

packages/stateful/components/dao/DaoInfoBar.tsx

@@ -1,4 +1,4 @@
-import { AccountBalanceOutlined } from '@mui/icons-material'
+import { AccountBalanceOutlined, LockOpenOutlined } from '@mui/icons-material'
 import { useTranslation } from 'react-i18next'
 
 import { daoTvlSelector } from '@dao-dao/state'
@@ -10,6 +10,10 @@ import {
   useChain,
   useDaoInfoContext,
 } from '@dao-dao/stateless'
+import {
+  convertMicroDenomToDenomWithDecimals,
+  formatPercentOf100,
+} from '@dao-dao/utils'
 
 import {
   useCw20CommonGovernanceTokenInfoIfExists,
@@ -27,13 +31,14 @@ const InnerDaoInfoBar = () => {
   const { t } = useTranslation()
   const { chain_id: chainId } = useChain()
   const {
-    hooks: { useDaoInfoBarItems },
+    hooks: { useDaoInfoBarItems, useCommonGovernanceTokenInfo },
   } = useVotingModuleAdapter()
   const votingModuleItems = useDaoInfoBarItems()
-  const { coreAddress } = useDaoInfoContext()
+  const { coreAddress, activeThreshold } = useDaoInfoContext()
 
   const { denomOrAddress: cw20GovernanceTokenAddress } =
     useCw20CommonGovernanceTokenInfoIfExists() ?? {}
+  const tokenInfo = useCommonGovernanceTokenInfo?.()
 
   const treasuryUsdcValueLoading = useCachedLoading(
     daoTvlSelector({
@@ -75,6 +80,30 @@ const InnerDaoInfoBar = () => {
             />
           ),
         },
+        ...(activeThreshold
+          ? [
+              {
+                Icon: LockOpenOutlined,
+                label: t('title.activeThreshold'),
+                tooltip: t('info.activeThresholdDescription'),
+                value:
+                  'percentage' in activeThreshold
+                    ? formatPercentOf100(
+                        Number(activeThreshold.percentage.percent) * 100
+                      )
+                    : tokenInfo && (
+                        <TokenAmountDisplay
+                          amount={convertMicroDenomToDenomWithDecimals(
+                            activeThreshold.absolute_count.count,
+                            tokenInfo.decimals
+                          )}
+                          decimals={tokenInfo.decimals}
+                          symbol={tokenInfo.symbol}
+                        />
+                      ),
+              },
+            ]
+          : []),
         // Voting module-specific items.
         ...votingModuleItems,
       ]}

packages/stateful/components/dao/commonVotingConfig/ActiveThresholdVotingConfigItem.tsx

@@ -0,0 +1,109 @@
+import { useTranslation } from 'react-i18next'
+
+import {
+  FilmSlateEmoji,
+  FormSwitchCard,
+  NumberInput,
+  SelectInput,
+} from '@dao-dao/stateless'
+import {
+  DaoCreationVotingConfigItem,
+  DaoCreationVotingConfigItemInputProps,
+  DaoCreationVotingConfigItemReviewProps,
+  DaoCreationVotingConfigWithActiveThreshold,
+} from '@dao-dao/types'
+import {
+  formatPercentOf100,
+  validatePositive,
+  validateRequired,
+} from '@dao-dao/utils'
+
+const ActiveThresholdInput = ({
+  data: {
+    activeThreshold: { enabled, type } = {
+      enabled: false,
+      type: 'percent',
+      value: 10,
+    },
+  },
+  register,
+  setValue,
+  watch,
+  errors,
+}: DaoCreationVotingConfigItemInputProps<DaoCreationVotingConfigWithActiveThreshold>) => {
+  const { t } = useTranslation()
+
+  return (
+    <div className="flex flex-col gap-2">
+      <FormSwitchCard
+        fieldName="activeThreshold.enabled"
+        setValue={setValue}
+        sizing="sm"
+        value={enabled}
+      />
+
+      {enabled && (
+        <>
+          <div className="flex flex-row gap-2">
+            <NumberInput
+              containerClassName="grow min-w-[8rem]"
+              error={errors?.activeThreshold?.value}
+              fieldName="activeThreshold.value"
+              min={1}
+              register={register}
+              setValue={setValue}
+              sizing="sm"
+              step={type === 'percent' ? 0.001 : 1}
+              validation={[validatePositive, validateRequired]}
+              watch={watch}
+            />
+
+            <SelectInput
+              containerClassName={type === 'absolute' ? 'grow' : undefined}
+              onChange={(newType) =>
+                setValue('activeThreshold.type', newType as any)
+              }
+              validation={[validateRequired]}
+              value={type}
+            >
+              <option value="percent">%</option>
+              <option value="absolute">{t('info.count')}</option>
+            </SelectInput>
+          </div>
+        </>
+      )}
+    </div>
+  )
+}
+
+const ActiveThresholdReview = ({
+  data: {
+    activeThreshold: { enabled, type, value } = {
+      enabled: false,
+      type: 'percent',
+      value: 10,
+    },
+  },
+}: DaoCreationVotingConfigItemReviewProps<DaoCreationVotingConfigWithActiveThreshold>) => {
+  const { t } = useTranslation()
+  return enabled ? (
+    <>
+      {type === 'absolute'
+        ? value.toLocaleString() + ' ' + t('info.tokens')
+        : formatPercentOf100(value)}
+    </>
+  ) : (
+    <>{t('info.none')}</>
+  )
+}
+
+export const makeActiveThresholdVotingConfigItem =
+  (): DaoCreationVotingConfigItem<DaoCreationVotingConfigWithActiveThreshold> => ({
+    Icon: FilmSlateEmoji,
+    nameI18nKey: 'title.activeThreshold',
+    descriptionI18nKey: 'info.activeThresholdDescription',
+    Input: ActiveThresholdInput,
+    getInputError: ({ activeThreshold } = {}) =>
+      activeThreshold?.type || activeThreshold?.value,
+    Review: ActiveThresholdReview,
+  })

packages/stateful/creators/NftBased/index.ts

@@ -2,6 +2,7 @@ import { ImageEmoji } from '@dao-dao/stateless'
 import { DaoCreator, DurationUnits } from '@dao-dao/types'
 import { NftBasedCreatorId } from '@dao-dao/utils'
 
+import { makeActiveThresholdVotingConfigItem } from '../../components/dao/commonVotingConfig/ActiveThresholdVotingConfigItem'
 import { GovernanceTokenType } from '../TokenBased/types'
 import { GovernanceConfigurationInput } from './GovernanceConfigurationInput'
 import { GovernanceConfigurationReview } from './GovernanceConfigurationReview'
@@ -31,6 +32,7 @@ export const NftBasedCreator: DaoCreator = {
   },
   votingConfig: {
     items: [UnstakingDurationVotingConfigItem],
+    advancedItems: [makeActiveThresholdVotingConfigItem()],
   },
   mutate,
 }

packages/stateful/creators/TokenBased/index.ts

@@ -2,6 +2,7 @@ import { DaoEmoji } from '@dao-dao/stateless'
 import { DaoCreator, DurationUnits, TokenType } from '@dao-dao/types'
 import { TokenBasedCreatorId } from '@dao-dao/utils'
 
+import { makeActiveThresholdVotingConfigItem } from '../../components/dao/commonVotingConfig/ActiveThresholdVotingConfigItem'
 import { GovernanceConfigurationInput } from './GovernanceConfigurationInput'
 import { GovernanceConfigurationReview } from './GovernanceConfigurationReview'
 import { mutate } from './mutate'
@@ -42,13 +43,19 @@ export const TokenBasedCreator: DaoCreator<CreatorData> = {
       value: 2,
       units: DurationUnits.Weeks,
     },
+    activeThreshold: {
+      enabled: false,
+      type: 'percent',
+      value: 10,
+    },
   },
   governanceConfig: {
     Input: GovernanceConfigurationInput,
     Review: GovernanceConfigurationReview,
   },
   votingConfig: {
     items: [UnstakingDurationVotingConfigItem],
+    advancedItems: [makeActiveThresholdVotingConfigItem()],
   },
   mutate,
 }

packages/stateful/creators/TokenBased/mutate.ts

@@ -2,6 +2,7 @@ import { Buffer } from 'buffer'
 
 import { DaoCreatorMutate, TokenType } from '@dao-dao/types'
 import {
+  ActiveThreshold,
   Cw20Coin,
   InstantiateMsg as DaoVotingCw20StakedInstantiateMsg,
 } from '@dao-dao/types/contracts/DaoVotingCw20Staked'
@@ -28,6 +29,7 @@ export const mutate: DaoCreatorMutate<CreatorData> = (
     existingTokenType,
     existingTokenDenomOrAddress,
     unstakingDuration,
+    activeThreshold,
   },
   t,
   codeIds
@@ -40,6 +42,20 @@ export const mutate: DaoCreatorMutate<CreatorData> = (
     | DaoVotingCw20StakedInstantiateMsg
     | DaoVotingNativeStakedInstantiateMsg
 
+  const active_threshold: ActiveThreshold | null = activeThreshold?.enabled
+    ? !activeThreshold.type || activeThreshold.type === 'percent'
+      ? {
+          percentage: {
+            percent: (activeThreshold.value / 100).toString(),
+          },
+        }
+      : {
+          absolute_count: {
+            count: BigInt(activeThreshold.value).toString(),
+          },
+        }
+    : null
+
   if (tokenType === GovernanceTokenType.NewCw20) {
     const microInitialBalances: Cw20Coin[] = tiers.flatMap(
       ({ weight, members }) =>
@@ -64,6 +80,7 @@ export const mutate: DaoCreatorMutate<CreatorData> = (
     ).toString()
 
     votingModuleAdapterInstantiateMsg = {
+      active_threshold,
       token_info: {
         new: {
           code_id: codeIds.Cw20Base,
@@ -86,6 +103,7 @@ export const mutate: DaoCreatorMutate<CreatorData> = (
     }
 
     votingModuleAdapterInstantiateMsg = {
+      active_threshold,
       token_info: {
         existing: {
           address: existingTokenDenomOrAddress,
@@ -105,6 +123,7 @@ export const mutate: DaoCreatorMutate<CreatorData> = (
     }
 
     votingModuleAdapterInstantiateMsg = {
+      active_threshold,
       denom: existingTokenDenomOrAddress,
       owner: { core_module: {} },
       unstaking_duration:

packages/stateful/creators/TokenBased/types.ts

@@ -1,4 +1,5 @@
 import {
+  DaoCreationVotingConfigWithActiveThreshold,
   DurationWithUnits,
   GenericToken,
   NewDaoTier,
@@ -30,4 +31,4 @@ export type CreatorData = {
   }
   existingTokenSupply?: string
   unstakingDuration: DurationWithUnits
-}
+} & DaoCreationVotingConfigWithActiveThreshold

packages/stateful/proposal-module-adapter/adapters/DaoProposalMultiple/common/components/NewProposal/NewProposal.stories.tsx

@@ -50,6 +50,8 @@ Default.args = {
   },
   loading: false,
   isPaused: false,
+  isActive: true,
+  activeThreshold: null,
   isMember: { loading: false, data: true },
   depositUnsatisfied: false,
   connected: true,