Activities of "AlderCove"

Thanks - I was able to download it to a project using abp add-package @volo/abp.commercial.ng.ui --with-source-code

• ABP Framework version: v8.3.0
• UI Type: Angular
• Database System: EF Core SQL Server
• Tiered (for MVC) or Auth Server Separated (for Angular): yes

How do I download the source for this package?

I thought it might be the common commercial source but when I run the get-source, it is not found: abp-old get-source Volo.Abp.Commercial.Common -o "C:\Users\Jamie\Repo\AbpIO_commercial\modules\Volo.Abp.Commercial.Common" -v 8.3.0

[17:38:53 INF] You are running the second generation of the ABP CLI. If you're interested in the legacy CLI, see https://abp.io/new-cli Checking extensions... [17:38:53 INF] Downloading source code of Volo.Abp.Commercial.Common (Latest) [17:38:53 INF] Output folder: C:\Users\Jamie\Repo\AbpIO_commercial [17:38:53 ERR] Module not found: Volo.Abp.Commercial.Common Volo.Abp.Studio.AbpStudioException: Exception of type 'Volo.Abp.Studio.AbpStudioException' was thrown. at async Task<ModuleInfo> Volo.Abp.Studio.Modules.Remote.StudioModuleInfoProvider.GetAsync(string name) at async Task Volo.Abp.Studio.Cli.Commands.StudioGetSourceCommand.ExecuteAsync (CommandLineArgs commandLineArgs) at async Task Volo.Abp.Studio.Cli.StudioCliService.RunInternalAsync( CommandLineArgs commandLineArgs) at async Task Volo.Abp.Studio.Cli.StudioCliService.RunAsync(string[] args)

It seems to be intermittent. I just tried again a couple of times on the demo site - it worked OK the first time but then I managed to reproduce the issue.

• ABP Framework version: v8.3.0
• UI Type: MVC
• Database System: EF Core (SQL Server)
• Tiered (for MVC) or Auth Server Separated (for Angular): yes
• Exception message and full stack trace:
• Steps to reproduce the issue:

I first noticed this in my own application, then tested the abp demo application to ensure it wasn't a local issue.

1. Navigate to the demo abp io page (https://demo.abp.io/)
2. Log in as admin
3. Create a new user - check the Force password change
4. Log out
5. Try logging in as the new user, with the wrong password

The system does not provide any feedback that the password is incorrect.

It appears that this was addressed in the framework by issue 19753 (https://github.com/abpframework/abp/issues/19753).

Add a class to extends TitleStrategy and localize the title in that class: https://dev.to/brandontroberts/setting-page-titles-natively-with-the-angular-router-393j

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule],
  providers: [
    {
      provide: TitleStrategy,
      useClass: TemplatePageTitleStrategy
    }
  ]
})
export class AppRoutingModule { }

import { LocalizationService } from '@abp/ng.core';
import { Injectable, Injector } from '@angular/core';
import { Title } from '@angular/platform-browser';
import { RouterStateSnapshot, TitleStrategy } from '@angular/router';

@Injectable()
export class TemplatePageTitleStrategy extends TitleStrategy {
  constructor(private readonly title: Title, private injector: Injector) {
    super();
  }
  private localizationService: LocalizationService;
  override updateTitle(routerState: RouterStateSnapshot) {
    this.localizationService = this.injector.get(LocalizationService);

    let localizedAppTitle = this.l('::BrowserTitle:Application');

    const routeTitle = this.buildTitle(routerState);

    if (routeTitle !== undefined && localizedAppTitle !== undefined) {
      let localizedRouteTitle = this.l(routeTitle);
      this.title.setTitle(`${localizedRouteTitle} - ${localizedAppTitle}`);
    } else {
      this.title.setTitle(`${localizedAppTitle}`);
    }
  }

  l(key: string): string {
    return this.localizationService.instant({
      key: key,
      defaultValue: 'Default',
    });
  }
}

It looks like this was a framework issue and has now been fixed with 7.4: https://support.abp.io/QA/Questions/5641/Bugs--Issues-v73x#answer-3a0dbedf-b3c3-29cc-e89a-c525a839f0a6

