Activities of "sumeyye.kurtulus"

• ABP Framework version: 9.0
• UI Type: Angular

Thanks for reaching out! I understand the frustration, and let's resolve this step by step.

First error:

[Invalid Module] Backend module "CoreService" does not exist in API definition.

• This suggests that CoreService is not defined in the API.
• Check CoreServiceRemoteServiceConsts.cs for the correct module name and update your command accordingly.

Second error:

[Project Not Found] Either define a default project in your workspace or specify the project name in schematics options.

• This happens when the Angular CLI can't find the project.
• Verify the project name in angular.json

 "projects": {
    "ticket8665": {
      "projectType": "application",
      ...
      "root": "projects/ticket8665",
      "sourceRoot": "projects/ticket8665/src",
      "prefix": "app",
      ...
    },
    "my-service-1": {
      "projectType": "library",
      "root": "projects/my-service-1",
      "sourceRoot": "projects/my-service-1/src",
      "prefix": "lib",
      ...
    },
    "my-service-2": {
      "projectType": "library",
      "root": "projects/my-service-2",
      "sourceRoot": "projects/my-service-2/src",
      "prefix": "lib",
      ...
    }
  }

For reference, here’s a sample project. If issues persist, please share your API definition and error screenshot so we can assist further.

Could you also try replacing the component like this https://abp.io/docs/latest/framework/ui/angular/component-replacement#how-to-replace-a-component

import { ReplaceableComponentsService } from '@abp/ng.core';
import { Component, inject } from '@angular/core';
import { eThemeLeptonXComponents } from '@volosoft/abp.ng.theme.lepton-x';
import { MySettingsComponent } from './my-settings/my-settings.component';

@Component({
  selector: 'app-root',
  template: `
    <abp-loader-bar></abp-loader-bar>
    <abp-dynamic-layout></abp-dynamic-layout>
    <abp-gdpr-cookie-consent></abp-gdpr-cookie-consent>
  `,
})
export class AppComponent {
  private replaceComponent = inject(ReplaceableComponentsService);
  constructor() {
    this.replaceComponent.add({
      component: MySettingsComponent,
      key: eThemeLeptonXComponents.Toolbar,
    });
  }
}

Hello again, I understand your frustration regarding the ticket closure. We are continuously working on improving our processes, including refining our support automation to prevent premature closures.

As for the React Native templates, the work is in progress, and we appreciate your patience and cooperation. If you need any further updates or have any concerns, feel free to reach out—we are happy to assist.

I'm using abp-nav-items
in the abp-nav-items I have the logout button so now do I need to write custom component for SSO to logout?

because I need to add logout logic in this button

Logout process should also require another custom logic. Here is how you can manage that part:

import { UserMenuService } from '@abp/ng.theme.shared';
import { eUserMenuItems } from '@volosoft/abp.ng.theme.lepton-x';
import { APP_INITIALIZER, inject, NgModule } from '@angular/core';

@NgModule({
  ...
  providers: [
    ...
    { provide: APP_INITIALIZER, useFactory: userMenuFactory },
    ...
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

function userMenuFactory() {
  const userMenu = inject(UserMenuService);

  userMenu.patchItem(eUserMenuItems.Logout, {
    action: () => {
      console.log('Custom logout action');
    },
  });
}

Hi I'm going to write this custom guard, correct me if i'm wrong, thanks.

import { Injectable } from '@angular/core'; import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router, } from '@angular/router'; import { Observable } from 'rxjs'; import { OktaAuthService } from './okta-auth.service'; // Your OktaAuthService import { OAuthService } from 'angular-oauth2-oidc'; // ABP's OAuthService

@Injectable({ providedIn: 'root', }) export class CustomAuthGuard implements CanActivate { constructor( private oktaAuthService: OktaAuthService, private oAuthService: OAuthService, private router: Router ) {}

canActivate( route: ActivatedRouteSnapshot, state: RouterStateSnapshot ): Observable<boolean> | Promise<boolean> | boolean { return this.checkAuthentication(state.url); }

private async checkAuthentication(returnUrl: string): Promise<boolean> { const isOktaAuthenticated = await this.oktaAuthService.isAuthenticated(); const hasValidAccessToken = this.oAuthService.hasValidAccessToken();

if (isOktaAuthenticated || hasValidAccessToken) { 
  return true; 
} else { 
  // Redirect to your custom login page or handle unauthenticated access 
  this.router.navigate(['/login'], { queryParams: { returnUrl } }); 
  return false; 
} 

} }

Hello again, your implementation is correct, but using both OktaAuthService and OAuthService might be redundant unless your app requires multiple authentication providers (e.g., Okta for some users and OAuth2 for others).

If both services are needed, consider abstracting authentication logic into a single service to simplify maintenance. Otherwise, removing the unnecessary check can reduce complexity.

The authGuard also utilizes the angular-oauth2-oidc library, as I mentioned earlier. You can refer to the implementation here: https://github.com/abpframework/abp/blob/dev/npm/ng-packs/packages/oauth/src/lib/guards/oauth.guard.ts

Since authGuard follows the logic of this library, you may need to adjust or replace it based on your specific authentication flow.

Regarding permissionGuard, it should not cause any issues. Could you verify your logic and let me know if the issue persists?

I'm thinking you are saying like this below

async hasLoggedIn(): Promise<boolean> { const authStatus = await this.oktaAuth.isAuthenticated(); return authStatus || this.oAuthService.hasValidAccessToken(); }

this.authService.hasLoggedIn().then(isLoggedIn => {

});

Yes, this is what I mean.

For the granted policies response that you shared, the okta library should not cause a problem. However, I did not see <MyProjectName>.Dashboard.Host and <MyProjectName>.Dashboard.Tenant permissions that is checked by the guard. Is this right?

I am assuming that oAuthService is from angular-oauth2-oidc library. So, you should be able to use this as you have mentioned at the beginning

    this.oktaAuth.isAuthenticated().then(async (authStatus) => {
        if (authStatus) {
            // Authenticated successfully
        }
    });

Hello, yes you are right. You will need to handle this part according to the library you use.

The permission guard only checks the required permissions that you give for the route. However, dashboard component checks for MyProjectName.Dashboard.Host and MyProjectName.Dashboard.Tenant permissions exceptionally.

Here is the reference for the check: https://github.com/abpframework/abp/blob/2201ee1c349da9dff2a0a333434e660f436b0851/npm/ng-packs/packages/core/src/lib/guards/permission.guard.ts#L47