client/src/pages/projects/create.tsx (view raw)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 |
import { CreatePorject } from "@/api/projects"; import { PrimaryButton } from "@/components/Button"; import MainLayout from "@/components/MainLayout"; import Head from "next/head"; import { useRouter } from "next/router"; import { useEffect, useState } from "react"; const CreateProjectPage = () => { const router = useRouter(); const [name, setName] = useState(""); const [apiResponse, setApiResponse] = useState<any>(); async function formSubmit(e: React.FormEvent) { e.preventDefault(); let project = { Name: name }; CreatePorject(project, setApiResponse); } useEffect(() => { apiResponse && apiResponse.status === "OK" && router.push("/projects"); }, [apiResponse]); return ( <MainLayout> <Head> <title>Create Projects | Watchman</title> </Head> <h1 className="text-xl font-medium">Create Project</h1> <form onSubmit={formSubmit} className="my-4 flex flex-col gap-4"> <div> <label className="block text-sm font-medium">Name</label> <input value={name} onChange={(e) => setName(e.target.value)} className="w-80 border border-slate-200 p-1" /> </div> <PrimaryButton type="submit" text="Create Project" /> </form> </MainLayout> ); }; export default CreateProjectPage; |