Why is my data loading randomly?

When the page loads I get the ‘posts’ from database in the following order.

But when a user navigates to the module 1 or module 2 (singlePost page) and the user tries to return to the ‘/’ the data gets loaded randomly.

How do I fix this issue? Is this an issue with FlowRouter? My Pub/Sub?


export default function (injectDeps, {FlowRouter}) {
  const MainLayoutCtx = injectDeps(MainLayout);

  FlowRouter.route('/', {
    name: 'posts.list',
    action() {
      mount(MainLayoutCtx, {
        content: () => (<PostList />)


<Panel bsStyle="primary"><a href={FlowRouter.path('/')}><h1 className="pull-middle">Microsoft Word Training</h1> </a></Panel>

Publish function:

import {Posts, Comments} from '/lib/collections';
import {Meteor} from 'meteor/meteor';
import {check} from 'meteor/check';

export default function () {

Meteor.publish('posts.list', function () {
  const selector = {};
  const options = {
    fields: {_id: 1, title: 1, content: 1, startDate: 1},
    sort: {startDate: 1}

  return Posts.find(selector, options);

Meteor.publish('posts.single', function (postId) {
  check(postId, String);
  const selector = {_id: postId};
  return Posts.find(selector);

Meteor.publish('posts.comments', function (postId) {
  check(postId, String);
  const selector = {postId};
  return Comments.find(selector);


Database schema:

"_id": "a9d4dbeb-3b80-4b08-94bb-5d8e41a58dae",
"content": "April 20th: 1:30 - 3:30 PM.",
"title": "Module 1",
"startDate": "1461177000000",

Can you show the source for your <PostList /> component?

import React from 'react';
import { Panel, Col } from 'react-bootstrap';
const PostList = ({posts}) => (
      <Col xs={12} md={6} lg={3}>
  <div className="text-center">
    <Panel header="Instructor Information" bsStyle="primary">
      <img src="adsfds.jpg"></img><br/>
      <strong>Instructor:</strong> asdfdsfsaf
<Col xs={12} md={6}>
  <div className='postlist'>

      {posts.map(post => (
        <div key={post._id}>

          <div className="client">
            <a href={`/post/${post._id}`}><span className="logo">
              <a href={`/post/${post._id}`}>{post.title}</a>



export default PostList;

Thanks - we’ll need to go up a bit higher; can you show where you’re subscribing to your publication, and loading your posts?

You probably forgot to put a sort option on the client-side Posts.find()

Thank you! Replaced the Post.find on the client with the proper sort. I can’t believe I missed this. Thank you again! @hwillson and @nlammertyn

import PostList from '../components/postlist.jsx';
    import {useDeps, composeWithTracker, composeAll} from 'mantra-core';

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

//     const posts = Collections.Posts.find({}, {sort: {startDate:1 }}).fetch();

        onData(null, {posts});

    export default composeAll(