Pwc-login-library NPM

login-library

A professional React library for handling login functionality.

Install

npm install --save login-library

Usage

This is a basic login form which can be triggered upon calling {LoginForm} from the library and can be used for authentication purpose by user given configurable gateways and api endpoints. This is an example of implementing the library in a basic app.

import { LoginForm } from 'login-library';

const App = () => {
  return (
    <div>
      <h1>Welcome to My App</h1>
      <LoginForm onLogin={(username) => console.log(`Logged in as ${username}`)} />
    </div>
  );
};

export default App;

Configuration

The library accepts a configuration object as a prop. You can customize the behavior by passing a config prop to the LoginForm component:

Create a config.js file in the root of your project:

// config.js

const authConfig = {
    gatewayConfig: 'microservice',
    microserviceApiUrl: 'http://your-auth-url',
    // Add any other required microservice-specific configurations...
  };
  
  export default authConfig;

Use the authConfig in your application:

import { LoginForm } from 'login-library';
import authConfig from './config'; // Adjust the path based on your project structure

const App = () => {
  const handleLogin = (username) => {
    console.log(`Logged in as ${username}`);
    // Add your logic for handling successful login
    // For example, navigate to another page, fetch user data, etc.
    // You can also trigger other side effects or actions here.
  };

  return (
    <div>
      <h1>Welcome to My App</h1>
      <LoginForm onLogin={handleLogin} config={authConfig} />
    </div>
  );
};

export default App;

Expected Outcome

Successful Login:

Upon successful login, the handleLogin function is called.
You should see a log message indicating the successful login.
Customize the handleLogin function to perform actions such as navigation to another page, fetching user data, etc.