AnnaCognitoLib

How to use the library in the consuming project ?

1. Install the package from npm npm install @annalib/anna-cognito-lib (if not working use with --force flag).
2. After installing the Library, you need to install it's peer dependancies. You can find the peer-dependecies in package.json file of library. Install all the peer depedencies with respective version number mentioned. this is important step otherwise library will throw error. ex: npm install [email protected]
3. Also make sure to Install the Roboto font locally in assets folder of your consuming project.

If using the library locally (library from your system locally not npm),then in angular json file you have to set preserveSymlinks: true.

Adding Configuration

1. import the AnnaCognitoLibModule module and pass the configuration to root AnnaCognitoLibModule.forRoot(appGenericConfig)
2. configuration const should be:

      cognito : {
        userPoolId: "",
        clientId: "",
      },
      loginPageLogoImgUrl: ""
    } ```

3. Keep the logo image in consuming project and provide the path for loginPageLogoImgUrl. ex: "assets/images/Anna-Logo.png" Note: for better loading of logo image, provide logo image in minified format.

Adding new custom function implemetation for any service file.

1. Background Understanding - when we want to provide custom implemenetation - We write the custom implementation in a service file of consuming project and that is injected in the library. Injection is taken care by library itself. You just need to provide the definition and implementation of new function added.
2. Ex: let's say we want to add a new function `onSuccessfulAuthenticatingUser() this function is called from library when user is succesfully authenticated and logged in. (Note: this function is already present in lib).
3. Then In library add the new function declaration onSuccessfulAuthenticatingUser() in interface file IAuthService of auth-service.token.ts file.
4. In consuming project, for onSuccessfulAuthenticatingUser() provide the implementation in the service file say AuthService of auth.service.ts.
5. Then In consuming project, app.module.ts file add following in providers array. { provide: AUTH_SERVICE_TOKEN, useExisting: AuthService } i.e. your consuming project's existing AuthService will be injected in Library's auth-service file with the help of AUTH_SERVICE_TOKEN.
6. Now you're good to go!

List of function implementation we need to provide in consuming project.

1. onSuccessfulAuthenticatingUser() - provide the implementation of what happens when user is succefully logged in. (any API call or routing you need to provide).
2. isUsernameAvailable() - in thie implementation call an backend API to find out if username is already present in Database or not. format of response should be {"isUsernameAvailable":true}. This is used in forgot-password page before calling forgot-password cognito sdk call, we need to check thorough backend db if the username is actually available.
3. isLoggingIn - set this variable to false. this will stop the spinner on top on button. use case: after successful login i.e. when we are done with all API call we need to call post succesfull calling or when we have routed to home page.

How to make changes in library and build it

1. Make the changes and Run ng build anna-cognito-lib to build the project.
2. The build artifacts will be stored in the dist/ directory.

Publishing

After building your library with ng build anna-cognito-lib, go to the dist folder cd dist/anna-cognito-lib and run npm publish.