How to Post Data to API using Volley in Android using Jetpack Compose?

package com.geeksforgeeks.demo

import android.content.Context
import android.os.Bundle
import android.widget.Toast
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.*
import androidx.compose.ui.graphics.*
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.TextFieldValue
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.*
import com.android.volley.Response
import com.android.volley.toolbox.*
import com.geeksforgeeks.demo.ui.theme.DemoTheme
import org.json.*

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            DemoTheme(dynamicColor = false, darkTheme = false) {
                Surface(color = Color.White) {
                    PostData()
                }
            }
        }
    }
}

@Composable
fun PostData() {
    val context = LocalContext.current

    val userName = remember {
        mutableStateOf(TextFieldValue())
    }
    val job = remember {
        mutableStateOf(TextFieldValue())
    }
    val response = remember {
        mutableStateOf("")
    }

    Column(
        modifier = Modifier
            .fillMaxSize()
            .fillMaxHeight()
            .fillMaxWidth(),
        verticalArrangement = Arrangement.Center,
        horizontalAlignment = Alignment.CenterHorizontally
    ) {
        // Email text field
        TextField(
            value = userName.value,
            onValueChange = { userName.value = it },
            placeholder = { Text(text = "Enter your name") },
            singleLine = true
        )

        Spacer(modifier = Modifier.height(5.dp))

        // Job text field
        TextField(
            value = job.value,
            onValueChange = { job.value = it },
            placeholder = { Text(text = "Enter your job") },
            singleLine = true
        )

        Spacer(modifier = Modifier.height(10.dp))

        Button(
            onClick = {
                // API call
                postDataUsingVolley(context, userName, job, response)
            }
        ) {
            Text(text = "Post Data", modifier = Modifier.padding(8.dp))
        }

        Spacer(modifier = Modifier.height(20.dp))

        Text(
            text = response.value,
            color = Color.Black,
            fontSize = 20.sp,
            fontWeight = FontWeight.Bold, modifier = Modifier
                .padding(10.dp)
                .fillMaxWidth(),
            textAlign = TextAlign.Center
        )
    }
}

private fun postDataUsingVolley(
    context: Context,
    userName: MutableState<TextFieldValue>,
    job: MutableState<TextFieldValue>,
    res: MutableState<String>
) {
    // base url
    val url = "https://reqres.in/api/users"

    // create a new variable for a request queue
    val queue = Volley.newRequestQueue(context)

    // string request to update data and
    // pass method as "PUT" to update data.
    val request: StringRequest = object : StringRequest(
        Method.POST,
        url,
        Response.Listener { response ->
            Toast.makeText(context, "Data Posted to API..", Toast.LENGTH_SHORT).show()
            try {
                // extract data from json object and display
                val jsonObject = JSONObject(response!!)
                val result =
                    "User Name : " + jsonObject.getString("name") + "\n" + "Job : " + jsonObject.getString(
                        "job"
                    )
                res.value = result
            } catch (e: JSONException) {
                e.printStackTrace()
            }
        },
        Response.ErrorListener {
            Toast.makeText(context, "Fail to post data..", Toast.LENGTH_SHORT)
                .show()
        }
    ) {
        override fun getParams(): Map<String, String> {
            // map to store values
            val params: MutableMap<String, String> = HashMap()
            params["name"] = userName.value.text
            params["job"] = job.value.text
            return params
        }
    }
    queue.add(request)
}