Hi, did somebody get withMobileDialog from material ui working with a reagent component?I just cannot get it working, no matter which combination I try.

I get the "functions are not valid as react child. this may happen if you return Component instead of <Component /> from render" error. But how would I wrap a component into the withMobileDialogcomponent?

To add some more context. In plain javascript you would do this:

export default withMobileDialog()(ResponsiveDialog);

try

(def responsive-dialog* (r/reactify-component responsive-dialog))
[:> ((withMobileDialog) responsive-dialog*) {:prop :go-here}]

assuming that responsive-dialog-dialog is a Reagent component

@sveri ^^

@pesterhazy was faster. 🙂 Was just going to paste this here:

(defn my-dialog [{:keys [fullScreen]}]
  [mui/dialog {:open       true
               :fullScreen fullScreen}
   [mui/typography "Some content"]])

(def with-mobile-dialog (.withMobileDialog js/MaterialUI))

(defn my-view []
  [:> (with-mobile-dialog (r/reactify-component my-dialog))])

Where mui/dialog is MaterialUI dialog wrapped with adapt-react-class. You could use :> syntax as well

Btw here’s a nice interop cheat sheet for reagent and MaterialUI https://github.com/reagent-project/reagent/blob/master/examples/material-ui/src/example/core.cljs

@valtteri @pesterhazy that did it, thank you both 🙂