Socialize Messaging help

help
1

@copleykj
I am trying to implemet your socialize messaging package in my app. I need to display a list of all the conversations of the current user. I have created a publication

Meteor.publish(‘curretnUserConversations’, function () {
let user = Meteor.users.findOne(this.userId);
return user.conversations();
});
and subscribing it in the client as follows:

export default class Conversations extends TrackerReact(Component) {
constructor () {
super();
this.state = {
subscription: {
conversations: Meteor.subscribe(‘curretnUserConversations’),
},
};
}

componentWillUnmount() {
this.state.subscription.conversations.stop();
}

I can verify that the the correct conversations are getting published to the client ( verififed using meteor toys). But when I do a Meteor.user().conversations.fetch() in the client, it is returning an empty array. Please help!
Thanks in advance!

2

I think your issue may be Meteor.user().conversations.fetch() as conversations is a method of user which returns a cursor.

3

Of course then you shouldn’t be getting an error and not an empty array. I guess a reproduction could be in order.

4

Excuse me if I am wrong, but cursor.fetch converts the cursor into an array right? When I use the same Meteor.user( ). conversations.fetch( ) in the server, it rerturns the array correctly.

5

Shouldn’t this be: Meteor.user().conversations().fetch()

6

You are right that fetch returns an array of the cursors dataset. The issue I was pointing out however was the fact that you have used conversations as a property of a user and not a method of a user.

Meteor.user().conversations.fetch() // error
        // VS
Meteor.user().conversations().fetch() // array

This of course may just be limited to your code posted here and not the issue with your project. I’m guessing this is most likely the case as if you had actually executed this code you would have gotten an error telling you that conversations has no method fetch.

That being said I can’t say for certain what might be wrong. As far as I can tell from what you have given me so far it should work. If you have a public repo or a reproduction of the issue that I can take I look at this would be helpful.

7

The issue arises when I am indeed using Meteor.user( ).conversations( ).fetch( ) on the client and not Meteor.user( ).conversations.fetch( ). (Sorry for the mistake.) The same method on server works like a charm.

Here is a link for the repo:

8

You should really add your .meteor folder to the repo.

9

Well sorry man, I’ve tried and tried to get that repo to run but I’ve just spent way too much time trying to fix all the errors preventing it from starting and its way more time than I have to invest.

10

Hi,
Another problem has popped up.
I have a chatbox component in which I plan to render all the messages between two users, using a Messages component. I have a publication function for the messages and a corresponding subscription for fetrching the messages. But somehow, the subscription is not registering(verified using Meteor toys). Please help!
Publication.
Meteor.publish(‘allMessagesForConversation’, function (conversationId) {
return Meteor.messages.find({
conversationId: conversationId,
});
});

Messages component:

import React, { Component } from ‘react’;
import ReactDOM, { render } from ‘react-dom’;
import TrackerReact from ‘meteor/ultimatejs:tracker-react’;

import Message from ‘./Message.jsx’;

export default class Messages extends TrackerReact(Component) {

constructor(props) {
super(props);
this.state = {
subscription: {
messages: Meteor.subscribe(‘allMessagesForConversation’, this.props.conversationId),
},
};
this.messages = this.messages.bind(this);
}

messages() {
return Meteor.messages.find({
conversationId: this.props.conversationId,
}).fetch();
}

componentWillUnmount() {
this.state.subscription.messages.stop();
}

render () {
var inlineStyles = {
height: ‘300px’,
overflowY: ‘scroll’,
};
// Loop through the list of chats and create array of Row components
console.log(this.props.conversationId);
var Messages = this.messages().map(function (message) {
return (
<Message key={message._id}
username={message.user().username}
// time={message.timestamp()}
message={message.body} />
);
});

return (
  <div style={inlineStyles}>
    {Messages}
    asd
  </div>
);

}
}

ChatBox component.

import React, { Component } from ‘react’;
import { render } from ‘react-dom’;

import ChatHeader from ‘./ChatHeader.jsx’;
import Messages from ‘./Messages.jsx’;
import ChatFooter from ‘./ChatFooter.jsx’;
export default class ChatBox extends Component {
constructor(props) {
super(props);
}

render () {
if (!this.props.conversation) {
return (

Loading
);
} 
console.log(this.props.conversation);
return (
  <div className="chat-container">
    <ChatHeader
    name="Manu"
    />
  <Messages conversationId={this.props.conversation._id} />

    <ChatFooter
      sendMessage={this.sendMessage}
      conversation={this.props.conversation}
    />
  </div>
);

}
}

11

1366×768 216 KB

12

I’d love to help, but I don’t think this is specific to the package. I can’t see off hand what the issue could be and I don’t have a lot of time at the moment to dig through code.

13

I understand. Thanks anyway! :slight_smile: