Chatwoot isn't sending any messages.

[ClarissaAudrey]

Hey! I have been using Chatwoot with no issue in my web page. Recently, I have developed a mobile app using flutter. It seems like there is an issue with Chatwoot on it. When testing it out, I am unable to send any messages. It just loads on forever. Schreenshot:

This is how I Implemented in on the mobile app

Chatwoot Button (clicking this will open the chatwoot box):

  Widget build(BuildContext context) {
    return Container(
      height: 55,
      width: 55,
      margin: EdgeInsets.only(bottom: isNavAvailable ? 50 : 0),
      decoration: const BoxDecoration(
        color: colorChatwoot,
        shape: BoxShape.circle,
      ),
      child: InkWell(
        customBorder: const CircleBorder(),
        onTap: onTap,
        child: Icon(
          show ? Icons.close : Icons.chat_bubble_rounded,
          color: colorChatwoot.computeLuminance() < 0.5
              ? Colors.white
              : Colors.black,
          size: 25,
        ),
      ),
    );
  }

Chatwoot box:

    final AppLocalizations _local = AppLocalizations.of(context)!;
    MediaQueryData queryData = MediaQuery.of(context);

    double _marginBottom = isNavAvailable
        ? queryData.size.width * 0.30
        : queryData.size.width * 0.18;

    if (queryData.size.width > 400) {
      _marginBottom = isNavAvailable
          ? queryData.size.width * 0.34
          : queryData.size.width * 0.24;
    }
    return Container(
      width: double.infinity,
      alignment: Alignment.bottomRight,
      margin: EdgeInsets.only(bottom: _marginBottom, top: 10),
      child: Visibility(
        visible: show,
        child: Container(
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(15),
            boxShadow: [
              BoxShadow(
                blurRadius: 10,
                color: Theme.of(context).shadowColor.withOpacity(0.2),
              ),
            ],
          ),
          constraints: BoxConstraints(
            minWidth: 100,
            maxWidth: 380,
            minHeight: 100,
            maxHeight: queryData.size.width * 1.3,
          ),
          margin: const EdgeInsets.all(20),
          child: ClipRRect(
            borderRadius: BorderRadius.circular(15),
            child: ChatwootChat(
              baseUrl:
                  "our websocket url,
              inboxIdentifier: "our inbox identifier",
              user: ChatwootUser(
                identifier: email,
                name: name,
                email: email,
              ),
            ),
          ),
        ),
      ),
    );
  }

Did i implement this wrong? Any help would be great! Thank you so much

[engmsaleh]

Hi @ClarissaAudrey I think I faced the same issue and ended up using this solution found here it is a forked version

Try it and check if it solves your issue

[sojan-official]

@engmsaleh Thanks for the comment. We will try to merge the changes in the fork to the main repo if @imhafeez feels okay about it.

[imhafeez]

@sojan-official Please merge the changes. Thanks

[sojan-official]

closing in favor of https://github.com/chatwoot/chatwoot-flutter-sdk/issues/13