Velt supports self-hosting your users’ personally identifiable information (PII):

  • Only the userId is stored on Velt servers, keeping sensitive user metadata on your infrastructure
  • Velt Components automatically hydrate user details in the frontend by fetching from your configured data provider
  • This gives you full control over user data while maintaining all Velt functionality

​
How does it work?

  • When the SDK is initialized, it will call the UserDataProvider you configure with the list of userIds that it needs to fetch for the currently set user, organization, document, etc.
  • The UserDataProvider takes in a list of userIds and returns a Record object with the userIds as keys and the user data as values.

Here are the methods that you need to implement on the data provider:

​
get

Method to fetch users from your database.

  • Param: string[]: Array of userIds to fetch
  • Return: Promise<Record<string, User>>

​
Example Implementation

const formatUsersToRecord = (users) => {
    // Format users array into a Record object with userId as key and user data as value
    return users.reduce((record, user) => {
        record[user.userId] = {
            userId: user.userId,
            name: user.name,
            // any other fields
        };
        return record;
    }, {});
};

const fetchUsersFromDB = async (userIds) => {
    // Fetch users from your DB
    const usersData = await __getUsersFromYourDB__(userIds);
    return formatUsersToRecord(usersData);
};

const userDataProvider: UserDataProvider = {
    get: fetchUsersFromDB
};

<VeltProvider 
    apiKey='YOUR_API_KEY'
    dataProviders={{
        user: userDataProvider
    }}
>
</VeltProvider>

Was this page helpful?