Sidenav

Configure seu menu, utilizando informações do token ou as que desejar após a autenticação do usuário ou libere para acesso público utilizando o componente de Sidenav do Cat UI

Uso

import { Injectable } from "@angular/core";
import { AppConfigMenu,CatAppDecodedToken } from "@catrx/ui";
import { Observable } from 'rxjs/internal/Observable';

@Injectable({ providedIn: 'any' })
export class UserService {

  public getMenu(decodedToken: CatAppDecodedToken) {
    return new Observable<AppConfigMenu>((observe) => {
      observe.next({
        modules: [
          {
            icon: 'fa-solid fa-database',
            name: 'Exibição de Dados',
            tools: [
              {
                name: 'Datatable',
                hasPermission: () => !!decodedToken,
                routerLink: './components/datatable',
              },
              {
                name: 'Componentes Dinâmicos',
                hasPermission: () => !!decodedToken,
                routerLink: './components/dynamic-components',
              },
            ],
          },
          {
            icon: 'fa-brands fa-wpforms',
            name: 'Formulário',
            tools: [
              {
                name: 'Formulário Dinâmico',
                hasPermission: () => true,
                routerLink: './components/form',
              },
            ],
          },
        ],
      });
    });
  }
}

app.component.ts

import { Component } from '@angular/core';
import { CatAppService } from '@catrx/ui';
import { CatDynamicComponent } from '@catrx/ui/dynamic-component';
import { UserService } from './user.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent {
  appConfig = this.appService
    .build('Cat UI', { ... },
      onAuth: (decodedToken) => this.userService.getMenu(decodedToken),
    })
    .generate();

  constructor(
    private appService: CatAppService,
    private userService: UserService) {}
}