1 files changed, 34 insertions, 34 deletions

diff --git a/src/components/invoice-generator.tsx b/src/components/invoice-generator.tsx
index 47cc458..da97184 100644
--- a/src/components/invoice-generator.tsx
+++ b/src/components/invoice-generator.tsx
@@ -1,29 +1,29 @@
-"use client";
+'use client';
 
-import { Invoice, InvoiceSchema } from "@/models/invoice";
-import { zodResolver } from "@hookform/resolvers/zod";
+import { Invoice, InvoiceSchema } from '@/models/invoice';
+import { zodResolver } from '@hookform/resolvers/zod';
 import {
   useFieldArray,
   useForm,
   useWatch,
   SubmitHandler,
-} from "react-hook-form";
-import { Input } from "./ui/input";
-import { cn } from "@/utils/cn";
-import { Button } from "./ui/button";
-import { generateInvoice } from "@/lib/generate";
+} from 'react-hook-form';
+import { Input } from './ui/input';
+import { cn } from '@/utils/cn';
+import { Button } from './ui/button';
+import { generateInvoice } from '@/lib/generate';
 
 const defaultItem = {
-  description: "",
+  description: '',
   quantity: 1,
   rate: 0,
 };
 
 const defaultValues: Invoice = {
   invoice_number: 0,
-  from: "",
+  from: '',
   line_items: [defaultItem],
-  currency: "USD",
+  currency: 'USD',
 };
 
 export const InvoiceGenerator = () => {
@@ -40,17 +40,17 @@ export const InvoiceGenerator = () => {
 
   const { fields, append, remove } = useFieldArray({
     control,
-    name: "line_items",
+    name: 'line_items',
   });
-  const lineItems = useWatch({ control, name: "line_items" });
-  const currency = watch("currency", "USD");
+  const lineItems = useWatch({ control, name: 'line_items' });
+  const currency = watch('currency', 'USD');
 
   const onSubmit: SubmitHandler<Invoice> = async (data) => {
     console.log(data);
     const blob = await generateInvoice(data);
-    const a = document.createElement("a");
+    const a = document.createElement('a');
     a.href = URL.createObjectURL(blob);
-    a.download = "invoice.pdf";
+    a.download = 'invoice.pdf';
     document.body.appendChild(a);
     a.click();
 
@@ -66,17 +66,17 @@ export const InvoiceGenerator = () => {
       <div className="flex justify-between gap-4">
         <section className="grid auto-rows-min gap-2 md:grid-cols-2">
           <Input
-            {...register("from")}
+            {...register('from')}
             placeholder="Who is this from?"
             className="md:col-span-2"
           />
-          {errors["from"] && (
-            <p className="md:col-span-2">{errors["from"].message ?? "Error"}</p>
+          {errors['from'] && (
+            <p className="md:col-span-2">{errors['from'].message ?? 'Error'}</p>
           )}
           <div className="grid">
             <label>Bill To</label>
             <Input
-              {...register("bill_to")}
+              {...register('bill_to')}
               className="w-full"
               placeholder="Who is this for?"
             />
@@ -84,7 +84,7 @@ export const InvoiceGenerator = () => {
           <div className="grid">
             <label>Ship To</label>
             <Input
-              {...register("ship_to")}
+              {...register('ship_to')}
               className="w-full"
               placeholder="(optional)"
             />
@@ -92,20 +92,20 @@ export const InvoiceGenerator = () => {
         </section>
         <section className="grid auto-rows-min grid-cols-2 gap-2">
           <label>Invoice #</label>
-          <Input {...register("invoice_number", { valueAsNumber: true })} />
+          <Input {...register('invoice_number', { valueAsNumber: true })} />
           <label>Date</label>
-          <Input {...register("date")} type="date" />
+          <Input {...register('date')} type="date" />
           <label>Due Date</label>
-          <Input {...register("due_date")} type="date" />
+          <Input {...register('due_date')} type="date" />
           <label>PO number</label>
-          <Input {...register("po_number")} />
+          <Input {...register('po_number')} />
         </section>
       </div>
       <h2>Your Items</h2>
       <div
         className={cn(
-          "bg-foreground text-background rounded-sm px-2 py-1",
-          "mb-2 grid grid-cols-11 gap-2",
+          'bg-foreground text-background rounded-sm px-2 py-1',
+          'mb-2 grid grid-cols-11 gap-2',
         )}
       >
         <p className="col-span-7">Item</p>
@@ -133,14 +133,14 @@ export const InvoiceGenerator = () => {
               <p>
                 {(
                   (lineItems[ind]?.rate ?? 0) * (lineItems[ind]?.quantity ?? 0)
-                ).toLocaleString(undefined, { style: "currency", currency })}
+                ).toLocaleString(undefined, { style: 'currency', currency })}
               </p>
               <Button
                 type="button"
                 onClick={() => remove(ind)}
                 className={cn(
-                  "absolute -right-1 m-auto hidden size-fit",
-                  "border-none group-hover:block hover:text-gray-500",
+                  'absolute -right-1 m-auto hidden size-fit',
+                  'border-none group-hover:block hover:text-gray-500',
                 )}
               >
                 X
@@ -157,19 +157,19 @@ export const InvoiceGenerator = () => {
         </Button>
       </section>
       <section className="pr-6 text-right text-xl">
-        Subtotal:{" "}
+        Subtotal:{' '}
         <b>
           {lineItems
             .reduce(
               (acc, cur) => acc + (cur.rate ?? 0) * (cur.quantity ?? 0),
               0,
             )
-            .toLocaleString(undefined, { style: "currency", currency })}
+            .toLocaleString(undefined, { style: 'currency', currency })}
         </b>
       </section>
-      <section className={cn("mt-4 flex flex-row-reverse")}>
+      <section className={cn('mt-4 flex flex-row-reverse')}>
         <Button
-          className={cn("border-green-700 text-green-700", "hover:bg-gray-100")}
+          className={cn('border-green-700 text-green-700', 'hover:bg-gray-100')}
         >
           Download
         </Button>