diff --git a/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/component/CollapsingToolbar.kt b/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/component/CollapsingToolbar.kt index 679dbe2..f8acff0 100644 --- a/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/component/CollapsingToolbar.kt +++ b/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/component/CollapsingToolbar.kt @@ -10,24 +10,28 @@ import androidx.compose.material.icons.automirrored.filled.MenuBook import androidx.compose.material.icons.filled.AccountCircle import androidx.compose.material.icons.filled.PlayCircleFilled import androidx.compose.material3.* -import androidx.compose.runtime.Composable -import androidx.compose.runtime.derivedStateOf -import androidx.compose.runtime.getValue -import androidx.compose.runtime.remember +import androidx.compose.runtime.* import androidx.compose.ui.Alignment import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.ColorFilter +import androidx.compose.ui.graphics.vector.rememberVectorPainter import androidx.compose.ui.layout.ContentScale import androidx.compose.ui.unit.dp +import coil3.compose.AsyncImage +import coil3.compose.rememberAsyncImagePainter import dev.chrisbanes.haze.hazeChild import dev.chrisbanes.haze.materials.ExperimentalHazeMaterialsApi import dev.chrisbanes.haze.materials.HazeMaterials import dev.datlag.aniflow.LocalHaze import dev.datlag.aniflow.SharedRes +import dev.datlag.aniflow.anilist.model.User import dev.datlag.aniflow.anilist.type.MediaType import dev.datlag.tooling.compose.ifFalse import dev.datlag.tooling.decompose.lifecycle.collectAsStateWithLifecycle +import dev.icerock.moko.resources.compose.fontFamilyResource import dev.icerock.moko.resources.compose.painterResource +import dev.icerock.moko.resources.compose.stringResource import kotlinx.coroutines.flow.Flow import kotlin.math.max import kotlin.math.min @@ -37,6 +41,7 @@ import kotlin.math.min fun CollapsingToolbar( state: TopAppBarState, scrollBehavior: TopAppBarScrollBehavior, + userFlow: Flow, viewTypeFlow: Flow, onProfileClick: () -> Unit, onAnimeClick: () -> Unit, @@ -78,9 +83,37 @@ fun CollapsingToolbar( onProfileClick() } ) { - Icon( - imageVector = Icons.Filled.AccountCircle, - contentDescription = null + val user by userFlow.collectAsStateWithLifecycle(null) + var colorFilter by remember(user) { mutableStateOf(null) } + val tintColor = LocalContentColor.current + + AsyncImage( + model = user?.avatar?.large, + contentDescription = null, + contentScale = ContentScale.Crop, + colorFilter = colorFilter, + placeholder = rememberVectorPainter(Icons.Filled.AccountCircle), + error = rememberAsyncImagePainter( + model = user?.avatar?.medium, + contentScale = ContentScale.Crop, + error = rememberVectorPainter(Icons.Filled.AccountCircle), + placeholder = rememberVectorPainter(Icons.Filled.AccountCircle), + onError = { + colorFilter = ColorFilter.tint(tintColor) + }, + onSuccess = { + colorFilter = null + }, + onLoading = { + colorFilter = ColorFilter.tint(tintColor) + } + ), + onSuccess = { + colorFilter = null + }, + onLoading = { + colorFilter = ColorFilter.tint(tintColor) + } ) } }, @@ -88,7 +121,10 @@ fun CollapsingToolbar( AnimatedVisibility( visible = isCollapsed ) { - Text(text = "AniFlow") + Text( + text = stringResource(SharedRes.strings.app_name), + fontFamily = fontFamilyResource(SharedRes.fonts.marckscript_regular) + ) } }, actions = { diff --git a/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeComponent.kt b/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeComponent.kt index b51b1b7..c44f942 100644 --- a/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeComponent.kt +++ b/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeComponent.kt @@ -3,6 +3,7 @@ package dev.datlag.aniflow.ui.navigation.screen.home import dev.datlag.aniflow.anilist.AiringTodayRepository import dev.datlag.aniflow.anilist.TrendingRepository import dev.datlag.aniflow.anilist.model.Medium +import dev.datlag.aniflow.anilist.model.User import dev.datlag.aniflow.anilist.state.CollectionState import dev.datlag.aniflow.anilist.type.MediaType import dev.datlag.aniflow.trace.TraceRepository @@ -11,6 +12,7 @@ import kotlinx.coroutines.flow.Flow interface HomeComponent : Component { val viewing: Flow + val user: Flow val airing: Flow val trending: Flow diff --git a/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeScreen.kt b/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeScreen.kt index 4f9841d..33d61ae 100644 --- a/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeScreen.kt +++ b/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeScreen.kt @@ -66,6 +66,7 @@ fun HomeScreen(component: HomeComponent) { CollapsingToolbar( state = appBarState, scrollBehavior = scrollBehavior, + userFlow = component.user, viewTypeFlow = component.viewing, onProfileClick = component::viewProfile, onAnimeClick = component::viewAnime, diff --git a/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeScreenComponent.kt b/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeScreenComponent.kt index 151c9f4..f903ce6 100644 --- a/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeScreenComponent.kt +++ b/composeApp/src/commonMain/kotlin/dev/datlag/aniflow/ui/navigation/screen/home/HomeScreenComponent.kt @@ -11,11 +11,13 @@ import dev.datlag.aniflow.anilist.PopularNextSeasonRepository import dev.datlag.aniflow.anilist.PopularSeasonRepository import dev.datlag.aniflow.anilist.TrendingRepository import dev.datlag.aniflow.anilist.model.Medium +import dev.datlag.aniflow.anilist.model.User import dev.datlag.aniflow.anilist.state.CollectionState import dev.datlag.aniflow.anilist.type.MediaType import dev.datlag.aniflow.common.onRender import dev.datlag.aniflow.model.coroutines.Executor import dev.datlag.aniflow.other.StateSaver +import dev.datlag.aniflow.other.UserHelper import dev.datlag.aniflow.settings.Settings import dev.datlag.aniflow.trace.TraceRepository import dev.datlag.tooling.decompose.ioScope @@ -44,8 +46,11 @@ class HomeScreenComponent( } } private val viewTypeExecutor = Executor() - private val stateScope = ioScope() + private val userHelper by instance() + override val user: Flow = userHelper.user + + private val stateScope = ioScope() private val airingTodayRepository by instance() override val airing: Flow = airingTodayRepository.airing.map { StateSaver.Home.updateAiring(it) diff --git a/composeApp/src/commonMain/moko-resources/fonts/MarckScript-regular.ttf b/composeApp/src/commonMain/moko-resources/fonts/MarckScript-regular.ttf new file mode 100644 index 0000000..2a8f6ba Binary files /dev/null and b/composeApp/src/commonMain/moko-resources/fonts/MarckScript-regular.ttf differ