package com.example.musicapp.Data.Repository

import com.example.musicapp.Data.Artist
import com.example.musicapp.Data.ArtistDetail

class ArtistRepository {
    private val deezerApiService = DeezerApiService.create()

    suspend fun getArtists(genreId: Int): List<Artist> {
        val response = deezerApiService.getArtists(genreId)
        return response.data
    }
    suspend fun getArtistDetail(artistId: Int): List<ArtistDetail> {
        val response = deezerApiService.getArtistDetail(artistId)
        return response.data
    }

},package com.example.musicapp.Data.Repository

import com.example.musicapp.Data.Artist
import com.example.musicapp.Data.ArtistDetail
import com.example.musicapp.Data.Category
import okhttp3.OkHttpClient
import okhttp3.logging.HttpLoggingInterceptor
import retrofit2.Retrofit
import retrofit2.converter.gson.GsonConverterFactory
import retrofit2.http.GET
import retrofit2.http.Path

interface DeezerApiService {
    @GET("genre")
    suspend fun getGenres(): DeezerResponse<Category>

    @GET("genre/{genre_id}/artists")
    suspend fun getArtists(@Path("genre_id") genreId: Int): DeezerResponse<Artist>

    @GET("artist/{artist_id}")
    suspend fun getArtistDetail(@Path("artist_id") artistId: Int): DeezerResponse<ArtistDetail>



    companion object {
        private const val BASE_URL = "https://api.deezer.com/"

        fun create(): DeezerApiService {
            val client = OkHttpClient.Builder()
                .addInterceptor(HttpLoggingInterceptor().apply {
                    level = HttpLoggingInterceptor.Level.BODY
                })
                .build()

            return Retrofit.Builder()
                .baseUrl(BASE_URL)
                .client(client)
                .addConverterFactory(GsonConverterFactory.create())
                .build()
                .create(DeezerApiService::class.java)
        }
    }


},package com.example.musicapp.Data.Repository

import com.example.musicapp.Data.Artist
import com.example.musicapp.Data.ArtistDetail
import com.example.musicapp.Data.Category

class DeezerRepository {
    private val deezerApiService = DeezerApiService.create()
    suspend fun getCategories(): List<Category> {
        val response = deezerApiService.getGenres()
        return response.data.map { category ->
            Category(category.id, category.name, category.picture_medium)
        }
    }
    suspend fun getArtists(genreId: Int): List<Artist> {
        val response = deezerApiService.getArtists(genreId)
        return response.data
    }

    suspend fun getArtistDetail(artistId: Int): List<ArtistDetail> {
        val response = deezerApiService.getArtistDetail(artistId)
        return response.data
    }
},package com.example.musicapp.Data.Repository

data class DeezerResponse<T>(
    val data: List<T>
),package com.example.musicapp.Data

data class Album(
    val id: Int,
    val title: String,
    val link: String,
    val cover: String,
    val coverSmall: String,
    val coverMedium: String,
    val coverBig: String,
    val coverXl: String,
    val releaseDate: String,
    val tracklist: String,
    val type: String
)
package com.example.musicapp.Data

data class Artist(
    val id: Int,
    val name: String,
    val picture_medium: String
),package com.example.musicapp.Data

data class ArtistDetail(
    val id: Int,
    val name: String,
    val link: String,
    val picture: String,
    val pictureBig: String,
    val pictureMedium: String,
    val pictureSmall: String,
    val pictureXl: String,
    val tracklist: String,
    val type: String,
    val nbAlbum: Int,
    val nbFan: Int,
    val nbPlaylist: Int,
    val nbRadio: Int,
    val nbFanLabel: Int,
    val radio: Boolean,
    val share: String,
    val biography: String?,
    val albums: List<Album>,
    val relatedArtists: List<Artist>
),package com.example.musicapp.Data



data class Category(
    val id: Int,
    val name: String,
    val picture_medium: String
)
,package com.example.musicapp.Interface

import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import coil.compose.rememberAsyncImagePainter
import com.example.musicapp.Data.Album
import com.example.musicapp.ViewModel.ArtistsViewModel

