Skip to content

Commit

Permalink
refactor: reformat organizations and user management to material card…
Browse files Browse the repository at this point in the history
… design
  • Loading branch information
hamed-valiollahi committed Dec 11, 2024
1 parent f437eec commit 12f91f0
Show file tree
Hide file tree
Showing 7 changed files with 325 additions and 232 deletions.
2 changes: 2 additions & 0 deletions frontend/src/assets/locales/en/admin.json
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,8 @@
"usersNotFound": "No users found",
"activitiesNotFound": "No user activities found",
"newUserBtn": "New user",
"userDetails": "User details",
"editBtn": "Edit",
"userColLabels": {
"userName": "User name",
"role": "Role(s)",
Expand Down
4 changes: 3 additions & 1 deletion frontend/src/assets/locales/en/organization.json
Original file line number Diff line number Diff line change
Expand Up @@ -45,5 +45,7 @@
"editOrgTitle": "Edit organization",
"toUpdateMsg": " to update address information.",
"selectOrgLabel": "Select an Organization",
"complianceUnitBalance": "Compliance Unit Balance"
"complianceUnitBalance": "Compliance Unit Balance",
"editBtn": "Edit",
"orgDetails": "Organization details"
}
39 changes: 34 additions & 5 deletions frontend/src/components/BCWidgetCard/BCWidgetCard.jsx
Original file line number Diff line number Diff line change
@@ -1,17 +1,28 @@
import PropTypes from 'prop-types'

// @mui material components
import { Card, CardContent, Divider } from '@mui/material'
import BCBox from '@/components/BCBox'
import BCTypography from '@/components/BCTypography'
import { useNavigate } from 'react-router-dom'
import EditIcon from '@mui/icons-material/Edit'
import BCButton from '@/components/BCButton'

function BCWidgetCard({
color = 'nav',
title = 'Title',
content,
style,
disableHover = false
disableHover = false,
editButtonText = null,
editButtonRoute = null
}) {
const navigate = useNavigate()

const handleButtonClick = () => {
if (editButtonRoute) {
navigate(editButtonRoute)
}
}

return (
<Card
sx={{
Expand All @@ -28,7 +39,7 @@ function BCWidgetCard({
coloredShadow={color}
borderRadius="md"
display="flex"
justifyContent="left"
justifyContent="space-between"
alignItems="center"
px={2}
py={1}
Expand All @@ -39,6 +50,22 @@ function BCWidgetCard({
<BCTypography variant="subtitle2" fontWeight="light" color="inherit">
{title}
</BCTypography>
{editButtonRoute && (
<BCButton
variant="outlined"
size="small"
color="primay"
onClick={handleButtonClick}
startIcon={<EditIcon sx={{ width: '17px', height: '17px' }} />}
sx={{
'&:hover': {
backgroundColor: 'rgba(255, 255, 255, 0.1)'
}
}}
>
{editButtonText}
</BCButton>
)}
</BCBox>
</BCBox>
<Divider
Expand Down Expand Up @@ -67,7 +94,9 @@ BCWidgetCard.propTypes = {
title: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
content: PropTypes.node.isRequired,
disableHover: PropTypes.bool,
subHeader: PropTypes.node
subHeader: PropTypes.node,
editButtonText: PropTypes.string,
editButtonRoute: PropTypes.string
}

export default BCWidgetCard
Loading

0 comments on commit 12f91f0

Please sign in to comment.