Enhancing Library Usability with Communication Error Handling in Queries and Mutations

[psyrenpark]

Hello~
I've been enjoying using this library. During its use, I've made some modifications.
I would appreciate it if you could review them.

Thank you for creating such a great library. If circumstances allow while I continue to study, I plan to make further modifications.

P.S.:
I am a React Native developer currently studying Compose and SwiftUI in the React paradigm.

Below are the reference materials.

// query

@Composable
fun TestQuery() {
    Column() {

        val queryResult by useQuery {
            delay(200)
            val response =  Req2.client.get("https://www.test-error.com")
            "Fetched: ${response?.status}"
        }
        when(queryResult){
            is QueryState.Loading -> {
                Text("loading")
            }
            is QueryState.Error -> {
                val th = (queryResult as QueryState.Error).th
                val statusCode : Int = when (th){
                    is RedirectResponseException -> { //Http Code: 3xx
                        (th.response.status.value)
                    }
                    is ClientRequestException -> { //Http Code: 4xx
                        (th.response.status.value)
                    }
                    is ServerResponseException -> { //Http Code: 5xx
                        (th.response.status.value)
                    }
                    is UnresolvedAddressException -> { // Network Error - Internet Error
                        1000
                    }
                    else -> 9999
                }
                Text("error : ${statusCode}" )
            }
            is QueryState.Content -> {
                val data = (queryResult as QueryState.Content<String>).data;
                Text("data :  $data")
            }
        }

    }
}

// mutation
@Composable
fun TestMutation() {
    var buttonText by remember { mutableStateOf("idle") }

    val testMutation = useMutation { (username, password) ->
        delay(500)
        val url = "https://www.test-error.com"
        val response =  Req2.client.get(url)
        "secret_token:$username/$password Fetched ${response?.status} "
    }
    
    Column() {
        Button(onClick = {
            testMutation.reset()
        }) {
            Text("reset")
        }
        Button(onClick = {
            println("click")
            testMutation.mutate("pavi2410", "secretpw123") {
                buttonText = it
            }

        }) {
            Text(text = buttonText)
        }

        when(testMutation.state){
            is MutationState.Idle -> {
                Text("idle")
            }
            is MutationState.Loading -> {
                Text("loading")
            }
            is MutationState.Error -> {
                val th = (testMutation.state as MutationState.Error).th
                val statusCode : Int = when (th){

                    is RedirectResponseException -> { //Http Code: 3xx
                        (th.response.status.value)
                    }
                    is ClientRequestException -> { //Http Code: 4xx
                        (th.response.status.value)
                    }
                    is ServerResponseException -> { //Http Code: 5xx
                        (th.response.status.value)
                    }
                    is UnresolvedAddressException -> { // Network Error - Internet Error
                        1000
                    }
                    else -> 9999
                }
                Text("error : $statusCode" )
            }
            is MutationState.Success -> {
                Text("Success : $buttonText")
            }
        }
    }
}

//swift ui
https://github.com/unixzii/swiftui-for-react-devs

// compose
https://tigeroakes.com/posts/react-to-compose-dictionary/

[pavi2410]

Wow! I thought nobody uses this library. Thanks for using this. It's bedtime right now, I will read this issue in the morning.

[pavi2410]

I am working on a v2 of this library at #16 where my goal will be to get a feature-rich and correct implementation of Tanstack Query.