1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-31 00:16:47 +01:00

feat: users ui adjustments (#3249)

This commit is contained in:
Jaanus Sellin 2023-03-03 14:05:45 +02:00 committed by GitHub
parent b47b2b2642
commit 2672e7386d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 14 deletions

View File

@ -1,11 +1,13 @@
import { MonetizationOn } from '@mui/icons-material'; import { AttachMoneyRounded, MonetizationOn } from '@mui/icons-material';
import { styled, Tooltip } from '@mui/material'; import { styled, Tooltip } from '@mui/material';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import { TextCell } from 'component/common/Table/cells/TextCell/TextCell'; import { TextCell } from 'component/common/Table/cells/TextCell/TextCell';
const StyledMonetizationOn = styled(MonetizationOn)(({ theme }) => ({ const StyledMonetizationOn = styled(AttachMoneyRounded)(({ theme }) => ({
color: theme.palette.primary.light, color: theme.palette.primary.light,
fontSize: '1.75rem', fontSize: '1.5rem',
backgroundColor: '#F1F0FC',
borderRadius: theme.shape.borderRadiusLarge,
})); }));
interface IUserTypeCellProps { interface IUserTypeCellProps {
@ -22,7 +24,7 @@ export const UserTypeCell = ({ value }: IUserTypeCellProps) => {
<StyledMonetizationOn /> <StyledMonetizationOn />
</Tooltip> </Tooltip>
} }
elseShow="Free" elseShow="Included"
/> />
</TextCell> </TextCell>
); );

View File

@ -96,16 +96,6 @@ const UsersList = () => {
const columns = useMemo( const columns = useMemo(
() => [ () => [
{
id: 'type',
Header: 'Type',
accessor: 'paid',
Cell: ({ row: { original: user } }: any) => (
<UserTypeCell value={isBillingUsers && user.paid} />
),
disableGlobalFilter: true,
sortType: 'boolean',
},
{ {
Header: 'Avatar', Header: 'Avatar',
accessor: 'imageUrl', accessor: 'imageUrl',
@ -163,6 +153,17 @@ const UsersList = () => {
sortType: 'date', sortType: 'date',
maxWidth: 150, maxWidth: 150,
}, },
{
id: 'type',
Header: 'Type',
accessor: 'paid',
maxWidth: 100,
Cell: ({ row: { original: user } }: any) => (
<UserTypeCell value={isBillingUsers && user.paid} />
),
disableGlobalFilter: true,
sortType: 'boolean',
},
{ {
Header: 'Actions', Header: 'Actions',
id: 'Actions', id: 'Actions',