updated the new changesg

src/components/pages/dashboard/userDashboard/buyCoins/buyCoinSinlgeGame/index.tsx

@@ -8,24 +8,24 @@ import CoinCalculator from './CoinCalculator'
 export default function BuyCoinSinlgeGame({ slug }: { slug: string }) {
     const packs = [
         {
-            amount: "10",
-            label: "Starter Pack",
-            coin: "1000",
-            bonus: "10",
-            tag: "popular"
-        },
-        {
             amount: "20",
-            label: "Golden Pack",
+            label: "Starter Pack",
             coin: "2000",
             bonus: "20",
+            tag: "popular"
         },
         {
             amount: "50",
-            label: "Legend Pack",
+            label: "Golden Pack",
             coin: "5000",
             bonus: "50",
         },
+        {
+            amount: "100",
+            label: "Legend Pack",
+            coin: "10000",
+            bonus: "100",
+        },
 
     ]
     return (

src/components/pages/dashboard/userDashboard/withdrawl/WithdrawlModal.tsx

@@ -208,7 +208,7 @@ export default function WithdrawlModal({
                         <div className="flex flex-col md:grid grid-cols-2 gap-4">
                             {fields.map((field) => (
                                 <div className={field.type === "IDSelfieCollection" ? "col-span-2" : "col-span-1"} key={field.token}>
-                                    {field.type === "IDSelfieCollection" ? <Link href={field.value} className="bg-primary-grad ss-btn">{field.label}</Link> : <RenderFields field={field} formik={formik} />}
+                                    {field.type === "IDSelfieCollection" ? <Link href={field.value} className="bg-primary-grad ss-btn">{field.label}</Link> : <RenderFields field={field} formik={formik} disabled={fields.some(field => field.type === "IDSelfieCollection") || isLoading} />}
                                 </div>
                             ))}
                         </div>
@@ -246,6 +246,7 @@ export default function WithdrawlModal({
                                     color="primary"
                                     fullWidth
                                     type="submit"
+                                    disabled={fields.some(field => field.type === "IDSelfieCollection") || isLoading}
                                 >
                                     {isLoading ? "Processing..." : "Withdraw Now"}
                                 </Button>

src/components/pages/dashboard/userDashboard/withdrawl/renderFields.tsx

@@ -9,9 +9,10 @@ import { validateDynamicField } from ".";
 interface RenderFieldsProps {
     field: MasspayPaymentFields;
     formik: FormikProps<any>;
+    disabled?: boolean;
 }
 
-export const RenderFields = ({ field, formik }: RenderFieldsProps) => {
+export const RenderFields = ({ field, formik, disabled }: RenderFieldsProps) => {
     const fieldIndex = formik.values.payment_fields?.findIndex(
         (f: MasspayPaymentFields) => f.token === field.token
     );
@@ -79,6 +80,7 @@ export const RenderFields = ({ field, formik }: RenderFieldsProps) => {
                 <div className="input__field text-left">
                     <InputLabel>{field.label} <span className="text-red-500">*</span></InputLabel>
                     <OutlinedInput
+                        disabled={disabled}
                         fullWidth
                         id={field.token}
                         name={`payment_fields.${field.token}`}
@@ -101,6 +103,7 @@ export const RenderFields = ({ field, formik }: RenderFieldsProps) => {
                     <InputLabel>{field.label} <span className="text-red-500">*</span></InputLabel>
                     <FormControl fullWidth error={Boolean(fieldError)}>
                         <Select
+                            disabled={disabled}
                             id={field.token}
                             name={`payment_fields.${field.token}`}
                             value={fieldValue}
@@ -130,6 +133,8 @@ export const RenderFields = ({ field, formik }: RenderFieldsProps) => {
                     <div className="input__field text-left">
                         <InputLabel>{field.label} <span className="text-red-500">*</span></InputLabel>
                         <OutlinedInput
+                            disabled={disabled}
+
                             fullWidth
                             id={field.token}
                             name={`payment_fields.${field.token}`}
@@ -151,6 +156,7 @@ export const RenderFields = ({ field, formik }: RenderFieldsProps) => {
                         <InputLabel>{field.label} <span className="text-red-500">*</span></InputLabel>
                         <LocalizationProvider dateAdapter={AdapterDayjs}>
                             <DatePicker
+                                disabled={disabled}
                                 value={fieldValue ? dayjs(fieldValue) : null}
                                 onChange={(newValue) => handleChange(newValue)}
                                 onClose={handleBlur}
@@ -249,6 +255,7 @@ export const RenderFields = ({ field, formik }: RenderFieldsProps) => {
                 <div className="input__field text-left">
                     <InputLabel>{field.label} <span className="text-red-500">*</span></InputLabel>
                     <OutlinedInput
+                        disabled={disabled}
                         fullWidth
                         id={field.token}
                         name={`payment_fields.${field.token}`}