Primary name registration

src/app/providers.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { useMemo } from 'react'
+import { useEffect, useMemo } from 'react'
 import { WagmiProvider, type State } from 'wagmi'
 import { Provider as ReduxProvider } from 'react-redux'
 import { darkTheme, RainbowKitProvider } from '@rainbow-me/rainbowkit'
@@ -33,6 +33,19 @@ const Providers: React.FC<ProviderProps> = ({ children, initialState }) => {
   // const handleInfoBarVisibilityChange = useCallback((visible: boolean) => {
   //   setShowInfoBar(visible)
   // }, [])
+  useEffect(() => {
+    console.clear()
+    console.log(`%c
+  /$$$$$$                     /$$ /$$          
+ /$$__  $$                   |__/| $$          
+| $$  \\__/  /$$$$$$  /$$$$$$  /$$| $$  /$$$$$$$
+| $$ /$$$$ /$$__  $$|____  $$| $$| $$ /$$_____/
+| $$|_  $$| $$  \\__/ /$$$$$$$| $$| $$|  $$$$$$ 
+| $$  \\ $$| $$      /$$__  $$| $$| $$ \\____  $$
+|  $$$$$$/| $$     |  $$$$$$$| $$| $$ /$$$$$$$/
+ \\______/ |__/      \\_______/|__/|__/|_______/                                               
+`, 'color: #ffdfc0;')
+  }, [])
 
   const providers = useMemo(
     () => (

src/components/modal/registration/components/reverse-record.tsx

@@ -10,8 +10,8 @@ const ReverseRecordSection: React.FC<ReverseRecordSectionProps> = ({ reverseReco
     <div className='border-tertiary flex flex-col gap-2 rounded-md border p-3'>
       <div className='flex items-center justify-between'>
         <div className='flex flex-col'>
-          <p className='text-lg font-medium'>Reverse Record</p>
-          <p className='text-neutral text-sm'>ENS names will point to the registrant&apos;s address</p>
+          <p className='text-lg font-medium'>Set as Primary Name</p>
+          <p className='text-neutral text-sm'>Set this name as the primary ENS name for your address</p>
         </div>
         <button
           type='button'

src/components/modal/registration/components/review-form.tsx

@@ -12,7 +12,7 @@ import PerNameDurationEditor from './per-name-duration-editor'
 import CustomOwnerSection from './custom-owner-section'
 import CostSummary from './cost-summary'
 import Calendar from 'public/icons/calendar.svg'
-// import ReverseRecordSection from './reverse-record'
+import ReverseRecordSection from './reverse-record'
 
 interface ReviewFormProps {
   isBulk: boolean
@@ -84,8 +84,8 @@ const ReviewForm: React.FC<ReviewFormProps> = ({
   debouncedCustomOwner,
   account,
   isResolving,
-  // reverseRecord,
-  // setReverseRecord,
+  reverseRecord,
+  setReverseRecord,
   calculationResults,
   hasSufficientBalance,
   allNamesValid,
@@ -198,7 +198,7 @@ const ReviewForm: React.FC<ReviewFormProps> = ({
         gasEstimate={gasEstimate}
         gasPrice={gasPrice}
       />
-      {/* <ReverseRecordSection reverseRecord={reverseRecord} setReverseRecord={setReverseRecord} /> */}
+      {!isBulk && <ReverseRecordSection reverseRecord={reverseRecord} setReverseRecord={setReverseRecord} />}
       <div className='flex flex-col gap-2'>
         <PrimaryButton
           onClick={handleCommit}

src/components/modal/registration/hooks/use-registration-modal.ts

@@ -28,6 +28,7 @@ import {
   resetRegistrationModal,
 } from '@/state/reducers/registration'
 import useBulkRegisterDomains from '@/hooks/registrar/useBulkRegisterDomains'
+import useRegisterDomain from '@/hooks/registrar/useRegisterDomain'
 import useETHPrice from '@/hooks/useETHPrice'
 import { TOKEN_DECIMALS } from '@/constants/web3/tokens'
 import { YEAR_IN_SECONDS } from '@/constants/time'
@@ -70,6 +71,16 @@ const useRegistrationModal = () => {
     getCommitmentAges,
     checkCommitmentAge,
   } = useBulkRegisterDomains()
+  const {
+    makeCommitment,
+    checkAvailable,
+    getRentPrice,
+    submitCommit,
+    submitRegister,
+    generateSecret: generateSingleSecret,
+    checkCommitmentAge: checkSingleCommitmentAge,
+    getCommitmentAges: getSingleCommitmentAges,
+  } = useRegisterDomain()
 
   const [showDatePicker, setShowDatePicker] = useState(false)
   const [showCancelWarning, setShowCancelWarning] = useState(false)
@@ -143,10 +154,15 @@ const useRegistrationModal = () => {
   const allDurationsValid = availableDurations.length === availableEntries.length
 
   const { data: totalPriceData, isLoading: isLoadingPrice } = useQuery({
-    queryKey: ['bulkTotalPrice', availableLabels.join(','), availableDurations.map(String).join(',')],
+    queryKey: ['bulkTotalPrice', isBulk, availableLabels.join(','), availableDurations.map(String).join(',')],
     queryFn: async () => {
       if (availableLabels.length === 0 || !allDurationsValid) return null
-      return getBulkTotalPrice(availableLabels, availableDurations)
+      if (isBulk) {
+        return getBulkTotalPrice(availableLabels, availableDurations)
+      } else {
+        const result = await getRentPrice(availableLabels[0], availableDurations[0])
+        return result?.total ?? null
+      }
     },
     enabled: availableLabels.length > 0 && allDurationsValid,
     refetchInterval: 10000,
@@ -215,12 +231,17 @@ const useRegistrationModal = () => {
 
     const checkAvailability = async () => {
       const labels = entries.map((e) => e.name.replace('.eth', ''))
-      const results = await checkBulkAvailable(labels)
-      dispatch(setBulkAvailability(results))
+      if (isBulk) {
+        const results = await checkBulkAvailable(labels)
+        dispatch(setBulkAvailability(results))
+      } else {
+        const result = await checkAvailable(labels[0])
+        dispatch(setBulkAvailability([result]))
+      }
     }
 
     checkAvailability()
-  }, [isClient, registrationState.isOpen, entries.length, registrationState.flowState])
+  }, [isClient, registrationState.isOpen, entries.length, registrationState.flowState, isBulk])
 
   useEffect(() => {
     entryDurations.forEach((d, i) => {
@@ -243,7 +264,7 @@ const useRegistrationModal = () => {
     if (!lastCommittedBatch?.commitmentTimestamp) return
 
     const interval = setInterval(async () => {
-      const ages = await getCommitmentAges()
+      const ages = isBulk ? await getCommitmentAges() : await getSingleCommitmentAges()
       const currentTime = Math.floor(Date.now() / 1000)
       const timePassed = currentTime - (lastCommittedBatch.commitmentTimestamp || 0)
       const timeRemaining = Math.max(0, ages.min - timePassed)
@@ -256,7 +277,7 @@ const useRegistrationModal = () => {
     }, 1000)
 
     return () => clearInterval(interval)
-  }, [registrationState.flowState, batches, getCommitmentAges])
+  }, [registrationState.flowState, batches, isBulk, getCommitmentAges, getSingleCommitmentAges])
 
   // Auto-reopen removed: when the user minimizes an active registration,
   // we show a toast instead of forcing the modal back open.
@@ -307,9 +328,11 @@ const useRegistrationModal = () => {
         }
 
         if (lastCommittedBatch.commitmentHashes?.[0]) {
-          const commitTimestamp = await checkCommitmentAge(lastCommittedBatch.commitmentHashes[0])
+          const commitTimestamp = isBulk
+            ? await checkCommitmentAge(lastCommittedBatch.commitmentHashes[0])
+            : await checkSingleCommitmentAge(lastCommittedBatch.commitmentHashes[0])
           if (commitTimestamp && commitTimestamp > 0) {
-            const ages = await getCommitmentAges()
+            const ages = isBulk ? await getCommitmentAges() : await getSingleCommitmentAges()
             const age = Math.floor(Date.now() / 1000) - commitTimestamp
             if (age >= ages.min && age <= ages.max) {
               dispatch(setRegistrationFlowState('waiting'))
@@ -405,7 +428,7 @@ const useRegistrationModal = () => {
     dispatch(setRegistrationFlowState('committing'))
 
     try {
-      const commitSecret = secret || generateSecret()
+      const commitSecret = secret || (isBulk ? generateSecret() : generateSingleSecret())
       if (!secret) dispatch(setSecret(commitSecret))
 
       if (batches.length === 0) {
@@ -449,16 +472,32 @@ const useRegistrationModal = () => {
           return BigInt(d || YEAR_IN_SECONDS)
         })
 
-        const hashes = await makeBulkCommitments(
-          batchLabels,
-          owner,
-          batchDurations,
-          commitSecret,
-          reverseRecord ? 1 : 0
-        )
-        dispatch(setBatchCommitmentData({ batchIndex, hashes, timestamp: 0 }))
+        let hashes: Hex[]
+        let tx: Hex
+
+        if (isBulk) {
+          hashes = await makeBulkCommitments(
+            batchLabels,
+            owner,
+            batchDurations,
+            commitSecret,
+            reverseRecord ? 1 : 0
+          )
+          dispatch(setBatchCommitmentData({ batchIndex, hashes, timestamp: 0 }))
+          tx = await submitMultiCommit(hashes)
+        } else {
+          const hash = await makeCommitment({
+            label: batchLabels[0],
+            owner,
+            duration: batchDurations[0],
+            secret: commitSecret,
+            reverseRecord,
+          })
+          hashes = [hash]
+          dispatch(setBatchCommitmentData({ batchIndex, hashes, timestamp: 0 }))
+          tx = await submitCommit(hash)
+        }
 
-        const tx = await submitMultiCommit(hashes)
         dispatch(setBatchCommitTxHash({ batchIndex, txHash: tx }))
 
         const receipt = publicClient ? await waitForTransaction(publicClient, tx) : undefined
@@ -491,9 +530,14 @@ const useRegistrationModal = () => {
     secret,
     batches,
     entryDurations,
+    isBulk,
+    reverseRecord,
     generateSecret,
+    generateSingleSecret,
     makeBulkCommitments,
     submitMultiCommit,
+    makeCommitment,
+    submitCommit,
     publicClient,
     dispatch,
   ])
@@ -524,21 +568,44 @@ const useRegistrationModal = () => {
           return BigInt(d || YEAR_IN_SECONDS)
         })
 
-        const batchPrice = await getBulkTotalPrice(batchLabels, batchDurations)
-        if (!batchPrice) {
-          dispatch(setRegistrationError(`Failed to get price for batch ${batchIndex + 1}`))
-          return
+        let tx: Hex
+
+        if (isBulk) {
+          const batchPrice = await getBulkTotalPrice(batchLabels, batchDurations)
+          if (!batchPrice) {
+            dispatch(setRegistrationError(`Failed to get price for batch ${batchIndex + 1}`))
+            return
+          }
+          const valueWithBuffer = (batchPrice * BigInt(105)) / BigInt(100)
+
+          tx = await submitMultiRegister(
+            batchLabels,
+            owner,
+            batchDurations,
+            secret,
+            valueWithBuffer,
+            reverseRecord ? 1 : 0
+          )
+        } else {
+          const priceResult = await getRentPrice(batchLabels[0], batchDurations[0])
+          if (!priceResult) {
+            dispatch(setRegistrationError('Failed to get price'))
+            return
+          }
+          const valueWithBuffer = (priceResult.total * BigInt(105)) / BigInt(100)
+
+          tx = await submitRegister(
+            {
+              label: batchLabels[0],
+              owner,
+              duration: batchDurations[0],
+              secret,
+              reverseRecord,
+            },
+            valueWithBuffer
+          )
         }
-        const valueWithBuffer = (batchPrice * BigInt(105)) / BigInt(100)
-
-        const tx = await submitMultiRegister(
-          batchLabels,
-          owner,
-          batchDurations,
-          secret,
-          valueWithBuffer,
-          reverseRecord ? 1 : 0
-        )
+
         dispatch(setBatchRegisterTxHash({ batchIndex, txHash: tx }))
 
         const receipt = publicClient ? await waitForTransaction(publicClient, tx) : undefined
@@ -579,8 +646,12 @@ const useRegistrationModal = () => {
     getOwnerAddress,
     batches,
     entryDurations,
+    isBulk,
+    reverseRecord,
     getBulkTotalPrice,
     submitMultiRegister,
+    getRentPrice,
+    submitRegister,
     publicClient,
     cartRegisteredDomains,
     cartUnregisteredDomains,

src/hooks/registrar/useRegisterDomain.ts

@@ -41,7 +41,7 @@ const useRegisterDomain = () => {
       secret: params.secret,
       resolver: params.resolver || ENS_PUBLIC_RESOLVER_ADDRESS,
       data: params.data || ([] as `0x${string}`[]),
-      reverseRecord: params.reverseRecord ? 1 : 0,
+      reverseRecord: params.reverseRecord ? 2 : 0,
       referrer: params.referrer || ENS_HOLIDAY_REFERRER_ADDRESS,
     }
 
@@ -177,7 +177,7 @@ const useRegisterDomain = () => {
       secret: params.secret,
       resolver: params.resolver || ENS_PUBLIC_RESOLVER_ADDRESS,
       data: params.data || ([] as `0x${string}`[]),
-      reverseRecord: params.reverseRecord ? 1 : 0,
+      reverseRecord: params.reverseRecord ? 2 : 0,
       referrer: params.referrer || ENS_HOLIDAY_REFERRER_ADDRESS,
     }
 

src/hooks/useAuthStatus.ts

@@ -79,7 +79,6 @@ export const useAuth = () => {
         // escape early if no token is found
         if (!token || token.length === 0) return 'unauthenticated'
 
-        console.log('token found')
         setIsSigningIn(true)
 
         const authenticateRes = await checkAuthentication()