Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 12:32

    foxdonut on master

    Experimenting with superouter a… (compare)

  • Dec 09 13:01

    foxdonut on master

    Working on using superouter exa… (compare)

  • Dec 08 15:13

    foxdonut on master

    Working on using superouter exa… (compare)

  • Dec 08 14:15

    foxdonut on master

    Working on using superouter exa… Working on using superouter exa… Working on using superouter exa… and 1 more (compare)

  • Dec 03 12:04

    foxdonut on gh-pages

    Remove video for now since it i… (compare)

  • Dec 01 20:29

    foxdonut on master

    Working on using superouter exa… (compare)

  • Dec 01 16:45

    foxdonut on master

    Working on using superouter exa… (compare)

  • Dec 01 15:23

    foxdonut on master

    Working on using superouter exa… (compare)

  • Dec 01 15:12

    foxdonut on master

    Working on using superouter exa… (compare)

  • Nov 30 13:21

    foxdonut on gh-pages

    Update gitter-search example. (compare)

  • Nov 30 13:13

    foxdonut on gh-pages

    Update gitter-search example. (compare)

  • Nov 30 13:07

    foxdonut on gh-pages

    Update gitter-search example. (compare)

  • Nov 30 12:59

    foxdonut on using-superouter

    (compare)

  • Nov 30 12:58

    foxdonut on master

    Experimenting with superouter a… Experimenting with superouter a… Experimenting with superouter a… and 18 more (compare)

  • Nov 29 22:08

    foxdonut on gh-pages

    Update gitter-search example. (compare)

  • Nov 29 00:52

    foxdonut on gh-pages

    Update gitter-search example. (compare)

  • Nov 27 22:36

    foxdonut on gh-pages

    Add gitter search example (compare)

  • Nov 27 22:28

    foxdonut on gh-pages

    Add gitter search example (compare)

  • Nov 27 22:23

    foxdonut on using-superouter

    Experimenting with superouter a… (compare)

  • Nov 27 00:21

    foxdonut on using-superouter

    Experimenting with superouter a… (compare)

sjmik
@sjmik

I was mostly curious if you'd already come up with some convention for working with arrays in your state objects.
I tried skimming through the realworld example but nothing jumped out at me (or I missed it).

Would you typically avoid arrays for things that need actions performed on them, or use something like in the flems, or something totally different?

J
@jludev_gitlab
@foxdonut Awesome! Thanks for the example above.
Fred Daoud
@foxdonut
@jludev_gitlab welcome!
@sjmik I don't think there is one approach to arrays that is "the best". Typically I would look them up by id. I've seen another approach where you only have the ids in the array (to indicate the ordering), and then you have an object that is keyed by id to make it easy to look up an item.
Daniel Loomer
@fuzetsu

@sjmik Here is an example of the array + object approach that @foxdonut mentioned, I've used this approach with success. I usually set up some helpers like patchList that handle the data/order structure for me, if I have multiple lists in my state.

To display the list in the correct order you would map over the order array, and then use the id from each position to get the data out of data.

Daniel Loomer
@fuzetsu
Here is another approach using just arrays, and indexes, not as efficient overall probably, but the key there is the idToIndex
sjmik
@sjmik
Cool, thank you both for the ideas
Fred Daoud
@foxdonut
:thumbsup:
Daniel Loomer
@fuzetsu
np!
Constantin Angheloiu
@cmnstmntmn
hei there!
is it possible to use meiosis as a state library with morphdom and a templating library ?
Fred Daoud
@foxdonut
@cmnstmntmn as long as there's a way to re-render the view from the state
Constantin Angheloiu
@cmnstmntmn
i picked mithril :D it's easier
Fred Daoud
@foxdonut
@cmnstmntmn well I could have told you that! :wink:
Constantin Angheloiu
@cmnstmntmn
:))
Constantin Angheloiu
@cmnstmntmn
@foxdonut there's an error here http://meiosis.js.org/tutorial/03-streams.html
Exercises section - Try actions.increment() again and also actions.decrement()
actions.decrement() is undefined
Fred Daoud
@foxdonut
@cmnstmntmn it's working for me... it returns undefined, but it performs the action, see the output in the upper right
image.png
Constantin Angheloiu
@cmnstmntmn
indeed
Constantin Angheloiu
@cmnstmntmn
thank you ;)
Fred Daoud
@foxdonut
welcome!
Deniz Dogan
@denizdogan
Hey guys, new to Meiosis, considering using it with React. The basic examples pass state and actions explicitly to the components that act on them. Is there any common way to do this without the explicit passing of these props?
Fred Daoud
@foxdonut
@denizdogan welcome!
I'm not certain, but I think @fuzetsu has experimented with importing the states stream and the actionsinstead of passing them as props.
Daniel Loomer
@fuzetsu

