percantage

src/pages/profile/Profile.tsx

@@ -22,10 +22,11 @@ import Phone from './components/Phone'
 const Profile: FC = () => {
 
     const { t } = useTranslation('global')
-    const singleUpload = useSingleUpload()
     const [file, setFile] = useState<File>()
     const getProvines = useGetProvines()
     const getProfile = useGetProfile()
+    const [percent, setPercent] = useState<number>(0)
+    const singleUpload = useSingleUpload(setPercent)
     const updateProfile = useUpdateProfile()
 
     const formik = useFormik<UpdateProfileType>({
@@ -126,6 +127,7 @@ const Profile: FC = () => {
                                     <Button
                                         isLoading={singleUpload.isPending || updateProfile.isPending}
                                         className='xl:w-[160px] w-fit px-4 xl:;px-0 h-8 xl:h-10 text-xs xl:text-sm'
+                                        percentage={percent}
                                     >
                                         <input {...getInputProps()} />
                                         <div {...getRootProps()} className='flex items-center gap-3'>