我正在尝试在下一个 js 14 中使用服务器操作在现有的创建表单中添加一个编辑函数

问：

当它说创建表单的类型（id）参数为null时，就会出现问题，这与prisma（编辑信息）不匹配。

export function AboutForm({ id }: { id: number }) {
    const router = useRouter();
    const [err, setErr] = useState("");
    const [isPending, startTransition] = useTransition();
    const pending = useFormStatus();
    const formRef = useRef<HTMLFormElement>(null);
    const formRef2 = useRef<HTMLFormElement>(null);

    const formInfo = useForm<InputInfo>({
        resolver: zodResolver(infoSchema),
    });

    const formExperience = useForm<InputExperience>({
        resolver: zodResolver(experienceSchema),
    });

    const onsubmitInfo = async (data: InputInfo) => {
        startTransition(async () => {
            if (id) await editInfo(id) //try to edit the form here if id exist
            await createInfo(data);
            router.refresh();
        });
    };

    const onSubmitExperience = async (data: InputExperience) => {
        startTransition(async () => {
            const result = await createExperience(data);
            if (!result.success) setErr("Unexpected error. Unable to create");
            router.refresh();
        });
    };


    return (
        <section className="mx-auto px-10 md:max-w-md pt-10 md:pt-0 bg-re">

            <Form {...formInfo}>
                <form
                    onSubmit={formInfo.handleSubmit(onsubmitInfo)}
                    className="space-y-8"
                    ref={formRef}
                >
                    <FormField
                        control={formInfo.control}
                        name="resume"
                        render={({ field }) => (
                            <FormItem>
                                <FormControl>
                                    <Input placeholder="resume" {...field} />
                                </FormControl>
                                <FormMessage />
                            </FormItem>
                        )}
                    />

//problems arises here:
export const EditForm = async({ id }: { id: number }) => {
    let [isPending, startTransition] = useTransition();
    const info = await editInfo(id)

    return (
        <AboutForm id={info}/>   //id 
       
    );
};

type '{ info： { id： number; resume： string; description： string; createAt： Date; } | null; suceess： boolean; }' 不可赋值给类型 'number'.ts（2322）

AboutForm.tsx（38， 37）：预期类型来自属性“id”，该属性在此处在类型“IntrinsicAttributes & { id： number; }”上声明

我尝试从我在网上看到的课程中使用动态导入，但它不起作用。 我的最终目标是把他所有的东西都放在一个地方。编辑的目标是触发模式来编辑表单 usign 我用于创建的相同表单。 应用的图像供参考