Activities of "sumeyye.kurtulus"

Thank you for the detailed reply. May I also know how I could produce the same problem and whether it is a temporary overlay problem?

It seems working on my side

Thank you for your cooperation.

Hello,

You can achieve this by replacing the top navbar and the navbar components by utilizing this feature: https://abp.io/docs/latest/framework/ui/angular/component-replacement

Here are the keys and the components that you need to implement:

import { TopMenuNavbarComponent } from '@volosoft/ngx-lepton-x/layouts';

@Component({
  selector: 'app-my-top-navbar',
  imports: [TopMenuNavbarComponent],
  template: `<lpx-top-menu-navbar />`,
})
export class MyTopNavbar {}

@Component({
  selector: 'app-my-navbar',
  imports: [],
  template: ``,
})
export class MyNavbar {}

You may need this style override

//angular/src/styles.scss
:root .lpx-header-top {
  justify-content: space-between;
}

Lastly, you need to replace the related components

import { eThemeLeptonXComponents } from '@volosoft/abp.ng.theme.lepton-x';
import { MyNavbar } from './my-navbar/my-navbar';
import { MyTopNavbar } from './my-top-navbar/my-top-navbar';

//...

export class AppComponent {
  private replaceComponent = inject(ReplaceableComponentsService);
  constructor() {
    this.replaceComponent.add({
      component: MyTopNavbar,
      key: eThemeLeptonXComponents.TopNavbar,
    });
    this.replaceComponent.add({
      component: MyNavbar,
      key: eThemeLeptonXComponents.Navbar,
    });
  }
}

Hello,

I could recommend you to try using this key SUPPRESS_UNSAVED_CHANGES_WARNING to override the default behavior for the touched forms as discussed in this thread

// app.module.ts or app.config.ts

providers: [
	{
      provide: SUPPRESS_UNSAVED_CHANGES_WARNING,
      useValue: false,
    }
]

I can also suggest passing these options to the modal you implement

<abp-modal
  <!-- ... -->
  [options]="{
    backdrop: 'static',
    keyboard: false,
  }"
>
<!-- ... -->
</abp-modal>

However, the behavior you’re seeing can be considered normal. In most cases, disabling that setting should allow it to function as expected. For additional details, you can also review the source code here: https://github.com/abpframework/abp/blob/dd192604ac4da609c997daa4d63a16491999d14d/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.ts#L40

Since the mobile view adjusts automatically, you may not be able to turn this off directly.

Hello,

Thank you for providing these details about your problem. I have checked your case and could not produce the same on my end. It is expected to work as the problem mentioned in this ticket is resolved in this PR: https://github.com/abpframework/abp/pull/22853. May I also know whether you still face the garbage query problem on your side and the exact ABP version you are using?

This issue is related to the package manager that you have used since I produced the same problem after using npm instead of yarn. I can suggest you to try again after explicitly adding this dependency

    "@volosoft/abp.ng.theme.lepton-x": "~2.2.2",

This version may be installed in a wrong way

"@volosoft/abp.ng.theme.lepton-x": "^2.2.0",

can you try this instead with ~ that would install the latest patch for this version?

"@volosoft/abp.ng.theme.lepton-x": "~2.2.0",

Thank you for the response. I am glad to hear that the problem is solved.

Thank you for providing a sample. There may be a path resolution problem. So, could you try adding these paths to your tsconfig.json

  "compilerOptions": {
    "paths": {
        "@angular/*":["node_modules/@angular/*"],
        "@abp/*":["node_modules/@abp/*"],
        "@volo/*":["node_modules/@volo/*"],
        "@volosoft/*":["node_modules/@volosoft/*"],
        "@swimlane/*": ["node_modules/@swimlane/*"],
        "@ngx-validate/core":["node_modules/@ngx-validate/core"],
        "@ng-bootstrap/ng-bootstrap": ["node_modules/@ng-bootstrap/ng-bootstrap"],
        "product-service": ["projects/product-service/src/public-api.ts"],
        "product-service/config": ["projects/product-service/config/src/public-api.ts"]
    }
  },

Thank you for providing extra details. I have checked your versions and I did not see anything problematic except this version

"@volosoft/abp.ng.theme.lepton-x": "~4.0." --> should be "~4.0.0"

If this does not solve your problem, you can send a minimal reproducible example through this e-mail address: sumeyye.kurtulus@volosoft.com.

Thank you for your cooperation.

Hello,

Could you please provide version details in your package.json ? May also know whether you have migrated to the new builder system for Angular app?