Untitled

private val scope = MainScope()

val App = FC<Props> {

    var shoppingList by useState(emptyList<ShoppingListItem>())
    val deleted by useState(mutableListOf<ShoppingListItem>())

    useEffectOnce {
        scope.launch {
            shoppingList = getShoppingList()
        }
    }

    h1 {
        +"Full-Stack Shopping List"
    }

    ul {
        shoppingList.sortedByDescending(ShoppingListItem::priority).forEach { item ->
            li {
                if (item in deleted) {
                    css {
                        textDecoration = TextDecoration.lineThrough
                    }
                }

                key = item.toString()
                onClick = {
                    scope.launch {
                        deleted.add(item)
                        shoppingList = getShoppingList()
                    }
                }
                +"[${item.priority}] ${item.desc}"
            }
        }
    }

    InputComponent {
        onSubmit = { input ->
            val cartItem = ShoppingListItem(
                input.replace("!", ""),
                input.count { it == '!' }
            )

            scope.launch {
                addShoppingListItem(cartItem)
                shoppingList = getShoppingList()
            }
        }
    }
}