Adding toolbar contributors from the chat module affects theme and toolbar functionality #5325

tkettani created 2 years ago

ABP Framework version: v7.3.0-rc.1
UI type: Blazor Server with LeptonX
DB provider: EF Core
Tiered (MVC) or Identity Server Separated (Angular): no
Exception message and stack trace:
Steps to reproduce the issue:

I am using the chat module (with the source code option not packages) and I'm noticing that as soon as I include the toolbar contributor to add the envelope with the outstanding number of messages two things happen: the style of the page (that was dark) is no longer active, the style files are not bundled (lpx-theme-color-dark and lpx-theme-bootstrap-dark), and the buttons on the toolbar stop responding (settings button and user menu)

this is the part that if commented out brings back the normal behavior: Configure<AbpToolbarOptions>(options => { options.Contributors.Add(new ChatToolbarContributor()); });

I tried with a dummy component as well that has no functionality or dependencies at all and I get the same result. as soon as I add a toolbar contributor from the chat module I lose style and toolbar functionality.

can you please help or point me to the right direction to investigate ? thanks

liangshiwei created 2 years ago

Support Team Fullstack Developer

Hi,

I will check it

liangshiwei created 2 years ago

Support Team Fullstack Developer

Hi,

I couldn't reproduce the problem, could you share the full steps to reproduce? thanks.

tkettani created 2 years ago

i think i fixed the problem although not in a sustainable way. at least it gives us an idea of where the problem is:

public class ChatToolbarContributor : IToolbarContributor
{
    public async Task ConfigureToolbarAsync(IToolbarConfigurationContext context)
    {
        //var featureChecker = context.ServiceProvider.GetRequiredService<IFeatureChecker>();       
        if (context.Toolbar.Name == StandardToolbars.Main) // && await featureChecker.IsEnabledAsync(ChatFeatures.Enable)
        {
            //var permissionChecker = context.ServiceProvider.GetRequiredService<IPermissionChecker>();
            //if (await permissionChecker.IsGrantedAsync(ChatPermissions.Messaging))
            //{
                context.Toolbar.Items.Add( new ToolbarItem(typeof(BlazorServerMessagesToolbarItem)) );
            //}
        }
    }
}

when i disable the feature checker and permission checker everything is normal the dark theme is applied and the right bundles are loaded. if i use any of those two features (or both) we lose the theme. i didn't read the entire codebase enough to understand the mechanisms behind the scene but at least it gives us a starting point to investigate. please note that i am using the blazor ui template app with both the chat module and leptonx from code (both modules still mostly unmodified from their original code)