change usage of image loader

MohamedRejeb · Nov 15, 2023 · 07af594 · 07af594
1 parent 4271d7e
commit 07af594
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 62 deletions.
diff --git a/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/details/DetailsScreen.kt b/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/details/DetailsScreen.kt
@@ -1,31 +1,9 @@
 package com.mocoding.pokedex.ui.details
 
-import androidx.compose.foundation.layout.*
-import androidx.compose.foundation.lazy.LazyColumn
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.rounded.ArrowBackIosNew
-import androidx.compose.material.icons.rounded.Favorite
-import androidx.compose.material.icons.rounded.FavoriteBorder
-import androidx.compose.material3.*
 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.draw.*
-import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.ColorFilter
-import androidx.compose.ui.graphics.ColorMatrix
-import androidx.compose.ui.layout.ContentScale
-import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.style.TextAlign
-import androidx.compose.ui.unit.dp
-import com.mocoding.pokedex.ui.comingsoon.AsyncImage
-import com.mocoding.pokedex.ui.details.components.AbilityRow
 import com.mocoding.pokedex.ui.details.components.DetailsContent
-import com.mocoding.pokedex.ui.details.components.PokemonInfos
-import com.mocoding.pokedex.ui.details.components.PokemonStats
-import com.mocoding.pokedex.ui.helper.LocalSafeArea
 
 @Composable
 internal fun DetailsScreen(component: DetailsComponent) {

diff --git a/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/details/components/DetailsContent.kt b/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/details/components/DetailsContent.kt
@@ -21,7 +21,7 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.dp
-import com.mocoding.pokedex.ui.comingsoon.AsyncImage
+import com.mocoding.pokedex.ui.main.components.AsyncImage
 import com.mocoding.pokedex.ui.details.DetailsComponent
 import com.mocoding.pokedex.ui.details.store.DetailsStore
 import com.mocoding.pokedex.ui.helper.LocalSafeArea

diff --git a/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/main/components/CategoryButton.kt b/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/main/components/CategoryButton.kt
@@ -1,27 +1,21 @@
 package com.mocoding.pokedex.ui.main.components
 
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
-import androidx.compose.foundation.shape.CircleShape
-import androidx.compose.material3.Button
-import androidx.compose.material3.ButtonDefaults
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.scale
-import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.graphics.Brush
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import com.mocoding.pokedex.ui.main.state.CategoryState
 import com.mocoding.pokedex.ui.theme.Black
-import com.seiko.imageloader.rememberAsyncImagePainter
 
 @Composable
 internal fun CategoryButton(
@@ -51,8 +45,6 @@ internal fun CategoryButton(
 
  Spacer(Modifier.weight(1f))
 
- val painter = rememberAsyncImagePainter(categoryState.iconUrl)
-
  Box(
  contentAlignment = Alignment.Center
  ) {
@@ -71,11 +63,11 @@ internal fun CategoryButton(
  )
  )
 
- Image(
- painter = painter,
+
+ AsyncImage(
+ url = categoryState.iconUrl,
  contentDescription = categoryState.title,
  modifier = Modifier
- .offset(y = (-8).dp)
  .size(40.dp)
  )
  }

diff --git a/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/main/components/MainContent.kt b/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/main/components/MainContent.kt
@@ -2,29 +2,19 @@ package com.mocoding.pokedex.ui.main.components
 
 import androidx.compose.foundation.*
 import androidx.compose.foundation.layout.*
-import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.rounded.Menu
 import androidx.compose.material.icons.rounded.Search
 import androidx.compose.material3.*
 import androidx.compose.runtime.*
-import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.draw.drawBehind
-import androidx.compose.ui.draw.drawWithCache
-import androidx.compose.ui.geometry.center
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import com.mocoding.pokedex.core.model.Video
 import com.mocoding.pokedex.ui.main.MainComponent
 import com.mocoding.pokedex.ui.main.state.CategoryState
 import com.mocoding.pokedex.ui.main.store.MainStore
-import com.mocoding.pokedex.ui.theme.*
-import com.seiko.imageloader.rememberAsyncImagePainter
-import kotlinx.coroutines.delay
 
-@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 internal fun MainContent(
  state: MainStore.State,
@@ -46,6 +36,7 @@ internal fun MainContent(
  modifier = Modifier.padding(horizontal = 20.dp, vertical = 20.dp)
  )
 
+ val containerColor = MaterialTheme.colorScheme.surface.copy(alpha = .2f)
  TextField(
  value = state.search,
  onValueChange = { onEvent(MainStore.Intent.InputPokemonSearch(it)) },
@@ -59,13 +50,16 @@ internal fun MainContent(
  Icon(Icons.Rounded.Search, contentDescription = "Search Pokemon")
  }
  },
- colors = TextFieldDefaults.textFieldColors(
- containerColor = MaterialTheme.colorScheme.surface.copy(alpha = .2f),
- placeholderColor = MaterialTheme.colorScheme.surface,
+ colors = TextFieldDefaults.colors(
+ focusedContainerColor = containerColor,
+ unfocusedContainerColor = containerColor,
+ disabledContainerColor = containerColor,
+ focusedIndicatorColor = Color.Transparent,
+ unfocusedIndicatorColor = Color.Transparent,
  focusedLeadingIconColor = MaterialTheme.colorScheme.surface,
  unfocusedLeadingIconColor = MaterialTheme.colorScheme.surface,
- unfocusedIndicatorColor = Color.Transparent,
- focusedIndicatorColor = Color.Transparent,
+ focusedPlaceholderColor = MaterialTheme.colorScheme.surface,
+ unfocusedPlaceholderColor = MaterialTheme.colorScheme.surface,
  ),
  shape = MaterialTheme.shapes.extraLarge,
  modifier = Modifier

diff --git a/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/main/components/VideoItem.kt b/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/main/components/VideoItem.kt
@@ -1,6 +1,5 @@
 package com.mocoding.pokedex.ui.main.components
 
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.material.icons.Icons
@@ -20,7 +19,6 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.unit.dp
 import com.mocoding.pokedex.core.model.Video
 import com.mocoding.pokedex.ui.theme.Black
-import com.seiko.imageloader.rememberAsyncImagePainter
 
 @Composable
 internal fun VideoItem(
@@ -29,8 +27,6 @@ internal fun VideoItem(
  modifier: Modifier = Modifier
 ) {
 
- val painter = rememberAsyncImagePainter(video.imageUrl)
-
  Column(
  verticalArrangement = Arrangement.spacedBy(8.dp),
  modifier = modifier
@@ -42,8 +38,8 @@ internal fun VideoItem(
  Box(
  contentAlignment = Alignment.Center
  ) {
- Image(
- painter = painter,
+ AsyncImage(
+ url = video.imageUrl,
  contentDescription = video.title,
  contentScale = ContentScale.Crop,
  colorFilter = ColorFilter.tint(Black.copy(.5f), BlendMode.Darken),
@@ -53,7 +49,6 @@ internal fun VideoItem(
  .clip(MaterialTheme.shapes.medium)
  )
 
-
  Icon(
  Icons.Rounded.PlayArrow,
  contentDescription = null,

diff --git a/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/pokedex/components/PokemonItem.kt b/shared/src/commonMain/kotlin/com/mocoding/pokedex/ui/pokedex/components/PokemonItem.kt
@@ -1,10 +1,7 @@
 package com.mocoding.pokedex.ui.pokedex.components
 
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
-import androidx.compose.material.icons.Icons
-import androidx.compose.material.icons.outlined.Image
 import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
@@ -17,10 +14,8 @@ import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
 import com.mocoding.pokedex.core.model.Pokemon
-import com.mocoding.pokedex.ui.comingsoon.AsyncImage
+import com.mocoding.pokedex.ui.main.components.AsyncImage
 import com.mocoding.pokedex.ui.theme.*
-import com.seiko.imageloader.ImageRequestState
-import com.seiko.imageloader.rememberAsyncImagePainter
 
 @OptIn(ExperimentalMaterial3Api::class)
 @Composable