custom domain form and validation; FAILED verification only if it was VERIFIED

Soxasora · Soxasora · commit 3ac04a60c997 · 2025-03-13T15:28:28.000Z
diff --git a/api/resolvers/sub.js b/api/resolvers/sub.js
@@ -1,10 +1,11 @@
 import { whenRange } from '@/lib/time'
-import { validateSchema, validateDomain, territorySchema } from '@/lib/validate'
+import { validateSchema, customDomainSchema, territorySchema } from '@/lib/validate'
 import { decodeCursor, LIMIT, nextCursorEncoded } from '@/lib/cursor'
 import { viewGroup } from './growth'
 import { notifyTerritoryTransfer } from '@/lib/webPush'
 import performPaidAction from '../paidAction'
 import { GqlAuthenticationError, GqlInputError } from '@/lib/error'
+import { randomBytes } from 'node:crypto'
 
 export async function getSub (parent, { name }, { models, me }) {
   if (!name) return null
@@ -292,16 +293,32 @@ export default {
         throw new GqlInputError('you do not own this sub')
       }
       domain = domain.trim()
-      if (domain && !validateDomain(domain)) {
+      if (domain && !validateSchema(customDomainSchema, { domain })) {
         throw new GqlInputError('Invalid domain format')
       }
 
+      console.log('domain', domain)
+      console.log('sub.customDomain?.domain', sub.customDomain?.domain)
+
       if (domain) {
         const existing = await models.customDomain.findUnique({ where: { subName } })
         if (existing) {
+          if (domain === existing.domain) {
+            throw new GqlInputError('domain already set')
+          }
           return await models.customDomain.update({ where: { subName }, data: { domain, verificationState: 'PENDING' } })
         } else {
-          return await models.customDomain.create({ data: { domain, subName, verificationState: 'PENDING' } })
+          return await models.customDomain.create({
+            data: {
+              domain,
+              verificationState: 'PENDING',
+              cname: 'parallel.soxa.dev',
+              verificationTxt: randomBytes(32).toString('base64'),
+              sub: {
+                connect: { name: subName }
+              }
+            }
+          })
         }
       } else {
         return await models.customDomain.delete({ where: { subName } })
diff --git a/components/territory-domains.js b/components/territory-domains.js
@@ -3,17 +3,19 @@ import { Badge } from 'react-bootstrap'
 import { Form, Input, SubmitButton } from './form'
 import { gql, useMutation } from '@apollo/client'
 import Info from './info'
+import { customDomainSchema } from '@/lib/validate'
+import ActionTooltip from './action-tooltip'
 
 const UPDATE_CUSTOM_DOMAIN = gql`
   mutation UpdateCustomDomain($subName: String!, $domain: String!) {
     updateCustomDomain(subName: $subName, domain: $domain) {
       domain
       verificationState
-      lastVerifiedAt
     }
   }
 `
 
+// TODO: verification states should refresh
 export default function CustomDomainForm ({ sub }) {
   const [updateCustomDomain] = useMutation(UPDATE_CUSTOM_DOMAIN)
   const [error, setError] = useState(null)
@@ -45,14 +47,25 @@ export default function CustomDomainForm ({ sub }) {
     }
   }
 
+  const getSSLStatusBadge = (sslEnabled) => {
+    switch (sslEnabled) {
+      case true:
+        return <Badge bg='success'>SSL enabled</Badge>
+      case false:
+        return <Badge bg='danger'>SSL disabled</Badge>
+    }
+  }
+
   return (
     <Form
       initial={{
         domain: sub?.customDomain?.domain || ''
       }}
+      schema={customDomainSchema}
       onSubmit={onSubmit}
       className='mb-2'
     >
+      {/* todo: too many flexes */}
       <div className='d-flex align-items-center gap-2'>
         <Input
           label={
@@ -61,25 +74,25 @@ export default function CustomDomainForm ({ sub }) {
               {error && <Info variant='danger'>error</Info>}
               {success && <Info variant='success'>Domain settings updated successfully!</Info>}
               {sub?.customDomain && (
-                <div className='d-flex align-items-center gap-2'>
-                  {getStatusBadge(sub.customDomain.verificationState)}
-                  <span className='text-muted'>
-                    {sub.customDomain.lastVerifiedAt &&
-                    ` (Last checked: ${new Date(sub.customDomain.lastVerifiedAt).toLocaleString()})`}
-                  </span>
-
-                  {sub.customDomain.verificationState === 'PENDING' && (
-                    <Info>
-                      <h6>Verify your domain</h6>
-                      <p>Add the following DNS records to verify ownership of your domain:</p>
-                      <pre>
-                        CNAME record:
-                        Host: @
-                        Value: stacker.news
-                      </pre>
-                    </Info>
-                  )}
-                </div>
+                <>
+                  <div className='d-flex align-items-center gap-2'>
+                    <ActionTooltip overlayText={new Date(sub.customDomain.lastVerifiedAt).toUTCString()}>
+                      {getStatusBadge(sub.customDomain.verificationState)}
+                    </ActionTooltip>
+                    {getSSLStatusBadge(sub.customDomain.sslEnabled)}
+                    {sub.customDomain.verificationState === 'PENDING' && (
+                      <Info>
+                        <h6>Verify your domain</h6>
+                        <p>Add the following DNS records to verify ownership of your domain:</p>
+                        <pre>
+                          CNAME record:
+                          Host: @
+                          Value: stacker.news
+                        </pre>
+                      </Info>
+                    )}
+                  </div>
+                </>
               )}
             </div>
           }
diff --git a/components/territory-form.js b/components/territory-form.js
@@ -280,21 +280,6 @@ export default function TerritoryForm ({ sub }) {
             </>
           }
         />
-        <AccordianItem
-          header={<div style={{ fontWeight: 'bold', fontSize: '92%' }}>personalization</div>}
-          body={
-            <>
-              <TerritoryDomains sub={sub} />
-              {sub?.customDomain?.verificationState === 'VERIFIED' &&
-                <>
-                  <BootstrapForm.Label>[NOT IMPLEMENTED] branding</BootstrapForm.Label>
-                  <div className='mb-3'>WIP</div>
-                  <BootstrapForm.Label>[NOT IMPLEMENTED] color scheme</BootstrapForm.Label>
-                  <div className='mb-3'>WIP</div>
-                </>}
-            </>
-          }
-        />
         <div className='mt-3 d-flex justify-content-end'>
           <FeeButton
             text={sub ? 'save' : 'found it'}
@@ -303,6 +288,21 @@ export default function TerritoryForm ({ sub }) {
           />
         </div>
       </Form>
+      <AccordianItem
+        header={<div style={{ fontWeight: 'bold', fontSize: '92%' }}>personalization</div>}
+        body={
+          <>
+            <TerritoryDomains sub={sub} />
+            {sub?.customDomain?.verificationState === 'VERIFIED' &&
+              <>
+                <BootstrapForm.Label>[NOT IMPLEMENTED] branding</BootstrapForm.Label>
+                <div className='mb-3'>WIP</div>
+                <BootstrapForm.Label>[NOT IMPLEMENTED] color scheme</BootstrapForm.Label>
+                <div className='mb-3'>WIP</div>
+              </>}
+          </>
+        }
+      />
     </FeeButtonProvider>
   )
 }
diff --git a/lib/validate.js b/lib/validate.js
@@ -349,7 +349,7 @@ export function territoryTransferSchema ({ me, ...args }) {
 // TODO: validate domain
 export function customDomainSchema (args) {
   return object({
-    customDomain: string().matches(/^([a-zA-Z0-9]([a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?\.)+[a-zA-Z]{2,}$/, {
+    domain: string().matches(/^([a-zA-Z0-9]([a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?\.)+[a-zA-Z]{2,}$/, {
       message: 'enter a valid domain name (e.g., example.com)'
     }).nullable()
   })
diff --git a/middleware.js b/middleware.js
@@ -52,6 +52,7 @@ export async function customDomainMiddleware (request, referrerResp) {
   console.log('domainMapping', domainMapping)
   const domainInfo = domainMapping?.[host.toLowerCase()]
   if (!domainInfo) {
+    console.log('Redirecting to main domain')
     return NextResponse.redirect(new URL(pathname, mainDomain))
   }
 
diff --git a/prisma/migrations/20250304121322_custom_domains/migration.sql b/prisma/migrations/20250304121322_custom_domains/migration.sql
@@ -9,6 +9,8 @@ CREATE TABLE "CustomDomain" (
     "sslCertExpiry" TIMESTAMP(3),
     "verificationState" TEXT,
     "lastVerifiedAt" TIMESTAMP(3),
+    "cname" TEXT NOT NULL,
+    "verificationTxt" TEXT NOT NULL,
 
     CONSTRAINT "CustomDomain_pkey" PRIMARY KEY ("id")
 );
@@ -27,3 +29,21 @@ CREATE INDEX "CustomDomain_created_at_idx" ON "CustomDomain"("created_at");
 
 -- AddForeignKey
 ALTER TABLE "CustomDomain" ADD CONSTRAINT "CustomDomain_subName_fkey" FOREIGN KEY ("subName") REFERENCES "Sub"("name") ON DELETE CASCADE ON UPDATE CASCADE;
+
+CREATE OR REPLACE FUNCTION schedule_domain_verification_job()
+RETURNS INTEGER
+LANGUAGE plpgsql
+AS $$
+DECLARE
+BEGIN
+    -- every 5 minutes
+    INSERT INTO pgboss.schedule (name, cron, timezone)
+    VALUES ('domainVerification', '*/5 * * * *', 'America/Chicago') ON CONFLICT DO NOTHING;
+    return 0;
+EXCEPTION WHEN OTHERS THEN
+    return 0;
+END;
+$$;
+
+SELECT schedule_domain_verification_job();
+DROP FUNCTION IF EXISTS schedule_domain_verification_job;
diff --git a/prisma/migrations/20250311105915_verify_dns_records/migration.sql b/prisma/migrations/20250311105915_verify_dns_records/migration.sql
diff --git a/prisma/migrations/20250311112522_domain_verification_job/migration.sql b/prisma/migrations/20250311112522_domain_verification_job/migration.sql
diff --git a/worker/domainVerification.js b/worker/domainVerification.js
@@ -15,7 +15,12 @@ export async function domainVerification () {
         console.log(`${domainName}: TXT ${txtValid ? 'valid' : 'invalid'}, CNAME ${cnameValid ? 'valid' : 'invalid'}`)
 
         // verificationState is based on the results of the TXT and CNAME checks
-        const verificationState = (txtValid && cnameValid) ? 'VERIFIED' : 'FAILED'
+        const verificationResult = txtValid && cnameValid
+        const verificationState = verificationResult // TODO: clean this up, working proof of concept
+          ? 'VERIFIED'
+          : domain.verificationState === 'PENDING' && !verificationResult
+            ? 'PENDING'
+            : 'FAILED'
         await models.customDomain.update({
           where: { id },
           data: { verificationState, lastVerifiedAt: new Date() }
@@ -27,10 +32,11 @@ export async function domainVerification () {
       } catch (error) {
         console.error(`Failed to verify domain ${domainName}:`, error)
 
+        // TODO: DNS inconcistencies can happen, we should retry at least 3 times before marking it as FAILED
         // Update to FAILED on any error
         await models.customDomain.update({
           where: { id },
-          data: { verificationState: 'NOT_VERIFIED', lastVerifiedAt: new Date() }
+          data: { verificationState: 'FAILED', lastVerifiedAt: new Date() }
         })
       }
     }

Original file line number	Diff line number	Diff line change
`@@ -52,6 +52,7 @@ export async function customDomainMiddleware (request, referrerResp) {`
`52`	`52`	`console.log('domainMapping', domainMapping)`
`53`	`53`	`const domainInfo = domainMapping?.[host.toLowerCase()]`
`54`	`54`	`if (!domainInfo) {`
	`55`	`+ console.log('Redirecting to main domain')`
`55`	`56`	`return NextResponse.redirect(new URL(pathname, mainDomain))`
`56`	`57`	`}`
`57`	`58`