chore: minor fixes (#74)

eight-labs · Jun 5, 2024 · cdbbb2f · cdbbb2f
1 parent 8acf829
commit cdbbb2f
Show file tree

Hide file tree

Showing 8 changed files with 69 additions and 154 deletions.
diff --git a/apps/web/package.json b/apps/web/package.json
@@ -28,12 +28,9 @@
     "@trpc/client": "next",
     "@trpc/react-query": "next",
     "@trpc/server": "next",
-    "clsx": "^2.1.1",
     "date-fns": "^3.6.0",
-    "geist": "^1.3.0",
     "lucide-react": "^0.379.0",
     "minio": "^8.0.0",
-    "nanoid": "^5.0.7",
     "next": "14.2.3",
     "next-themes": "^0.3.0",
     "nodemailer": "^6.9.13",
@@ -43,10 +40,7 @@
     "server-only": "^0.0.1",
     "sonner": "^1.4.41",
     "superjson": "^2.2.1",
-    "tailwind-merge": "^2.3.0",
-    "tailwindcss-animate": "^1.0.7",
     "ts-pattern": "^5.1.2",
-    "uploadthing": "^6.10.4",
     "zod": "^3.23.8"
   },
   "devDependencies": {

diff --git a/apps/web/src/app/(landing)/layout.tsx b/apps/web/src/app/(landing)/layout.tsx
@@ -1,4 +1,5 @@
 import { type ReactNode } from 'react';
+import { redirect } from 'next/navigation';
 
 import { validateRequest } from '@formbase/auth';
 
@@ -8,6 +9,10 @@ import { SiteFooter } from './_components/site-footer';
 async function LandingPageLayout({ children }: { children: ReactNode }) {
   const { user } = await validateRequest();
 
+  if (user) {
+    redirect('/dashboard');
+  }
+
   return (
     <div className="bg-white dark:bg-black">
       <Header user={user} />

diff --git a/apps/web/src/app/(main)/dashboard/_components/new-form-dialog.tsx b/apps/web/src/app/(main)/dashboard/_components/new-form-dialog.tsx
@@ -4,6 +4,7 @@ import React, { useState, useTransition } from 'react';
 import { useRouter } from 'next/navigation';
 
 import { zodResolver } from '@hookform/resolvers/zod';
+import { InfoCircledIcon } from '@radix-ui/react-icons';
 import { useForm } from 'react-hook-form';
 import { toast } from 'sonner';
 import { z } from 'zod';
@@ -20,13 +21,17 @@ import {
 import {
   Form,
   FormControl,
-  FormDescription,
   FormField,
   FormItem,
   FormLabel,
   FormMessage,
 } from '@formbase/ui/primitives/form';
 import { Input } from '@formbase/ui/primitives/input';
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipTrigger,
+} from '@formbase/ui/primitives/tooltip';
 
 import { api } from '~/lib/trpc/react';
 
@@ -61,8 +66,7 @@ export function CreateFormDialog() {
         {
           title: data.name,
           description: data.description,
-          returningUrl: data.returnUrl,
-          keys: [],
+          returnUrl: data.returnUrl,
         },
         {
           onSuccess: ({ id }) => {
@@ -103,11 +107,8 @@ export function CreateFormDialog() {
               control={form.control}
               name="name"
               render={({ field }) => (
-                <FormItem className="space-y-0.5">
+                <FormItem>
                   <FormLabel>Name</FormLabel>
-                  <FormDescription className="text-[11px]">
-                    How you want to call your form?
-                  </FormDescription>
                   <FormControl>
                     <Input {...field} />
                   </FormControl>
@@ -120,11 +121,8 @@ export function CreateFormDialog() {
               control={form.control}
               name="description"
               render={({ field }) => (
-                <FormItem className="space-y-0.5">
+                <FormItem>
                   <FormLabel>Description</FormLabel>
-                  <FormDescription className="text-[11px]">
-                    Describe your form
-                  </FormDescription>
                   <FormControl>
                     <Input {...field} />
                   </FormControl>
@@ -137,11 +135,18 @@ export function CreateFormDialog() {
               control={form.control}
               name="returnUrl"
               render={({ field }) => (
-                <FormItem className="space-y-0.5">
-                  <FormLabel>Return URL</FormLabel>
-                  <FormDescription className="text-[11px]">
-                    Where should users be redirected after form submission?
-                  </FormDescription>
+                <FormItem>
+                  <FormLabel className="flex items-end gap-1">
+                    Return URL
+                    <Tooltip>
+                      <TooltipTrigger>
+                        <InfoCircledIcon width={13} />
+                      </TooltipTrigger>
+                      <TooltipContent className="bg-white dark:bg-black">
+                        Where should users be redirected after form submission?
+                      </TooltipContent>
+                    </Tooltip>
+                  </FormLabel>
                   <FormControl>
                     <Input placeholder="http://..." {...field} />
                   </FormControl>

diff --git a/apps/web/src/app/(main)/form/[id]/form-settings.tsx b/apps/web/src/app/(main)/form/[id]/form-settings.tsx
@@ -65,7 +65,7 @@ export function FormSettings({ form }: FormSettingsProps) {
   }
 
   const redirectToDashboard = () => {
-    refreshDashboardAfterDeletion();
+    void refreshDashboardAfterDeletion();
     router.push('/dashboard');
   };
 
@@ -263,14 +263,14 @@ const EnableFormSubmissions = ({
     },
   });
 
-  const { mutateAsync: updateForm, isPending: isUpdatingForm } =
+  const { mutateAsync: updateFormSubmissions, isPending: isUpdatingForm } =
     api.form.update.useMutation();
 
   async function handleEnableSubmissionsRetentionSubmit(
     data: EnableFormSubmissionsSchema,
   ) {
     try {
-      await updateForm({
+      await updateFormSubmissions({
         id: formId,
         enableSubmissions: data.enableFormSubmissions,
       });
@@ -343,16 +343,16 @@ const EnableFormNotifications = ({
     },
   });
 
-  const { mutateAsync: updateForm, isPending: isUpdatingForm } =
+  const { mutateAsync: updateFormNotifications, isPending: isUpdatingForm } =
     api.form.update.useMutation();
 
   async function handleEnableSubmissionsNotifications(
     data: EnableFormNotificationsSchema,
   ) {
     try {
-      await updateForm({
+      await updateFormNotifications({
         id: formId,
-        enableNotifications: data.enableNotifications,
+        enableEmailNotifications: data.enableNotifications,
       });
 
       toast(

diff --git a/apps/web/src/app/layout.tsx b/apps/web/src/app/layout.tsx
@@ -8,6 +8,7 @@ import type { Metadata, Viewport } from 'next';
 import { Toaster } from 'sonner';
 
 import { env } from '@formbase/env';
+import { TooltipProvider } from '@formbase/ui/primitives/tooltip';
 import { cn } from '@formbase/ui/utils/cn';
 
 import { ThemeProvider } from '~/components/theme-provider';
@@ -53,7 +54,9 @@ export default function RootLayout({
           enableSystem
           disableTransitionOnChange
         >
-          <TRPCReactProvider>{children}</TRPCReactProvider>
+          <TRPCReactProvider>
+            <TooltipProvider>{children}</TooltipProvider>
+          </TRPCReactProvider>
           <Toaster />
         </ThemeProvider>
         {env.UMAMI_TRACKING_ID && (

diff --git a/packages/api/routers/form.ts b/packages/api/routers/form.ts
@@ -47,7 +47,13 @@ export const formRouter = createTRPCRouter({
     ),
 
   create: protectedProcedure
-    .input(ZInsertFormSchema)
+    .input(
+      z.object({
+        title: z.string(),
+        description: z.string().optional(),
+        returnUrl: z.string().optional(),
+      }),
+    )
     .mutation(async ({ ctx, input }) => {
       const id = generateId(15);
 
@@ -59,25 +65,43 @@ export const formRouter = createTRPCRouter({
         updatedAt: new Date(),
         returnUrl: input.returnUrl ?? null,
         keys: [''],
-        enableEmailNotifications: input.enableEmailNotifications ?? true,
-        enableSubmissions: input.enableSubmissions ?? true,
+        enableEmailNotifications: true,
+        enableSubmissions: true,
       });
 
       return { id };
     }),
 
   update: protectedProcedure
-    .input(ZUpdateFormSchema)
+    .input(
+      z.object({
+        id: z.string(),
+        title: z.string().optional(),
+        description: z.string().optional(),
+        enableSubmissions: z.boolean().optional(),
+        enableEmailNotifications: z.boolean().optional(),
+        returnUrl: z.string().optional(),
+      }),
+    )
     .mutation(async ({ ctx, input }) => {
+      const form = await ctx.db.query.forms.findFirst({
+        where: (table, { eq }) => eq(table.id, input.id),
+      });
+
+      if (!form) {
+        throw new Error('Form not found');
+      }
+
       await ctx.db
         .update(forms)
         .set({
-          title: input.title,
-          description: input.description ?? null,
+          title: input.title ?? form.title,
+          description: input.description ?? form.description,
           updatedAt: new Date(),
-          enableSubmissions: input.enableSubmissions ?? true,
-          enableEmailNotifications: input.enableEmailNotifications ?? true,
-          returnUrl: input.returnUrl ?? null,
+          enableSubmissions: input.enableSubmissions ?? form.enableSubmissions,
+          enableEmailNotifications:
+            input.enableEmailNotifications ?? form.enableEmailNotifications,
+          returnUrl: input.returnUrl ?? form.returnUrl,
         })
         .where(eq(forms.id, input.id));
     }),

diff --git a/packages/db/schema/forms.ts b/packages/db/schema/forms.ts
@@ -1,7 +1,6 @@
 import { type InferSelectModel } from 'drizzle-orm';
 import { boolean, index, pgTable, text, timestamp } from 'drizzle-orm/pg-core';
 import { createInsertSchema, createSelectSchema } from 'drizzle-zod';
-import { type z } from 'zod';
 
 export const forms = pgTable(
   'forms',