@Composable
fun ArtistDetailScreen(artistId: Int) {
    val artistsViewModel: ArtistsViewModel = viewModel()
    artistsViewModel.fetchArtistDetails(artistId)
    val artistDetails by artistsViewModel.artistDetails.collectAsState()

    val artistDetail = artistDetails.firstOrNull()
    artistDetail?.let {
        Column {
            Text(
                text = it.name,
                style = MaterialTheme.typography.h6,
                modifier = Modifier.padding(start = 16.dp, end = 16.dp, top = 16.dp, bottom = 8.dp)
            )

            val painter = rememberAsyncImagePainter(model = it.pictureBig)
            Image(
                painter = painter,
                contentDescription = it.name,
                contentScale = ContentScale.Crop,
                modifier = Modifier
                    .align(Alignment.CenterHorizontally)
                    .size(200.dp)
            )

            LazyColumn {
                items(it.albums) { album ->
                    ArtistDetailItem(album)
                }
            }
        }
    }
}
@Composable
fun ArtistDetailItem(album: Album) {
    Row(modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp)) {
        val painter = rememberAsyncImagePainter(model = album.coverMedium)
        Image(
            painter = painter,
            contentDescription = album.title,
            contentScale = ContentScale.Crop,
            modifier = Modifier
                .size(100.dp)
                .align(Alignment.CenterVertically)
        )

        Column(
            modifier = Modifier
                .weight(1f) // 2/3 of the width
                .padding(start = 16.dp)
                .align(Alignment.CenterVertically)
        ) {
            Text(text = album.title, style = MaterialTheme.typography.subtitle1)
            Text(text = album.releaseDate, style = MaterialTheme.typography.caption)
        }
    }
},package com.example.musicapp.Interface

import TopBar
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Scaffold
import androidx.compose.material.Surface
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.navigation.NavController
import coil.compose.rememberAsyncImagePainter
import com.example.musicapp.Data.Artist
import com.example.musicapp.Data.Category
import com.example.musicapp.ViewModel.ArtistsViewModel
import com.example.musicapp.ViewModel.CategoriesViewModel
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue


@Composable
fun ArtistsScreen(navController: NavController, categoryId: Int) {
    val categoriesViewModel: CategoriesViewModel = viewModel()
    val allCategories by categoriesViewModel.categories.collectAsState()
    val category = allCategories.firstOrNull { it.id == categoryId }

    val artistsViewModel: ArtistsViewModel = viewModel()
    val artists by artistsViewModel.artists.collectAsState()
    artistsViewModel.fetchArtists(categoryId)

    if (category != null) {
        Scaffold(
            topBar = { TopBar(title = category.name) },
            content = { padding ->
                Column(modifier = Modifier.padding(padding)) {
                    ArtistsScreenContent(
                        genre = category,
                        artists = artists,
                        onArtistSelected = { artist -> // FIX HERE
                            navController.navigate("artistDetail/{artist.id}")
                        }
                    )
                }
            }
        )
    } else {
        Text("Category not found")
    }
}

@Composable
fun ArtistsScreenContent(
    genre: Category,
    artists: List<Artist>,
    onArtistSelected: (Artist) -> Unit = {},
) {
    Column {
        Text(
            text = "Genre Artists:${genre.name}",
        style = MaterialTheme.typography.h6,
        modifier = Modifier.padding(start = 16.dp, end = 16.dp, top = 16.dp, bottom = 8.dp)
        )

        LazyVerticalGrid(
            columns = GridCells.Fixed(2),
            contentPadding = PaddingValues(16.dp)
        ) {
            items(artists) { artist ->
                ArtistItem(artist) { onArtistSelected(artist) } // FIX HERE
            }
        }
    }
}

@Composable
private fun ArtistItem(artist: Artist, onClick: () -> Unit) {
    Surface(
        modifier = Modifier
            .padding(8.dp)
            .clickable(onClick = onClick)
            .aspectRatio(1f),
        shape = RoundedCornerShape(8.dp),
        elevation = 4.dp,
        border = BorderStroke(width = 1.dp, color = Color.LightGray)
    ) {
        Box(
            modifier = Modifier.fillMaxSize()
        ) {
            val painter = rememberAsyncImagePainter(model = artist.picture_medium)

            Image(
                painter = painter,
                contentDescription = artist.name,
                contentScale = ContentScale.Crop,
                modifier = Modifier.fillMaxSize()
            )

            Text(
                text = artist.name,
                modifier = Modifier
                    .align(Alignment.BottomCenter)
                    .background(color = Color.Black.copy(alpha = 0.7f))
                    .fillMaxWidth()
                    .padding(4.dp),
                style = MaterialTheme.typography.body2,
                color = Color.White,
                textAlign = TextAlign.Center
            )
        }
    }
},package com.example.musicapp.Interface

