Merge pull request #1015 from ubavic/fix/ui_changes_system_setting

fix: user and session managment
This commit is contained in:
Rafael Taranto 2021-12-24 09:41:04 +00:00 committed by GitHub
commit acdf001796
9 changed files with 100 additions and 27 deletions

View file

@ -61,7 +61,7 @@ const SessionManagement = () => {
{
header: 'Last known use',
width: 305,
textAlign: 'center',
textAlign: 'left',
size: 'sm',
view: s => {
if (R.isNil(s.sess.ua)) return 'No Record'
@ -72,7 +72,7 @@ const SessionManagement = () => {
{
header: 'Last known location',
width: 250,
textAlign: 'center',
textAlign: 'left',
size: 'sm',
view: s => {
return isLocalhost(s.sess.ipAddress) ? 'This device' : s.sess.ipAddress

View file

@ -6,10 +6,16 @@ import * as R from 'ramda'
import React, { useReducer, useState, useContext } from 'react'
import AppContext from 'src/AppContext'
import { Link } from 'src/components/buttons'
import { ActionButton, Link } from 'src/components/buttons'
import { Switch } from 'src/components/inputs'
import TitleSection from 'src/components/layout/TitleSection'
import DataTable from 'src/components/tables/DataTable'
import { ReactComponent as WhiteKeyIcon } from 'src/styling/icons/button/key/white.svg'
import { ReactComponent as KeyIcon } from 'src/styling/icons/button/key/zodiac.svg'
import { ReactComponent as WhiteLockIcon } from 'src/styling/icons/button/lock/white.svg'
import { ReactComponent as LockIcon } from 'src/styling/icons/button/lock/zodiac.svg'
import { ReactComponent as WhiteUserRoleIcon } from 'src/styling/icons/button/user-role/white.svg'
import { ReactComponent as UserRoleIcon } from 'src/styling/icons/button/user-role/zodiac.svg'
import styles from './UserManagement.styles'
import ChangeRoleModal from './modals/ChangeRoleModal'
@ -153,35 +159,37 @@ const Users = () => {
size: 'sm',
view: u => {
return (
<>
<Chip
size="small"
label="Reset password"
className={classes.actionChip}
<div className={classes.actionButtonWrapper}>
<ActionButton
Icon={KeyIcon}
InverseIcon={WhiteKeyIcon}
color="primary"
onClick={() => {
setUserInfo(u)
dispatch({
type: 'open',
payload: 'showResetPasswordModal'
})
}}
/>
<Chip
size="small"
label="Reset 2FA"
className={classes.actionChip}
}}>
Reset password
</ActionButton>
<ActionButton
Icon={LockIcon}
InverseIcon={WhiteLockIcon}
color="primary"
onClick={() => {
setUserInfo(u)
dispatch({
type: 'open',
payload: 'showReset2FAModal'
})
}}
/>
<Chip
size="small"
label="Add FIDO"
className={classes.actionChip}
}}>
Reset 2FA
</ActionButton>
<ActionButton
Icon={UserRoleIcon}
InverseIcon={WhiteUserRoleIcon}
color="primary"
onClick={() => {
setUserInfo(u)
generateAttestationOptions({
@ -189,9 +197,10 @@ const Users = () => {
userID: u.id
}
})
}}
/>
</>
}}>
Add FIDO
</ActionButton>
</div>
)
}
},

View file

@ -52,10 +52,6 @@ const styles = {
fontFamily: fontPrimary,
marginLeft: 10
},
actionChip: {
backgroundColor: subheaderColor,
marginRight: 15
},
info: {
fontFamily: fontSecondary,
textAlign: 'justify'
@ -118,6 +114,10 @@ const styles = {
},
roleSwitch: {
marginLeft: 15
},
actionButtonWrapper: {
display: 'flex',
gap: 12
}
}

View file

@ -0,0 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>icon/button/key/white</title>
<g id="icon/button/key/white" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group" transform="translate(0.500000, 0.500000)" stroke="#FFFFFF">
<circle id="Oval" cx="2.75" cy="8.25" r="2.75"></circle>
<line x1="5.04166667" y1="5.95833333" x2="11" y2="0" id="Path-13" stroke-linecap="round" stroke-linejoin="round"></line>
<line x1="8.25" y1="3.66666667" x2="10.5416667" y2="1.375" id="Path-13-Copy" stroke-width="2" stroke-linejoin="round"></line>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 773 B

