Account SDK

The @sdk/account library simplifies user account management within your application, offering functionalities to sign up new users, manage user account data, and enforce access management based on user roles.

Features

User Signup: Streamline the process of creating new user accounts.
Account Data Management: Provides a framework for updating and maintaining user account information.
Role-Based Access Management: Enforce access controls within your application based on user roles.

Note: For signing in users and handling identities, please use the @sdk/auth library.

Installation

To install this package, you need to have access to the private @sdk npm scope.

To install the library, run the following command in your project directory:

npm install @sdk/account

This command adds the necessary package to your project, allowing you to integrate advanced account management features.

Using with Vanilla JavaScript/TypeScript

Here's how to set up and use the AccountService for managing user accounts in a Vanilla JavaScript or TypeScript project:

import { Account, AccountService, UserMapper, CompanyAccountMapper } from '@sdk/account';
import config from './myConfig'; // Of type Config.Config from @sdk/config
import authService from './myAuthService'; // Of type Auth.AuthserviceInterface from @sdk/auth
import connectClient from './myConnectClient'; // Of type Connect.ConnectClientInterface from @sdk/connect
 
// Initialize the AccountService with necessary dependencies
const accountService = new AccountService(
  new UserMapper(config, new CompanyAccountMapper()),
  authService,
  connectClient
);
 
// Retrieve the current user's account information
const currentUser = await accountService.getCurrentUser();
 
// Check if the current user is authenticated
if (Account.isAuthenticatedUser(currentUser)) {
  // Execute actions for authenticated users
}

Integration with React

To integrate account management with your React application, first, install the React-specific package:

npm install @sdk/account-react react react-dom

Then, wrap your app with the AccountProvider to make account services accessible throughout your component tree:

import { AccountProvider } from '@sdk/account-react';
import accountService from './myAccountService'; // Import your account service instance
 
function App() {
  return (
    <AccountProvider accountService={accountService}>
      <Component />
    </AccountProvider>
  );
}
 
function Component() {
  const { currentUser, accountService } = useAccount();
  // Now you can handle the current user and account service as needed
}

Enforcing Access Restrictions in React

The library provides React components to enforce access restrictions based on authentication status and user roles:

Restrict Access to Authenticated Users

import { AccessRestriction } from '@sdk/account-react';
 
function AccessRestrictedPage() {
  return (
    <AccessRestriction
      requiresAuthenticatedUser
      requiresOneAccountRoleOf={['ACCOUNT_ADMIN']}
      onUnauthorized={reason => {
        if (reason === 'UNAUTHENTICATED') {
          redirectToAuthenticationPage('/login');
        } else {
          router.push('/');
        }
      }}
    >
      <SensitivePage />
    </AccessRestriction>
  );
}

Restrict Access to Anonymous Users

import { AnonymousRequired } from '@sdk/account-react';
 
function AnonymousPage() {
  return (
    <AnonymousRequired onAuthorized={() => router.redirect('/dashboard')}>
      <PublicOnlyPage />
    </AnonymousRequired>
  );
}

Auth Notification