Update to version 4

[diegodfsd]

After update to version 4 and tried to follow the instructions to extend the CustomConfig I'm get this error message in my building process.

client/src/app/config/auth-config.service.ts(3,14): error TS2415: Class 'MyAuthConfig' incorrectly extends base class 'CustomConfig'.
  Types of property 'providers' are incompatible.
    Type '{ google: { clientId: string; }; }' is not assignable to type 'IProviders'.
      Index signature is missing in type '{ google: { clientId: string; }; }'.

This is my auth settings class

import { CustomConfig } from 'ng2-ui-auth';

export class MyAuthConfig extends CustomConfig {
    baseUrl = 'http://localhost:3000';
    defaultHeaders = { 'Content-Type': 'application/json' };
    tokenPrefix = 'locaoffice';
    loginUrl =  '/api/sessions';
    signupUrl = '/api/users';
    providers = {google: {clientId: ''}};
}

I don't know where is the problem.

[ronzeidman]

microsoft/TypeScript#1887
microsoft/TypeScript#6118
In short, it's a typescript issue... You'll have to add a : { [provider: string]: IProvider } or : any to the providers property

[diegodfsd]

@ronzeidman Thanks for your reply. Do you know why this is happening? In your sample you don't do explicit convert. In case ng2-ui-auth types is registered in typings this could be solved without use an explicit convert?

[sumit10]

Hi i have same issue please help I have tried using : any to the providers property i am getting this error core.umd.js:3433Error: Uncaught (in promise): Error: Error in ./AuthComponent class AuthComponent_Host - inline template:0:0 caused by: No provider for AuthService!

[ronzeidman]

"No provider for AuthService" means that you didn't provide the Ng2UiAuthModule to your base module. Can you share how you initialize your main module?

[sumit10]

@ronzeidman sorry my bad that issue was from my side now it is resolved.

[ronzeidman]

Updated the readme... I'll try to fix this later... it will probably be a breaking change though (I'll use an interface instead of a class for it...)

[ronzeidman]

@diegodfsd I can't seem to be able to reproduce the type issue, what typescript version are you using?

[diegodfsd]

@ronzeidman I was using version 1.8.10 and now I update to 2.03 but the error continue if I remove the explicit conversion.

client/src/app/app.module.ts(35,39): error TS2345: Argument of type 'typeof MyAuthConfig' is not assignable to parameter of type 'Type<CustomConfig>'.
  Type 'MyAuthConfig' is not assignable to type 'CustomConfig'.
    Types of property 'providers' are incompatible.
      Type '{ google: { clientId: "*************"...' is not assignable to type 'IProviders'.
        Index signature is missing in type '{ google: { clientId: "**********"...'.
client/src/app/config/auth-config.ts(5,14): error TS2415: Class 'MyAuthConfig' incorrectly extends base class 'CustomConfig'.
  Types of property 'providers' are incompatible.
    Type '{ google: { clientId: "**********"...' is not assignable to type 'IProviders'.
      Index signature is missing in type '{ google: { clientId: "************"...'.

[ronzeidman]

What's your tsconfig.json?

[diegodfsd]

My tsconfig.json

{
  "compilerOptions": {
    "rootDir": "client/src/app",
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "client/config",
    "node_modules",
    "typings/main",
    "typings/main.d.ts",
    "typings/globals/node",
    "typings/globals/core-js"
  ],
  "compileOnSave": false
}

[ronzeidman]

Can you try with version 4.1.0 typescript 2.0.3 and use @types/ instead of typings?

[diegodfsd]

@types? How do I use it?

[ronzeidman]

