[SOLVED] I would like to add Lucid into Yesod's defaultLayout

I would like to add Lucid into Yesod's defaultLayout

I am trying to have a dynamic HTML id for modals usage.

Basically my problems would be solved if Hamlet accepted something like [hamlet| <div .modal .fade ##{modalIdFunction i}> |]

Since I haven't been able to do that in Hamlet, I am trying to do it with Lucid, but it is incompatible with Yesod's defaultLayout.

here is my intent:

getSupportR :: CustomerId -> Handler LucidHtml
getSupportR customerId = do
 defaultLayout $ do
    setTitle "Your Licenses"
    toWidget . lucid $ \url ->
      p_ $ a_ [href_ "\\"] "Link to root"

this is the error msg:

• Couldn't match type ‘blaze-markup-0.8.2.1:Text.Blaze.Internal.MarkupM
                             ()’
                     with ‘HtmlT Identity ()’
      Expected type: HandlerFor App LucidHtml
        Actual type: HandlerFor App Html

Is there a way to convert Lucid's LucidHtml to Blaze's Html?

my whole code is at: https://github.com/hhefesto/laurus-nobilis and the pertinent files are /src/Yesod/Lucid.hs and /src/Handler/Support.hs

Solution

Since lucid Html and blaze Html are completely different types, your only way is to render one as text and insert it as pre-escaped HTML to another one. Something like Blaze.preEscapedToHtml . Lucid.renderText.