tapimo 0.13.0 → 0.15.0

package/src/admin/ui/src/components/RewardCampaignForm.tsx

@@ -0,0 +1,1009 @@
+import { useQuery } from '@tanstack/react-query'
+import { type FormEvent, type ReactNode, useState } from 'react'
+import { formatUnits, parseUnits, type Address } from 'viem'
+import { Button, Input } from 'regen-ui'
+
+import * as Config from '../lib/config.js'
+import * as RewardCampaigns from '../lib/reward-campaigns.js'
+import { EarnVaultForm } from './EarnVaultForm.js'
+import * as core_Page from './Page.js'
+
+const mainnetChainId = 4217
+const addressPattern = /^0x[a-fA-F0-9]{40}$/
+const defaultMorphoMaxBps = 2_000
+const defaultMorphoMinBps = 0
+const defaultMorphoStaleAfterSeconds = 300
+const defaultPayoutIntervalSeconds = 86_400
+const hourlyPayoutIntervalSeconds = 3_600
+const weeklyPayoutIntervalSeconds = 604_800
+const zeroAddress = '0x0000000000000000000000000000000000000000'
+
+type FormState = {
+  boostEnabled?: boolean | undefined
+  boostFundingWallet?: Address | undefined
+  boostRewards: boolean
+  excludedAddresses: Address[]
+  morphoMaxBps: number
+  morphoMinBps: number
+  morphoStaleAfterSeconds: number
+  payoutCadence: 'custom' | 'daily' | 'hourly' | 'settlement' | 'weekly'
+  payoutDeadlineDefault: string
+  rateType: 'fixed' | 'morpho'
+  targetFunding?: NonNullable<RewardCampaigns.Config['targetYield']>['funding'] | undefined
+  targetYield: boolean
+  treasury?: Address | undefined
+}
+
+/** Reward campaign configuration and operational controls for one Earn vault. */
+export function RewardCampaignForm(options: RewardCampaignForm.Props) {
+  const bootstrap = Config.use()
+  const campaign = useQuery(
+    RewardCampaigns.get.options({ chainId: options.chainId, vaultId: options.vaultId }),
+  )
+  const configure = RewardCampaigns.configure.useMutation()
+  const setPaused = RewardCampaigns.setPaused.useMutation()
+  const [formError, setFormError] = useState<string>()
+
+  if (options.chainId !== mainnetChainId)
+    return (
+      <core_Page.Card className="max-w-2xl">
+        <core_Page.Notice>
+          Reward campaigns are currently supported only on Mainnet.
+        </core_Page.Notice>
+      </core_Page.Card>
+    )
+
+  if (campaign.isPending)
+    return (
+      <core_Page.Card className="max-w-2xl">
+        <core_Page.Notice>Loading reward configuration…</core_Page.Notice>
+      </core_Page.Card>
+    )
+
+  if (campaign.isError)
+    return (
+      <core_Page.Card className="max-w-2xl">
+        <div className="flex flex-col gap-4 p-5">
+          <EarnVaultForm.Error>{campaign.error.message}</EarnVaultForm.Error>
+          <div className="flex gap-2">
+            <Button onClick={() => void campaign.refetch()} type="button">
+              Retry
+            </Button>
+            <Button
+              loading={setPaused.isPending}
+              onClick={() =>
+                setPaused.mutate({
+                  chainId: options.chainId,
+                  paused: true,
+                  vaultId: options.vaultId,
+                })
+              }
+              type="button"
+            >
+              Pause rewards
+            </Button>
+          </div>
+          {setPaused.error ? (
+            <EarnVaultForm.Error>{setPaused.error.message}</EarnVaultForm.Error>
+          ) : null}
+        </div>
+      </core_Page.Card>
+    )
+
+  function onSubmit(event: FormEvent<HTMLFormElement>, state: FormState) {
+    event.preventDefault()
+    setFormError(undefined)
+    configure.reset()
+    try {
+      configure.mutate({
+        chainId: options.chainId,
+        config: configFromForm(
+          new FormData(event.currentTarget),
+          state,
+          options.assetDecimals,
+          bootstrap.data?.rewards.signerAddress,
+        ),
+        vaultId: options.vaultId,
+      })
+    } catch (cause) {
+      setFormError(cause instanceof Error ? cause.message : 'Reward configuration is invalid.')
+    }
+  }
+
+  function onChange() {
+    setFormError(undefined)
+    configure.reset()
+    setPaused.reset()
+  }
+
+  const record = campaign.data
+  const config = record?.pendingConfig ?? record?.config ?? exampleConfig()
+  const error = formError ?? configure.error?.message ?? setPaused.error?.message
+  return (
+    <div className="flex max-w-2xl flex-col gap-4">
+      {record ? (
+        <CampaignStatus
+          campaign={record}
+          earnShareDecimals={options.earnShareDecimals}
+          loading={configure.isPending}
+          onCancelPending={() =>
+            configure.mutate({
+              chainId: options.chainId,
+              config: record.config,
+              vaultId: options.vaultId,
+            })
+          }
+        />
+      ) : null}
+      <ConfigurationForm
+        assetDecimals={options.assetDecimals}
+        assetSymbol={options.assetSymbol}
+        config={config}
+        error={error}
+        key={JSON.stringify(config)}
+        loading={configure.isPending}
+        onChange={onChange}
+        onSubmit={onSubmit}
+        record={record}
+        setPaused={setPaused}
+      />
+    </div>
+  )
+}
+
+export namespace RewardCampaignForm {
+  /** Props selecting the Earn reward campaign. */
+  export type Props = {
+    /** Base-asset decimals used to translate displayed dollar amounts. */
+    assetDecimals: number
+    /** Base-asset symbol shown beside dollar amounts. */
+    assetSymbol: string
+    /** Tempo chain containing the Earn vault. */
+    chainId: number
+    /** EarnShare decimals used to display unpaid liabilities. */
+    earnShareDecimals: number
+    /** EarnVault contract address. */
+    vaultId: RewardCampaigns.Input['vaultId']
+  }
+}
+
+function ConfigurationForm(options: ConfigurationForm.Props) {
+  const schedule = options.config.targetYield ?? options.config.boostRewards!
+  const boost = options.config.boostRewards
+  const defaults = newCapabilitySchedule(options.record, schedule)
+  const payoutIntervalSeconds =
+    boost?.payoutSchedule?.intervalSeconds ?? defaultPayoutIntervalSeconds
+  const [state, setState] = useState<FormState>(() => ({
+    boostEnabled: boost?.enabled,
+    boostFundingWallet: options.record ? options.config.boostRewards?.funding.wallet : undefined,
+    boostRewards: Boolean(options.config.boostRewards),
+    excludedAddresses: [...(options.config.boostRewards?.excludedAddresses ?? [])],
+    morphoMaxBps:
+      options.config.targetYield && 'morphoVault' in options.config.targetYield.annualRate
+        ? options.config.targetYield.annualRate.maxBps
+        : defaultMorphoMaxBps,
+    morphoMinBps:
+      options.config.targetYield && 'morphoVault' in options.config.targetYield.annualRate
+        ? options.config.targetYield.annualRate.minBps
+        : defaultMorphoMinBps,
+    morphoStaleAfterSeconds:
+      options.config.targetYield && 'morphoVault' in options.config.targetYield.annualRate
+        ? options.config.targetYield.annualRate.staleAfterSeconds
+        : defaultMorphoStaleAfterSeconds,
+    payoutCadence: (() => {
+      const intervalSeconds = options.config.boostRewards?.payoutSchedule?.intervalSeconds
+      if (intervalSeconds === undefined) return 'settlement'
+      if (intervalSeconds === hourlyPayoutIntervalSeconds) return 'hourly'
+      if (intervalSeconds === weeklyPayoutIntervalSeconds) return 'weekly'
+      if (intervalSeconds === defaultPayoutIntervalSeconds) return 'daily'
+      return 'custom'
+    })(),
+    payoutDeadlineDefault: boost?.payoutSchedule
+      ? datetimeInput(boost.payoutSchedule.startTimestamp)
+      : '',
+    rateType:
+      options.config.targetYield && 'morphoVault' in options.config.targetYield.annualRate
+        ? 'morpho'
+        : 'fixed',
+    targetFunding: options.record ? options.config.targetYield?.funding : undefined,
+    targetYield: Boolean(options.config.targetYield),
+    treasury: options.config.boostRewards?.treasury,
+  }))
+  const target = options.config.targetYield
+  const morphoRate =
+    target?.annualRate && 'morphoVault' in target.annualRate ? target.annualRate : undefined
+  const fixedRate = target?.annualRate && 'bps' in target.annualRate ? target.annualRate.bps : 500
+  const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone || 'local time'
+
+  return (
+    <form
+      className="border border-border bg-surface"
+      onChange={options.onChange}
+      onSubmit={(event) => options.onSubmit(event, state)}
+    >
+      <div className="flex flex-col gap-6 p-5">
+        <div>
+          <h2 className="text-heading-18 text-foreground">Reward configuration</h2>
+          <p className="mt-1 text-copy-13 text-foreground-secondary">
+            Configure the campaign below. The Admin API receives the complete JSON configuration.
+          </p>
+        </div>
+
+        <FormSection
+          description="Both reward types share this accounting interval and boundary grid."
+          title="Accounting"
+        >
+          <FieldGrid>
+            <Input
+              defaultValue={schedule.intervalSeconds}
+              label="Interval (seconds)"
+              max={300}
+              min={60}
+              name="intervalSeconds"
+              required
+              step={1}
+              type="number"
+            />
+          </FieldGrid>
+          <Help>Each reward schedule processes only complete intervals on this grid.</Help>
+        </FormSection>
+
+        <FormSection
+          description="Fund the difference between organic vault yield and a target annual rate."
+          title="Target yield"
+        >
+          <Toggle
+            checked={state.targetYield}
+            label="Enable target yield"
+            onChange={(targetYield) => setState((current) => ({ ...current, targetYield }))}
+          />
+          {state.targetYield ? (
+            <div className="flex flex-col gap-5 border-l-2 border-border pl-4">
+              <FieldGrid>
+                <Input
+                  defaultValue={datetimeInput(target?.startTimestamp ?? defaults.startTimestamp)}
+                  label="Starts at"
+                  name="targetStartTimestamp"
+                  required
+                  step="1"
+                  type="datetime-local"
+                />
+                <Input
+                  defaultValue={datetimeInput(target?.endTimestamp ?? defaults.endTimestamp)}
+                  label="Ends at"
+                  name="targetEndTimestamp"
+                  required
+                  step="1"
+                  type="datetime-local"
+                />
+              </FieldGrid>
+              <label className="flex flex-col gap-2 text-label-13 text-foreground-secondary">
+                Rate source
+                <select
+                  className="rounded-body border-2 border-transparent bg-secondary px-3 py-2.5 text-copy-13 text-foreground outline-none hover:bg-secondary-hover focus-visible:border-focus"
+                  onChange={(event) =>
+                    setState((current) => ({
+                      ...current,
+                      rateType: event.target.value as FormState['rateType'],
+                    }))
+                  }
+                  value={state.rateType}
+                >
+                  <option value="fixed">Fixed annual rate</option>
+                  <option value="morpho">Base Morpho vault rate</option>
+                </select>
+              </label>
+              {state.rateType === 'fixed' ? (
+                <Input
+                  defaultValue={fixedRate}
+                  label="Annual rate (bps)"
+                  max={10_000}
+                  min={1}
+                  name="targetFixedRateBps"
+                  required
+                  step={1}
+                  type="number"
+                />
+              ) : (
+                <EarnVaultForm.AddressInput
+                  defaultValue={morphoRate?.morphoVault}
+                  label="Morpho vault"
+                  name="targetMorphoVault"
+                  required
+                />
+              )}
+            </div>
+          ) : null}
+        </FormSection>
+
+        <FormSection
+          description="Top qualified registered depositors up to a target total annual rate."
+          title="Depositor boost"
+        >
+          <Toggle
+            checked={state.boostRewards && state.boostEnabled !== false}
+            label="Enable depositor boost"
+            onChange={(enabled) =>
+              setState((current) =>
+                options.record?.config.boostRewards
+                  ? { ...current, boostEnabled: enabled }
+                  : { ...current, boostEnabled: enabled, boostRewards: enabled },
+              )
+            }
+          />
+          {state.boostRewards ? (
+            <div className="flex flex-col gap-5 border-l-2 border-border pl-4">
+              <FieldGrid>
+                <Input
+                  defaultValue={datetimeInput(boost?.startTimestamp ?? defaults.startTimestamp)}
+                  label="Starts at"
+                  name="boostStartTimestamp"
+                  required
+                  step="1"
+                  type="datetime-local"
+                />
+                <Input
+                  defaultValue={datetimeInput(boost?.endTimestamp ?? defaults.endTimestamp)}
+                  label="Ends at"
+                  name="boostEndTimestamp"
+                  required
+                  step="1"
+                  type="datetime-local"
+                />
+                <Input
+                  defaultValue={boost?.targetAnnualRateBps ?? 700}
+                  label="Target annual rate (bps)"
+                  max={10_000}
+                  min={1}
+                  name="boostTargetAnnualRateBps"
+                  required
+                  step={1}
+                  type="number"
+                />
+                <Input
+                  defaultValue={assetAmountInput(
+                    boost?.perUserPrincipalCapAssets,
+                    options.assetDecimals,
+                  )}
+                  inputMode="decimal"
+                  label="Per-user principal cap ($)"
+                  min={assetStep(options.assetDecimals)}
+                  name="boostPerUserPrincipalCap"
+                  required
+                  step={assetStep(options.assetDecimals)}
+                  type="number"
+                />
+                <Input
+                  defaultValue={assetAmountInput(
+                    boost?.totalPrincipalCapAssets,
+                    options.assetDecimals,
+                  )}
+                  inputMode="decimal"
+                  label="Total principal cap ($)"
+                  min={assetStep(options.assetDecimals)}
+                  name="boostTotalPrincipalCap"
+                  required
+                  step={assetStep(options.assetDecimals)}
+                  type="number"
+                />
+              </FieldGrid>
+              <Help>
+                Dollar amounts are converted to {options.assetSymbol} base units when saved. Both
+                schedules must start on the shared accounting grid.
+              </Help>
+              <div className="flex flex-col gap-4 border-t border-border pt-5">
+                <div>
+                  <h4 className="text-label-14 text-foreground">Automatic payouts</h4>
+                  <p className="mt-1 text-copy-13 text-foreground-secondary">
+                    Choose when accumulated depositor rewards are pushed. Times use {timeZone}.
+                  </p>
+                </div>
+                <FieldGrid>
+                  <label className="flex flex-col gap-2 text-label-13 text-foreground-secondary">
+                    Payout cadence
+                    <select
+                      className="rounded-body border-2 border-transparent bg-secondary px-3 py-2.5 text-copy-13 text-foreground outline-none hover:bg-secondary-hover focus-visible:border-focus"
+                      onChange={(event) => {
+                        const payoutCadence = event.target.value as FormState['payoutCadence']
+                        const data = new FormData(event.currentTarget.form!)
+                        setState((current) => ({
+                          ...current,
+                          payoutCadence,
+                          payoutDeadlineDefault:
+                            payoutCadence === 'settlement'
+                              ? current.payoutDeadlineDefault
+                              : datetimeInput(
+                                  defaultPayoutDeadline({
+                                    cadence: payoutCadence,
+                                    endTimestamp:
+                                      inputTimestamp(text(data, 'boostEndTimestamp')) ??
+                                      boost?.endTimestamp ??
+                                      schedule.endTimestamp,
+                                    intervalSeconds: payoutIntervalSeconds,
+                                    startTimestamp:
+                                      inputTimestamp(text(data, 'boostStartTimestamp')) ??
+                                      boost?.startTimestamp ??
+                                      schedule.startTimestamp,
+                                  }),
+                                ),
+                        }))
+                      }}
+                      defaultValue={state.payoutCadence}
+                      name="boostPayoutCadence"
+                    >
+                      <option value="settlement">Every settlement</option>
+                      <option value="hourly">Hourly</option>
+                      <option value="daily">Daily</option>
+                      <option value="weekly">Weekly</option>
+                      <option value="custom">Custom</option>
+                    </select>
+                  </label>
+                  {state.payoutCadence !== 'settlement' ? (
+                    <Input
+                      defaultValue={state.payoutDeadlineDefault}
+                      key={`${state.payoutCadence}:${state.payoutDeadlineDefault}`}
+                      label="First payout deadline"
+                      name="boostPayoutStartTimestamp"
+                      required
+                      step="1"
+                      type="datetime-local"
+                    />
+                  ) : null}
+                  {state.payoutCadence === 'custom' ? (
+                    <Input
+                      defaultValue={payoutIntervalSeconds}
+                      label="Custom cadence (seconds)"
+                      min={61}
+                      name="boostPayoutIntervalSeconds"
+                      required
+                      step={1}
+                      type="number"
+                    />
+                  ) : null}
+                </FieldGrid>
+                {state.payoutCadence === 'settlement' ? (
+                  <Help>
+                    Accumulated rewards are considered for payout after every settlement. Minimum
+                    payout rules may still defer small amounts, and campaign end forces a final
+                    payout.
+                  </Help>
+                ) : (
+                  <Help>
+                    A deadline triggers payout at the next settlement, no more than one accounting
+                    interval later. Campaign end forces a final payout.
+                  </Help>
+                )}
+              </div>
+            </div>
+          ) : null}
+        </FormSection>
+
+        {options.error ? <EarnVaultForm.Error>{options.error}</EarnVaultForm.Error> : null}
+      </div>
+      <div className="flex items-center justify-between gap-2 border-t border-border px-5 py-3">
+        <div>
+          {options.record ? (
+            <Button
+              loading={options.setPaused.isPending}
+              onClick={() =>
+                options.setPaused.mutate({
+                  chainId: options.record!.chainId,
+                  paused: !options.record!.paused,
+                  vaultId: options.record!.vaultAddress,
+                })
+              }
+              type="button"
+            >
+              {options.record.paused ? 'Resume rewards' : 'Pause rewards'}
+            </Button>
+          ) : null}
+        </div>
+        <Button loading={options.loading} type="submit" variant="primary">
+          {options.record ? 'Save reward configuration' : 'Configure rewards'}
+        </Button>
+      </div>
+    </form>
+  )
+}
+
+declare namespace ConfigurationForm {
+  type Props = {
+    assetDecimals: number
+    assetSymbol: string
+    config: RewardCampaigns.Config
+    error?: string | undefined
+    loading: boolean
+    onChange: () => void
+    onSubmit: (event: FormEvent<HTMLFormElement>, state: FormState) => void
+    record: RewardCampaigns.Campaign | null | undefined
+    setPaused: ReturnType<typeof RewardCampaigns.setPaused.useMutation>
+  }
+}
+
+function FormSection(options: FormSection.Props) {
+  return (
+    <section className="flex flex-col gap-4 border-t border-border pt-5 first:border-t-0 first:pt-0">
+      <div>
+        <h3 className="text-heading-16 text-foreground">{options.title}</h3>
+        <p className="mt-1 text-copy-13 text-foreground-secondary">{options.description}</p>
+      </div>
+      {options.children}
+    </section>
+  )
+}
+
+declare namespace FormSection {
+  type Props = { children: ReactNode; description: string; title: string }
+}
+
+function FieldGrid(options: FieldGrid.Props) {
+  return <div className="grid gap-4 sm:grid-cols-2">{options.children}</div>
+}
+
+declare namespace FieldGrid {
+  type Props = { children: ReactNode }
+}
+
+function Toggle(options: Toggle.Props) {
+  return (
+    <label className="flex cursor-pointer items-center gap-2 text-label-13 text-foreground has-disabled:cursor-not-allowed has-disabled:opacity-60">
+      <input
+        checked={options.checked}
+        className="size-4 accent-foreground"
+        disabled={options.disabled}
+        onChange={(event) => options.onChange(event.target.checked)}
+        type="checkbox"
+      />
+      {options.label}
+    </label>
+  )
+}
+
+declare namespace Toggle {
+  type Props = {
+    checked: boolean
+    disabled?: boolean | undefined
+    label: string
+    onChange: (checked: boolean) => void
+  }
+}
+
+function Help(options: Help.Props) {
+  return <p className="text-copy-12 text-foreground-secondary">{options.children}</p>
+}
+
+declare namespace Help {
+  type Props = { children: ReactNode }
+}
+
+function CampaignStatus(options: CampaignStatus.Props) {
+  const { campaign } = options
+  const nextPayout = nextAutomaticPayout(campaign)
+  return (
+    <core_Page.Card>
+      <div className="border-b border-border px-5 py-4">
+        <h2 className="text-heading-18 text-foreground">Reward campaign</h2>
+        <p className="mt-1 text-copy-13 text-foreground-secondary">
+          Current provisioning, delivery, and liability state.
+        </p>
+      </div>
+      <div className="grid gap-px bg-border sm:grid-cols-2">
+        <Status label="Status">{campaignStatus(campaign)}</Status>
+        <Status label="Periphery">{campaign.peripheryReady ? 'Ready' : 'Provisioning'}</Status>
+        <Status label="Execution">{campaign.execution?.phase ?? 'No runs yet'}</Status>
+        <Status label="Delivered through">{unixTime(campaign.deliveredThrough)}</Status>
+        <Status label="Next automatic payout">
+          {campaign.paused ? 'Paused' : nextPayout === undefined ? 'None' : unixTime(nextPayout)}
+        </Status>
+        <Status label="Unpaid recipients">{campaign.unpaidRecipients.toLocaleString()}</Status>
+        <Status label="Unpaid EarnShare">
+          {formatUnits(BigInt(campaign.unpaidEarnShares), options.earnShareDecimals)}
+        </Status>
+        <Status label="Controller">
+          <AddressValue value={campaign.controllerAddress} />
+        </Status>
+        <Status label="Distributor">
+          <AddressValue value={campaign.distributorAddress} />
+        </Status>
+        <Status label="Signer">
+          <AddressValue value={campaign.signerAddress} />
+        </Status>
+        <Status label="Pending effective">
+          {campaign.pendingEffectiveAt ? unixTime(campaign.pendingEffectiveAt) : 'None'}
+        </Status>
+      </div>
+      {campaign.provisioningError ? (
+        <div className="border-t border-border p-5">
+          <EarnVaultForm.Error>{campaign.provisioningError}</EarnVaultForm.Error>
+        </div>
+      ) : null}
+      {campaign.execution?.error ? (
+        <div className="border-t border-border p-5">
+          <EarnVaultForm.Error>{campaign.execution.error}</EarnVaultForm.Error>
+        </div>
+      ) : null}
+      {campaign.pendingConfig ? (
+        <div className="flex items-center justify-between gap-3 border-t border-border p-5">
+          <Help>A replacement is scheduled. Canceling restores the active configuration.</Help>
+          <Button loading={options.loading} onClick={options.onCancelPending} type="button">
+            Cancel pending update
+          </Button>
+        </div>
+      ) : null}
+    </core_Page.Card>
+  )
+}
+
+declare namespace CampaignStatus {
+  type Props = {
+    campaign: RewardCampaigns.Campaign
+    earnShareDecimals: number
+    loading: boolean
+    onCancelPending: () => void
+  }
+}
+
+function Status(options: Status.Props) {
+  return (
+    <div className="flex min-w-0 flex-col gap-1 bg-surface px-5 py-3">
+      <span className="text-label-12 text-foreground-secondary">{options.label}</span>
+      <span className="min-w-0 truncate text-copy-14 text-foreground">{options.children}</span>
+    </div>
+  )
+}
+
+declare namespace Status {
+  type Props = { children: ReactNode; label: string }
+}
+
+function AddressValue(options: AddressValue.Props) {
+  return options.value ? <code>{options.value}</code> : 'Not provisioned'
+}
+
+declare namespace AddressValue {
+  type Props = { value: string | null }
+}
+
+function configFromForm(
+  data: FormData,
+  state: FormState,
+  assetDecimals: number,
+  signerAddress: Address | null | undefined,
+): RewardCampaigns.Config {
+  if (!state.targetYield && !state.boostRewards)
+    throw new Error('Enable target yield or depositor boost.')
+  if (!signerAddress) throw new Error('Rewards signer address is unavailable.')
+
+  const intervalSeconds = integer(data, 'intervalSeconds')
+  if (intervalSeconds < 60 || intervalSeconds > 300)
+    throw new Error('Interval must be between 60 and 300 seconds.')
+
+  const targetYield = state.targetYield
+    ? (() => {
+        const endTimestamp = timestamp(data, 'targetEndTimestamp')
+        const startTimestamp = timestamp(data, 'targetStartTimestamp')
+        if (endTimestamp <= startTimestamp)
+          throw new Error('Target yield end time must be after its start time.')
+        return {
+          annualRate:
+            state.rateType === 'fixed'
+              ? { bps: basisPoints(data, 'targetFixedRateBps') }
+              : {
+                  maxBps: state.morphoMaxBps,
+                  minBps: state.morphoMinBps,
+                  morphoVault: address(text(data, 'targetMorphoVault'), 'Morpho vault'),
+                  staleAfterSeconds: state.morphoStaleAfterSeconds,
+                },
+          endTimestamp,
+          funding: state.targetFunding ?? [{ remainder: true as const, wallet: signerAddress }],
+          intervalSeconds,
+          startTimestamp,
+        }
+      })()
+    : undefined
+  if (
+    targetYield?.annualRate &&
+    typeof targetYield.annualRate.minBps === 'number' &&
+    typeof targetYield.annualRate.maxBps === 'number' &&
+    targetYield.annualRate.minBps > targetYield.annualRate.maxBps
+  )
+    throw new Error('Morpho minimum rate cannot exceed the maximum rate.')
+
+  const boostRewards = state.boostRewards
+    ? (() => {
+        const endTimestamp = timestamp(data, 'boostEndTimestamp')
+        const payoutSchedule = (() => {
+          const cadence = payoutCadence(data)
+          if (cadence === 'settlement') return undefined
+          const intervalSeconds = (() => {
+            if (cadence === 'hourly') return hourlyPayoutIntervalSeconds
+            if (cadence === 'daily') return defaultPayoutIntervalSeconds
+            if (cadence === 'weekly') return weeklyPayoutIntervalSeconds
+            return integer(data, 'boostPayoutIntervalSeconds')
+          })()
+          return {
+            intervalSeconds,
+            startTimestamp: timestamp(data, 'boostPayoutStartTimestamp'),
+          }
+        })()
+        const startTimestamp = timestamp(data, 'boostStartTimestamp')
+        if (endTimestamp <= startTimestamp)
+          throw new Error('Depositor boost end time must be after its start time.')
+        return {
+          endTimestamp,
+          excludedAddresses: state.excludedAddresses,
+          funding: { wallet: state.boostFundingWallet ?? signerAddress },
+          intervalSeconds,
+          ...(state.boostEnabled !== undefined ? { enabled: state.boostEnabled } : {}),
+          ...(payoutSchedule ? { payoutSchedule } : {}),
+          perUserPrincipalCapAssets: assetAmount(
+            data,
+            'boostPerUserPrincipalCap',
+            assetDecimals,
+            'Per-user principal cap',
+          ),
+          startTimestamp,
+          targetAnnualRateBps: basisPoints(data, 'boostTargetAnnualRateBps'),
+          totalPrincipalCapAssets: assetAmount(
+            data,
+            'boostTotalPrincipalCap',
+            assetDecimals,
+            'Total principal cap',
+          ),
+          treasury: state.treasury ?? signerAddress,
+        }
+      })()
+    : undefined
+  if (
+    boostRewards &&
+    BigInt(boostRewards.perUserPrincipalCapAssets) > BigInt(boostRewards.totalPrincipalCapAssets)
+  )
+    throw new Error('Per-user principal cap cannot exceed the total principal cap.')
+  if (
+    boostRewards?.payoutSchedule &&
+    (boostRewards.payoutSchedule.intervalSeconds <= intervalSeconds ||
+      boostRewards.payoutSchedule.startTimestamp <= boostRewards.startTimestamp ||
+      boostRewards.payoutSchedule.startTimestamp > boostRewards.endTimestamp)
+  )
+    throw new Error('Automatic payouts must be slower than accounting and start during the boost.')
+  if (
+    boostRewards &&
+    targetYield &&
+    Math.abs(boostRewards.startTimestamp - targetYield.startTimestamp) % intervalSeconds !== 0
+  )
+    throw new Error('Target yield and depositor boost must start on one accounting grid.')
+
+  return {
+    ...(boostRewards ? { boostRewards } : {}),
+    ...(targetYield ? { targetYield } : {}),
+  }
+}
+
+function assetAmount(data: FormData, name: string, decimals: number, label: string) {
+  try {
+    const amount = parseUnits(text(data, name), decimals)
+    if (amount <= 0n) throw new Error()
+    return String(amount)
+  } catch {
+    throw new Error(`${label} must be a positive dollar amount with at most ${decimals} decimals.`)
+  }
+}
+
+function assetAmountInput(amount: string | undefined, decimals: number) {
+  return amount === undefined ? undefined : formatUnits(BigInt(amount), decimals)
+}
+
+function assetStep(decimals: number) {
+  return 10 ** -decimals
+}
+
+function address(value: string, label: string): Address {
+  if (!addressPattern.test(value) || value.toLowerCase() === zeroAddress)
+    throw new Error(`${label} must be a valid nonzero address.`)
+  return value as Address
+}
+
+function basisPoints(data: FormData, name: string) {
+  const value = integer(data, name)
+  if (value < 1 || value > 10_000) throw new Error('Annual rates must be 1–10,000 bps.')
+  return value
+}
+
+function integer(data: FormData, name: string) {
+  const value = Number(text(data, name))
+  if (!Number.isSafeInteger(value)) throw new Error(`${name} must be a whole number.`)
+  return value
+}
+
+function timestamp(data: FormData, name: string) {
+  const value = inputTimestamp(text(data, name))
+  if (value === undefined) throw new Error(`${name} must be a valid date and time.`)
+  return value
+}
+
+function inputTimestamp(value: string) {
+  const milliseconds = new Date(value).getTime()
+  return Number.isFinite(milliseconds) ? Math.floor(milliseconds / 1_000) : undefined
+}
+
+function payoutCadence(data: FormData): FormState['payoutCadence'] {
+  const value = text(data, 'boostPayoutCadence')
+  if (
+    value !== 'custom' &&
+    value !== 'daily' &&
+    value !== 'hourly' &&
+    value !== 'settlement' &&
+    value !== 'weekly'
+  )
+    throw new Error('Payout cadence is invalid.')
+  return value
+}
+
+function text(data: FormData, name: string) {
+  const value = data.get(name)
+  return typeof value === 'string' ? value.trim() : ''
+}
+
+function exampleConfig(): RewardCampaigns.Config {
+  const intervalSeconds = 300
+  const startTimestamp =
+    Math.ceil((Math.floor(Date.now() / 1_000) + 3_600) / intervalSeconds) * intervalSeconds
+  return {
+    targetYield: {
+      annualRate: { bps: 500 },
+      endTimestamp: startTimestamp + 30 * 24 * 60 * 60,
+      funding: [{ remainder: true, wallet: zeroAddress }],
+      intervalSeconds,
+      startTimestamp,
+    },
+  }
+}
+
+function datetimeInput(timestamp: number) {
+  const date = new Date(timestamp * 1_000)
+  const offset = date.getTimezoneOffset() * 60_000
+  return new Date(date.getTime() - offset).toISOString().slice(0, 19)
+}
+
+function newCapabilitySchedule(
+  record: RewardCampaigns.Campaign | null | undefined,
+  schedule: NonNullable<RewardCampaigns.Config['boostRewards' | 'targetYield']>,
+) {
+  if (!record || Date.now() < schedule.startTimestamp * 1_000)
+    return { endTimestamp: schedule.endTimestamp, startTimestamp: schedule.startTimestamp }
+  const now = Math.max(Math.floor(Date.now() / 1_000), Number(record.deliveredThrough))
+  const nextBoundary =
+    schedule.startTimestamp +
+    (Math.floor((now - schedule.startTimestamp) / schedule.intervalSeconds) + 1) *
+      schedule.intervalSeconds
+  const startTimestamp = Math.max(nextBoundary, Number(record.pendingEffectiveAt ?? 0))
+  return {
+    endTimestamp: startTimestamp + (schedule.endTimestamp - schedule.startTimestamp),
+    startTimestamp,
+  }
+}
+
+function defaultPayoutDeadline(options: defaultPayoutDeadline.Options) {
+  const reference = new Date(Math.max(Date.now(), options.startTimestamp * 1_000))
+  const deadline = new Date(reference)
+  if (options.cadence === 'hourly') {
+    deadline.setMinutes(0, 0, 0)
+    deadline.setHours(deadline.getHours() + 1)
+  } else if (options.cadence === 'daily') {
+    deadline.setHours(12, 0, 0, 0)
+    if (deadline <= reference) deadline.setDate(deadline.getDate() + 1)
+  } else if (options.cadence === 'weekly') {
+    deadline.setHours(12, 0, 0, 0)
+    deadline.setDate(deadline.getDate() + ((8 - deadline.getDay()) % 7))
+    if (deadline <= reference) deadline.setDate(deadline.getDate() + 7)
+  } else deadline.setTime(reference.getTime() + options.intervalSeconds * 1_000)
+  return Math.min(Math.floor(deadline.getTime() / 1_000), options.endTimestamp)
+}
+
+declare namespace defaultPayoutDeadline {
+  type Options = {
+    cadence: FormState['payoutCadence']
+    endTimestamp: number
+    intervalSeconds: number
+    startTimestamp: number
+  }
+}
+
+function nextAutomaticPayout(campaign: RewardCampaigns.Campaign) {
+  const deliveredThrough = Number(campaign.deliveredThrough)
+  const executionEndsAt =
+    campaign.execution &&
+    campaign.execution.phase !== 'delivered' &&
+    campaign.execution.phase !== 'failed'
+      ? Number(campaign.execution.endsAt)
+      : deliveredThrough
+  const scheduled =
+    nextAutomaticPayoutForConfig(campaign.config, deliveredThrough) ??
+    nextDeferredRetry(campaign.config, deliveredThrough, campaign.unpaidRecipients)
+  const active = scheduled === undefined ? undefined : Math.max(scheduled, executionEndsAt)
+  if (!campaign.pendingConfig || !campaign.pendingEffectiveAt) return active
+  const effectiveAt = Number(campaign.pendingEffectiveAt)
+  if (active !== undefined && active <= effectiveAt) return active
+  return (
+    nextAutomaticPayoutForConfig(campaign.pendingConfig, effectiveAt) ??
+    nextDeferredRetry(campaign.pendingConfig, effectiveAt, campaign.unpaidRecipients)
+  )
+}
+
+function nextAutomaticPayoutForConfig(config: RewardCampaigns.Config, deliveredThrough: number) {
+  const boost = config.boostRewards
+  if (!boost) return undefined
+  const finalBoundary = scheduleFinalBoundary(boost)
+  if (deliveredThrough >= finalBoundary) return undefined
+  const payout = boost.payoutSchedule
+  if (!payout)
+    return Math.min(
+      Math.max(
+        deliveredThrough + boost.intervalSeconds,
+        boost.startTimestamp + boost.intervalSeconds,
+      ),
+      finalBoundary,
+    )
+  const deadline = (() => {
+    if (deliveredThrough < payout.startTimestamp) return payout.startTimestamp
+    return (
+      payout.startTimestamp +
+      (Math.floor((deliveredThrough - payout.startTimestamp) / payout.intervalSeconds) + 1) *
+        payout.intervalSeconds
+    )
+  })()
+  const settlement =
+    deliveredThrough +
+    Math.ceil((deadline - deliveredThrough) / boost.intervalSeconds) * boost.intervalSeconds
+  return Math.min(settlement, finalBoundary)
+}
+
+function nextDeferredRetry(
+  config: RewardCampaigns.Config,
+  deliveredThrough: number,
+  unpaidRecipients: number,
+) {
+  const boost = config.boostRewards
+  if (!boost || unpaidRecipients === 0 || deliveredThrough < scheduleFinalBoundary(boost))
+    return undefined
+  const campaignFinal = Math.max(
+    config.targetYield ? scheduleFinalBoundary(config.targetYield) : 0,
+    scheduleFinalBoundary(boost),
+  )
+  if (deliveredThrough >= campaignFinal) return undefined
+  return Math.min(deliveredThrough + boost.intervalSeconds, campaignFinal)
+}
+
+function scheduleFinalBoundary(
+  schedule: NonNullable<RewardCampaigns.Config['boostRewards' | 'targetYield']>,
+) {
+  return (
+    schedule.startTimestamp +
+    Math.floor((schedule.endTimestamp - schedule.startTimestamp) / schedule.intervalSeconds) *
+      schedule.intervalSeconds
+  )
+}
+
+function campaignStatus(campaign: RewardCampaigns.Campaign) {
+  if (campaign.paused) return 'Paused'
+  const schedules = [
+    campaign.config.targetYield,
+    campaign.config.boostRewards?.enabled === false ? undefined : campaign.config.boostRewards,
+  ].filter((schedule): schedule is NonNullable<typeof schedule> => schedule !== undefined)
+  if (schedules.length === 0) return 'Disabled'
+  const now = Math.floor(Date.now() / 1_000)
+  const windows = schedules.map((schedule) => ({
+    end: scheduleFinalBoundary(schedule),
+    start: schedule.startTimestamp,
+  }))
+  if (now < Math.min(...windows.map((window) => window.start))) return 'Scheduled'
+  if (now >= Math.max(...windows.map((window) => window.end))) return 'Ended'
+  return windows.some((window) => now >= window.start && now < window.end) ? 'Active' : 'Inactive'
+}
+
+function unixTime(value: number | string) {
+  return new Intl.DateTimeFormat(undefined, {
+    dateStyle: 'medium',
+    timeStyle: 'medium',
+  }).format(new Date(Number(value) * 1_000))
+}