diff --git a/src/app/(protected)/create/page.tsx b/src/app/(protected)/create/page.tsx index a72b0a9..df4e3de 100644 --- a/src/app/(protected)/create/page.tsx +++ b/src/app/(protected)/create/page.tsx @@ -1,97 +1,48 @@ 'use client'; -import { zodResolver } from '@hookform/resolvers/zod'; -import { useForm } from 'react-hook-form'; -import { Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form'; -import { Input } from '@/components/ui/input'; -import { useFormState } from 'react-dom'; -import { createSchema, createSchemaType } from '@/lib/forms/zod'; import { create } from '@/lib/forms/actions'; import React from 'react'; import { useRouter } from 'next/navigation'; -import SubmitButton from '@/components/app/SubmitButton/SubmitButton'; +import { UniversalForm } from '@/components/app/UniversalForm/UniversalForm'; -// TODO: move form to the new universal form component -export default function ProfileForm() { +export default function CreateForm() { const router = useRouter(); - const form = useForm({ - resolver: zodResolver(createSchema), - defaultValues: { - name: '', - description: '', - github: '', - }, - }); - - const [formState, formAction] = useFormState(create, null); - React.useEffect(() => { - if (formState && formState.id) { - router.push(`/project/${formState.id}`); - } - // eslint-disable-next-line react-hooks/exhaustive-deps - }, [formState]); - return (
-
- { - const formData = new FormData(); - Object.entries(data).forEach(([key, value]) => { - formData.append(key, value); - }); - formAction(formData); - })} - className="space-y-8" - > - ( - - Project name - - - - How the project is called. - - - )} - /> - ( - - Description - - - - Describe the project a bit. - - - )} - /> - ( - - Github - - - - Your Github repository link. Will come in handy for some integrations! - - - )} - /> - - - -
+ { + // @ts-ignore yea + if (res && res.id) { + // @ts-ignore i stopped caring + router.push(`/project/${res.id}`); + } + }} + /> +
); -} +} \ No newline at end of file diff --git a/src/app/(protected)/dashboard/page.tsx b/src/app/(protected)/dashboard/page.tsx index 1dc3ae5..36c2ab0 100644 --- a/src/app/(protected)/dashboard/page.tsx +++ b/src/app/(protected)/dashboard/page.tsx @@ -11,17 +11,19 @@ export default async function Page() { userId: user!.id, }, }); + if (db.length === 0) { + return ( +
+

No projects found

+

Create a project to get started

+ + + +
+ ); + } return (
- {db.length === 0 && ( -
-

No projects found

-

Create a project to get started

- - - -
- )} {db.map((d) => ( ))} diff --git a/src/app/(protected)/project/[id]/page.tsx b/src/app/(protected)/project/[id]/page.tsx index 697e9f2..24812d0 100644 --- a/src/app/(protected)/project/[id]/page.tsx +++ b/src/app/(protected)/project/[id]/page.tsx @@ -18,7 +18,7 @@ import { BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, -} from "@/components/ui/breadcrumb" +} from '@/components/ui/breadcrumb'; // TODO: refactor to maybe append the no feedback message to the table div export default async function Page({ params }: { params: Promise<{ id: string }> }) { @@ -30,23 +30,29 @@ export default async function Page({ params }: { params: Promise<{ id: string }> }); if (!project) { - return
Project not found
; + return ( + <> +

Project not found

+

...or maybe you don't have permission!

+ + ); } + // maybe it's not clean enough but who cares return (
- - - - Dashboard - - - - {project.name} - - - + + + + Dashboard + + + + {project.name} + + +

{project.name}

{project.description}

@@ -54,16 +60,17 @@ export default async function Page({ params }: { params: Promise<{ id: string }>
- {project.feedback.length === 0 ? ( -
-

No feedback!

-

- Once you start receiving feedback, it will appear here. -

-
- ) : ( -
- +
+ {project.feedback.length === 0 && ( +
+

No feedback!

+

+ Once you start receiving feedback, it will appear here. +

+
+ )} +
+ {project.feedback.length > 0 && ( ID @@ -73,21 +80,25 @@ export default async function Page({ params }: { params: Promise<{ id: string }> ))} - - {/* using toReversed to not change the upstream array in case of other data treatments needed */} - {project.feedback.toReversed().map((feedback) => ( - - {feedback.id} - {feedback.message} - {Object.entries(JSON.parse(feedback.customData)).map(([key, value]) => ( - {value as string} - ))} - - ))} - -
-
- )} + )} + + {/* + using toReversed to not change the upstream array in case of + other data treatments needed. + why js why + */} + {project.feedback.toReversed().map((feedback) => ( + + {feedback.id} + {feedback.message} + {Object.entries(JSON.parse(feedback.customData)).map(([key, value]) => ( + {value as string} + ))} + + ))} + + +
); diff --git a/src/components/app/UniversalForm/UniversalForm.tsx b/src/components/app/UniversalForm/UniversalForm.tsx index 0da7448..89defc4 100644 --- a/src/components/app/UniversalForm/UniversalForm.tsx +++ b/src/components/app/UniversalForm/UniversalForm.tsx @@ -21,19 +21,23 @@ import SubmitButton from '../SubmitButton/SubmitButton'; import { useFormState } from 'react-dom'; import React from 'react'; import { toast } from 'sonner'; +import { createSchema } from '@/lib/forms/zod'; export const schemaDb = [ { name: 'projectSettings', zod: projectSettingsSchema }, { name: 'ratelimitChange', zod: ratelimitChangeSchema }, { name: 'customData', zod: customDataSchema }, + { name: 'create', zod: createSchema }, ] as const; export function UniversalForm({ fields, schemaName, action, + onActionComplete, defaultValues, submitText = 'Submit', + submitClassname, }: UniversalFormProps) { const [state, formAction] = useFormState(action, null); const schema = schemaDb.find((s) => s.name === schemaName)?.zod; @@ -54,6 +58,9 @@ export function UniversalForm({ // @ts-ignore toast.error(state.error); } + if (state) { + onActionComplete?.(state); + } }, [state]); return ( @@ -81,7 +88,7 @@ export function UniversalForm({ )} /> ))} - + ); diff --git a/src/components/app/UniversalForm/types.ts b/src/components/app/UniversalForm/types.ts index 2321e4e..2bdaf50 100644 --- a/src/components/app/UniversalForm/types.ts +++ b/src/components/app/UniversalForm/types.ts @@ -15,6 +15,8 @@ export type UniversalFormProps = { fields: FormFieldConfig[]; schemaName: typeof schemaDb[number]['name']; action: (prev: any, formData: FormData) => void; + onActionComplete?: (result: unknown) => void; defaultValues?: Partial>; submitText?: string; + submitClassname?: string; };