import MusicCategoriesScreen
import TopBar
import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.material.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import com.example.musicapp.ui.theme.MusicAppTheme
import com.example.musicapp.R
import com.example.musicapp.ViewModel.CategoriesViewModel
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.rememberNavController


class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            MusicAppTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colors.background
                ) {
                    MainScreen()
                }
            }
        }
    }
}
@Composable
fun FirstScreen(modifier: Modifier = Modifier) {
    val categoriesViewModel: CategoriesViewModel = viewModel()
    val categories by categoriesViewModel.categories.collectAsState()
    Scaffold(
        content = { padding ->
            Column(
                modifier = modifier.padding(padding)
            ) {
                // Add your UI components here
                MusicCategoriesScreen(categories = categories, topBar = { TopBar(title = "Music Categories") })
            }
        }
    )
}


@Composable
fun SecondScreen(modifier: Modifier = Modifier) {
    Scaffold(
        topBar = {
            // No top bar title
        },
        content = { padding ->
            Column(
                modifier = modifier.padding(padding)
            ) {
                Text(text = "This is the second screen")
            }
        }
    )
}


/*
@Composable
fun MainScreen() {
    val navController = rememberNavController()

    NavHost(navController, startDestination = "musicCategories") {
        composable("musicCategories") {
        val categoriesViewModel: CategoriesViewModel = viewModel()
        val categories by categoriesViewModel.categories.collectAsState()

        MusicCategoriesScreen(
            categories = categories,
            onCategorySelected = { category ->
                navController.navigate("artistsDetail/${category.id}")
            },
            topBar = { TopBar(title = "Music Categories") }
        )
    }
        composable("artistsDetail/{categoryId}") { backStackEntry ->
        val categoryId = backStackEntry.arguments?.getString("categoryId")?.toIntOrNull()
        if (categoryId != null) {
            ArtistsScreen(navController, categoryId)
        }
    }
    }
}

 */
@Composable
fun MainScreen() {
    val navController = rememberNavController()

    NavHost(navController, startDestination = "musicCategories") {
        composable("musicCategories") {
        val categoriesViewModel: CategoriesViewModel = viewModel()
        val categories by categoriesViewModel.categories.collectAsState()

        MusicCategoriesScreen(
            categories = categories,
            onCategorySelected = { category ->
                navController.navigate("artistsDetail/${category.id}")
            },
            topBar = { TopBar(title = "Music Categories") }
        )
    }
        composable("artistsDetail/{categoryId}") { backStackEntry ->
        val categoryId = backStackEntry.arguments?.getString("categoryId")?.toIntOrNull()
        if (categoryId != null) {
            ArtistsScreen(navController, categoryId)
        }
    }
        composable("artistDetail/{artistId}") { backStackEntry ->
        val artistId = backStackEntry.arguments?.getString("artistId")?.toIntOrNull()
        if (artistId != null) {
            ArtistDetailScreen(artistId)
        }
    }
    }
}


@Composable
fun BottomBar(selectedScreen: Int, onItemSelected: (Int) -> Unit) {
    BottomAppBar {
        BottomNavigationItem(
            icon = { Icon(painterResource(R.drawable.music_symbol), contentDescription = null) },
            selected = selectedScreen == 0,
            onClick = { onItemSelected(0) }
        )
        BottomNavigationItem(
            icon = { Icon(painterResource(R.drawable.heart_empty), contentDescription = null) },
            selected = selectedScreen == 1,
            onClick = { onItemSelected(1) }
        )
    }
}

/*
@Composable
fun MainScreen() {
    val selectedScreen = remember { mutableStateOf(0) }
    Scaffold(
        bottomBar = { BottomBar(selectedScreen.value, onItemSelected = { index -> selectedScreen.value = index }) },
        content = { padding ->
            when (selectedScreen.value) {
                0 -> FirstScreen(modifier = Modifier.padding(padding))
                1 -> SecondScreen(modifier = Modifier.padding(padding))
            }
        }
    )
}
 */
,import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.compose.material.Text
import androidx.compose.material.TopAppBar
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import coil.compose.rememberAsyncImagePainter
import com.example.musicapp.Data.Category

