0

Hi everyone i am using nuxt js for my hotel management system and for chat i am using the send bird which is a third-party library for chat and videos call, The issue i am facing is when i set my channel into my state then every this errors occurs even i tried the JSON.parse(JSON.Stringify(channel)) it will solve the problem but it will change my channel event into JSON so i will get the other error which is TypeError: _this2.channel.createPreviousMessageListQuery is not a function kindly please refer a better solution for this, here is my code

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script>
computed: {
    ...mapGetters('modules/dashboard', [
      'getHotelCode',
      'getHotel',
      'getHotelLayout',
      'getUser',
      'getDynamicPrimaryColor'
    ]),
    ...mapGetters('modules/concierge', ['getWakeUpDetails']),
    ...mapState('modules/chat', ['channel'])
  },

  methods: {
    ...mapActions('modules/chat', ['setMessageUnreadCount']),
    ...mapActions('modules/profile', ['setProfileListVisible']),
    ...mapActions('modules/dashboard', [
      'fetchCurrentUser',
      'setDynamicPrimaryColor'
    ]),
    ...mapActions('modules/parking', ['fetchParkingDetails']),
    ...mapActions('modules/chat', ['addMessage', 'setUserChannel']),
    async connectSendbird(user) {
      try {
        await SendBirdService.connect(
          user.sendbird_user_id,
          user.sendbird_access_token
        ).then(async (resp) => {
          console.log('PSR', resp)
          await this.setChannel()
        })
      } catch (error) {
        console.log(error)
      }
    },
    async setChannel() {
      await SendBirdService.getChannel(
        this.$store.state.auth.user.user.sendbird_channel_url
      ).then((channel) => {
        console.log('connect channel')
        this.setUserChannel(JSON.parse(JSON.stringify(channel)))
        this.onMessageReceived(channel)
      })
    },
    onMessageReceived(channel) {
      SendBirdService.onMessageReceived(
        // On Notification messsage Received
        channel,
        (channel, message) => {
          this.addMessage(message)
          console.log('On message received ', message)

          // show Pop notification
          let description
          if (message.messageType == 'file') {
            description = 'sents you a image'
          } else {
            description = message.message
          }
          // if user in chat hide notification
          if (message.data) {
            const data = JSON.parse(message.data)
            console.log('notification data', data)
          }

          if (this.$route.name !== 'chat') {
            //  get Unread chat count
            SendBirdService.getTotalUnreadMessageCount(channel).then(
              (count) => {
                console.log('count', count)
                this.setMessageUnreadCount(count)
              }
            )
            const audio = new Audio('/light.mp3') // path to file
            audio.play()
            this.$notification.open({
              message: this.getHotel.data.name,
              description,
              duration: 5,
              icon: (
                <a-avatar
                  size="large"
                  shape="circle"
                  src="/images/logo/logo.png"
                />
              )
            })
          }
          this.fetchCurrentUser(this.getHotelCode)
        }
      )
    },
https://github.com/MichaelTessier/vuejs-sendBird

0 Answers0