Histórico da Página

...

Consideramos este passo o mais importante, aqui é onde iremos configurar uma única instância da classe MingleService e ela funcionará por toda a sua aplicação. 

Utilizando o comando $ "ng generate service appinitservice" do Angular CLI, criamos um serviço AppInitService e nele realizamos a seguinte implementação: 

import { Injectable } from '@angular/core';
import { MingleService, Configuration } from '@totvs/mingle';
@Injectable()
export class AppInitService {
 
 constructor(private mingleService: MingleService) { }
 
 mingleConfiguration(): Promise<any> {
   return new Promise((resolve, reject) => {
     console.log("Mingle Service Configuration called");
     const config = new Configuration();
     config.modules.web = true;
     config.environment = 'DEV';
     config.modules.usage_metrics = true;
     config.modules.gateway = true;
     config.modules.push_notification = true;
     config.server = 'https://dev-mingle.totvs.com.br/api'
     config.app_identifier = 'identificadorDoAplicativo'
 
     this.mingleService.setConfiguration(config);
    
     this.mingleService.init()
     .then( init => {
       resolve('Mingle Service Init');
     }).catch(error => {
       console.log("error" , error);
      
       reject(error);
     });  
	console.log("Mingle Service configuration completed");  
   });
 }}

Observação: O framework Angular foi utilizado para este tutorial, mas pode ser qualquer plataforma escrita com Typescript

Agora vamos analisar os trechos mais importantes do código acima:

...

Para definir qual servidor do Mingle será utilizado:

Existem três servidores, sendo eles: 

...

Como neste exemplo ainda estamos desenvolvendo, vamos utilizar o ambiente "Mingle Development": 

• config.server = 'https://dev-mingle.totvs.com.br/api'
• config.environment = 'DEV'

Para utilizar o ambiente Staging

• config.server = 'https://hom-mingle.totvs.com.br/api'
• config.environment = 'HOM'

Para utilizar o ambiente Production

• config.server = 'https://mingle.totvs.com.br/api'
• config.environment = 'PROD'

Após finalizar a configuração de acordo com as regras da sua aplicação, chame a função setConfiguration() da classe mingleService passando a sua configuração anterior:

...

export function initializeApp1(appInitService: AppInitService) {
  return (): Promise<any> => { 
    return appInitService.mingleConfiguration();
  }
}

...

 2- Crie um provide para realizar o APP_INITIALIZER que será responsável por executar as configurações realizadas no tópico anterior

3- Realize a importação das classes declaradas em providers

providers: [
  AppInitService,
  MingleService,
  { provide: APP_INITIALIZER, useFactory: initializeApp1, deps:[AppInitService], multi: true},
  {provide: HTTP_INTERCEPTORS, useClass: MingleHttpInterceptor, multi: true}
]
],

Agora basta compilar a aplicação e acompanhar o terminal de logs.

Para essa aplicação utilizamos o comando: $ng   $ "ng serve"

Em caso de compilação e configuração positiva, sem erros, no console do seu navegador será Caso  no terminal seja apresentada a mensagem:  "Mingle Service configuration completed", sua configuração inicial deu certo. 

Acompanhe os próximos tópicos desta documentação para começar a desenvolver a aplicação utilizando o Mingle, como por exemplo realizar uma autenticação ou uma requisição de API  utilizando a segurança que o gateway do Mingle proporciona.

...