Login Frontend App for Eka Care

This application is in early development mode.

How to Use Login Frontend App

Follow these steps to use the window.initAuthApp function from the main.tsx file:

1. Include the Required Scripts and Styles: Ensure that you have included the necessary scripts and styles in your HTML file.

   <link rel="stylesheet" href="https://login.eka.care/assets/css/index.css" />
   <script type="module" src="https://login.eka.care/assets/js/lo-fe-main.js"></script>

2. Prepare the Container Element: Create a container element in your HTML where the React app will be mounted.

   <div id="lofe_root"></div>

3. Implement Callback Functions: Define the onSuccess and onError callback functions to handle authentication outcomes.

   onSuccess: This function is called when the authentication is successful. Use it to process the authenticated user's data or redirect them within your application.

   function onSuccess(params) {
     // Handle successful authentication
     console.log('Authentication successful:', params);
     // Redirect user or update UI accordingly
   }

   • @param params - An object containing authentication tokens and the user's profile information.

       {
          response: {
            txn_id: "Transaction id string",
            skip_state: 1,
            method: 2,
            data: {
              tokens: {
                sess: "A string representing the session token.",
                refresh: "A string representing the refresh token.",
              },
              profile: "The user's profile.",
            }
          }
       }

   onError: This function is invoked when there is an error during authentication. Use it to handle errors, display error messages, or perform logging.

   function onError(params) {
     // Handle authentication error
     console.error('Authentication error:', params);
     // Display error message to the user or take corrective action
   }

   • @param params - An object containing authentication error.

     {
       error: 'Error message';
       response: {
            txn_id: "Transaction id string",
            skip_state: 1,
            method: 2,
            error: 'error message from api'
          }
     }

4. Initialize the App: Call the window.initAuthApp function with the required parameters.

   <script>
     window.onload = function () {
       window.initAuthApp({
         clientId: 'your_client_id',
         containerId: 'lofe_root',
         workspaceName: 'your_workspace_name', // Optional
         urlParams: { next_url: 'next_url' }, // Optional
         method: 'email_mobile', // Optional
         onSuccess: function (params) {
           // Handle success
         },
         onError: function (params) {
           // Handle error
         },
       });
     };
   </script>

   window.initAuthApp returns an unmount function to remove the Login app.

5. Close the App: To unmount the Lofe app and clear the store, call the window.closeAuthApp function or the function that is returned by window.initAuthApp

   <script>
     window.closeAuthApp();
   </script>

By following these steps, you can successfully initialize and use the login frontend app for Eka Care.