Fork me on GitHub
#fulcro
<
2018-12-02
>
tony.kay08:12:31

Incubator 0.0.22 released to clojars with the new UI routing and documentation. The macros could use a bit of a tweak, things are lightly tested, and the algorithms are not as nice as I’d like, but a full-blown demo works, so I figured it was time to let others play with it. I don’t have a lot of time coming up, so be wary of using it in production until you test it a bit. They rely on dynamic queries, which is a feature I had to rewrite from Om Next, and it is not heavily used by anyone that I know (including myself). Therefore there could be deep bugs lurking in the shadows from long ago. That said, I think this version of routing is a heck of a lot easier to understand and use, and it has some cool features that co-located queries and idents make easy. Of particular note is the fact that the “path” to a router can be derived from the query, making the structure of the UI automatically construct your “URI paths”. This composition should hold up very well under refactoring, and “aliasing” paths is a simple transform on a vector of path components. I got all of the features in I could think of needing: - Composition and refactoring of UI “paths” without the need for any non-ui declarations. - Deferred routes to allow for loading (including for code splitting) - Custom UI for what to show on deferred and “failed” routes - The ability for an on-screen route target to “cancel” a new route (e.g. to prevent unsaved changes being lost) - Direct code navigation. Routers are linked together in an obvious composition that IDEs can easily navigate. - Declaration macros that minimize typing and do some error checking for you. The docs are here: https://github.com/fulcrologic/fulcro-incubator/blob/develop/dynamic-routing.adoc

parameme05:12:51

Hi @U0CKQ19AQ, FYI, the embedded table UI diagram and the favicon reference are returning 404s.

tony.kay05:12:30

ah, thx

👍 4
tony.kay05:12:03

that should fix it

4
tony.kay08:12:47

Live demo at https://fulcrologic.github.io/fulcro-incubator/ (see the routing-ws demo card, and read the output in js console as you route)

tony.kay08:12:05

Thanks @claudiu and @pvillegas12 and others for suggestions…and complaining about the less-than-ideal UI routers in Fulcro itself 🙂

sooheon10:12:00

What should I use in fulcro for <svg><image> tags? I only see <img> in fulcro.client.dom

tony.kay21:12:11

could be a missing tag…if you look at the source you can just build your own…but I’m glad to add anything that is missing that is “official”

tony.kay21:12:04

dom/create-element is the simplest approach, though you have to use js props.

tony.kay21:12:04

You can use incubator’s UI helper function fulcro.incubator.ui.core/component-factory to create a function that will work just like the built-in DOM helpers in Fulcro…which is just a wrapper around a utility function fulcro.client.dom/macro-create-element.

tony.kay21:12:49

Try 2.6.18-SNAPSHOT…I added all the missing SVG tags

sooheon04:12:24

Thank you! Looking at the component-factory helper

sooheon15:12:58

http://book.fulcrologic.com/#_queries_on_idents This shows that I can query for a specific table entry in an ident. How can I make the query dynamic? Rather than hard-coding [:person/by-id 1], I want to receive the person-id as a prop.

claudiu16:12:17

Do you have a particular use-case ?

claudiu16:12:51

Not sure it can be done that way. The query is static.

claudiu16:12:02

You can get what you want by creating a comp with that ident and using it just for getting the query (need to se the indent in the appdb)

sooheon16:12:36

The use case is to move through an image carousel.

sooheon16:12:27

can you give an example of using a comp with that ident?

sooheon16:12:35

maybe there’s one in the book i’m not seeing

claudiu16:12:10

Where you see stuff like :ident [:person/by-id :db/id

claudiu16:12:56

On the phone now, hard to find :) but basically where you can find an example with a listing + view page.

claudiu17:12:54

If you look in fulcro inspect you will see something like {:my-page :singleton {:current-image [:image/by-id 5 }} to navigate you just write a mutation that sets :current-image

sooheon04:12:08

Thanks, the bootstrap example’s a bit much but going through the normalization section again helped.

souenzzo22:12:49

tip of the day: normalization only occurs in vector?. So always (vec (for ..)) when declare the initial state

jeremys23:12:03

Wow I just finished watching the Pathom video from the conj and that was crazy good! Is it integrated in Fulcro? Or is it an optional library to use with Fulcro?