• ABP Framework version: v7.3.2
• UI Type: MVC
• Database System: EF Core (SQL Server
• Tiered (for MVC) or Auth Server Separated (for Angular): yes
• Exception message and full stack trace: Could not find localization source: AbpUi

Unable to upload profile picture Angular Project in My Account --> Profile Picture:

First experienced in our app, then replicated issue in scratch 7.3.2 project.

Error in browser

core.mjs:10171 ERROR TypeError: Cannot read properties of undefined (reading 'nativeElement') at volo-abp.ng.account-public.mjs:1758:60 at timer (zone.js:2367:41) at _ZoneDelegate.invokeTask (zone.js:402:31) at core.mjs:25893:55 at AsyncStackTaggingZoneSpec.onInvokeTask (core.mjs:25893:36) at _ZoneDelegate.invokeTask (zone.js:401:60) at Object.onInvokeTask (core.mjs:26194:33) at _ZoneDelegate.invokeTask (zone.js:401:60) at Zone.runTask (zone.js:173:47) at invokeTask (zone.js:483:34)

image.png

Unable to upload profile picture Angular Project in My Account --> Profile Picture:

First experienced in our app, then replicated issue in scratch 7.3.2 project.

Error in browser

core.mjs:10171 ERROR TypeError: Cannot read properties of undefined (reading 'nativeElement')
    at volo-abp.ng.account-public.mjs:1758:60
    at timer (zone.js:2367:41)
    at _ZoneDelegate.invokeTask (zone.js:402:31)
    at core.mjs:25893:55
    at AsyncStackTaggingZoneSpec.onInvokeTask (core.mjs:25893:36)
    at _ZoneDelegate.invokeTask (zone.js:401:60)
    at Object.onInvokeTask (core.mjs:26194:33)
    at _ZoneDelegate.invokeTask (zone.js:401:60)
    at Zone.runTask (zone.js:173:47)
    at invokeTask (zone.js:483:34)

Hi

The supplied javascript did not work (as described earlier).

The approach I tried using separate components for the appearance and language on the LeptonX\Top Menu\Main Header resolved the keyboard issues but resulted in an exception in the browser that prevented the User Menu from functioning.

lepton-x.bundle.min.js?_v=638270199920000000:2 Uncaught TypeError: Cannot read properties of null (reading 'parentElement') at t.initChildren (lepton-x.bundle.min.js?_v=638270199920000000:2:43721) at new t (lepton-x.bundle.min.js?_v=638270199920000000:2:41474) at t.create (lepton-x.bundle.min.js?_v=638270199920000000:2:41563) at t.createSettingGroupWithMenu (lepton-x.bundle.min.js?_v=638270199920000000:2:86551) at e [as constructor] (lepton-x.bundle.min.js?_v=638270199920000000:2:68837) at new e (lepton-x.bundle.min.js?_v=638270199920000000:2:71613) at e.create (lepton-x.bundle.min.js?_v=638270199920000000:2:71708) at t.createSettingGroups (lepton-x.bundle.min.js?_v=638270199920000000:2:73132) at t.create (lepton-x.bundle.min.js?_v=638270199920000000:2:72833) at NodeList.forEach (<anonymous>)

I was unable to resolve the issues and have reverted to the framework code for the menus and we have flagged this as a framework issue to our clients.

Here is the approach I took that you can use to recreate the exception ( using 7.3.2) in the Web.Public MVC project:

1. Create a new application with abp suite
2. Create a new Toolbar Appearance Component (in Components\Toolbar\Appearance)
3. Update the Main Header to invoke the Appearance component (in LeptonX\Components\Top Menu\Main Menu)
4. Comment out the General Settings cshtml code (in LeptonX\Components\Top Menu\Main Menu)

Toolbar Appearance Component (...\Components\Toolbar\Appearance\AppearanceViewComponent.cs):

public class AppearanceViewComponent : AbpViewComponent
    {
        public virtual IViewComponentResult Invoke()
        {
            return View("~/Components/Toolbar/Appearance/Default.cshtml");
        }
    }

\Components\Toolbar\Appearance\Default.cshtml:

@using Microsoft.AspNetCore.Mvc.Localization @using Acs.Cts.Portal.Localization @using Microsoft.Extensions.Localization; @using Microsoft.Extensions.Options @using Volo.Abp.AspNetCore.Mvc.UI.Theme.LeptonX @using Volo.Abp.LeptonX.Shared; @using Volo.Abp.Users @inject IOptions<LeptonXThemeOptions> Options @inject IStringLocalizerFactory LocalizerFactory @inject IHtmlLocalizer<PortalResource> L @inject ICurrentUser CurrentUser <li class="outer-menu-item" id="lpx-settings"> <div class="dropdown"> <a href="#" class="lpx-menu-item-link lpx-menu-item" role="button" id="dropdownMenuLink" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-lpx-setting-group="appearance"> <span class="lpx-menu-item-icon" data-lpx-setting-icon="appearance" data-lpx-setting-id="settings-context-menu"> <i class="lpx-icon bi bi-palette-fill" aria-hidden="true"></i> </span> <span class="lpx-menu-item-text">@L["Appearance"]</span> </a> <div class="dropdown-menu dropdown-menu-end" aria-labelledby="dropdownMenuLink" data-lpx-context-menu="settings-context-menu"> <ul class="lpx-nav-menu lpx-inner-menu hidden-in-hover-trigger collapsed" style="align-items:start; display: block;" data-id="appearance"> @foreach (var item in Options.Value.Styles) { <li class="lpx-inner-menu-item"> <a href="javascript:void(0)" class="lpx-menu-item-link lpx-menu-item" data-lpx-setting="@item.Key"> <span class="lpx-menu-item-icon"> <i class="lpx-icon @item.Value.Icon" aria-hidden="true"></i> </span> <span class="lpx-menu-item-text hidden-in-hover-trigger">@item.Value.DisplayName.Localize(LocalizerFactory).Value</span> </a> </li> } </ul> </div> </div> </li>

<br> Main Header (\Themes\LeptonX\Components\TopMenu\MainHeader\Default.cshtml):

@using Acs.Cts.Portal.Web.Components.Toolbar.Appearance; @using Acs.Cts.Portal.Web.Components.Toolbar.Language; @using Volo.Abp.AspNetCore.Mvc.UI.Theme.LeptonX.Themes.LeptonX.Components.Common.MainHeaderBranding @using Volo.Abp.AspNetCore.Mvc.UI.Theme.LeptonX.Themes.LeptonX.Components.TopMenu.MainHeaderToolbar @using Volo.Abp.AspNetCore.Mvc.UI.Theme.LeptonX.Themes.LeptonX.Components.TopMenu.MainMenu &lt;header> &lt;div class="lpx-header-top"> @await Component.InvokeAsync(typeof(MainHeaderBrandingViewComponent)) &lt;nav class="lpx-nav me-auto"> &lt;ul class="lpx-nav-menu"> @await Component.InvokeAsync(typeof(AppearanceViewComponent)) &lt;/ul> &lt;/nav> @await Component.InvokeAsync(typeof(MainHeaderToolbarViewComponent)) &lt;/div> &lt;div class="lpx-header-bottom"> &lt;nav class="lpx-nav"> &lt;ul class="lpx-nav-menu"> @await Component.InvokeAsync(typeof(MainMenuViewComponent)) &lt;/ul> &lt;/nav> &lt;/div> &lt;/header>

General Settings (...\Themes\LeptonX\Components\Common\GeneralSettings\Default.cshtml): @using Microsoft.Extensions.Localization @using Microsoft.Extensions.Options @using Volo.Abp.AspNetCore.Mvc.UI.Theme.LeptonX @using Volo.Abp.AspNetCore.Mvc.UI.Theme.LeptonX.Themes.LeptonX.Components.SideMenu.Toolbar.LanguageSwitch @using Volo.Abp.LeptonX.Shared @using Volo.Abp.LeptonX.Shared.Localization @inject ThemeLanguageInfoProvider ThemeLanguageInfoProvider @inject IOptions&lt;LeptonXThemeOptions> Options @inject IOptions&lt;LeptonXThemeMvcOptions> MvcOptions @inject IStringLocalizer&lt;LeptonXResource> L @inject IStringLocalizerFactory LocalizerFactory @{ var languageModel = await ThemeLanguageInfoProvider.GetLanguageSwitchViewComponentModel(); } @*&lt;div class="lpx-settings" id="lpx-settings"> COMMENTED OUT &lt;/div>*@ Hope that helps. Jamie

<br>

• UI Type: Angular

Hi

I like what you're doing with the lepton-x theme and example components, for example the wizard: https://x.leptontheme.com/side-menu/custom-pages/wizard-horizontal

Are there to develop angular components for these and is the current javascript for the demo pages available?

If there are plans for angular components, can you share a roadmap?

Thanks Jamie