@Composable
fun MusicCategoriesScreen(
    categories: List<Category>,
    onCategorySelected: (Category) -> Unit = {},
    topBar: @Composable () -> Unit,
    modifier: Modifier = Modifier
) {
    Column(
        modifier = modifier
    ) {
        topBar()

        LazyVerticalGrid(
            columns = GridCells.Fixed(2),
            contentPadding = PaddingValues(16.dp)
        ) {
            items(categories) { category ->
                CategoryItem(category) {
                    onCategorySelected(category)
                }
            }
        }
    }
}

@Composable
fun TopBar(title: String) {
    TopAppBar(
        title = {
            Text(
                title,
                textAlign = TextAlign.Center,
                modifier = Modifier.fillMaxWidth()
            )
        }
    )
}

@Composable
private fun CategoryItem(category: Category, onClick: () -> Unit) {
    Surface(
        modifier = Modifier
            .padding(8.dp)
            .clickable(onClick = onClick)
            .aspectRatio(1f),
        shape = RoundedCornerShape(8.dp),
        elevation = 4.dp,
        border = BorderStroke(width = 1.dp, color = Color.LightGray)
    ) {
        Box(
            modifier = Modifier.fillMaxSize()
        ) {
            val painter = rememberAsyncImagePainter(model = category.picture_medium)

            Image(
                painter = painter,
                contentDescription = category.name,
                contentScale = ContentScale.Crop,
                modifier = Modifier.fillMaxSize()
            )

            Text(
                text = category.name,
                modifier = Modifier
                    .align(Alignment.BottomCenter)
                    .background(color = Color.Black.copy(alpha = 0.7f))
                    .fillMaxWidth()
                    .padding(4.dp),
                style = MaterialTheme.typography.body2,
                color = Color.White, // Change the text color to white
                textAlign = TextAlign.Center
            )
        }
    }
},package com.example.musicapp.ViewModel

import android.util.Log
import androidx.lifecycle.ViewModel
import androidx.lifecycle.viewModelScope
import com.example.musicapp.Data.Artist
import com.example.musicapp.Data.ArtistDetail
import com.example.musicapp.Data.Repository.ArtistRepository
import com.example.musicapp.Data.Repository.DeezerRepository
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.StateFlow
import kotlinx.coroutines.launch

class ArtistsViewModel : ViewModel() {
    private val deezerRepository = DeezerRepository()

    private val _artists = MutableStateFlow<List<Artist>>(emptyList())
    val artists: StateFlow<List<Artist>>
        get() = _artists

    private val _artistDetails = MutableStateFlow<List<ArtistDetail>>(emptyList())
    val artistDetails: StateFlow<List<ArtistDetail>>
        get() = _artistDetails

    fun fetchArtists(genreId: Int) {
        viewModelScope.launch {
            try {
                val artists = deezerRepository.getArtists(genreId)
                _artists.value = artists
            } catch (e: Exception) {
                Log.e("MusicViewModel", "Failed to fetch artists: " + e.message)
            }
        }
    }

    fun fetchArtistDetails(artistId: Int) {
        viewModelScope.launch {
            try {
                val artistDetail = deezerRepository.getArtistDetail(artistId)
                _artistDetails.value = artistDetail // FIX HERE
            } catch (e: Exception) {
                Log.e("MusicViewModel", "Failed to fetch artist details: " + e.message)
            }
        }
    }
}
,package com.example.musicapp.ViewModel

import android.util.Log
import androidx.lifecycle.ViewModel
import androidx.lifecycle.viewModelScope
import com.example.musicapp.Data.Category
import com.example.musicapp.Data.Repository.DeezerRepository
import kotlinx.coroutines.flow.MutableStateFlow
import kotlinx.coroutines.flow.StateFlow
import kotlinx.coroutines.launch
class CategoriesViewModel : ViewModel() {
    private val deezerRepository = DeezerRepository()
    private val _categories = MutableStateFlow<List<Category>>(emptyList())
    val categories: StateFlow<List<Category>>
        get() = _categories

    init {
        fetchCategories()
    }

    private fun fetchCategories() {
        viewModelScope.launch {
            try {
                val categories = deezerRepository.getCategories()
                _categories.value = categories
            } catch (e: Exception) {
                Log.e("CategoriesViewModel", "Failed to fetch categories: ${e.message}")
            }
        }
    }

    // public function to fetch categories
    fun refreshCategories() {
        fetchCategories()
    }
}
 Why when i clickto an artist , artist details screen page is empty ? can you fix it these are my all classes "," separated