diff --git a/public/locales/bg/person.json b/public/locales/bg/person.json index 02e20da49..ef8c08897 100644 --- a/public/locales/bg/person.json +++ b/public/locales/bg/person.json @@ -37,7 +37,10 @@ "email-confirmed": "Потвърден имейл", "newsletter": "Известия", "company": "Компания", - "address": "Адрес" + "address": "Адрес", + "organizer": "Организатор", + "coordinator": "Координатор", + "beneficiary": "Бенефициент" }, "cta": { "create": "Създай", diff --git a/public/locales/en/person.json b/public/locales/en/person.json index 3728492d2..e9ce8a8cb 100644 --- a/public/locales/en/person.json +++ b/public/locales/en/person.json @@ -38,7 +38,10 @@ "email-confirmed": "Email confirmed", "newsletter": "Newsletter", "company": "Company", - "address": "Address" + "address": "Address", + "organizer": "Organizer", + "coordinator": "Coordinator", + "beneficiary": "Beneficiary" }, "cta": { "create": "Create", diff --git a/src/components/common/person/grid/Grid.tsx b/src/components/common/person/grid/Grid.tsx index 66fb545de..5548e0c6c 100644 --- a/src/components/common/person/grid/Grid.tsx +++ b/src/components/common/person/grid/Grid.tsx @@ -3,6 +3,7 @@ import React, { useState } from 'react' import { UseQueryResult } from '@tanstack/react-query' import { useTranslation } from 'next-i18next' import { Box, Avatar } from '@mui/material' +import { styled } from '@mui/material/styles' import { DataGrid, GridColDef, @@ -28,6 +29,13 @@ const defaultSort: SortData = { sortOrder: 'desc', } +const Centered = styled('div')({ + flex: 1, + display: 'flex', + justifyContent: 'center', + alignItems: 'center', +}) + export default observer(function Grid() { const { t } = useTranslation() @@ -165,15 +173,67 @@ export default observer(function Grid() { minWidth: 130, valueGetter: (f) => f.row.createdAt?.toString().slice(0, 10), }, + { + field: 'organizer', + headerName: t('person:admin.fields.organizer'), + minWidth: 130, + renderCell: (params: GridRenderCellParams): React.ReactNode => { + return ( + + {params.row.organizer ? ( + + ) : ( + + )} + + ) + }, + }, + { + field: 'coordinators', + headerName: t('person:admin.fields.coordinator'), + minWidth: 130, + renderCell: (params: GridRenderCellParams): React.ReactNode => { + return ( + + {params.row.coordinators ? ( + + ) : ( + + )} + + ) + }, + }, + { + field: 'beneficiaries', + headerName: t('person:admin.fields.beneficiary'), + minWidth: 130, + renderCell: (params: GridRenderCellParams): React.ReactNode => { + return ( + + {params.row.beneficiaries.length > 0 ? ( + + ) : ( + + )} + + ) + }, + }, { field: 'emailConfirmed', headerName: t('person:admin.fields.email-confirmed'), minWidth: 140, renderCell: (params: GridRenderCellParams): React.ReactNode => { - return params.row.emailConfirmed === true ? ( - - ) : ( - + return ( + + {params.row.emailConfirmed ? ( + + ) : ( + + )} + ) }, }, @@ -182,10 +242,14 @@ export default observer(function Grid() { headerName: t('person:admin.fields.newsletter'), minWidth: 130, renderCell: (params: GridRenderCellParams): React.ReactNode => { - return params.row.newsletter === true ? ( - - ) : ( - + return ( + + {params.row.newsletter ? ( + + ) : ( + + )} + ) }, }, @@ -235,6 +299,7 @@ export default observer(function Grid() { pageSizeOptions={[5, 10]} paginationModel={{ page: paginationModel.pageIndex, pageSize: paginationModel.pageSize }} paginationMode="server" + sortingMode="server" rowCount={totalCount} onPaginationModelChange={handlePaginationModelChange} onSortModelChange={handleSortModelChange}