# Claims (Optional)

O sistema de Claims permite armazenar em memória dados sensíveis do usuário, que precisam ser utilizados, porém, não podem ser amazenados em storage.

Exemplos de dados que podem ser armazenados são, permissões, perfil, email e outros dados internos e que você poderá acabar utilizando para construção de seu menu.

{% hint style="info" %}
Esta implementação será apenas necessária em casos de autenticação do tipo JWT.

Autenticação utilizando a estratégia [OpenID](https://doc.catui.igordrangel.com.br/comece-por-aqui/4.-seguranca/openid-opcional) já possui o carregamento e inclusão dos dados de **Claims** nativamente.
{% endhint %}

### Uso

{% hint style="info" %}
Em caso de erro ao objeter o claims de sua API, o Cat UI já irá exibir um layout padrão para estes casos, permitindo o logout e uma nova tentativa de acesso.

Para simulação deste caso, basta alterar na *linha 12* do exemplo abaixo o método **next** para **error**.
{% endhint %}

{% code lineNumbers="true" %}

```typescript
import { Injectable } from '@angular/core';
import { AppConfigMenu, AppNotification, CatAppDecodedToken, CatRoutePolice } from '@catrx/ui';
import { Observable } from 'rxjs/internal/Observable';

@Injectable({ providedIn: 'any' })
export class AppService {
  ...
  
  public getClaims() {
    return new Observable(observe => {
      setTimeout(() => {
        observe.next({ profile: 2 });
        observe.complete();
      }, 1000);
    });
  }
}
```

{% endcode %}

{% code title="app.component.ts" lineNumbers="true" %}

```typescript
export class AppComponent {
  appConfig = this.catAppService
    .build('Cat UI', {
      autoAuth: true,
      startedPage: '/examples/crud-page',
      jwt: {
        loginComponent: LoginComponent,
        claims: this.appService.getClaims()
      },
      onAuth: (decodedToken) => this.appService.getMenu(decodedToken),
    })
    .setLogotype({
      default: '../assets/logotype.svg',
      negative: '../assets/logotype-negative.svg',
    })
    .enableDarkMode()
    .generate();

  constructor(
    private catAppService: CatAppService,
    private appService: AppService
  ) {}
}
```

{% endcode %}