diff --git a/client/components/src/main/kotlin/com/zegreatrob/coupling/client/components/welcome/Welcome.kt b/client/components/src/main/kotlin/com/zegreatrob/coupling/client/components/welcome/Welcome.kt
index b74472b243..f849c6fc3f 100644
--- a/client/components/src/main/kotlin/com/zegreatrob/coupling/client/components/welcome/Welcome.kt
+++ b/client/components/src/main/kotlin/com/zegreatrob/coupling/client/components/welcome/Welcome.kt
@@ -8,14 +8,15 @@ import com.zegreatrob.coupling.client.components.supersize
 import com.zegreatrob.coupling.model.pairassignmentdocument.CouplingPair
 import com.zegreatrob.coupling.model.pairassignmentdocument.pairOf
 import com.zegreatrob.coupling.model.player.Player
-import com.zegreatrob.minreact.DataPropsBind
+import com.zegreatrob.minreact.ReactFunc
 import com.zegreatrob.minreact.add
-import com.zegreatrob.minreact.ntmFC
+import com.zegreatrob.minreact.nfc
 import csstype.PropertiesBuilder
 import emotion.css.ClassName
 import emotion.react.css
 import react.ChildrenBuilder
 import react.MutableRefObject
+import react.Props
 import react.dom.html.ReactHTML.div
 import react.dom.html.ReactHTML.span
 import react.useLayoutEffect
@@ -45,9 +46,13 @@ import web.cssom.rotate
 import web.cssom.s
 import web.html.HTMLDivElement
 
-data class Welcome(val randomProvider: RandomProvider = RandomProvider) : DataPropsBind<Welcome>(welcome)
+external interface WelcomeProps : Props {
+    var randomProvider: RandomProvider?
+}
 
-val welcome by ntmFC { (randomProvider): Welcome ->
+@ReactFunc
+val Welcome by nfc<WelcomeProps> { props ->
+    val randomProvider = props.randomProvider ?: RandomProvider
     var showLoginChooser by useState(false)
     val welcomeTitleRef = useRef<HTMLDivElement>(null)
     useLayoutEffect {
diff --git a/client/components/src/test/kotlin/com/zegreatrob/coupling/client/components/WelcomeTest.kt b/client/components/src/test/kotlin/com/zegreatrob/coupling/client/components/WelcomeTest.kt
index 5b6772e308..cd2a9f8f3e 100644
--- a/client/components/src/test/kotlin/com/zegreatrob/coupling/client/components/WelcomeTest.kt
+++ b/client/components/src/test/kotlin/com/zegreatrob/coupling/client/components/WelcomeTest.kt
@@ -4,7 +4,6 @@ import com.zegreatrob.coupling.client.components.welcome.RandomProvider
 import com.zegreatrob.coupling.client.components.welcome.Welcome
 import com.zegreatrob.minassert.assertIsEqualTo
 import com.zegreatrob.minassert.assertIsNotEqualTo
-import com.zegreatrob.minreact.create
 import com.zegreatrob.testmints.setup
 import com.zegreatrob.wrapper.testinglibrary.react.TestingLibraryReact.render
 import com.zegreatrob.wrapper.testinglibrary.react.TestingLibraryReact.screen
@@ -17,7 +16,7 @@ class WelcomeTest {
         val randomProvider = this
         override fun nextRandomInt(until: Int) = 0
     }) exercise {
-        render(Welcome(randomProvider).create())
+        render { Welcome(randomProvider) }
     } verify {
         screen.queryByText("Frodo")
             .assertIsNotEqualTo(null)
@@ -36,7 +35,7 @@ class WelcomeTest {
             override fun nextRandomInt(until: Int) = 1
         }
     }) exercise {
-        render(Welcome(randomProvider).create {})
+        render { Welcome(randomProvider) }
     } verify {
         screen.queryByText("Batman")
             .assertIsNotEqualTo(null)
@@ -55,7 +54,7 @@ class WelcomeTest {
             override fun nextRandomInt(until: Int) = 2
         }
     }) exercise {
-        render(Welcome(randomProvider).create())
+        render { Welcome(randomProvider) }
     } verify {
         screen.queryByText("Rosie")
             .assertIsNotEqualTo(null)
diff --git a/client/src/main/kotlin/com/zegreatrob/coupling/client/welcome/WelcomePage.kt b/client/src/main/kotlin/com/zegreatrob/coupling/client/welcome/WelcomePage.kt
index dc59cf3635..accac089ad 100644
--- a/client/src/main/kotlin/com/zegreatrob/coupling/client/welcome/WelcomePage.kt
+++ b/client/src/main/kotlin/com/zegreatrob/coupling/client/welcome/WelcomePage.kt
@@ -3,13 +3,12 @@ package com.zegreatrob.coupling.client.welcome
 import com.zegreatrob.coupling.client.components.welcome.Welcome
 import com.zegreatrob.coupling.client.routing.PageProps
 import com.zegreatrob.coupling.client.routing.animationFrame
-import com.zegreatrob.minreact.add
 import com.zegreatrob.minreact.nfc
 import com.zegreatrob.react.dataloader.ResolvedState
 
 val WelcomePage by nfc<PageProps> {
     animationFrame {
         this.state = ResolvedState(Unit)
-        add(Welcome())
+        Welcome()
     }
 }