new: add offline fallback support for WebView
This commit is contained in:
@@ -7,6 +7,7 @@ import bzh.ajaury.chombev.preferences.di.preferencesModule
|
||||
import bzh.ajaury.chombev.records.di.recordsModule
|
||||
import bzh.ajaury.chombev.records.ui.viewmodel.RecordsViewModel
|
||||
import bzh.ajaury.chombev.resources.di.resourcesModule
|
||||
import bzh.ajaury.chombev.web.ui.viewmodel.WebViewModel
|
||||
import org.koin.core.module.dsl.viewModelOf
|
||||
import org.koin.dsl.module
|
||||
|
||||
@@ -18,4 +19,5 @@ val sharedModule = module {
|
||||
includes(resourcesModule)
|
||||
viewModelOf(::RecordsViewModel)
|
||||
viewModelOf(::PlayerViewModel)
|
||||
viewModelOf(::WebViewModel)
|
||||
}
|
||||
|
||||
@@ -4,12 +4,21 @@ import kotlinx.serialization.Serializable
|
||||
|
||||
/**
|
||||
* Web destinations reachable from the main bottom navigation bar and shown inside the app.
|
||||
* Placeholder URLs for now.
|
||||
*
|
||||
* [offlineAsset] is the resource path of a bundled HTML snapshot shown when the online [url] cannot
|
||||
* be reached, so the page still has content offline.
|
||||
*/
|
||||
@Serializable
|
||||
enum class WebPage(
|
||||
val url: String,
|
||||
val offlineAsset: String,
|
||||
) {
|
||||
DEEPEN("https://ksk.bzh/fr/chom-bev-approfondir/"),
|
||||
ABOUT("https://ksk.bzh/fr/chom-bev-a-propos/"),
|
||||
DEEPEN(
|
||||
url = "https://ksk.bzh/fr/chom-bev-approfondir/",
|
||||
offlineAsset = "files/offline_deepen.html",
|
||||
),
|
||||
ABOUT(
|
||||
url = "https://ksk.bzh/fr/chom-bev-a-propos/",
|
||||
offlineAsset = "files/offline_about.html",
|
||||
),
|
||||
}
|
||||
|
||||
@@ -8,12 +8,16 @@ import androidx.compose.ui.Modifier
|
||||
* honouring [darkTheme] so the page matches the app's light/dark appearance; the others fall back to
|
||||
* [WebViewUnavailable], which offers to open the page in the system browser.
|
||||
*
|
||||
* When [url] cannot be reached, the native web views swap in [offlineHtml] — a bundled offline
|
||||
* snapshot — so the page still shows content. When it is `null` no fallback is loaded.
|
||||
*
|
||||
* [onLoadingStateChange] reports whether a page is currently loading, so the caller can show a
|
||||
* loader. Fallback platforms report `false` immediately since there is nothing to load.
|
||||
*/
|
||||
@Composable
|
||||
expect fun PlatformWebView(
|
||||
url: String,
|
||||
offlineHtml: String?,
|
||||
darkTheme: Boolean,
|
||||
onLoadingStateChange: (Boolean) -> Unit = {},
|
||||
modifier: Modifier = Modifier,
|
||||
|
||||
@@ -11,33 +11,62 @@ import androidx.compose.runtime.mutableStateOf
|
||||
import androidx.compose.runtime.remember
|
||||
import androidx.compose.runtime.setValue
|
||||
import androidx.compose.ui.Modifier
|
||||
import androidx.lifecycle.compose.collectAsStateWithLifecycle
|
||||
import bzh.ajaury.chombev.navigation.WebPage
|
||||
import bzh.ajaury.chombev.web.ui.viewmodel.WebUiState
|
||||
import bzh.ajaury.chombev.web.ui.viewmodel.WebViewModel
|
||||
import org.koin.compose.viewmodel.koinViewModel
|
||||
import org.koin.core.parameter.parametersOf
|
||||
|
||||
/**
|
||||
* Displays a [WebPage] inside the app: the embedded page, matching the app's [darkTheme]. A
|
||||
* [WebViewLoader] covers the page while it loads. The surrounding top and bottom bars are provided by
|
||||
* the app-level scaffold.
|
||||
* Displays a [WebPage] inside the app. Injects a [WebViewModel] keyed by the page so each page keeps
|
||||
* its own online URL and bundled offline snapshot.
|
||||
*/
|
||||
@Composable
|
||||
fun WebViewScreen(
|
||||
page: WebPage,
|
||||
contentPadding: PaddingValues,
|
||||
darkTheme: Boolean = isSystemInDarkTheme(),
|
||||
viewModel: WebViewModel = koinViewModel(key = page.name) { parametersOf(page) },
|
||||
) {
|
||||
val uiState by viewModel.uiState.collectAsStateWithLifecycle()
|
||||
|
||||
WebViewScreen(
|
||||
uiState = uiState,
|
||||
contentPadding = contentPadding,
|
||||
darkTheme = darkTheme,
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders the embedded page for [uiState], matching the app's [darkTheme]. A [WebViewLoader] covers
|
||||
* the page while it loads; if the online page fails, the web view swaps in the offline snapshot. The
|
||||
* surrounding top and bottom bars are provided by the app-level scaffold.
|
||||
*/
|
||||
@Composable
|
||||
fun WebViewScreen(
|
||||
uiState: WebUiState?,
|
||||
contentPadding: PaddingValues,
|
||||
darkTheme: Boolean = isSystemInDarkTheme(),
|
||||
) {
|
||||
// Start in the loading state; each distinct page loads afresh.
|
||||
var isLoading by remember(page) { mutableStateOf(true) }
|
||||
var isLoading by remember(uiState) { mutableStateOf(true) }
|
||||
|
||||
Box(
|
||||
modifier = Modifier
|
||||
.padding(contentPadding)
|
||||
.fillMaxSize(),
|
||||
) {
|
||||
PlatformWebView(
|
||||
url = page.url,
|
||||
darkTheme = darkTheme,
|
||||
onLoadingStateChange = { isLoading = it },
|
||||
modifier = Modifier.fillMaxSize(),
|
||||
)
|
||||
if (uiState != null) {
|
||||
PlatformWebView(
|
||||
url = uiState.url,
|
||||
offlineHtml = uiState.offlineHtml,
|
||||
darkTheme = darkTheme,
|
||||
onLoadingStateChange = { isLoading = it },
|
||||
modifier = Modifier.fillMaxSize(),
|
||||
)
|
||||
}
|
||||
|
||||
if (isLoading) {
|
||||
WebViewLoader(modifier = Modifier.fillMaxSize())
|
||||
}
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
package bzh.ajaury.chombev.web.ui.viewmodel
|
||||
|
||||
import androidx.compose.runtime.Immutable
|
||||
|
||||
/**
|
||||
* UI state for [bzh.ajaury.chombev.web.ui.WebViewScreen].
|
||||
*
|
||||
* [url] is the online page to display. [offlineHtml] is the bundled fallback shown when [url] fails
|
||||
* to load; it is `null` until the snapshot has been read (or if reading it failed), in which case no
|
||||
* offline fallback is available.
|
||||
*/
|
||||
@Immutable
|
||||
data class WebUiState(
|
||||
val url: String = "",
|
||||
val offlineHtml: String? = null,
|
||||
)
|
||||
@@ -0,0 +1,42 @@
|
||||
package bzh.ajaury.chombev.web.ui.viewmodel
|
||||
|
||||
import androidx.lifecycle.ViewModel
|
||||
import androidx.lifecycle.viewModelScope
|
||||
import bzh.ajaury.chombev.core.logging.domain.Logger
|
||||
import bzh.ajaury.chombev.navigation.WebPage
|
||||
import bzh.ajaury.chombev.resources.domain.ResourceReader
|
||||
import kotlinx.coroutines.flow.MutableStateFlow
|
||||
import kotlinx.coroutines.flow.StateFlow
|
||||
import kotlinx.coroutines.flow.asStateFlow
|
||||
import kotlinx.coroutines.flow.update
|
||||
import kotlinx.coroutines.launch
|
||||
|
||||
/**
|
||||
* Owns the state for a single [page]: the online URL to display and its bundled offline snapshot,
|
||||
* read from resources on init so it is ready as a fallback the moment the online page fails to load.
|
||||
*/
|
||||
class WebViewModel(
|
||||
private val page: WebPage,
|
||||
private val resourceReader: ResourceReader,
|
||||
private val logger: Logger,
|
||||
) : ViewModel() {
|
||||
private val _uiState = MutableStateFlow<WebUiState?>(null)
|
||||
val uiState: StateFlow<WebUiState?> = _uiState.asStateFlow()
|
||||
|
||||
init {
|
||||
loadOfflineSnapshot()
|
||||
}
|
||||
|
||||
private fun loadOfflineSnapshot() {
|
||||
viewModelScope.launch {
|
||||
val html = runCatching { resourceReader.read(page.offlineAsset) }
|
||||
.onFailure {
|
||||
logger.error(
|
||||
"Failed to read offline snapshot ${page.offlineAsset}",
|
||||
it,
|
||||
)
|
||||
}.getOrNull()
|
||||
_uiState.update { WebUiState(url = page.url, offlineHtml = html) }
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user