View file

@ -0,0 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>icon/button/key/zodiac</title>
<g id="icon/button/key/zodiac" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Group" transform="translate(0.500000, 0.500000)" stroke="#1B2559">
<circle id="Oval" cx="2.75" cy="8.25" r="2.75"></circle>
<line x1="5.04166667" y1="5.95833333" x2="11" y2="0" id="Path-13" stroke-linecap="round" stroke-linejoin="round"></line>
<line x1="8.25" y1="3.66666667" x2="10.5416667" y2="1.375" id="Path-13-Copy" stroke-width="2" stroke-linejoin="round"></line>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 775 B

View file

@ -0,0 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>icon/button/lock/white</title>
<g id="icon/button/lock/white" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Lock-Icon-White" transform="translate(0.500000, 0.500000)">
<path d="M7.98058644,2.48058644 C7.98058644,1.11059638 6.86999006,0 5.5,0 C4.13000994,0 3.01941356,1.11059638 3.01941356,2.48058644 C3.01941356,3.39391315 3.01941356,4.09482878 3.01941356,4.58333333 L7.98058644,4.58333333 C7.98058644,4.09482878 7.98058644,3.39391315 7.98058644,2.48058644 Z" id="Lock" stroke="#FFFFFF" stroke-linejoin="round"></path>
<rect id="Body" stroke="#FFFFFF" stroke-linejoin="round" x="0" y="4.58333333" width="11" height="6.41666667"></rect>
<circle id="Key-Hole" fill="#FFFFFF" cx="5.5" cy="7.33333333" r="1"></circle>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1,010 B

View file

@ -0,0 +1,11 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>icon/button/lock/zodiac</title>
<g id="icon/button/lock/zodiac" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Lock-Icon-Zodiac" transform="translate(0.500000, 0.500000)">
<path d="M7.98058644,2.48058644 C7.98058644,1.11059638 6.86999006,0 5.5,0 C4.13000994,0 3.01941356,1.11059638 3.01941356,2.48058644 C3.01941356,3.39391315 3.01941356,4.09482878 3.01941356,4.58333333 L7.98058644,4.58333333 C7.98058644,4.09482878 7.98058644,3.39391315 7.98058644,2.48058644 Z" id="Lock" stroke="#1B2559" stroke-linejoin="round"></path>
<rect id="Body" stroke="#1B2559" stroke-linejoin="round" x="0" y="4.58333333" width="11" height="6.41666667"></rect>
<circle id="Key-Hole" fill="#1B2559" cx="5.5" cy="7.33333333" r="1"></circle>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1,013 B

View file

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>icon/button/user-role/white</title>
<g id="icon/button/user-role/white" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linejoin="round">
<g id="User-Role-Icon-White" transform="translate(2.500000, 0.500000)" stroke="#FFFFFF">
<path d="M5.50008791,6.84274776 L5.5,11 L3.66666667,9.35927189 L1.83333333,11 L1.83223109,6.84216075 C2.37179795,7.15453375 2.99835187,7.33333333 3.66666667,7.33333333 C4.33456272,7.33333333 4.96075021,7.15475774 5.50008791,6.84274776 Z" id="Bottom"></path>
<circle id="Top" cx="3.66666667" cy="3.66666667" r="3.66666667"></circle>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 840 B

View file

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>icon/button/user-role/zodiac</title>
<g id="icon/button/user-role/zodiac" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" stroke-linejoin="round">
<g id="User-Role-Icon-Zodiac" transform="translate(2.500000, 0.500000)" stroke="#1B2559">
<path d="M5.50008791,6.84274776 L5.5,11 L3.66666667,9.35927189 L1.83333333,11 L1.83223109,6.84216075 C2.37179795,7.15453375 2.99835187,7.33333333 3.66666667,7.33333333 C4.33456272,7.33333333 4.96075021,7.15475774 5.50008791,6.84274776 Z" id="Bottom"></path>
<circle id="Top" cx="3.66666667" cy="3.66666667" r="3.66666667"></circle>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 843 B