Android - Extract Data From JSON Array using Volley Library with Jetpack Compose

package com.example.newcanaryproject.ui.theme

import androidx.compose.ui.graphics.Color

val Purple200 = Color(0xFF0F9D58)
val Purple500 = Color(0xFF0F9D58)
val Purple700 = Color(0xFF3700B3)
val Teal200 = Color(0xFF03DAC5)

// on below line we are adding different colors.
val greenColor = Color(0xFF0F9D58)

package com.example.newcanaryproject

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.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.*
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.*
import com.android.volley.Request
import com.android.volley.toolbox.JsonArrayRequest
import com.android.volley.toolbox.Volley
import com.example.newcanaryproject.ui.theme.*

class MainActivity : ComponentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            NewCanaryProjectTheme {
                // on below line we are specifying background color for our application
                Surface(
                    // on below line we are specifying modifier and color for our app
                    modifier = Modifier.fillMaxSize(), color = MaterialTheme.colors.background
                ) {

                    // on below line we are specifying theme as scaffold.
                    Scaffold(

                        // in scaffold we are specifying top bar.
                        topBar = {

                            // inside top bar we are specifying background color.
                            TopAppBar(backgroundColor = greenColor,

                                // along with that we are specifying title for our top bar.
                                title = {
                                    // in the top bar we are specifying tile as a text
                                    Text(

                                        // on below line we are specifying 
                                        // text to display in top app bar.
                                        text = "JSON Parsing in Android",

                                        // on below line we are specifying 
                                        // modifier to fill max width.
                                        modifier = Modifier.fillMaxWidth(),

                                        // on below line we are 
                                        // specifying text alignment.
                                        textAlign = TextAlign.Center,

                                        // on below line we are 
                                        // specifying color for our text.
                                        color = Color.White
                                    )
                                })
                        }) {
                        // on below line we are display list view 
                        // method to display our list view.
                        displayListView()
                    }
                }
            }
        }
    }
}


fun parseJSONArray(courseList: MutableList<String>, ctx: Context) {

    // on below line we are creating a variable for url
    var url = "https://jsonkeeper.com/b/T7R2"

    // on below line we are creating a
    // variable for our request queue
    val queue = Volley.newRequestQueue(ctx)

    // on below line we are creating a request variable
    // for making our json object request.
    val request =
        // as we are getting json object response and we are making a get request.
        JsonArrayRequest(Request.Method.GET, url, null, { response ->
            // this method is called when we get successful response from API.
            try {
                for (i in 0 until response.length()) {
                    // on below line we are extracting data 
                    // from each json object
                    val respObj = response.getJSONObject(i)
                    val lngName = respObj.getString("languageName")

                    // on below line we are adding data to our list
                    courseList += lngName
                }
                // on below line we are handling exception
            } catch (e: Exception) {
                e.printStackTrace()
            }

        }, { error ->
            // in this case we are simply displaying a toast message.
            Toast.makeText(ctx, "Fail to get response", Toast.LENGTH_SHORT)
                .show()
        })
    // at last we are adding our request to our queue.
    queue.add(request)

}

@Composable
fun displayListView() {
    val context = LocalContext.current
  
    // on below line we are creating and
    // initializing our array list
    val courseList = remember { mutableStateListOf<String>() }
    parseJSONArray(courseList, context)

    // on the below line we are creating a
    // lazy column for displaying a list view.
    // on below line we are calling lazy column
    // for displaying lstview.
    LazyColumn {
        // on below line we are populating
        // items for listview.
        items(courseList) { language ->
            // on below line we are specifying ui for each item of list view.
            // we are specifying a simple text for each item of our list view.
            Text(language, modifier = Modifier.padding(15.dp))
            // on below line we are specifying
            // divider for each list item
            Divider()
        }
    }

}