diff --git a/new-lamassu-admin/src/components/table/EmptyTable.js b/new-lamassu-admin/src/components/table/EmptyTable.js new file mode 100644 index 00000000..270bbc7b --- /dev/null +++ b/new-lamassu-admin/src/components/table/EmptyTable.js @@ -0,0 +1,30 @@ +import { makeStyles } from '@material-ui/core' +import React, { memo } from 'react' + +import { H4 } from 'src/components/typography' +import { ReactComponent as EmptyTableIcon } from 'src/styling/icons/table/empty-table.svg' + +const styles = { + emptyTable: { + width: '100%', + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + marginTop: 52 + } +} + +const useStyles = makeStyles(styles) + +const EmptyTable = memo(({ message }) => { + const classes = useStyles() + + return ( +
+ +

{message}

+
+ ) +}) + +export default EmptyTable diff --git a/new-lamassu-admin/src/components/table/index.js b/new-lamassu-admin/src/components/table/index.js index 21cf539a..289d0b01 100644 --- a/new-lamassu-admin/src/components/table/index.js +++ b/new-lamassu-admin/src/components/table/index.js @@ -1,4 +1,5 @@ import EditCell from './EditCell' +import EmptyTable from './EmptyTable' import Table from './Table' import TableBody from './TableBody' import TableCell from './TableCell' @@ -8,6 +9,7 @@ import TableRow from './TableRow' export { EditCell, + EmptyTable, Table, TableCell, TableHead, diff --git a/new-lamassu-admin/src/components/tables/DataTable.js b/new-lamassu-admin/src/components/tables/DataTable.js index 500217e8..2c49c7b9 100644 --- a/new-lamassu-admin/src/components/tables/DataTable.js +++ b/new-lamassu-admin/src/components/tables/DataTable.js @@ -17,10 +17,10 @@ import { Td, Th } from 'src/components/fake-table/Table' +import { EmptyTable } from 'src/components/table' import { H4 } from 'src/components/typography' import { ReactComponent as ExpandClosedIcon } from 'src/styling/icons/action/expand/closed.svg' import { ReactComponent as ExpandOpenIcon } from 'src/styling/icons/action/expand/open.svg' -import { ReactComponent as EmptyTableIcon } from 'src/styling/icons/table/empty-table.svg' import styles from './DataTable.styles' @@ -168,12 +168,7 @@ const DataTable = ({ {loading &&

Loading...

} - {!loading && R.isEmpty(data) && ( -
- -

{emptyText}

-
- )} + {!loading && R.isEmpty(data) && } {({ height }) => ( { disableRowEdit={R.compose(R.not, R.path(['active']))} elements={getElements(machines, locale)} /> + {R.isEmpty(config) && } {wizard && ( { save={onSave} validationSchema={ValidationSchema} /> + + {data && R.isEmpty(data.machines) && ( + + )} ) }