デフォルト値をreduxフォームに渡す方法

私はreduxフォームを作成しました。これは、ユーザーがプロファイルの詳細を編集できるユーザープロファイルフォームです。バックエンドで利用できる初期値を入れて、後で編集することもできます。しかし、私はdocがhttps://redux-form.com/6.0.0-alpha.4/examples/initializefromstate/と言う方法を試しましたが、まったく機能していません。APIから初期値を取得し、reduxストアに保存しています。

EditFormPage.jsx

let  EditProfileForm =(props) => {


    const [image, setImage]  = useState(null);
    const {handleSubmit, pristine, reset, submitting, classes} = props;

    const dispatch = useDispatch();
    const getDroppedImage = (imageSrc) => {

        setImage(imageSrc);
    }

    const getCroppedImage = (imageUrl) =>{
        //props.getProfileImage(imageUrl);
        dispatch(uploadProfileImage(imageUrl));
    }

    const data = {
        profilePic : props.profileDetail.profilePic,
        name : 'Hell ow',
        dob : props.profileDetail.dateOfBirth,
        sex: props.profileDetail.gender,
        contact: props.profileDetail.phoneNumber,
        address: props.profileDetail.address
    }
    useEffect(() => {

        load(data);
    }, [data])

    return (
        <Grid container className={"container edit_profile"}>
            <Grid className="profile_menu global-padding" container>
                    <form onSubmit={handleSubmit}>
                        <Grid
                            container
                            alignItems="center"
                            justify="flex-end"
                            className="profile_menu_list"
                            xs={12}
                        >
                            <Field
                                type="file"
                                name="profilePic"
                                component={EditDropZone}
                                image={image}
                                getDroppedImage={getDroppedImage}
                            />
                        </Grid>
                        <Grid
                            container
                            alignItems="center"
                            justify="flex-end"
                            className="profile_menu_list"
                            xs={12}
                        >
                            <Field name="name" component={renderInputField} />
                        </Grid>
                        <Grid
                            container
                            alignItems="center"
                            justify="flex-end"
                            className="profile_menu_list"
                            xs={12}
                        >
                            <Field
                                name="dob"
                                showTime={false}
                                component={renderDateTimePicker}
                            />
                        </Grid>
                        <Grid
                            container
                            alignItems="center"
                            justify="flex-end"
                            className="profile_menu_list"
                            xs={12}
                        >

                            <Field style={{flexDirection: 'row'}} name="sex" component={renderRadioButton}>
                                <RadioButton value="male" label="male"/>Male
                                <RadioButton value="female" label="female"/>Female
                            </Field>
                        </Grid>
                        <Grid
                            container
                            alignItems="center"
                            justify="flex-end"
                            className="profile_menu_list"
                            xs={12}
                        >
                            <Field name="contact" normalize={normalizePhone} component={renderInputField} />
                        </Grid>
                        <Grid
                            container
                            alignItems="center"
                            justify="flex-end"
                            className="profile_menu_list"
                            xs={12}
                        >
                            <Field name="address" component={renderInputField} />
                        </Grid>
                        <div style={{paddingTop: '20px'}}>
                            <LoadingButton type={"submit"} title={'Save'}/>
                        </div>
                    </form>
                </Grid>
                <Grid xs={12}>
                    <ImageModal
                        getCroppedImage={getCroppedImage}
                        image={image}
                    />
                </Grid>
            </Grid>
        </Grid>
    )


}

EditProfileForm = reduxForm({
    form: 'EditProfileForm',

    validate
})(EditProfileForm);
EditProfileForm = connect(
    state => ({
        initialValues: state.editProfileData.profileData
    }),{load: load }
)(EditProfileForm)

export default EditProfileForm;

私がここで立ち往生しているどんな助けも素晴らしいでしょう。