This commit is contained in:
Lakhan Samani 2022-08-31 11:02:50 +05:30
commit 75a413e5f2
2 changed files with 252 additions and 249 deletions

View File

@ -29,6 +29,7 @@ import {
MenuItem, MenuItem,
useToast, useToast,
Spinner, Spinner,
TableContainer
} from '@chakra-ui/react'; } from '@chakra-ui/react';
import { import {
FaAngleLeft, FaAngleLeft,
@ -262,9 +263,8 @@ export default function Users() {
.toPromise(); .toPromise();
if (res.data?._update_user?.id) { if (res.data?._update_user?.id) {
toast({ toast({
title: `Multi factor authentication ${ title: `Multi factor authentication ${user.is_multi_factor_auth_enabled ? 'disabled' : 'enabled'
user.is_multi_factor_auth_enabled ? 'disabled' : 'enabled' } for user`,
} for user`,
isClosable: true, isClosable: true,
status: 'success', status: 'success',
position: 'bottom-right', position: 'bottom-right',
@ -293,260 +293,262 @@ export default function Users() {
</Flex> </Flex>
{!loading ? ( {!loading ? (
userList.length > 0 ? ( userList.length > 0 ? (
<Table variant="simple"> <TableContainer>
<Thead> <Table variant="simple">
<Tr> <Thead>
<Th>Email</Th> <Tr>
<Th>Created At</Th> <Th>Email</Th>
<Th>Signup Methods</Th> <Th>Created At</Th>
<Th>Roles</Th> <Th>Signup Methods</Th>
<Th>Verified</Th> <Th>Roles</Th>
<Th>Access</Th> <Th>Verified</Th>
<Th> <Th>Access</Th>
<Tooltip label="MultiFactor Authentication Enabled / Disabled"> <Th>
MFA <Tooltip label="MultiFactor Authentication Enabled / Disabled">
</Tooltip> MFA
</Th> </Tooltip>
<Th>Actions</Th> </Th>
</Tr> <Th>Actions</Th>
</Thead> </Tr>
<Tbody> </Thead>
{userList.map((user: userDataTypes) => { <Tbody>
const { email_verified, created_at, ...rest }: any = user; {userList.map((user: userDataTypes) => {
return ( const { email_verified, created_at, ...rest }: any = user;
<Tr key={user.id} style={{ fontSize: 14 }}> return (
<Td maxW="300">{user.email}</Td> <Tr key={user.id} style={{ fontSize: 14 }}>
<Td> <Td maxW="300">{user.email}</Td>
{dayjs(user.created_at * 1000).format('MMM DD, YYYY')} <Td>
</Td> {dayjs(user.created_at * 1000).format('MMM DD, YYYY')}
<Td>{user.signup_methods}</Td> </Td>
<Td>{user.roles.join(', ')}</Td> <Td>{user.signup_methods}</Td>
<Td> <Td>{user.roles.join(', ')}</Td>
<Tag <Td>
size="sm" <Tag
variant="outline" size="sm"
colorScheme={user.email_verified ? 'green' : 'yellow'} variant="outline"
> colorScheme={user.email_verified ? 'green' : 'yellow'}
{user.email_verified.toString()} >
</Tag> {user.email_verified.toString()}
</Td> </Tag>
<Td> </Td>
<Tag <Td>
size="sm" <Tag
variant="outline" size="sm"
colorScheme={user.revoked_timestamp ? 'red' : 'green'} variant="outline"
> colorScheme={user.revoked_timestamp ? 'red' : 'green'}
{user.revoked_timestamp ? 'Revoked' : 'Enabled'} >
</Tag> {user.revoked_timestamp ? 'Revoked' : 'Enabled'}
</Td> </Tag>
<Td> </Td>
<Tag <Td>
size="sm" <Tag
variant="outline" size="sm"
colorScheme={ variant="outline"
user.is_multi_factor_auth_enabled ? 'green' : 'red' colorScheme={
} user.is_multi_factor_auth_enabled ? 'green' : 'red'
> }
{user.is_multi_factor_auth_enabled >
? 'Enabled' {user.is_multi_factor_auth_enabled
: 'Disabled'} ? 'Enabled'
</Tag> : 'Disabled'}
</Td> </Tag>
<Td> </Td>
<Menu> <Td>
<MenuButton as={Button} variant="unstyled" size="sm"> <Menu>
<Flex <MenuButton as={Button} variant="unstyled" size="sm">
justifyContent="space-between" <Flex
alignItems="center" justifyContent="space-between"
> alignItems="center"
<Text fontSize="sm" fontWeight="light">
Menu
</Text>
<FaAngleDown style={{ marginLeft: 10 }} />
</Flex>
</MenuButton>
<MenuList>
{!user.email_verified && (
<MenuItem
onClick={() => userVerificationHandler(user)}
> >
Verify User <Text fontSize="sm" fontWeight="light">
</MenuItem> Menu
)} </Text>
<EditUserModal <FaAngleDown style={{ marginLeft: 10 }} />
user={rest} </Flex>
updateUserList={updateUserList} </MenuButton>
/> <MenuList>
<DeleteUserModal {!user.email_verified && (
user={rest} <MenuItem
updateUserList={updateUserList} onClick={() => userVerificationHandler(user)}
/> >
{user.revoked_timestamp ? ( Verify User
<MenuItem </MenuItem>
onClick={() => )}
updateAccessHandler( <EditUserModal
user.id, user={rest}
updateAccessActions.ENABLE updateUserList={updateUserList}
) />
} <DeleteUserModal
> user={rest}
Enable Access updateUserList={updateUserList}
</MenuItem> />
) : ( {user.revoked_timestamp ? (
<MenuItem <MenuItem
onClick={() => onClick={() =>
updateAccessHandler( updateAccessHandler(
user.id, user.id,
updateAccessActions.REVOKE updateAccessActions.ENABLE
) )
} }
> >
Revoke Access Enable Access
</MenuItem> </MenuItem>
)} ) : (
{user.is_multi_factor_auth_enabled ? ( <MenuItem
<MenuItem onClick={() =>
onClick={() => multiFactorAuthUpdateHandler(user)} updateAccessHandler(
> user.id,
Disable MultiFactor Authentication updateAccessActions.REVOKE
</MenuItem> )
) : ( }
<MenuItem >
onClick={() => multiFactorAuthUpdateHandler(user)} Revoke Access
> </MenuItem>
Enable MultiFactor Authentication )}
</MenuItem> {user.is_multi_factor_auth_enabled ? (
)} <MenuItem
</MenuList> onClick={() => multiFactorAuthUpdateHandler(user)}
</Menu> >
</Td> Disable MultiFactor Authentication
</Tr> </MenuItem>
); ) : (
})} <MenuItem
</Tbody> onClick={() => multiFactorAuthUpdateHandler(user)}
{(paginationProps.maxPages > 1 || paginationProps.total >= 5) && ( >
<TableCaption> Enable MultiFactor Authentication
<Flex </MenuItem>
justifyContent="space-between" )}
alignItems="center" </MenuList>
m="2% 0" </Menu>
> </Td>
<Flex flex="1"> </Tr>
<Tooltip label="First Page"> );
<IconButton })}
aria-label="icon button" </Tbody>
onClick={() => {(paginationProps.maxPages > 1 || paginationProps.total >= 5) && (
<TableCaption>
<Flex
justifyContent="space-between"
alignItems="center"
m="2% 0"
>
<Flex flex="1">
<Tooltip label="First Page">
<IconButton
aria-label="icon button"
onClick={() =>
paginationHandler({
page: 1,
})
}
isDisabled={paginationProps.page <= 1}
mr={4}
icon={<FaAngleDoubleLeft />}
/>
</Tooltip>
<Tooltip label="Previous Page">
<IconButton
aria-label="icon button"
onClick={() =>
paginationHandler({
page: paginationProps.page - 1,
})
}
isDisabled={paginationProps.page <= 1}
icon={<FaAngleLeft />}
/>
</Tooltip>
</Flex>
<Flex
flex="8"
justifyContent="space-evenly"
alignItems="center"
>
<Text mr={8}>
Page{' '}
<Text fontWeight="bold" as="span">
{paginationProps.page}
</Text>{' '}
of{' '}
<Text fontWeight="bold" as="span">
{paginationProps.maxPages}
</Text>
</Text>
<Flex alignItems="center">
<Text flexShrink="0">Go to page:</Text>{' '}
<NumberInput
ml={2}
mr={8}
w={28}
min={1}
max={paginationProps.maxPages}
onChange={(value) =>
paginationHandler({
page: parseInt(value),
})
}
value={paginationProps.page}
>
<NumberInputField />
<NumberInputStepper>
<NumberIncrementStepper />
<NumberDecrementStepper />
</NumberInputStepper>
</NumberInput>
</Flex>
<Select
w={32}
value={paginationProps.limit}
onChange={(e) =>
paginationHandler({ paginationHandler({
page: 1, page: 1,
limit: parseInt(e.target.value),
}) })
} }
isDisabled={paginationProps.page <= 1}
mr={4}
icon={<FaAngleDoubleLeft />}
/>
</Tooltip>
<Tooltip label="Previous Page">
<IconButton
aria-label="icon button"
onClick={() =>
paginationHandler({
page: paginationProps.page - 1,
})
}
isDisabled={paginationProps.page <= 1}
icon={<FaAngleLeft />}
/>
</Tooltip>
</Flex>
<Flex
flex="8"
justifyContent="space-evenly"
alignItems="center"
>
<Text mr={8}>
Page{' '}
<Text fontWeight="bold" as="span">
{paginationProps.page}
</Text>{' '}
of{' '}
<Text fontWeight="bold" as="span">
{paginationProps.maxPages}
</Text>
</Text>
<Flex alignItems="center">
<Text flexShrink="0">Go to page:</Text>{' '}
<NumberInput
ml={2}
mr={8}
w={28}
min={1}
max={paginationProps.maxPages}
onChange={(value) =>
paginationHandler({
page: parseInt(value),
})
}
value={paginationProps.page}
> >
<NumberInputField /> {getLimits(paginationProps).map((pageSize) => (
<NumberInputStepper> <option key={pageSize} value={pageSize}>
<NumberIncrementStepper /> Show {pageSize}
<NumberDecrementStepper /> </option>
</NumberInputStepper> ))}
</NumberInput> </Select>
</Flex>
<Flex flex="1">
<Tooltip label="Next Page">
<IconButton
aria-label="icon button"
onClick={() =>
paginationHandler({
page: paginationProps.page + 1,
})
}
isDisabled={
paginationProps.page >= paginationProps.maxPages
}
icon={<FaAngleRight />}
/>
</Tooltip>
<Tooltip label="Last Page">
<IconButton
aria-label="icon button"
onClick={() =>
paginationHandler({
page: paginationProps.maxPages,
})
}
isDisabled={
paginationProps.page >= paginationProps.maxPages
}
ml={4}
icon={<FaAngleDoubleRight />}
/>
</Tooltip>
</Flex> </Flex>
<Select
w={32}
value={paginationProps.limit}
onChange={(e) =>
paginationHandler({
page: 1,
limit: parseInt(e.target.value),
})
}
>
{getLimits(paginationProps).map((pageSize) => (
<option key={pageSize} value={pageSize}>
Show {pageSize}
</option>
))}
</Select>
</Flex> </Flex>
<Flex flex="1"> </TableCaption>
<Tooltip label="Next Page"> )}
<IconButton </Table>
aria-label="icon button" </TableContainer>
onClick={() =>
paginationHandler({
page: paginationProps.page + 1,
})
}
isDisabled={
paginationProps.page >= paginationProps.maxPages
}
icon={<FaAngleRight />}
/>
</Tooltip>
<Tooltip label="Last Page">
<IconButton
aria-label="icon button"
onClick={() =>
paginationHandler({
page: paginationProps.maxPages,
})
}
isDisabled={
paginationProps.page >= paginationProps.maxPages
}
ml={4}
icon={<FaAngleDoubleRight />}
/>
</Tooltip>
</Flex>
</Flex>
</TableCaption>
)}
</Table>
) : ( ) : (
<Flex <Flex
flexDirection="column" flexDirection="column"

View File

@ -109,6 +109,7 @@ func main() {
router := routes.InitRouter(log) router := routes.InitRouter(log)
log.Info("Starting Authorizer: ", VERSION) log.Info("Starting Authorizer: ", VERSION)
port, err := memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyPort) port, err := memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyPort)
log.Info("Authorizer running at PORT: ", port)
if err != nil { if err != nil {
log.Info("Error while getting port from env using default port 8080: ", err) log.Info("Error while getting port from env using default port 8080: ", err)
port = "8080" port = "8080"