User Invites UI Components

ℹ️

Before you can use these UI Components, RoqProvider needs to be installed.

`<UserInviteButton />`

Description

The <UserInviteButton /> component renders a button which opens a lightbox. The user can then invite other users.

Integration

You can integrate the <UserInviteButton/> component using this code:

import { UserInviteButton } from '@roq/ui-react';
 
function App() {
    return (
        <UserInviteButton
            onInviteError={function noRefCheck(){}}
            onInviteSuccess={function noRefCheck(){}}
        />
    );
}

Prop	Type	Description
`onInviteError`	`function(error)`	Error callback when sending the invite fails.
`onInviteSuccess`	`function(data)`	Success callback when sending the invite success.

User Invite Pane UI Component

`<UserInvitePane />`

Description

The <UserInvitePane /> component renders a pane that allows to invite one or multiple users at once. This component support locales.

Integration

You can integrate the <UserInvitePane/> component using this code:

import { UserInvitePane } from '@roq/ui-react';
 
function App() {
    return (
        <UserInvitePane locale={'de-DE'}
            onInviteError={function noRefCheck(){}}
            onInviteSuccess={function noRefCheck(){}}
        />
    );
}

The email sent to the invitee is based on the locale property of the <UserInvitePane/> component. Make sure the email template for the local is exist in the ROQ Console.

`<UserInvitesTable />`

Description

The <UserInvitesTable /> component renders all related components at once. Users can invite other users and manage their invitees in a table. This component support locales property.

user invites table screenshot

Integration

You can integrate the <UserInvitesTable/> component using this code:

import { UserInvitesTable } from '@roq/ui-react';
 
function App() {
    return (
        <UserInvitesTable locale={'en-US'}/>
    );
}

API Overview