Remove typings library and install typings from npm: npm i -D @types/<your lib name> no more configuration should be needed (it's one of the major updates of ts2)

[diegodfsd]

@ronzeidman I tried install as you recommended but something went wrong.

$ npm i -D @types/ng2-ui-auth
npm ERR! Darwin 16.0.0
npm ERR! argv "/Users/diego/.nvm/versions/node/v6.3.1/bin/node" "/Users/diego/.nvm/versions/node/v6.3.1/bin/npm" "i" "-D" "@types/ng2-ui-auth"
npm ERR! node v6.3.1
npm ERR! npm  v3.10.3
npm ERR! code E404

npm ERR! 404 Not found : @types/ng2-ui-auth
npm ERR! 404 
npm ERR! 404  '@types/ng2-ui-auth' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404 
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

npm ERR! Please include the following file with any support request:
npm ERR!     /npm-debug.log

Do you have any idea about what's happening?

[ronzeidman]

@types like typings is only required for JS libraries. TS libraries have their type definitions built-in

[diegodfsd]

make sense. so do you have an alternative to avoid explicit conversion?

[ronzeidman]

It shouldn't be an issue... I gave you my settings and they don't reproduce the issue

[diegodfsd]

are you sure? because I'm just install your package like I did with othera and only with ng2-ui-auth I got this error. Are you import your package directly from source or from npm install?

[ronzeidman]

npm install. Try to compile the https://github.com/ronzeidman/ng2-ui-auth-example

[ronzeidman]

try adding the following to your tsconfig: "suppressImplicitAnyIndexErrors": true

[diegodfsd]

@ronzeidman I tried change my tsconfig.json but when I remove the explicit conversion I get this error messages:

client/src/app/app.module.ts(36,39): error TS2345: Argument of type 'typeof MyAuthConfig' is not assignable to parameter of type 'Type<CustomConfig>'.
  Type 'MyAuthConfig' is not assignable to type 'CustomConfig'.
    Types of property 'providers' are incompatible.
      Type '{ google: { clientId: string; scope: string[]; }; facebook: { clientId: string; scope: string[]; ...' is not assignable to type 'IProviders'.
        Index signature is missing in type '{ google: { clientId: string; scope: string[]; }; facebook: { clientId: string; scope: string[]; ...'.
client/src/app/config/auth-config.ts(5,14): error TS2415: Class 'MyAuthConfig' incorrectly extends base class 'CustomConfig'.
  Types of property 'providers' are incompatible.
    Type '{ google: { clientId: string; scope: string[]; }; facebook: { clientId: string; scope: string[]; ...' is not assignable to type 'IProviders'.
      Index signature is missing in type '{ google: { clientId: string; scope: string[]; }; facebook: { clientId: string; scope: string[]; ...'.

I don't have ideia what's the problem. I have changed my tsconfig to include some keys that I took from ng2-ui-auth-example but the errors persist. I don't know if this could be the problem, but I'm using gulp + systemjs while you are using webpack.

This is my tsconfig.json

{
  "compilerOptions": {
    "rootDir": "client/src/app",
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "noEmitHelpers": true,
    "declaration": false,    
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "suppressImplicitAnyIndexErrors": true
  },
  "exclude": [
    "client/config",
    "node_modules",
    "typings/main",
    "typings/main.d.ts",
    "typings/globals/node",
    "typings/globals/core-js"
  ],
  "compileOnSave": false
}

My configuration

import { CustomConfig } from 'ng2-ui-auth';

import { ConfigService } from './config.service';

export class MyAuthConfig extends CustomConfig {
    defaultHeaders: { [name: string]: string; } = { 'Content-Type': 'application/json' };
    baseUrl = ConfigService.BASE_ADDRESS;
    tokenPrefix = 'locaoffice';
    loginUrl = '/api/sessions';
    signupUrl = '/api/users';
    providers: { [provider: string]: any } = {
        google: {
            clientId: '***********',
            scope: ['profile',
                'email'
            ]
        },
        facebook: {
            clientId: '*********',
            scope: ['public_profile',
                'email'
            ]
        }
    };
}

When I run the ng2-ui-auth-example everything works fine.

[ronzeidman]

I have no idea.
I'll leave this open if so I'll look into it further in the future. in the meantime try:

export class MyAuthConfig extends CustomConfig {
    defaultHeaders: { [name: string]: string; } = { 'Content-Type': 'application/json' };
    baseUrl = ConfigService.BASE_ADDRESS;
    tokenPrefix = 'locaoffice';
    loginUrl = '/api/sessions';
    signupUrl = '/api/users';
    providers = <any>{
        google: {
            clientId: '***********',
            scope: ['profile',
                'email'
            ]
        },
        facebook: {
            clientId: '*********',
            scope: ['public_profile',
                'email'
            ]
        }
    };
}

That should resolve the error

[ronzeidman]

If anyone can provide a solution I'll be happy to accept, in the meantime I'm closing since there is a workable workaround.