refactor: remove and verify domain by id (#3971)

Here exposed domain id and used it for remove and verify operations to avoid additional roundtrips to db.
webstudio-is · Aug 24, 2024 · 8460cef · 8460cef
1 parent 0b0707e
commit 8460cef
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 52 deletions.
diff --git a/apps/builder/app/builder/features/topbar/domains.tsx b/apps/builder/app/builder/features/topbar/domains.tsx
@@ -30,6 +30,7 @@ import { $publisherHost } from "~/shared/nano-states";
 
 export type Domain = {
   projectId: Project["id"];
+  domainId: string;
   domain: {
     domain: string;
     error: string | null;
@@ -241,6 +242,7 @@ const DomainItem = (props: {
 
   const { initiallyOpen } = props;
 
+  const domainId = props.projectDomain.domainId;
   const domain = props.projectDomain.domain.domain;
   const domainStatus = props.projectDomain.domain.status;
   const domainError = props.projectDomain.domain.error;
@@ -255,7 +257,7 @@ const DomainItem = (props: {
   const handleVerify = useCallback(() => {
     verify(
       {
-        domain,
+        domainId,
         projectId,
       },
       (verifyResponse) => {
@@ -268,7 +270,7 @@ const DomainItem = (props: {
         }
       }
     );
-  }, [domain, projectId, refreshDomainResult, verify]);
+  }, [domainId, projectId, refreshDomainResult, verify]);
 
   // @todo this should gone https://github.com/webstudio-is/webstudio/issues/1723
   const handleUpdateStatus = useCallback(() => {
@@ -340,7 +342,7 @@ const DomainItem = (props: {
   ]);
 
   const publisherHost = useStore($publisherHost);
-  const cnameEntryName = getCname(props.projectDomain.domain.domain);
+  const cnameEntryName = getCname(domain);
   const cnameEntryValue = `${props.projectDomain.cname}.customers.${publisherHost}`;
 
   const txtEntryName =
@@ -372,22 +374,20 @@ const DomainItem = (props: {
   return (
     <CollapsibleDomainSection
       initiallyOpen={props.initiallyOpen}
-      title={props.projectDomain.domain.domain}
+      title={domain}
       suffix={
         <Grid flow="column">
           <StatusIcon
             isLoading={isStatusLoading}
             projectDomain={props.projectDomain}
           />
 
-          <Tooltip content={`Proceed to ${props.projectDomain.domain.domain}`}>
+          <Tooltip content={`Proceed to ${domain}`}>
             <IconButton
               tabIndex={-1}
               disabled={status !== "VERIFIED_ACTIVE"}
               onClick={(event) => {
-                const url = new URL(
-                  `https://${props.projectDomain.domain.domain}`
-                );
+                const url = new URL(`https://${domain}`);
                 window.open(url.href, "_blank");
                 event.preventDefault();
               }}
@@ -446,17 +446,9 @@ const DomainItem = (props: {
         color="neutral"
         css={{ width: "100%", flexShrink: 0 }}
         onClick={() => {
-          remove(
-            {
-              domain: props.projectDomain.domain.domain,
-              projectId: props.projectDomain.projectId,
-            },
-            () => {
-              props.refreshDomainResult({
-                projectId: props.projectDomain.projectId,
-              });
-            }
-          );
+          remove({ projectId, domainId }, () => {
+            props.refreshDomainResult({ projectId });
+          });
         }}
       >
         Remove domain
@@ -557,7 +549,7 @@ const DomainItem = (props: {
 
         <Entri
           dnsRecords={dnsRecords}
-          domain={props.projectDomain.domain.domain}
+          domain={domain}
           onClose={() => {
             // Sometimes Entri modal dialog hangs even if it's successful,
             // until they fix that, we'll just refresh the status here on every onClose event

diff --git a/packages/domain/src/db/domain.ts b/packages/domain/src/db/domain.ts
@@ -147,8 +147,8 @@ export const create = async (
  */
 export const verify = async (
   props: {
-    projectId: Project["id"];
-    domain: string;
+    projectId: string;
+    domainId: string;
   },
   context: AppContext
 ): Promise<Result> => {
@@ -162,20 +162,10 @@ export const verify = async (
     throw new Error("You don't have access to create this project domains");
   }
 
-  const validationResult = validateDomain(props.domain);
-
-  if (validationResult.success === false) {
-    return validationResult;
-  }
-
-  const { domain } = validationResult;
-
   const projectDomain = await prisma.projectWithDomain.findFirstOrThrow({
     where: {
       projectId: props.projectId,
-      domain: {
-        domain,
-      },
+      domainId: props.domainId,
     },
     include: {
       domain: true,
@@ -184,7 +174,7 @@ export const verify = async (
 
   // @todo: TXT verification and domain initialization should be implemented in the future as queue service
   const createDomainResult = await context.domain.domainTrpc.create.mutate({
-    domain,
+    domain: projectDomain.domain.domain,
     txtRecord: projectDomain.txtRecord,
   });
 
@@ -194,7 +184,7 @@ export const verify = async (
 
   await prisma.domain.update({
     where: {
-      domain,
+      id: props.domainId,
     },
     data: {
       status: "PENDING",
@@ -210,8 +200,8 @@ export const verify = async (
  */
 export const remove = async (
   props: {
-    projectId: Project["id"];
-    domain: string;
+    projectId: string;
+    domainId: string;
   },
   context: AppContext
 ): Promise<Result> => {
@@ -225,20 +215,10 @@ export const remove = async (
     throw new Error("You don't have access to delete this project domains");
   }
 
-  const validationResult = validateDomain(props.domain);
-
-  if (validationResult.success === false) {
-    return validationResult;
-  }
-
-  const { domain } = validationResult;
-
   await prisma.projectDomain.deleteMany({
     where: {
       projectId: props.projectId,
-      domain: {
-        domain,
-      },
+      domainId: props.domainId,
     },
   });
 

diff --git a/packages/domain/src/trpc/domain.ts b/packages/domain/src/trpc/domain.ts
@@ -206,15 +206,15 @@ export const domainRouter = router({
     .input(
       z.object({
         projectId: z.string(),
-        domain: z.string(),
+        domainId: z.string(),
       })
     )
     .mutation(async ({ input, ctx }) => {
       try {
         return await db.verify(
           {
             projectId: input.projectId,
-            domain: input.domain,
+            domainId: input.domainId,
           },
           ctx
         );
@@ -229,15 +229,15 @@ export const domainRouter = router({
     .input(
       z.object({
         projectId: z.string(),
-        domain: z.string(),
+        domainId: z.string(),
       })
     )
     .mutation(async ({ input, ctx }) => {
       try {
         return await db.remove(
           {
             projectId: input.projectId,
-            domain: input.domain,
+            domainId: input.domainId,
           },
           ctx
         );