مشکل در مقدار دهی مجدد formik در فیلد از نوع radio

سلام دوستان خسته نباشید
من مشکی با formik دارم که توی دوره ی پروژه محور هم مطرحش کردم مهندس ایده ای دادن که تست کردم و متاسفانه باز هم حل نشد
من یه صفحه ی ثبت فاکتور دارم که عمل ثبت و ویرایش هردو در یک صفحه و یک فرم انجام میشه
مشکل اینجاست که توی فرمیک وقتی اطلاعات فرم خودم رو تغییر یا به اصطلاح اون ها رو reinitial میکنم فیلدی که نوع radio داره توی شرایط خاصی کار نمیکنه و قفل میشه
شرایطشم اینه که وقتی داده ی اون ی چیزی باشه و من تغییرش بدم دیگ تغییر نمیکنه
مهندس فرمودن کلا بیا و فرمیک رو ببر توی یک کامپوننت دیگه و initial خودت رو با props ارسال کن و نیازی به سختی نباشه
من تست کردم ولی جواب نداد
لطفا مشکل اصلی رو توی لینکی که فرستادم یه چک بکنید کد تغییر کرده ی من به شکل زیر هست
من مشکل رو یه پروژه جدید کردم که فقط یه رادیو باتون داره و اونو آپلودش کردم همین کد های زیر هست
لطفا این کد رو دانلود کنید و فقط npm i و بعد از اون هم npm run dev بزنید و ادرس http://localhost:3000/radio رو باز کنید
کنسول مرورگر رو باز کنید و 4 ثانیه صبر کنید و هیچ تغییری ایجاد نکنید در مرحله اول
صبر کنید تا کنسول پیام change state ------------------ رو بده که یعنی مقدار فرمیک تغییر کرد
حالا هرچی تلاش کنید نمیتونید داده ی فرم رو عوض کنید
مشکل کجاست ؟؟؟؟؟

"use client";

import { useEffect, useState, useRef } from "react";
import RadioFormik from "./radioFormik";

export default function TestError() {
  const [specificFactor,setSpecificFactor]=useState<any>({
    factorCategory: "unofficial",
  });
    useEffect(()=>{
      setTimeout(()=>{
          console.log('change state ------------------')
          setSpecificFactor({factorCategory:'official'})
      },4000)
    },[])
    console.log('load page ---------------')
return (
  <div className=" p-5  " dir="rtl">
    <RadioFormik  initialValues={specificFactor} />
  </div>
);
}

import { Field, Form, Formik } from "formik";
import { useRef } from "react";

interface props {
  initialValues: any;
}
export default function RadioFormik({ initialValues }: props) {
    console.log(initialValues)
  const factorSubmitHandler = async (
    values: any,
    { resetForm, props, setFieldError }: any
  ) => {
    console.log(values);
  };
  return (
    <>
      <Formik
        initialValues={initialValues}
        onSubmit={factorSubmitHandler}
        enableReinitialize
      >
        {(formikProps) => {
          return (
            <>
              <Form>
                <label>
                  <Field type="radio" name="factorCategory" value="official"/>
                  رسمی
                </label>
                <label>
                  <Field type="radio" name="factorCategory" value="unofficial"/>
                  غیر رسمی
                </label>
                <button type="submit" className="border p-3 rounded bg-slate-400">
                  submit
                </button>
              </Form>
            </>
          );
        }}
      </Formik>
    </>
  );
}