From d7b8a9cca69c8839d1362df9d4d2421703455776 Mon Sep 17 00:00:00 2001
From: KM Koushik <koushikmohan1996@gmail.com>
Date: Tue, 28 May 2024 06:34:01 +1000
Subject: [PATCH] Add verify domain button (#22)

---
 .../migration.sql                             |  2 +
 apps/web/prisma/schema.prisma                 |  1 +
 .../(dashboard)/domains/[domainId]/page.tsx   | 58 ++++++++++++++++---
 .../app/(dashboard)/domains/add-domain.tsx    |  5 +-
 apps/web/src/server/api/routers/domain.ts     |  9 +++
 apps/web/src/server/service/domain-service.ts | 40 ++++++-------
 6 files changed, 83 insertions(+), 32 deletions(-)
 create mode 100644 apps/web/prisma/migrations/20240527202531_add_is_verifying/migration.sql

diff --git a/apps/web/prisma/migrations/20240527202531_add_is_verifying/migration.sql b/apps/web/prisma/migrations/20240527202531_add_is_verifying/migration.sql
new file mode 100644
index 0000000..104676b
--- /dev/null
+++ b/apps/web/prisma/migrations/20240527202531_add_is_verifying/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "Domain" ADD COLUMN     "isVerifying" BOOLEAN NOT NULL DEFAULT false;
diff --git a/apps/web/prisma/schema.prisma b/apps/web/prisma/schema.prisma
index 9dd4616..db145dc 100644
--- a/apps/web/prisma/schema.prisma
+++ b/apps/web/prisma/schema.prisma
@@ -115,6 +115,7 @@ model Domain {
   dmarcAdded    Boolean      @default(false)
   errorMessage  String?
   subdomain     String?
+  isVerifying   Boolean      @default(false)
   createdAt     DateTime     @default(now())
   updatedAt     DateTime     @updatedAt
   team          Team         @relation(fields: [teamId], references: [id], onDelete: Cascade)
diff --git a/apps/web/src/app/(dashboard)/domains/[domainId]/page.tsx b/apps/web/src/app/(dashboard)/domains/[domainId]/page.tsx
index a468109..d06ffee 100644
--- a/apps/web/src/app/(dashboard)/domains/[domainId]/page.tsx
+++ b/apps/web/src/app/(dashboard)/domains/[domainId]/page.tsx
@@ -24,15 +24,35 @@ import React from "react";
 import { Switch } from "@unsend/ui/src/switch";
 import DeleteDomain from "./delete-domain";
 import SendTestMail from "./send-test-mail";
+import { Button } from "@unsend/ui/src/button";
 
 export default function DomainItemPage({
   params,
 }: {
   params: { domainId: string };
 }) {
-  const domainQuery = api.domain.getDomain.useQuery({
-    id: Number(params.domainId),
-  });
+  const domainQuery = api.domain.getDomain.useQuery(
+    {
+      id: Number(params.domainId),
+    },
+    {
+      refetchInterval: (q) => (q?.state.data?.isVerifying ? 10000 : false),
+      refetchIntervalInBackground: true,
+    }
+  );
+
+  const verifyQuery = api.domain.startVerification.useMutation();
+
+  const handleVerify = () => {
+    verifyQuery.mutate(
+      { id: Number(params.domainId) },
+      {
+        onSettled: () => {
+          domainQuery.refetch();
+        },
+      }
+    );
+  };
 
   return (
     <div>
@@ -67,9 +87,24 @@ export default function DomainItemPage({
                 />
               </div>
             </div>
-            {domainQuery.data ? (
-              <SendTestMail domain={domainQuery.data} />
-            ) : null}
+            <div className="flex gap-4">
+              <div>
+                <Button
+                  variant="outline"
+                  onClick={handleVerify}
+                  disabled={domainQuery.data?.isVerifying}
+                >
+                  {domainQuery.data?.isVerifying
+                    ? "Verifying..."
+                    : domainQuery.data?.status === DomainStatus.SUCCESS
+                      ? "Verify again"
+                      : "Verify domain"}
+                </Button>
+              </div>
+              {domainQuery.data ? (
+                <SendTestMail domain={domainQuery.data} />
+              ) : null}
+            </div>
           </div>
 
           <div className=" border rounded-lg p-4">
@@ -155,9 +190,14 @@ export default function DomainItemPage({
                 <TableRow>
                   <TableCell className="">TXT</TableCell>
                   <TableCell>
-                    <TextWithCopyButton
-                      value={`_dmarc.${domainQuery.data?.subdomain || domainQuery.data?.name}`}
-                    />
+                    <div className="flex gap-2 items-center">
+                      <span className="text-sm text-muted-foreground">
+                        (optional)
+                      </span>
+                      <TextWithCopyButton
+                        value={`_dmarc.${domainQuery.data?.subdomain || domainQuery.data?.name}`}
+                      />
+                    </div>
                   </TableCell>
                   <TableCell className="">
                     <TextWithCopyButton
diff --git a/apps/web/src/app/(dashboard)/domains/add-domain.tsx b/apps/web/src/app/(dashboard)/domains/add-domain.tsx
index 3c94a2d..ee9c5ab 100644
--- a/apps/web/src/app/(dashboard)/domains/add-domain.tsx
+++ b/apps/web/src/app/(dashboard)/domains/add-domain.tsx
@@ -16,6 +16,7 @@ import {
 import { api } from "~/trpc/react";
 import { useState } from "react";
 import { Plus } from "lucide-react";
+import { useRouter } from "next/navigation";
 
 export default function AddDomain() {
   const [open, setOpen] = useState(false);
@@ -23,6 +24,7 @@ export default function AddDomain() {
   const addDomainMutation = api.domain.createDomain.useMutation();
 
   const utils = api.useUtils();
+  const router = useRouter();
 
   function handleSave() {
     addDomainMutation.mutate(
@@ -30,8 +32,9 @@ export default function AddDomain() {
         name: domainName,
       },
       {
-        onSuccess: () => {
+        onSuccess: async (data) => {
           utils.domain.domains.invalidate();
+          await router.push(`/domains/${data.id}`);
           setOpen(false);
         },
       }
diff --git a/apps/web/src/server/api/routers/domain.ts b/apps/web/src/server/api/routers/domain.ts
index 19ed08f..4b55312 100644
--- a/apps/web/src/server/api/routers/domain.ts
+++ b/apps/web/src/server/api/routers/domain.ts
@@ -17,6 +17,15 @@ export const domainRouter = createTRPCRouter({
       return createDomain(ctx.team.id, input.name);
     }),
 
+  startVerification: teamProcedure
+    .input(z.object({ id: z.number() }))
+    .mutation(async ({ ctx, input }) => {
+      await ctx.db.domain.update({
+        where: { id: input.id },
+        data: { isVerifying: true },
+      });
+    }),
+
   domains: teamProcedure.query(async ({ ctx }) => {
     const domains = await db.domain.findMany({
       where: {
diff --git a/apps/web/src/server/service/domain-service.ts b/apps/web/src/server/service/domain-service.ts
index e968d48..8419b17 100644
--- a/apps/web/src/server/service/domain-service.ts
+++ b/apps/web/src/server/service/domain-service.ts
@@ -33,7 +33,7 @@ export async function getDomain(id: number) {
     throw new Error("Domain not found");
   }
 
-  if (domain.status !== "SUCCESS") {
+  if (domain.isVerifying) {
     const domainIdentity = await ses.getDomainIdentity(
       domain.name,
       domain.region
@@ -48,27 +48,23 @@ export async function getDomain(id: number) {
     const _dmarcRecord = await getDmarcRecord(domain.name);
     const dmarcRecord = _dmarcRecord?.[0]?.[0];
 
-    console.log(domainIdentity);
-    console.log(dmarcRecord);
-
-    if (
-      domain.dkimStatus !== dkimStatus ||
-      domain.spfDetails !== spfDetails ||
-      domain.status !== verificationStatus ||
-      domain.dmarcAdded !== (dmarcRecord ? true : false)
-    ) {
-      domain = await db.domain.update({
-        where: {
-          id,
-        },
-        data: {
-          dkimStatus,
-          spfDetails,
-          status: verificationStatus ?? "NOT_STARTED",
-          dmarcAdded: dmarcRecord ? true : false,
-        },
-      });
-    }
+    domain = await db.domain.update({
+      where: {
+        id,
+      },
+      data: {
+        dkimStatus,
+        spfDetails,
+        status: verificationStatus ?? "NOT_STARTED",
+        dmarcAdded: dmarcRecord ? true : false,
+        isVerifying:
+          verificationStatus === "SUCCESS" &&
+          dkimStatus === "SUCCESS" &&
+          spfDetails === "SUCCESS"
+            ? false
+            : true,
+      },
+    });
 
     return {
       ...domain,