mirror of
https://github.com/InsanusMokrassar/TelegramBotAPI-examples.git
synced 2024-12-22 00:27:19 +00:00
start migration to compose in webapp
This commit is contained in:
parent
1c437690e4
commit
76f151586e
@ -11,6 +11,9 @@ buildscript {
|
||||
plugins {
|
||||
id "org.jetbrains.kotlin.multiplatform"
|
||||
id "org.jetbrains.kotlin.plugin.serialization"
|
||||
|
||||
id "org.jetbrains.kotlin.plugin.compose" version "$kotlin_version"
|
||||
id "org.jetbrains.compose" version "$compose_version"
|
||||
}
|
||||
|
||||
apply plugin: 'application'
|
||||
@ -27,12 +30,14 @@ kotlin {
|
||||
dependencies {
|
||||
implementation kotlin('stdlib')
|
||||
implementation "org.jetbrains.kotlinx:kotlinx-serialization-json:$serialization_version"
|
||||
implementation compose.runtime
|
||||
}
|
||||
}
|
||||
|
||||
jsMain {
|
||||
dependencies {
|
||||
implementation "dev.inmo:tgbotapi.webapps:$telegram_bot_api_version"
|
||||
implementation compose.web.core
|
||||
}
|
||||
}
|
||||
|
||||
@ -41,6 +46,7 @@ kotlin {
|
||||
implementation "dev.inmo:tgbotapi:$telegram_bot_api_version"
|
||||
implementation "dev.inmo:micro_utils.ktor.server:$micro_utils_version"
|
||||
implementation "io.ktor:ktor-server-cio:$ktor_version"
|
||||
implementation compose.desktop.currentOs
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
import androidx.compose.runtime.*
|
||||
import dev.inmo.micro_utils.coroutines.launchSafelyWithoutExceptions
|
||||
import dev.inmo.tgbotapi.types.webAppQueryIdField
|
||||
import dev.inmo.tgbotapi.webapps.*
|
||||
@ -18,6 +19,10 @@ import kotlinx.dom.appendElement
|
||||
import kotlinx.dom.appendText
|
||||
import kotlinx.dom.clear
|
||||
import kotlinx.serialization.json.Json
|
||||
import org.jetbrains.compose.web.dom.Button
|
||||
import org.jetbrains.compose.web.dom.P
|
||||
import org.jetbrains.compose.web.dom.Text
|
||||
import org.jetbrains.compose.web.renderComposable
|
||||
import org.w3c.dom.*
|
||||
import kotlin.random.Random
|
||||
import kotlin.random.nextUBytes
|
||||
@ -33,11 +38,11 @@ fun main() {
|
||||
val client = HttpClient()
|
||||
val baseUrl = window.location.origin.removeSuffix("/")
|
||||
|
||||
window.onload = {
|
||||
val scope = CoroutineScope(Dispatchers.Default)
|
||||
runCatching {
|
||||
|
||||
scope.launchSafelyWithoutExceptions {
|
||||
renderComposable("root") {
|
||||
val scope = rememberCoroutineScope()
|
||||
val isSafeState = remember { mutableStateOf<Boolean?>(null) }
|
||||
val logsState = remember { mutableStateListOf<String>() }
|
||||
LaunchedEffect(baseUrl) {
|
||||
val response = client.post("$baseUrl/check") {
|
||||
setBody(
|
||||
Json.encodeToString(
|
||||
@ -61,29 +66,38 @@ fun main() {
|
||||
)
|
||||
}
|
||||
|
||||
document.body ?.appendElement("button") {
|
||||
addEventListener("click", {
|
||||
Text(
|
||||
when (isSafeState.value) {
|
||||
null -> "Checking safe state..."
|
||||
true -> "Data is safe"
|
||||
false -> "Data is unsafe"
|
||||
}
|
||||
)
|
||||
Text(webApp.initDataUnsafe.chat.toString())
|
||||
|
||||
Button({
|
||||
onClick {
|
||||
scope.launchSafelyWithoutExceptions {
|
||||
handleResult({ "Clicked" }) {
|
||||
client.post("${window.location.origin.removeSuffix("/")}/inline") {
|
||||
parameter(webAppQueryIdField, it)
|
||||
setBody(TextContent("Clicked", ContentType.Text.Plain))
|
||||
document.body ?.log(url.build().toString())
|
||||
logsState.add(url.build().toString())
|
||||
}.coroutineContext.job.join()
|
||||
}
|
||||
}
|
||||
})
|
||||
appendText("Answer in chat button")
|
||||
} ?: window.alert("Unable to load body")
|
||||
}
|
||||
}) {
|
||||
Text("Answer in chat button")
|
||||
}
|
||||
|
||||
document.body ?.appendElement("p", {})
|
||||
document.body ?.appendText("Allow to write in private messages: ${webApp.initDataUnsafe.user ?.allowsWriteToPM ?: "User unavailable"}")
|
||||
P()
|
||||
Text("Allow to write in private messages: ${webApp.initDataUnsafe.user ?.allowsWriteToPM ?: "User unavailable"}")
|
||||
|
||||
document.body ?.appendElement("p", {})
|
||||
document.body ?.appendText("Alerts:")
|
||||
|
||||
document.body ?.appendElement("button") {
|
||||
addEventListener("click", {
|
||||
P()
|
||||
Text("Alerts:")
|
||||
Button({
|
||||
onClick {
|
||||
webApp.showPopup(
|
||||
PopupParams(
|
||||
"It is sample title of default button",
|
||||
@ -93,7 +107,7 @@ fun main() {
|
||||
DestructivePopupButton("destructive", "Destructive button")
|
||||
)
|
||||
) {
|
||||
document.body ?.log(
|
||||
logsState.add(
|
||||
when (it) {
|
||||
"default" -> "You have clicked default button in popup"
|
||||
"ok" -> "You have clicked ok button in popup"
|
||||
@ -102,48 +116,67 @@ fun main() {
|
||||
}
|
||||
)
|
||||
}
|
||||
})
|
||||
appendText("Popup")
|
||||
} ?: window.alert("Unable to load body")
|
||||
|
||||
document.body ?.appendElement("button") {
|
||||
addEventListener("click", {
|
||||
}
|
||||
}) {
|
||||
Text("Popup")
|
||||
}
|
||||
Button({
|
||||
onClick {
|
||||
webApp.showAlert(
|
||||
"This is alert message"
|
||||
) {
|
||||
document.body ?.log(
|
||||
logsState.add(
|
||||
"You have closed alert"
|
||||
)
|
||||
}
|
||||
})
|
||||
appendText("Alert")
|
||||
} ?: window.alert("Unable to load body")
|
||||
}
|
||||
}) {
|
||||
Text("Alert")
|
||||
}
|
||||
|
||||
document.body ?.appendElement("p", {})
|
||||
P()
|
||||
Button({
|
||||
onClick {
|
||||
webApp.requestWriteAccess()
|
||||
}
|
||||
}) {
|
||||
Text("Request write access without callback")
|
||||
}
|
||||
Button({
|
||||
onClick {
|
||||
webApp.requestWriteAccess {
|
||||
logsState.add("Write access request result: $it")
|
||||
}
|
||||
}
|
||||
}) {
|
||||
Text("Request write access with callback")
|
||||
}
|
||||
|
||||
document.body ?.appendElement("button") {
|
||||
addEventListener("click", { webApp.requestWriteAccess() })
|
||||
appendText("Request write access without callback")
|
||||
} ?: window.alert("Unable to load body")
|
||||
P()
|
||||
Button({
|
||||
onClick {
|
||||
webApp.requestContact()
|
||||
}
|
||||
}) {
|
||||
Text("Request contact without callback")
|
||||
}
|
||||
Button({
|
||||
onClick {
|
||||
webApp.requestContact { logsState.add("Contact request result: $it") }
|
||||
}
|
||||
}) {
|
||||
Text("Request contact with callback")
|
||||
}
|
||||
P()
|
||||
|
||||
document.body ?.appendElement("button") {
|
||||
addEventListener("click", { webApp.requestWriteAccess { document.body ?.log("Write access request result: $it") } })
|
||||
appendText("Request write access with callback")
|
||||
} ?: window.alert("Unable to load body")
|
||||
logsState.forEach {
|
||||
P { Text(it) }
|
||||
}
|
||||
}
|
||||
|
||||
document.body ?.appendElement("p", {})
|
||||
|
||||
document.body ?.appendElement("button") {
|
||||
addEventListener("click", { webApp.requestContact() })
|
||||
appendText("Request contact without callback")
|
||||
} ?: window.alert("Unable to load body")
|
||||
|
||||
document.body ?.appendElement("button") {
|
||||
addEventListener("click", { webApp.requestContact { document.body ?.log("Contact request result: $it") } })
|
||||
appendText("Request contact with callback")
|
||||
} ?: window.alert("Unable to load body")
|
||||
|
||||
document.body ?.appendElement("p", {})
|
||||
window.onload = {
|
||||
val scope = CoroutineScope(Dispatchers.Default)
|
||||
runCatching {
|
||||
|
||||
document.body ?.appendElement("button") {
|
||||
addEventListener("click", {
|
||||
|
||||
@ -10,6 +10,7 @@
|
||||
<title>Web App Example</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="application/javascript" src="https://telegram.org/js/telegram-web-app.js"></script>
|
||||
<script type="application/javascript" src="WebApp.js"></script>
|
||||
</body>
|
||||
|
||||
@ -29,3 +29,8 @@ allprojects {
|
||||
maven { url "https://nexus.inmo.dev/repository/maven-releases/" }
|
||||
}
|
||||
}
|
||||
|
||||
// Fix of https://youtrack.jetbrains.com/issue/KTOR-7912/Module-not-found-errors-when-executing-browserProductionWebpack-task-since-3.0.2
|
||||
rootProject.plugins.withType(org.jetbrains.kotlin.gradle.targets.js.yarn.YarnPlugin.class) {
|
||||
rootProject.kotlinYarn.resolution("ws", "8.18.0")
|
||||
}
|
||||
|
||||
@ -10,3 +10,4 @@ telegram_bot_api_version=22.0.0
|
||||
micro_utils_version=0.23.2
|
||||
serialization_version=1.7.3
|
||||
ktor_version=3.0.2
|
||||
compose_version=1.7.1
|
||||
|
||||
Loading…
Reference in New Issue
Block a user