I am using ACS ui library for my chat, i am always getting fluen ui icon warning.

Question

Console Warning: The icon "messageremove" was used but not registered. See https://github.com/microsoft/fluentui/wiki/Using-icons for more information.

Even though i try to do this, i am getting the console warning. how do i fix this ? I am using MessageThread component from

import { initializeIcons } from '@fluentui/react/lib/Icons';

initializeIcons(undefined, { disableWarnings: true });

@azure/communication-react

Answer 1

Hi @Manish Adhikari sorry to hear you're facing this issue.

The warning message you are seeing means that the "messageremove" icon is being used in your chat UI, but it has not been registered with the Fluent UI icon library. To fix this warning message, you need to register the "messageremove" icon with the Fluent UI icon library.

• Import the registerIcons function from the @fluentui/react/lib/Styling module:

import { registerIcons } from '@fluentui/react/lib/Styling';

• Call the registerIcons function to register the "messageremove" icon:

registerIcons({
  icons: {
    messageremove: <i className="ms-Icon ms-Icon--MessageRemove" />,
  },
});

• Add the disableWarnings option to the initializeIcons function:

initializeIcons(undefined, { disableWarnings: true });

Hope that helps
-Grace