diff --git a/src/components/MembershipDetails.tsx b/src/components/MembershipDetails.tsx index b60f515..0481b2b 100644 --- a/src/components/MembershipDetails.tsx +++ b/src/components/MembershipDetails.tsx @@ -5,6 +5,7 @@ import { ethers } from 'ethers'; import { MembershipState } from '@waku/rln'; import { useRLN } from '../contexts/rln/RLNContext'; import { toast } from 'sonner'; +import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from './ui/tooltip'; interface MembershipDetailsProps { membershipInfo: { @@ -177,7 +178,21 @@ export function MembershipDetails({ membershipInfo, copyToClipboard, hash }: Mem
Rate Limit: -
{membershipInfo.rateLimit} msg/epoch
+
+ {membershipInfo.rateLimit} msg/epoch + + + + + i + + + + 1 epoch = 10 minutes + + + +
{/* Contract Info */} diff --git a/src/components/Tabs/MembershipTab/MembershipRegistration.tsx b/src/components/Tabs/MembershipTab/MembershipRegistration.tsx index 4801c90..384e36f 100644 --- a/src/components/Tabs/MembershipTab/MembershipRegistration.tsx +++ b/src/components/Tabs/MembershipTab/MembershipRegistration.tsx @@ -6,10 +6,11 @@ import { KeystoreEntity } from '@waku/rln'; import { useRLN } from '../../../contexts/rln/RLNContext'; import { useWallet } from '../../../contexts/wallet'; import { TerminalWindow } from '../../ui/terminal-window'; -import { Slider } from '../../ui/slider'; +import { ToggleGroup, ToggleGroupItem } from '../../ui/toggle-group'; import { Button } from '../../ui/button'; import { membershipRegistration, type ContentSegment } from '../../../content/index'; import { toast } from 'sonner'; +import { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } from '../../ui/tooltip'; interface MembershipRegistrationProps { tabId?: string; @@ -17,10 +18,11 @@ interface MembershipRegistrationProps { // eslint-disable-next-line @typescript-eslint/no-unused-vars export function MembershipRegistration({ tabId: _tabId }: MembershipRegistrationProps) { - const { registerMembership, isInitialized, isStarted, rateMinLimit, rateMaxLimit, error, isLoading } = useRLN(); + const { registerMembership, isInitialized, isStarted, error, isLoading } = useRLN(); const { isConnected, chainId } = useWallet(); - const [rateLimit, setRateLimit] = useState(rateMinLimit); + // Replace slider state with discrete options + const [rateLimit, setRateLimit] = useState(300); // Default to Standard const [isRegistering, setIsRegistering] = useState(false); const [saveToKeystore, setSaveToKeystore] = useState(true); const [keystorePassword, setKeystorePassword] = useState(''); @@ -172,22 +174,41 @@ export function MembershipRegistration({ tabId: _tabId }: MembershipRegistration
- setRateLimit(value[0])} + { + if (value === '300' || value === '600') setRateLimit(Number(value)); + }} className="w-full" - /> - - {rateLimit} - + > + + Standard (300) + lower cost + + + Max (600) + higher cost, more messages + +