local-it/dashboard
Archived
0
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Added roles support

Browse source
This commit is contained in:
Valentino K 2022-05-17 11:52:08 +02:00
parent 2b00c8425d
commit da9eedc94e
17 changed files with 390 additions and 250 deletions
Download patch file Download diff file Expand all files Collapse all files

57
src/modules/users/Users.tsx
View file

@ -5,6 +5,7 @@ import { CogIcon, TrashIcon } from '@heroicons/react/outline';
import { useUsers } from 'src/services/users';
import { Table } from 'src/components';
import { debounce } from 'lodash';
import { useAuth } from 'src/services/auth';
import { UserModal } from './components/UserModal';
export const Users: React.FC = () => {
@ -13,6 +14,7 @@ export const Users: React.FC = () => {
const [userId, setUserId] = useState(null);
const [search, setSearch] = useState('');
const { users, loadUsers, userTableLoading } = useUsers();
const { isAdmin } = useAuth();
const handleSearch = (event: any) => {
setSearch(event.target.value);
@ -60,23 +62,27 @@ export const Users: React.FC = () => {
Cell: (props: any) => {
const { row } = props;
return (
<div className="text-right lg:opacity-0 group-hover:opacity-100 transition-opacity">
<button
onClick={() => configureModalOpen(row.original.id)}
type="button"
className="inline-flex items-center px-4 py-2 border border-gray-200 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500"
>
<CogIcon className="-ml-0.5 mr-2 h-4 w-4" aria-hidden="true" />
Configure
</button>
</div>
);
if (isAdmin) {
return (
<div className="text-right lg:opacity-0 group-hover:opacity-100 transition-opacity">
<button
onClick={() => configureModalOpen(row.original.id)}
type="button"
className="inline-flex items-center px-4 py-2 border border-gray-200 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500"
>
<CogIcon className="-ml-0.5 mr-2 h-4 w-4" aria-hidden="true" />
Configure
</button>
</div>
);
}
return null;
},
width: 'auto',
},
],
[],
[isAdmin],
);
const selectedRows = useCallback((rows: Record<string, boolean>) => {
@ -88,16 +94,19 @@ export const Users: React.FC = () => {
<div className="max-w-7xl mx-auto py-4 px-3 sm:px-6 lg:px-8 h-full flex-grow">
<div className="pb-5 mt-6 border-b border-gray-200 sm:flex sm:items-center sm:justify-between">
<h1 className="text-3xl leading-6 font-bold text-gray-900">Users</h1>
<div className="mt-3 sm:mt-0 sm:ml-4">
<button
onClick={() => configureModalOpen(null)}
type="button"
className="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-primary-700 hover:bg-primary-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-800"
>
<PlusIcon className="-ml-0.5 mr-2 h-4 w-4" aria-hidden="true" />
Add new user
</button>
</div>
{isAdmin && (
<div className="mt-3 sm:mt-0 sm:ml-4">
<button
onClick={() => configureModalOpen(null)}
type="button"
className="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-primary-700 hover:bg-primary-800 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-800"
>
<PlusIcon className="-ml-0.5 mr-2 h-4 w-4" aria-hidden="true" />
Add new user
</button>
</div>
)}
</div>
<div className="flex justify-between w-100 my-3 items-center mb-5 ">
@ -153,7 +162,7 @@ export const Users: React.FC = () => {
</div>
</div>
<UserModal open={configureModal} onClose={configureModalClose} userId={userId} />
<UserModal open={configureModal} onClose={configureModalClose} userId={userId} setUserId={setUserId} />
</div>
</div>
);