Indeed I have, it's not perfect but works well at least with the simple app I tried it on.
You can see here that I export both state/update, then I can import an up to date reference to the state in whichever file I need it.
For actions I import update and just write them as normal functions and export them.

@denizdogan

That code there using meiosis-setup hasn't been updated to the newest version, but the concept is the same.
Constantin Angheloiu
@cmnstmntmn
hei there!
i'm bit puzzled about the initial state in the routing context; coming from the gif generator example (where things are clear enough) i'm not sure about this part
export const app = {
    //initial: navTo([Route.Home()]),
    initial: Object.assign({}, {
        counter: counter.Initial({ label: "Counter:" }),        
        button: button.initial,
        randomGif1: randomGif.initial,
        randomGifList: randomGifList.initial
    }),
is if fine to have it this way?
 initial: Object.assign({}, {
        ...navTo([Route.Home()]),
        counter: counter.Initial({ label: "Counter:" }),        
        button: button.initial,
        randomGif1: randomGif.initial,
        randomGifList: randomGifList.initial
    }),
?
Constantin Angheloiu
@cmnstmntmn
i see, so i have to create a service and patch the initial state with to component initial state
Fred Daoud
@foxdonut
@cmnstmntmn all good?
Constantin Angheloiu
@cmnstmntmn
yeap, so far :d
Neftaly Hernandez
@neftaly
Hey folks, are there any good example repos using flyd and immutable.js? Or with anything clojure-ish
I have something working with flyd/immutable/react but would like to see how others are doing it if possible :)
Neftaly Hernandez
@neftaly
this is what I have FWIW, though I assume it makes life difficult for react fiber etc
import React from 'react';
import { render } from 'react-dom';
import { stream, scan } from 'flyd';
import tracer from 'meiosis-tracer'; // dev only

import Main from './src/Main.jsx';
import { initial, Actions } from './src/app';

const update = stream();
const actions = Actions(update);
const states = scan(
  (state, patch) => patch(state), initial, update
);

states.map(state => render(
  <Main state={state} actions={actions} />,
  document.getElementById('root')
));

// Meiosis Tracer - dev only
tracer({ selector: "#tracer", rows: 25, streams: [states] });

// // Using React state to handle updates instead:
// class Root extends React.Component {
//   constructor(props) {
//     super(props);
//     this.state = props.states();
//   }
//   componentDidMount() {
//     this.props.states.map(
//       state => this.setState(state)
//     );
//   }
//   render() {
//     const { state, props } = this;
//     return (
//       <Main state={state} actions={props.actions} />
//     );
//   }
// };

// render(
//   <Root state={state} actions={actions} />,
//   document.getElementById('root')
// );
Constantin Angheloiu
@cmnstmntmn
@foxdonut i'm curious about the absence of state.routeTransition.arrive.Home when the / is visited for the first time
i was trying to create a service, but there's no arrive for it
Fred Daoud
@foxdonut
@cmnstmntmn good catch! I need to update the meiosis-setup version, will do shortly.
Constantin Angheloiu
@cmnstmntmn
;)
great!
Fred Daoud
@foxdonut
@cmnstmntmn should work now, for example in the mithril version
  services: [
    routeService,
    ({ state }) => {
      if (state.routeTransition.arrive.Home) {
        console.log('Welcome home')
      }
    },
    settingsService,
image.png
Constantin Angheloiu
@cmnstmntmn
awesome! :D thank you
Fred Daoud
@foxdonut
welcome, and thank you!
Constantin Angheloiu
@cmnstmntmn
re: welcome (:
robinchew
@robinchew
it's too bad meiosis.js.org don't have the video there anymore
has the meiosis pattern change a lot from the video?
Patrik Johnson
@orbitbot
can't remember the video content, but at some point (in the last year?) the tutorial was rewritten into a shorter format that was quite easy to digest