purescript-react/purescript-react-basic-hooks

Array of JSX is not allowed

avi892nash opened this issue · 1 comments

The type of component function does not allow to create react component with Array JSX return.

This should get compile, because react library allowes this syntax.

mkCounter :: Component Int
mkCounter = do
  component "Counter" \initialValue -> React.do
    counter /\ setCounter <- useState initialValue

    pure
      $ [ R.button
          { onClick: handler_ do
              setCounter (_ + 1)
          , children:
              [ R.text $ "Increment: " <> show counter ]
          }
          ]

Yeah Component is just a type alias

type Component props = Effect (props -> JSX)

so if you have an Array JSX that you want to return, the recommendation is to use fragment :: Array JSX -> JSX https://pursuit.purescript.org/packages/purescript-react-basic/17.0.0/docs/React.Basic#v:fragment