@Composable
fun JobItemView(modifier: Modifier = Modifier,job: Job ){
Card(modifier = Modifier
    .height(100.dp)
    ,elevation = 4.dp) {
    Row(modifier = Modifier.padding(horizontal = 8.dp),verticalAlignment = Alignment.CenterVertically) {

        when(job.company_logo){
            is String -> {
                CoilImage(modifier = Modifier
                    .size(60.dp)
                    .padding(2.dp) ,
                    data = job.company_logo as String,
                    contentDescription = "An image",
                    loading = {
                        Box(Modifier.matchParentSize()){
                            CircularProgressIndicator(Modifier.align(
                                Alignment.Center))
                        }
                    },error = {

                    })
            } else -> {
                Image(modifier = Modifier.size(60.dp).padding(2.dp) ,
                    painter = painterResource(id = R.drawable.ic_launcher_background), contentDescription = "Content" )
            }

        }


        Column(verticalArrangement = Arrangement.Center) {
            Text(text = job.title,fontWeight = FontWeight.Bold)
            Text(text = job.company)

        }
        
        Spacer(modifier = Modifier.weight(1f))
        Text(text = job.type)

    }

}

}

setContent {
                val jobs:List<Job> by viewModel.jobs.observeAsState(listOf())

                LazyColumn{
                    items(jobs,key ={ it.id} ){ job ->
                        JobItemView(job = job,modifier = Modifier.clickable(onClick = {
                            Log.d(TAG, "onCreateView: $job")
                            findNavController().navigate(HomeFragmentDirections.actionHomeFragmentToDetailsFragment(job))
                        }))


                    }
                }
            }