Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

TypeError: t is not a function #181

Closed
YohaanYoon opened this issue Mar 25, 2020 · 11 comments
Closed

TypeError: t is not a function #181

YohaanYoon opened this issue Mar 25, 2020 · 11 comments
Assignees
Labels
bug Something isn't working

Comments

@YohaanYoon
Copy link

YohaanYoon commented Mar 25, 2020

Going through tutorial, ChannelList component works well. But, I received following error, when MessageList and MessageInput components:

MessageList.render
node_modules/stream-chat-react/dist/index.es.js:15770
15770 | }, t('Connection failure, reconnecting now...')),

When MessageList and MessageInput components removed in render(), it works.

@vishalnarkhede
Copy link
Contributor

Hey @YohaanYoon thanks for bringing it up. I will check and get back to you!

@vishalnarkhede
Copy link
Contributor

@YohaanYoon can you please share the code around how you are using MessageList and MessageInput?

Also which version of stream-chat-react are you using?

@vishalnarkhede vishalnarkhede self-assigned this Mar 25, 2020
@YohaanYoon
Copy link
Author

YohaanYoon commented Mar 25, 2020

render() {
    const {
      chatClient,
      channel,
    } = this.state;
    const chatTranslate = chatTranslateInstance.getChatTranslate();

    if (!channel) return (<Spinner />);

    return (
      <div>
        <S.AppBar />
        <Chat client={chatClient} theme="messaging light" i18nInstance={chatTranslate}>
          <Channel channel={channel}>
            <Window>
              <MessageList />
              <MessageInput />
            </Window>
            <Thread />
          </Channel>
        </Chat>
      </div>
    );
  }

And, the version of stream-chat-react is 0.10.1.

@tbarbugli
Copy link
Member

something is going wrong with the i18n setup, what does chatTranslateInstance.getChatTranslate() return?

For translations to work correctly, it should be something like this:

const i18n = new Streami18n({
  language: 'nl',
  translationsForLanguage: {
    'Nothing yet...': 'Nog Niet ...',
    '{{ firstUser }} and {{ secondUser }} are typing...':
      '{{ firstUser }} en {{ secondUser }} zijn aan het typen...',
  },
});

@vishalnarkhede is this is a misconfiguration problem we should add some basic validation to catch it when Chat is constructed and i18nInstance is passed

@tbarbugli tbarbugli added the bug Something isn't working label Mar 26, 2020
@YohaanYoon
Copy link
Author

@tbarbugli chatTranslateInstance.getChatTranslate() returns new Streami18n . ChannelList component works correctly. But, For MessageList and MessageInput components do not works.
Anyway, I will check my codes again.

@vishalnarkhede
Copy link
Contributor

@YohaanYoon I have published a fix for this. Can you please check on 0.10.2

Its mostly because translator wasn't ready before rendering Chat component.

@vishalnarkhede is this is a misconfiguration problem we should add some basic validation to catch it when Chat is constructed and i18nInstance is passed

We have check if (i18nInstance && i18nInstance instanceof Streami18n) { ... }, which should be enough in my opinion, and since its working for ChannelList, don't think its a configuration issue.

@YohaanYoon
Copy link
Author

YohaanYoon commented Mar 26, 2020

Thanks. It works well.

But, I have found the other issues.
In MessageList component, when I click flag or mute buttons, console shows error message as follows:

Uncaught (in promise) TypeError: t is not a function
    at _callee2$ (index.es.js:12927)
    at tryCatch (runtime.js:45)
    at Generator.invoke [as _invoke] (runtime.js:264)
    at Generator.prototype.<computed> [as next] (runtime.js:98)
    at asyncGeneratorStep (asyncToGenerator.js:3)
    at _next (asyncToGenerator.js:25)
index.es.js:12927
              case 9:
                _context2.prev = 9;
                _context2.t0 = _context2["catch"](2);
                errorMessage = _this.validateAndGetNotificationMessage(getMuteUserErrorNotification, [message.user]);
                addNotification(errorMessage ? errorMessage : t('Error muting a user ...'), 'error');
Uncaught (in promise) TypeError: t is not a function
    at _callee$ (index.es.js:12882)
    at tryCatch (runtime.js:45)
    at Generator.invoke [as _invoke] (runtime.js:264)
    at Generator.prototype.<computed> [as throw] (runtime.js:98)
    at asyncGeneratorStep (asyncToGenerator.js:3)
    at _throw (asyncToGenerator.js:29)
index.es.js:12882
              case 9:
                _context.prev = 9;
                _context.t0 = _context["catch"](2);
                errorMessage = _this.validateAndGetNotificationMessage(getFlagMessageErrorNotification, [message]);
                addNotification(errorMessage ? errorMessage : t('Error adding flag: Either the flag already exist or there is issue with network connection ...'), 'error');

I guess those are similar issues.
Please check it again.

@vishalnarkhede
Copy link
Contributor

Thanks for brining it up @YohaanYoon . Translation context consumer is missing on that component. I will put up a fix soon :)

@vishalnarkhede
Copy link
Contributor

@YohaanYoon fixed in 0.11.1 :)

@YohaanYoon
Copy link
Author

@vishalnarkhede Thanks

@ssshah
Copy link

ssshah commented Apr 23, 2023

CreateGuest failed with error: "JWTAuth error: token contains an invalid number of segments getting this error on creating guest user what's the issue this was working perfect berfore
` this.chatClient = new StreamChat(streamChatKey,{ timeout: 10000 })

  // https://getstream.io/blog/chat-edge-infrastructure/
  this.chatClient.setBaseURL('https://chat.stream-io-api.com')
  const { me: guestUser } = await this.chatClient.setGuestUser({
    id: userId,
    name: userName
  })`

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

4 participants