Adding additional props to component wrap with withForm

import { withForm } from '@/shared/hooks';

//aditional props here
type LoginFormPros = {
  name: string,
  otherFunction: () => void,
  isAdded: boolean
}

export const LoginForm = withForm({
  props: {
   // why do I need to add a default value here for additional props
   name: "",
   otherFunction: () => {},
   isAdded: false
  } as LoginFormPros,
  render: function Render({ form,isAdded, name, otherFunction }) { // before getting it here?
    return (
      <div className='flex min-h-svh w-full items-center justify-center p-6 md:p-10'>
        <div className='w-full max-w-sm'>
          <div className='flex flex-col gap-4'>
            <Card>

//parent component passing the form with additional prop
  return <LoginForm form={loginForm as any} name='test' otherFunction={() => {}} isAdded />;
};