Fork me on GitHub
#untangled
<
2016-07-18
>
jasonjckn18:07:58

has anyone seen this error before with :advanced optimizations enabled?

core.cljs:59 Uncaught Error: No protocol method InitialAppState.initial-state defined for type function: function (){React.Component.apply(this,arguments);this.state=null!= this}

mahinshaw18:07:39

@jasonjckn: Just curious, are you using any field accessors in you code (like (.-legs Cat)). That has broken our advanced builds before. @ethangracer can explain in more detail, but it has to do with maps converted to js object.

jasonjckn19:07:55

yes i am @mahinshaw does that include (.-target e)

anmonteiro19:07:51

@jasonjckn: @mahinshaw: set! and .- interop only work in advanced compilation when the things are known to GClosure

anmonteiro19:07:40

if you want to access properties in Objects that are treated as maps (vs instances) you need to use goog.object/get and goog.object/set

jasonjckn19:07:03

what about (.-value (.-target evt))

jasonjckn19:07:09

does gclosure know about that?

anmonteiro19:07:24

that should be OK, yes

jasonjckn19:07:46

is 'static' an om.next thing or cljs thing?

jasonjckn19:07:52

i'm trying to use it for my own purposes

anmonteiro19:07:09

you can probably use it for your own purposes

jasonjckn19:07:20

I wrote this macro for syntatic sugar

(defmacro defui [name q & forms]
  {:pre [(symbol? name)
         (or (map? q) (vector? q) (list? q))]}
  `(do
     (declare ~(symbol (factory-name (str name))))
     (om.next/defui ~(with-meta name {:once true})

         ~'static cljs.core/IDeref
         (~'-deref [this#]
          ~(symbol (factory-name (str name))))

         ~'static om.next/IQuery
         (~'query [this#]
          ~q)

         ~@forms)
     (def ~(symbol (factory-name (str name)))
       (om.next/factory ~name {:keyfn (let [c# (atom 0)]
                                        #(swap! c# inc))}))))

anmonteiro19:07:21

but statics are elided in advanced compilation

jasonjckn19:07:34

esentially it let's me get the factory function on a defui by using @

jasonjckn19:07:40

so @TabUnion

jasonjckn19:07:44

but it's choking advanced

jasonjckn19:07:04

that's probably why then

anmonteiro19:07:57

@jasonjckn: try (deref (.. MyComponent -prototype)) instead

anmonteiro19:07:21

if your troubles go away, you’ll know it was because of that

mahinshaw19:07:38

@anmonteiro: Thanks for filing that in for me.

currentoor23:07:51

@jasonjckn: I've been using this macro at work for a while, works fine with advanced compilation https://github.com/currentoor/untangled-starter/blob/master/src/untangled_starter/aum.cljc

currentoor23:07:20

lets me use sablono in the body and omit the om.next protocol names

adambrosio23:07:24

i had been working on something similar, except with the intention to wrap the render method with devtools when in dev mode https://github.com/untangled-web/untangled-client/commit/aa0970c48b1333668c28579c6c444a29e5158b75

adambrosio23:07:12

i also had a variant that would let you do something like

(defui SomeComp
   :query some-query
   :render some-fn)

currentoor23:07:49

@adambros: cool, i might steal some ideas here

adambrosio23:07:50

the idea was to have some button that you press, and you entered a mode in which components would highlight on hover, letting you go to their definition, see their query & appstate, etc

currentoor23:07:10

hmm that would be cool, my goal with that starter kit was just to make it easy for me to prototype with untangled, defui wrapper and the full React Bootstrap UI kit ready to go

adambrosio23:07:11

and then some sort of panel open up that would let you query & inspect app state

adambrosio23:07:31

right, well untangled-template should be coming out soon

adambrosio23:07:50

i could see a case for an —experimental option

adambrosio23:07:28

we could put stuff related to defui wrappers in that

currentoor23:07:15

yeah that would be cool

currentoor23:07:16

@adambros: i remember tony mentioning something about having a UI kit of components

currentoor23:07:37

maybe we could use my react bootstrap wrapper?

currentoor23:07:54

as a starting point

adambrosio23:07:59

what is a react bootstrap wrapper?

adambrosio23:07:17

do i just need to google it ?

currentoor23:07:13

gives you a clojurescript-y api for all these components https://react-bootstrap.github.io/components.html

currentoor23:07:58

unlike many vanilla react components they don't require you to mess around with local state so it's clean to use with cljs

currentoor23:07:07

in a real production app it's probably best to roll out your own components from scratch but for prototyping it's nice to have stuff like modals, dropdowns, tooltips, and form elements (with error states) ready to go IMHO

currentoor23:07:23

also comes with a grid systems, which is pretty nice

currentoor23:07:38

plus customizing bootstrap styles with less/scss variables is pretty easy

adambrosio23:07:55

does sound nice, we’ll have to see what tony thinks, but this doesn’t have to be part of untangled, and might be better off that way

currentoor23:07:26

right yeah i don't think it would make sense to be part of untangled directly, a contributor library perhaps?

adambrosio23:07:54

volt batteries included untangled

adambrosio23:07:04

or lotus as a pun off of om

adambrosio23:07:03

maybe im thinking of a different word

tony.kay23:07:05

(bits of untangled thread)

tony.kay23:07:15

untangled-strands

currentoor23:07:41

how about untangled-knots

currentoor23:07:51

or knot-untangled?

adambrosio23:07:51

sounds like rope

tony.kay23:07:03

I think knots and braids are what we're trying to avoid!

adambrosio23:07:03

Lotus:
It represents purity, perfection, and pacification of one's nature. A white lotus symbolizes the pinnacle of achievement in the Buddhism and as such has come to be called the Flower of the Buddhas (though it does not represent the Buddha himself).
because #humblebrag