Changing one document causes re-render of all components

[nadeemja]

Hello,

I would really appreciate some help on this.

The Problem A change in document causes components displaying other documents to re-render as well.

Expected behavior Only the component displaying the affected document should re-render.

Steps to recreate

1. Setup pub/sub and container/components as below.
2. Change anything about a document.
3. Use React DevTools for Chrome to confirm re-render. (confirmed using console.log)

The Setup

Publication server/publications/schedules.js

...
Meteor.publish('schedules.list', function schedulesList() {
  ...
  return Schedules.find();
});
...

Container client/modules/schedules/containers/list.js

import { useDeps, composeAll, composeWithTracker, compose } from 'mantra-core';
import List from '../components/list.jsx';

export const composer = ({ context }, onData) => {
  const { Meteor, Collections } = context();
  if (Meteor.subscribe('schedules.list').ready()) {
    const schedules = Collections.Schedules.find().fetch();
    onData(null, { schedules });
  }
};

export const depsMapper = (context, actions) => ({
  context: () => context,
});

export default composeAll(
  composeWithTracker(composer),
  useDeps(depsMapper)
)(List);

List Component client/modules/schedules/components/list.jsx

import React from 'react';
import Item from './item.jsx';
const List = ({ schedules = [] } = {}) => (
  <div>
    {schedules.map((schedule) => (
      <Item schedule={schedule} key={schedule._id} />
    ))}
  </div>
);

export default List;

Item Component client/modules/schedules/components/item.jsx

import React from 'react';
import {
 ...
} from 'react-bootstrap';

const Item = ({ schedule = {} }) => (
  <div>
    ...
  </div>
);

export default Item;

[crapthings]

i've the same issue

[arunoda]

Yep. This will be fixed in 2.x - https://github.com/kadirahq/react-komposer/issues/123

[nadeemja]

Awesome, @arunoda! :)

[arunoda]

Launched v2. Check the Performance section.