To manage team members across neeto products.
npm install @bigbinary/neeto-team-membersneetoTeamMembers is the library that manages team members across neeto products.
1. neetoTeamMembers has a few peer dependencies that are required for the proper
functioning of the package. Install all the peer dependencies using the below
command:
``zsh`
yarn add @bigbinary/neeto-commons-frontend@2.0.1 @bigbinary/neeto-icons@1.8.37 @bigbinary/neetoui@3.5.15 axios@0.27.2 classnames@2.3.1 formik@2.2.9 ramda@0.28.0 react-router-dom@5.3.3 react-toastify@9.0.8 yup@0.32.11
2. Now install the latest neetoTeamMembers package using the below command:
`zsh`
yarn add @bigbinary/neeto-team-members@2.2.3
`jsx
import React from "react";
import { Roles, TeamMembers } from "@bigbinary/neeto-team-members";
import { BrowserRouter, Redirect, Route, Switch } from "react-router-dom";
import { ToastContainer } from "react-toastify";
import SideBar from "./components/Common/SideBar";
const App = () => (
);
export default App;
`
By default TeamMembers and Roles component will render without the config prop.
Some of the configurations that are available for TeamMembers components are:
- To toggle the Manage Roles button visibility in the right sub-header, please provide the roles button props as below. It uses the same props as neetoUI Button component.
`js`
const MEMBERS_CONFIG = {
rolesButtonProps: {
to: "/roles",
},
};
- To override the activation and deactivation alert box title or message, please use the below configuration.
`jsYou are deactivating member ${member?.name}. Are you sure you want to proceed?
const MEMBERS_CONFIG = {
alert: {
title: member =>
member.active ? "Deactivate member" : "Activate member",
message: member =>
member.active
?
: ,`
},
}
Some of the configurations that are available for Roles components are:
- (Deprecated) To specify the location for the members page in the neetoUI Header component's breadcrumb, use the below configuration.
`js`
const ROLES_CONFIG = {
membersPageUrl: "/members",
};
- To specify the neetoUI Header component's breadcrumb, use the below configuration.
`js`
const ROLES_CONFIG = {
header: {
breadcrumbs: [
{
text: "Settings",
link: "/settings",
},
],
},
};
1. Install all the dependencies by executing the following command
`zsh`
yarn install
2. See the changes in the example app by executing the following command:
`zsh`
yarn dev
The neetoTeamMembers package gets auto-published to NPM for every new merge to the
master branch. You can checkout the publish` workflow in GitHub Actions to get a
live update.
| Projects | Integrated | Projects | Integrated |
|--------------------| :----------------: |-----------------| :----------------: |
| neetoAnalytics | :white_check_mark: | neetoQuiz | :white_check_mark: |
| neetoCal | :white_check_mark: | neetoReplay | :white_check_mark: |
| neetoChangelog | :white_check_mark: | neetoRunner | :white_check_mark: |
| neetoCourse | :white_check_mark: | neetoStore | :white_check_mark: |
| neetoCRM | :white_check_mark: | neetoTestify | :white_check_mark: |
| neetoEngage | :white_check_mark: | neetoWheel | :white_check_mark: |
| neetoForm | :white_check_mark: | neetoWireframe | :white_check_mark: |
| neetoGrow | :white_check_mark: | neetoAuth | :x: |
| neetoInvisible | :white_check_mark: | neetoChat | :x: |
| neetoKB | :white_check_mark: | neetoDesk | :x: |
| neetoPlanner | :white_check_mark: | neetoInvoice | :x: |
| neetoPopups | :white_check_mark: | | |