Fork me on GitHub
#hyperfiddle
<
2022-09-01
>
Dustin Getz01:09:07

This is extraordinary. Network-transparent distributed & reactive tree-list DOM widget, backed by the file system. With combined filtering and pagination. 100% abstracted from the file system via Clojure's datafy/nav protocols. Recursive treewalk filtering is a pure function, works at the REPL and has a unit test. Tree logic and filtering is 100% decoupled from rendering / DOM and could drive ClojureDart, Swing or anything else. 15 LOC - TreeList with filtering 40 LOC - Abstract table renderer with pagination controls 40 LOC - concrete file system cell renderer and router 50 LOC – java.io.FIle datafy implementation

clojure-spin 7
Dustin Getz01:09:39

Now that async traces have landed, this is within reach of any mid-level clojure programmer

Daniel Jomphe12:09:32

I hope you publish a quarterly report with this stuff in. 🙂 BTW Even though the demo clearly makes the technical point, I feel like it would be more convincing if... each item showed more of its (full)path! It's a small detail, but the results feel incomplete, less valuable because of the contextual omission, and it seems to potentially and uselessly cast a shadow on the overall. Another detail, likewise, would be the suggestion to replace the scrollbar with typical label-links for each page number. Again, not required to technically prove HF... All stuff that some of us users could contribute. You might want to start a list of easy contributor-level demo issues in e.g. github.

🙂 1
Dustin Getz13:09:28

> each item showed more of its (full)path! i dont understand please say more?

Daniel Jomphe13:09:36

Oh, I was wrong - something gave me the impression that each LICENSE file here didn't show its owning folder, but it does. What triggered the impression for me might have been the small indentation, and/or pajama greying out of each alternate line; in this context it might be better to grey out dirs vs files???

👍 1
Daniel Jomphe13:09:12

So you might just as well forget this part of feedback, it's too UI-centered, then, since contents are Good:tm: .

Daniel Jomphe13:09:49

Near 30s mark, you had to fix an out-of-new-bounds state error with the pager. Might be worth checking into improving coherency on this matter.

👍 1
Dustin Getz13:09:21

The slider is poor man's infinite scroll, do you know a simple infinite scroll component in cljs or react?

xificurC17:09:42

Can't you do something similar to what htmx has, i.e. on reveal load more content? https://htmx.org/examples/infinite-scroll/

👀 1
Geoffrey Gaillard18:09:01

Looks like an intersection observer. Appending is easy, unmounting off screen pages is way harder. The scroll must be virtual and adding/removing content shouldn't make the page "jump". Even more so with dynamic height content.

Dustin Getz18:09:51

I'm porting https://github.com/dustingetz/react-chatview wish me luck, about 3 hours in

🤞 1
xificurC19:09:45

Is unmounting a hard requirement?

xificurC19:09:49

Good luck!

🙂 1
Geoffrey Gaillard19:09:12

Infinite scrolling implies unbound data size, so unmounting is essential.

Dustin Getz19:09:27

Photon will do it, half of react-chatview should evaporate

Geoffrey Gaillard19:09:11

Could you brute force it and interop with the existing react component, while rendering rows with photon?

Dustin Getz19:09:40

i want the tutorial example ha

Dustin Getz20:09:46

Damn you guys are right, I am likely gonna fail – chatviews are special in that the "not unmounting of elements we've already loaded" is essential, it's just a "load more history" button. I.e. Slack channels. Newsfeed is the same thing but flipped upside down

Dustin Getz20:09:35

What this folder explorer demo wants is the case where the total record count is known in advance so you can set the scrollbar to the exact right height and leap ahead to a specific page. (Or with "close enough" accuracy in the case of variable height rows)

Daniel Jomphe20:09:46

Sorry to have thrown you in such minutiae!

Dustin Getz20:09:12

Ha this has been on my mind for a while

😁 1
Daniel Jomphe20:09:04

Let's hope you can close the loop, then; after all, this is a lisphug language!

Geoffrey Gaillard20:09:08

Slack scroll is not just "load more history". It's fully virtualized, you can jump to any point in history and scroll faster than it can load while getting a smooth scroll experience. Messages load into place an no jump happens even with dynamic height. TBH I don't know how they did it.

👀 1
Benjamin C21:09:25

> could drive ClojureDart

Benjamin C21:09:09

^Does photon already work with ClojureDart?

Dustin Getz21:09:46

have not tried but don't see why not, photon-dom is designed as a separate module and it's just point effects

👍 1
Drew Verlee18:09:41

is there a way in the test rcf macro to not repeat the function name? not a big deal, i'm just seeing if i organize things better.

Dustin Getz18:09:00

what do you mean

Drew Verlee18:09:17

e.g (test inc 1 := 2 2 := 3)

Dustin Getz18:09:38

An idea is to call into clojure.test

Dustin Getz18:09:18

the point of RCF is to make it easy to eval them – but if you need to eval a bunch of stuff as a unit then calling into other abstractions is likely idiomatic

Drew Verlee18:09:47

yep yep. that was my inspiration. thanks Dustin 🙂 i'm just taking the library for a spin for the first time.

Dustin Getz18:09:23

If you have a neat idea for a macro – the latest published release of RCF (maven coords were published last week) has strong support for macros (deep assertions)

👀 1
👍 1