Fork me on GitHub
#clojurescript
<
2019-08-15
>
Aklscc03:08:25

hey, what's the meaning of #object[Object [object Object]] ? I println some Vars and it output this.

yen04:08:55

I think its some kind of object

Aklscc07:08:34

Yes, maybe something needed to learn clojurescript source code.

Aklscc07:08:49

hey, is there anyone knowing the meaning of following code snippet?

(defprotocol IReset
  "Protocol for adding resetting functionality."
  (-reset! [o new-value]
    "Sets the value of o to new-value."))
I can't find anythings about defprotocol with -methodname and have not this in parameters.

andy.fingerhut07:08:42

The first parameter in the protocol definition need not be called this, but that is what it is, I am pretty sure.

andy.fingerhut07:08:23

It might need to be called this when inside of a deftype form, for example, to define the implementation of such a protocol method. The parameter names used when the implementation is given need not match the ones used inside defprotocol

thheller07:08:19

The name is completely open, no special meaning to this

akond10:08:25

does cljs.test support :test-selectors from project.clj?

akond10:08:55

it is a pity

akond10:08:56

was it a conscious decision then?

thheller10:08:07

clojure.test doesn't support that either

thheller10:08:13

it is leiningen supporting clojure.test

akond10:08:11

lein test?

Robin Jakobsson12:08:11

how would you write JS like this in CLJS? <motion.div />

Roman Liutikov12:08:22

(.createElement js/React (.-div js/motion))

Roman Liutikov12:08:33

but I assume you are using React wrapper in cljs?

Robin Jakobsson12:08:58

thanks for the response :thumbsup: . Yes, I'm using a React wrapper. It should allow me to use motion directly, but the "dot div" .div is causing it to fail, I think.

Roman Liutikov12:08:38

@jakobssonrobin which one are you using? Reagent?

Aklscc12:08:38

Hey, how do you use a react UI component in ClojureScript? It's state and some method props really tricky to dispose.

Roman Liutikov12:08:42

Could you explain a bit more? It’s not clear what is your question about

Aklscc12:08:38

I want use some bare React UI Component in ClojureScript. But they rerender depend state update. Are there some good ways to use or update the state?

Aklscc12:08:20

Reagent can only wrap Component, but some of them has their own methods to update, these methods use state to reserve state props as default. But I have no way to deal with it.

Aklscc13:08:15

@roman01la @jakobssonrobin I have seen you talk about react component, do you know this problem?😁

Robin Jakobsson13:08:18

@ULZE0PA2K I don't know reagent unfortunately.

Roman Liutikov12:08:41

ah ok, not familiar with it but in Reagent there’s interop syntax for js components [:> js/motion.div props]

Robin Jakobsson12:08:56

ah, cheers. thanks

Aklscc12:08:56

@roman01la But some bare React bare Component rerender when it self state flush.

Aklscc12:08:51

For example, a UI from react-native-elements, the onChangeText only need a state to rerender a Component.

import { SearchBar } from 'react-native-elements';

export default class App extends React.Component {
  state = {
    search: '',
  };

  updateSearch = search => {
    this.setState({ search });
  };

  render() {
    const { search } = this.state;

    return (
      <SearchBar
        placeholder="Type Here..."
        onChangeText={this.updateSearch}
        value={search}
      />
    );
  }
}

Kevin12:08:57

Does anyone have experience using Material UI in Reagent? I’m trying to use ThemeProvider but I get the following error. TypeError: _styles.withStyles is not a function Even though I’m not using withStyles. Here’s my code:

👍 4
pithyless12:08:50

@jakobssonrobin As a general rule, in Fulcro you want to wrap the JS library classes in a ui-factory. See http://book.fulcrologic.com/fulcro3/#_using_javascript_react_components - Also, there is a #fulcro channel on Slack where you may want to ask in the future.

👍 4
Robin Jakobsson12:08:42

got it working by doing this (def motion-div (create-react-element (.-div motion)))

thheller12:08:52

@kevin.van.rooijen the code you posted is using react hooks (ie. useStyles). that is not supported by reagent. can't tell if you are using that or not.

alpox13:08:40

@kevin.van.rooijen Due to the lack of react hooks in reagent I made the switch over to hx. If you want to stay in reagent the only way I managed to make hooks of third party libraries work was to opt-out of reagent and opt-in again:

(defn Component []
  (let [[ob setOb] (react/setState #js {})]
    (reagent/as-element [:div ..... ])
And then use it as:
[:> Component ...]
And I'm not sure how trustworthy that code is in the end

neupsh13:08:04

do you miss re-frame with hx? I am not familiar with hx at all, does it have something comparable to re-frame for reagent?

alpox13:08:52

Atm I don't use re-frame (yet?) and I'm not sure if I'll feel the need for it eventually. There is an example by the creator of hx though which maps the RAtom used by re-frame to a react hook though so you can subscribe to re-frame through react hooks. The one downside I see is that it pulls in the whole of reagent just for the RAtom

alpox13:08:45

hx is nothing else than a small wrapper around react and doesn't provide all that much itself. It replaces reagent to some degree but doesn't add state handling logic itself like reagent does. hx relies on the new react hooks for that.

alpox13:08:24

https://github.com/Lokeh/hooks-demo/blob/master/src/hooks_demo/hooks.cljs Here is an example of a <-sub hook implementation which subscribes to re-frame - which can be used in hx to access re-frame state

👍 4
David Pham18:08:52

It works for local state, but once you have to manage workflow of events, re-frame is a great tool.

Kevin13:08:42

@thheller @alpox Thank you, this clears up a lot

Godwin Ko15:08:48

how does reagent trigger react component’s re-render? I know that reagent keep a deref list of components to triggger re-render upon ratom update, but they are not react component’s props or state, how does reagent notify react which components did update?

Roman Liutikov15:08:32

I think it calls .forceUpdate on component instance

4
tianshu18:08:43

any good article about how to do server side rendering with reagent?

tianshu18:08:29

I just tried copy the html, paste it as the first page. it open instantly, however, when javascript ready, this is a whole re-render of whole page which cause a flicker.

Joe Chasinga18:08:31

Hi :spock-hand: . I really need help integrating reagent with the current React/TypeScript codebase.

Joe Chasinga18:08:21

Excuse me I didn’t know there was an #reagent. Shared the question https://clojurians.slack.com/archives/C0620C0C8/p1565895519303800

andy.fingerhut21:08:36

Regarding questions on all numbers in JS, and thus ClojureScript, being floating point, I found in ECMA-252 standard the section "6.1.6 The Number Type" that goes into significant detail on this. Basically all Number type values are 64-bit double precision IEEE 754 floating point numbers. That spec even helpfully points out that all integers from -2^53 to +2^53 an be represented exactly in this format (I might be off by on there on the endpoints of that range). Cool. That is a pretty reasonable sized exact range for integer operations.