From ed6dc0d1b80bdd5ddf8d2748b4746b1b384a9201 Mon Sep 17 00:00:00 2001
From: kkalisz <kamil.kalisz@gmail.com>
Date: Tue, 24 Sep 2024 21:46:21 +0200
Subject: [PATCH] added support for molecule for js wasm, added wasm sample

---
 precompose-molecule/build.gradle.kts          |  5 +++++
 .../molecule/ProvidePlatformDispatcher.kt     |  6 ++++++
 sample/molecule/build.gradle.kts              | 21 +++++++++++++++++++
 .../precompose/molecule/sample/Main.kt        | 12 +++++++++++
 .../src/wasmJsMain/resources/index.html       | 12 +++++++++++
 .../src/wasmJsMain/resources/styles.css       |  7 +++++++
 6 files changed, 63 insertions(+)
 create mode 100644 precompose-molecule/src/wasmJsMain/kotlin/moe/tlaster/precompose/molecule/ProvidePlatformDispatcher.kt
 create mode 100644 sample/molecule/src/wasmJsMain/kotlin/moe/tlaster/precompose/molecule/sample/Main.kt
 create mode 100644 sample/molecule/src/wasmJsMain/resources/index.html
 create mode 100644 sample/molecule/src/wasmJsMain/resources/styles.css

diff --git a/precompose-molecule/build.gradle.kts b/precompose-molecule/build.gradle.kts
index 48ca670a..cc7808ea 100644
--- a/precompose-molecule/build.gradle.kts
+++ b/precompose-molecule/build.gradle.kts
@@ -1,3 +1,4 @@
+import org.jetbrains.kotlin.gradle.targets.js.dsl.ExperimentalWasmDsl
 import java.util.Properties
 
 plugins {
@@ -31,6 +32,10 @@ kotlin {
     js(IR) {
         browser()
     }
+    @OptIn(ExperimentalWasmDsl::class)
+    wasmJs {
+        browser()
+    }
     sourceSets {
         val commonMain by getting {
             dependencies {
diff --git a/precompose-molecule/src/wasmJsMain/kotlin/moe/tlaster/precompose/molecule/ProvidePlatformDispatcher.kt b/precompose-molecule/src/wasmJsMain/kotlin/moe/tlaster/precompose/molecule/ProvidePlatformDispatcher.kt
new file mode 100644
index 00000000..31a18009
--- /dev/null
+++ b/precompose-molecule/src/wasmJsMain/kotlin/moe/tlaster/precompose/molecule/ProvidePlatformDispatcher.kt
@@ -0,0 +1,6 @@
+package moe.tlaster.precompose.molecule
+
+import kotlinx.coroutines.Dispatchers
+import kotlin.coroutines.CoroutineContext
+
+internal actual fun providePlatformDispatcher(): CoroutineContext = Dispatchers.Main
diff --git a/sample/molecule/build.gradle.kts b/sample/molecule/build.gradle.kts
index bb26c7ae..9ef58c62 100644
--- a/sample/molecule/build.gradle.kts
+++ b/sample/molecule/build.gradle.kts
@@ -1,5 +1,7 @@
 import org.jetbrains.compose.desktop.application.dsl.TargetFormat
 import org.jetbrains.kotlin.gradle.plugin.mpp.KotlinNativeTarget
+import org.jetbrains.kotlin.gradle.targets.js.dsl.ExperimentalWasmDsl
+import org.jetbrains.kotlin.gradle.targets.js.webpack.KotlinWebpackConfig
 
 plugins {
     kotlin("multiplatform")
@@ -37,6 +39,25 @@ kotlin {
         }
     }
     jvm()
+    @OptIn(ExperimentalWasmDsl::class)
+    wasmJs {
+        moduleName = "composeApp"
+        browser {
+            val projectDirPath = project.projectDir.path
+            commonWebpackConfig {
+                outputFileName = "composeApp.js"
+                devServer =
+                    (devServer ?: KotlinWebpackConfig.DevServer()).apply {
+                        static =
+                            (static ?: mutableListOf()).apply {
+                                // Serve sources to debug inside browser
+                                add(projectDirPath)
+                            }
+                    }
+            }
+        }
+        binaries.executable()
+    }
 
     sourceSets {
         val commonMain by getting {
diff --git a/sample/molecule/src/wasmJsMain/kotlin/moe/tlaster/precompose/molecule/sample/Main.kt b/sample/molecule/src/wasmJsMain/kotlin/moe/tlaster/precompose/molecule/sample/Main.kt
new file mode 100644
index 00000000..d0ea2c9e
--- /dev/null
+++ b/sample/molecule/src/wasmJsMain/kotlin/moe/tlaster/precompose/molecule/sample/Main.kt
@@ -0,0 +1,12 @@
+package moe.tlaster.precompose.molecule.sample
+
+import androidx.compose.ui.ExperimentalComposeUiApi
+import androidx.compose.ui.window.ComposeViewport
+import kotlinx.browser.document
+
+@OptIn(ExperimentalComposeUiApi::class)
+fun main() {
+    ComposeViewport(document.body!!) {
+        App()
+    }
+}
diff --git a/sample/molecule/src/wasmJsMain/resources/index.html b/sample/molecule/src/wasmJsMain/resources/index.html
new file mode 100644
index 00000000..a8a4240c
--- /dev/null
+++ b/sample/molecule/src/wasmJsMain/resources/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>molecule</title>
+    <link type="text/css" rel="stylesheet" href="styles.css">
+    <script type="application/javascript" src="composeApp.js"></script>
+</head>
+<body>
+</body>
+</html>
\ No newline at end of file
diff --git a/sample/molecule/src/wasmJsMain/resources/styles.css b/sample/molecule/src/wasmJsMain/resources/styles.css
new file mode 100644
index 00000000..0549b10f
--- /dev/null
+++ b/sample/molecule/src/wasmJsMain/resources/styles.css
@@ -0,0 +1,7 @@
+html, body {
+    width: 100%;
+    height: 100%;
+    margin: 0;
+    padding: 0;
+    overflow: hidden;
+}
\ No newline at end of file