feat(folio-webApp): add main entrypoint and index.html

main.kt mirrors the iOS entry point: builds DriverFactory + AppGraph
factory, hooks browser back-gesture into WebBackGesture, then mounts
the shared App composable into ComposeViewport.
This commit is contained in:
pj committed 2026-04-26 16:37:39 +07:00
1 parent c36f9bfd42
commit 80b02fd19f
2 files changed
+49

No files matched your search

@@ -0,0 +1,33 @@
@file:OptIn(ExperimentalComposeUiApi::class, kotlin.js.ExperimentalWasmJsInterop::class)
package app.folio
import androidx.compose.ui.ExperimentalComposeUiApi
import androidx.compose.ui.window.ComposeViewport
import app.folio.core.data.DriverFactory
import app.folio.db.LedgerDatabase
import app.folio.di.AppGraph
import app.folio.ui.WebBackGesture
import dev.zacsweers.metro.createGraphFactory
import kotlinx.browser.document
import kotlinx.browser.window
import org.w3c.dom.events.Event
fun main() {
val driverFactory = DriverFactory()
val graphFactory = createGraphFactory<AppGraph.Factory>()
window.history.pushState(null, "", window.location.href)
window.addEventListener("popstate", { _: Event ->
if (WebBackGesture.dispatch()) {
window.history.pushState(null, "", window.location.href)
}
})
val target = document.getElementById("app") ?: document.body!!
ComposeViewport(target) {
App(graphBuilder = {
graphFactory.create(LedgerDatabase(driverFactory.create()))
})
}
}
@@ -0,0 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>Folio</title>
<style>
html, body { margin: 0; padding: 0; height: 100%; background: #000; color: #fff; font-family: system-ui, sans-serif; }
#app { height: 100%; }
</style>
</head>
<body>
<div id="app"></div>
<script src="composeApp.js"></script>
</body>
</html>