Dark and Light Mode in Jetpack and Android

package com.example.newsapp

/**
 * SampleData for Jetpack Compose Tutorial
 */
object SampleData {
    // Sample conversation data
    val conversationSample = listOf(
        Message(
            "John",
            "How are you?"
        ),
        Message(
            "John",
            """List of Global Leaders:
            |Joe Biden (USA)
            |Boris Johnson (UK)
            |Narendra Modi (India)
            |Angela Merkel (Germany)
            |Xi Jinping (China)""".trim()
        ),
        Message(
            "John",
            """I think Spanish is a beautiful language.
            |It's so rich and expressive!""".trim()
        ),
        Message(
            "John",
            "Looking for updates on the new international space station project..."
        ),
        Message(
            "John",
            """Hey, did you hear about the new technology hub in Silicon Valley?
            |It's bringing innovation and growth to the tech industry globally.
            |Exciting times ahead!""".trim()
        ),
        Message(
            "John",
            "The tech hub is part of a global initiative to boost technology :)"
        ),
        Message(
            "John",
            "Investing in tech startups worldwide seems so promising, where do we start?"
        ),
        Message(
            "John",
            "Apple's new features are incredible!"
        ),
        Message(
            "John",
            "Mobile money platforms are leading the world ^_^"
        ),
        Message(
            "John",
            "Did you know you can now access government services online in many countries?"
        ),
        Message(
            "John",
            "The innovation in fintech globally is amazing, digital payments keep evolving"
        ),
        Message(
            "John",
            "Interactive maps for city traffic are now available worldwide"
        ),
        Message(
            "John",
            "Have you tried booking train tickets online in your country?"
        ),
    )
}

@Composable

fun Conversation(messages: List<Message>) {
    //Here messages is an instance of Message in the MessageCard function above
    LazyColumn {
        items(messages) { message ->
            MessageCard(message)
        }
    }
}

//HAPPY CODING !!!






@Preview(name = "Light Mode")
@Preview(
    uiMode = Configuration.UI_MODE_NIGHT_YES,
    showBackground = true,
    name = "Dark Mode"
)

@Preview(showBackground = true)
@Composable
fun MessageCardPreview() {
    NewsAppTheme {
        Surface() {
            MessageCard(msg = Message("Wilson", "Hey, take a look at Jetpack Compose, it's great!"))
            Conversation(SampleData.conversationSample)
        }

    }
}

@Preview
@Composable
fun PreviewConversation() {
    NewsAppTheme {
        Conversation(SampleData.conversationSample)
    }
}

package com.example.newsapp.ui.theme

import androidx.compose.ui.graphics.Color

val Purple80 = Color(0xFFD0BCFF)
val PurpleGrey80 = Color(0xFFCCC2DC)
val Pink80 = Color(0xFFEFB8C8)

val Purple40 = Color(0xFF6650a4)
val PurpleGrey40 = Color(0xFF625b71)
val Pink40 = Color(0xFF7D5260)

package com.example.newsapp.ui.theme

import android.app.Activity
import android.os.Build
import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.darkColorScheme
import androidx.compose.material3.dynamicDarkColorScheme
import androidx.compose.material3.dynamicLightColorScheme
import androidx.compose.material3.lightColorScheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.SideEffect
import androidx.compose.ui.graphics.toArgb
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalView
import androidx.core.view.WindowCompat

private val DarkColorScheme = darkColorScheme(
    primary = Purple80,
    secondary = PurpleGrey80,
    tertiary = Pink80
)

private val LightColorScheme = lightColorScheme(
    primary = Purple40,
    secondary = PurpleGrey40,
    tertiary = Pink40

    /* Other default colors to override
    background = Color(0xFFFFFBFE),
    surface = Color(0xFFFFFBFE),
    onPrimary = Color.White,
    onSecondary = Color.White,
    onTertiary = Color.White,
    onBackground = Color(0xFF1C1B1F),
    onSurface = Color(0xFF1C1B1F),
    */
)

@Composable
fun NewsAppTheme(
    darkTheme: Boolean = isSystemInDarkTheme(),
    // Dynamic color is available on Android 12+
    dynamicColor: Boolean = true,
    content: @Composable () -> Unit
) {
    val colorScheme = when {
        dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
            val context = LocalContext.current
            if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
        }

        darkTheme -> DarkColorScheme
        else -> LightColorScheme
    }
    val view = LocalView.current
    if (!view.isInEditMode) {
        SideEffect {
            val window = (view.context as Activity).window
            window.statusBarColor = colorScheme.primary.toArgb()
            WindowCompat.getInsetsController(window, view).isAppearanceLightStatusBars = darkTheme
        }
    }

    MaterialTheme(
        colorScheme = colorScheme,
        typography = Typography,
        content = content
    )
}