Activities of "improwise"

https://abp.io/docs/latest/release-info/road-map

Is very out of date now that 8.2 has been released several weeks ago.

Hi,

When trying to build a MAUI Blazor (and probably MAUI Xamarin as well I guess) you will get build errors from OAuthSecureStorage as the AccessTokenKey property is not defined.

I can't reproduce the problem.

• abp new Qa -u maui-blalzor
• dotnet build

Did you build it in Release mode as that is needed to activate the mentioned code? Will build fine in debug mode but not in Release mode as AccessTokenKey isn't declared.

public Task<string> GetAsync(string key) { #if DEBUG return Task.FromResult(Preferences.Get(key, string.Empty)); #else return SecureStorage.Default.GetAsync(AccessTokenKey); #endif } public Task RemoveAsync(string key) { #if DEBUG Preferences.Remove(key); #else SecureStorage.Default.Remove(AccessTokenKey); #endif return Task.CompletedTask; }

The code generated by ABP Suite (and probably the normal MAUI projects in all version) does not seem to be compatible with newer versions of Android. When you try to build it in Release mode with SDK 33 or higher (which is a requirement these days), you will get this error message:

Thanks. We will update the template, and your ticket will be refunded.

Thanks.

I need help with a problem I'm having with the Blazor Web App template version 8.2.0:

Never seen that myself, you did not simply type the wrong path? I usually copy and paste it from file explorer.

Still waiting for a reply here.

How can you hide language, container width and appearance menus, both in Main Header Toolbar (General Settings) and in MobileNavBar (MobileGeneralSettings)? Looking into the files for LeptonX, there seem to be switches like" @if (HasMultipleStyles)" and "@if (HasContainerWidth)" but we have not been able where to control/change those. Unlike previous Lepton theme, even if you disable all languages but one, the language menu still seem to render in LeptonX but with only one choice available (the enabled language).

You can create the following component in your application:

using Microsoft.AspNetCore.Components.Rendering; 
using Volo.Abp.AspNetCore.Components.Web.LeptonXTheme.Components.ApplicationLayout.Common; 
using Volo.Abp.DependencyInjection; 
 
namespace LeptonXDemoApp.Blazor.Components; 
 
[Dependency(ReplaceServices = true)] 
[ExposeServices(typeof(GeneralSettings), typeof(EmptyGeneralSettings))] 
public class EmptyGeneralSettings : GeneralSettings 
{ 
 
    protected override void BuildRenderTree(RenderTreeBuilder __builder) 
    { 
        __builder.OpenElement(0, "div"); 
        __builder.AddAttribute(1, "class", "empty-general-settings"); 
        __builder.CloseElement(); 
    } 
} 

How can you specify theme, container width and appearance either in code or settings (appsettings or similar) for Leptonx so you can control it but not allowing users to modify it?

You can create the following script in wwwroot/globa.js

$(function () { 
 
    const currentInitLeptonX = window.initLeptonX; 
    window.initLeptonX = function (layout, defaultStyle = "dim") { 
 
        currentInitLeptonX(layout, defaultStyle); 
 
        leptonx.globalConfig.defaultSettings = 
        { 
            appearance: "dark", 
            containerWidth: 'full', 
        }; 
 
        leptonx.init.run(); 
    } 
}); 

And add it to the bundle configuration: (Configure both for Blazor Server)

 
// For Blazor Server 
options.ScriptBundles.Configure( 
    LeptonXThemeBundles.Scripts.Global, 
    bundle => 
    { 
        bundle.AddFiles("/global.js"); 
    } 
); 
 
// For Blazor WASM / MauiBlazor / Blazor Server 
options.ScriptBundles.Configure( 
    BlazorLeptonXThemeBundles.Scripts.Global, 
    bundle => 
    { 
        bundle.AddFiles("/global.js"); 
    }); 

3.For the MobileNavBar, is there a way to hide the "Settings" or at least move it in under the user menu so that "slot" in the tab bar can instead be used for something more useful, like navigating to a page just like Home/Dashboard? With only fem slots available, 4 including the hamburger menu, it seems like a waste to dedicate one of them to Settings that you might change once or twice (or never)

It's a design decision, there is no configuration for it right now, you can customize it by overriding the MobileNavBar component in your project.

4.How come the MobileNavBar can't be controlled like the normal main menu? Seems like the only way is to hardcode items using options.MobileMenuSelector = items => items.Where(...) which isn't ideal for various reasons.

5.How can you control/change the number of items for MobileMenuSelector ? 2 seems to be default but have found not documentation on how to change that.

It uses regular menu contributor to list menu items. Bottom bar is designed for mobile requirements and it has limited space. So only 2 items can be placed there, you can pick which ones will be there. But still all the menu items will be included in hamburger menu.

Thank you. We will give this a try and report back on how it goes and if there are any additional questions.

Is the a way to make the hamburger menu a bit less "in your face" and perhaps also move it to be far right instead of in center which is a very odd location?

For now, you need to override the styles to do something like this, but we are working on this and will change the design this way in the next versions.

Thanks. I believe that is a very good idea as the current "theme" feels much more suitable for something like a game or a fashion app than something you would use in a more typical LOB app or similar. Since there are only 5 available slots on the navbar, using three of them for navigation seems like a waste. Like how often do you really need to change appearance and language that you need to have it available in one of the prime locations on the navbar when it could just as well be under the "my profile" section. Also please consider if the hamburger menu really need to be there and even if it is, it should probably be further to the right and bit toned down. Of course, the best would be if you could perhaps switch between a couple of different designs / themes, like the current one and the one I describe above. That should go a long way.

A somewhat related issue to this so I put it in here instead of creating a new issue about it.

The code generated by ABP Suite (and probably the normal MAUI projects in all version) does not seem to be compatible with newer versions of Android. When you try to build it in Release mode with SDK 33 or higher (which is a requirement these days), you will get this error message:

android:exported needs to be explicitly specified for element <activity#XXXXWebAuthenticatorCallbackActivity>. Apps targeting Android 12 and higher are required to specify an explicit value for android:exported when the corresponding component has an intent filter defined.

After some investigation, it turns out to be the generated WebAuthenticatorCallbackActivity that is the reason for this, and the solution is to put android:exported in the Activity decoration

[Activity(NoHistory = true, LaunchMode = LaunchMode.SingleTop, Exported = true)]
[IntentFilter(new[] { Intent.ActionView },
    Categories = new[] { Intent.CategoryDefault, Intent.CategoryBrowsable },
    DataScheme = CALLBACK_SCHEME)]
public class XXXXWebAuthenticatorCallbackActivity : WebAuthenticatorCallbackActivity
{
    public const string CALLBACK_SCHEME = "XXXX";
}

I thought this sounded familiar, apparently we had a similar discussion 2 years ago

https://support.abp.io/QA/Questions/3714/NET-MAUI-mobile-application-uses-Preferences-instead-of-SecureStorage-for-JWT-Tokens

But I guess the question still stands about how to solve this and make the ABP generated solution build.

Still waiting for a response here...

Seems like this is the answer to question 5:

SelectedMenuItems = Options.Value.MobileMenuSelector(menu.Items.AsReadOnly()).Take(2).ToList();