shadaj/slinky

Everything about Slinky -- issues, ideas for features, where it's being used, and more

Gabor Juhasz

@gjuhasz86

not sure if this is relevant, but IntelliJ 2020.2.3 CE

Alexis Hernandez

@AlexITC

that's great to know, I'll try it later, thanks

Gabor Juhasz

@gjuhasz86

ah almost forgot, after adding the extension, I had to restart IntelliJ

Peter Storm

@peterstorm

So I thought I had figured out a clever way to build up my Sidebar links, using a case class called SideBarLinks, and in there I wanted either pngs as js.Objects or MaterialIcons as SVGElements. But when I tried it with MaterialIcons I keep getting

Uncaught java.lang.IllegalStateException: This component has already been built into a ReactElement, and cannot be reused

when I open and close my menu, which is weird, right?

I might have explained it poorly, but maybe someone has tried something similar, and can help me see whats going on

It loads fine when the page is not in "mobile view", when the menu is just visible all the time

Øyvind Raddum Berg

@oyvindberg

don't store it in a val

Peter Storm

@peterstorm

Ah, what do I store it as then?

Øyvind Raddum Berg

@oyvindberg

a def

Peter Storm

@peterstorm

Thank you so much, that worked!

Øyvind Raddum Berg

@oyvindberg

no problem. I'm not really sure where that limitation comes from, I can't really see what can go so wrong

Pascal Mengelt

@pme123

After lots of problems with Intellij I tried with VSCode and it worked great with Metals.

Gabor Juhasz

@gjuhasz86

how do people deal with asynchrony? For example I have a component with a boolean state shouldAggregate, and another one that holds a key based on which it loads a list of items from the server. Now, on a user click I want to change the key as well as the shouldAggregate, but the aggregation takes into effect immediately (this happens on the client) while loading the list takes time, so after the click I can see the current list aggregated before the new items arrive.
Anyone had to deal with similar situation and have a good solution?

Alexis Hernandez

@AlexITC

I created a component for that, so that the component depending on the async result renders only when the result is ready

Gabor Juhasz

@gjuhasz86

Thank you, checking

so when it's loading it shows a progress indicator, right?

Gabor Juhasz

@gjuhasz86

I'm wondering if it can be rewritten to show the previous state while it's loading. I guess it's only possible if I pipe the shouldAggregate through this component's state as well

Alexis Hernandez

@AlexITC

you can certainly override the in progress behaviour to display something else

Gabor Juhasz

@gjuhasz86

yeah. I'll have to hold the previous state somewhere, though. But this gave me an idea.

roughly:

DisplayPrefs { shouldAggregate0 =>
  ItemFetcher(onComplete = gate.release()) { items =>
    Gate(state = shouldAggregate0) { shouldAggregate => 
      (if(shouldAggregate) aggregate(items) else items)
        .map{ item => div(onClick = {fetcher.load(item))(item.name); dispPrefs.setAggregate(true)} }
    }.withRef(gate)
  }.withRef(fetcher)
}.withRef(dispPrefs)

Gabor Juhasz

@gjuhasz86

only hiccup I guess is that whenever I need multiple states to be piped through the same Gate I'll have to change the type of the Gate too.

I like your workaround for implementing generic components. (I still wish it was supported out of the box, though)

Alexis Hernandez

@AlexITC

this could do the trick

Gabor Juhasz

@gjuhasz86

That looks promising. thank you! I'll have take a deeper look into hooks. I haven't used them yet

nkgm

@nkgm

Any working examples of slinky.reactrouter? I'm trying Route("/", DashboardPage, exact = true) but I get required: slinky.core.ReactComponentClass[_].

Alexis Hernandez

@AlexITC

I have one and there is another one

nkgm

@nkgm

Thanks so much @AlexITC, just what I was looking for. I don't see any mention of useParams hook anywhere on slinky.reactrouter. Is there a way of adding it to the existing facade (other than forking slinky itself)?

Alexis Hernandez

@AlexITC

very likely, isn't it being generated already by scalablytyped?

nkgm

@nkgm

I'm looking into that, but would I have to remove slinky.reactrouter completely and use the facade generated by scalablytyped in its place?

Alexis Hernandez

@AlexITC

I don't know about slinky.reactrouter but scalablytyped generated facades generally work quite well

Øyvind Raddum Berg

@oyvindberg

there's a pretty high chance you can mix and match the two approaches, since they both use the same javascript in the end

whether you want to keep two approaches is obviously another question :)

Peter Storm

@peterstorm

Im using the scalablytyped react router stuff with great success :)

nkgm

@nkgm

Just wanted to say thanks, ST works remarkably well so far :)

Peter Storm

@peterstorm

Yeah, irs an amazing piece of kit, that you get access to those libraries in Scala like that

Øyvind Raddum Berg

@oyvindberg

glad to hear it :)

Peter Storm

@peterstorm

How many of the normal libraries can you use in ScalaJS/Slinky by the way? Can i use cats types and cats effect, fs2?

Øyvind Raddum Berg

@oyvindberg

All of those work

Peter Storm

@peterstorm

Can i use http4s clients in scalajs? Do they somehow get translated to real js?

Anton Sviridov

@keynmol

Nope, http4s doesn't have a sjs module AFAIK

You can use sttp

Peter Storm

@peterstorm

Cheers :)

nkgm

@nkgm

Is there a way to spread props like so <table {...myProps}>as you do in React?

Naftoli Gugenheim

@nafg

When would you need to?

Yoichi Yamaguchi

@yyo1

Hi,
I'm using IntelliJ 2020.2 on MacOS and trying to run the example "Slinky for React" in slinky.dev/docs/resources.

The application runs successfully on console with sbt command.
But InttelliJ doesn't recognize @react annotation.
I added this to the library dependencies and slinky-core-ijext_2.13-0.6.6.jar exsists in External Libraries.
I have uncheck and check "Enable loading external extensions" at IntelliJ > Preferences > Languages & Frameworks > Scala > Extensions, but there is no extension in the list.
How can I enable Slinky support?

Gabor Juhasz

@gjuhasz86

@yyo1 I was struggling with this too, I noticed that version 0.6.6 of the extension is not recognized by IJ. But I manually added 0.6.5 and it works with that

See my earlier post about it: https://gitter.im/shadaj/slinky?at=5fabf7db2a354407151ba04a

nkgm

@nkgm

@nafg it's a useful React idiom when interfacing with existing components eg:

 const tableInstance = useTable({ columns, data })

 const {
   getTableProps,
   getTableBodyProps,
   headerGroups,
   rows,
   prepareRow,
 } = tableInstance

 return (
   // apply the table props
   <table {...getTableProps()}>
...

Yoichi Yamaguchi

@yyo1

@gjuhasz86 Thanks for your information. But unfortunately, it didn't suit my environment (Scala 2.13)...

Where communities thrive

People

Repo info

Activity