// page.tsx

"use client"

import { useForm } from "react-hook-form"
import {
  Form,
  FormControl,
  FormDescription,
  FormField,
  FormLabel,
  FormMessage,
  FormItem,
} from "@/components/ui/form";
import { Input } from "@/components/ui/input"



  const AddPage = () => {
    
    const form = useForm()
    const onSubmit = async () => {
      console.log("submit")
      }

      return (
        <div className="flex items-center justify-center pt-40">
          <Form {...form}>
            <form onSubmit={form.handleSubmit(onSubmit)}>
              <FormField
                control={form.control}
                name="title"
                render={({ field }) => (
                  <FormItem>
                    <FormLabel>
                      Course title
                    </FormLabel>
                    <FormControl className="relative  ">
                      
                      <Input
                        placeholder="e.g. 'Advanced web development'"
                        {...field}
                      />
                      
                    </FormControl>
                    <FormMessage />
                  </FormItem>
                )}
              />
              <button type='submit' className=" rounded p-2">
              Add Page
              </button>
          </form>
          </Form>
            
        </div>
      )
  }

  export default AddPage