Add template to prod action

app/components/TopBar.tsx

@@ -13,7 +13,7 @@ import { Tool, useEditorStore } from "../stores/EditorStore";
 import { ValidatedForm, useFormContext } from "remix-validated-form";
 import { FormInput, FormSubmitButton } from "./Form";
 import { useEffect, useState } from "react";
-import { editTemplateNamevalidator } from "~/routes/api.update-template-name";
+import { editTemplateNameValidator } from "~/routes/api.update-template-name";
 import { Link, useFetcher } from "@remix-run/react";
 import { action as updateTemplateNameAction } from "~/routes/api.update-template-name";
 import { Spinner } from "./Spinner";
@@ -209,7 +209,7 @@ const TemplateNameButton = ({
         <Dialog.Title>Edit template name</Dialog.Title>
         <ValidatedForm
           id={formId}
-          validator={editTemplateNamevalidator}
+          validator={editTemplateNameValidator}
           defaultValues={{
             templateName: templateName,
           }}
@@ -235,11 +235,11 @@ const TemplateNameButton = ({
                 <Icon name="info" size="lg" />
               </Callout.Icon>
               <Callout.Text>
-                Please change the template name in your code after you changed
-                it here.
+                The template name is used to identify your template in the
+                dashboard.
               </Callout.Text>
             </Callout.Root>{" "}
-            <FormInput name="templateName" placeholder="template-name" />
+            <FormInput name="templateName" placeholder="template name" />
           </div>
 
           <div

app/routes/api.update-template-name.tsx

@@ -5,7 +5,7 @@ import { z } from "zod";
 import { ensureAuthenticated } from "~/libs/lucia";
 import { prisma } from "~/libs/prisma";
 
-export const editTemplateNamevalidator = withZod(
+export const editTemplateNameValidator = withZod(
   z.object({
     templateId: z.string(),
 
@@ -21,7 +21,7 @@ export const editTemplateNamevalidator = withZod(
 export async function action({ context, request }: ActionFunctionArgs) {
   ensureAuthenticated(context.user);
 
-  const result = await editTemplateNamevalidator.validate(
+  const result = await editTemplateNameValidator.validate(
     await request.formData()
   );
 

app/routes/api.update-template-to-prod.tsx

@@ -0,0 +1,61 @@
+import { Prisma } from "@prisma/client";
+import { ActionFunctionArgs, json } from "@remix-run/node";
+import { withZod } from "@remix-validated-form/with-zod";
+import { validationError } from "remix-validated-form";
+import { z } from "zod";
+import { ensureAuthenticated } from "~/libs/lucia";
+import { prisma } from "~/libs/prisma";
+
+export const updateTemplateToProdValidator = withZod(
+  z.object({
+    templateId: z.string(),
+  })
+);
+
+export async function action({ context, request }: ActionFunctionArgs) {
+  ensureAuthenticated(context.user);
+
+  const result = await updateTemplateToProdValidator.validate(
+    await request.formData()
+  );
+
+  if (result.error) {
+    return validationError(result.error);
+  }
+
+  if (!context.user?.id) {
+    return json({ data: "unauthorized" }, { status: 401 });
+  }
+
+  const { templateId } = result.data;
+
+  try {
+    const template = await prisma.template.findUnique({
+      where: {
+        id: templateId,
+      },
+    });
+
+    if (!template) {
+      return json({ data: "not found" }, { status: 404 });
+    }
+
+    if (template.userId !== context.user.id) {
+      return json({ data: "unauthorized" }, { status: 401 });
+    }
+
+    await prisma.template.update({
+      where: {
+        id: templateId,
+      },
+      data: {
+        prodTree: template.tree as unknown as Prisma.JsonArray,
+      },
+    });
+
+    return json({ ok: true });
+  } catch (error) {
+    console.error(error);
+    return json({ data: "error" }, { status: 500 });
+  }
+}