diff --git a/lib/new-admin/graphql/schema.js b/lib/new-admin/graphql/schema.js index b1e7db57..d3eae0bf 100644 --- a/lib/new-admin/graphql/schema.js +++ b/lib/new-admin/graphql/schema.js @@ -256,7 +256,6 @@ const typeDefs = gql` type Notification { id: ID! - deviceName: String type: String detail: JSON message: String diff --git a/migrations/1607009558538-create-notifications-table.js b/migrations/1607009558538-create-notifications-table.js index 9dd89aa8..88231246 100644 --- a/migrations/1607009558538-create-notifications-table.js +++ b/migrations/1607009558538-create-notifications-table.js @@ -23,8 +23,7 @@ exports.up = function (next) { "message" TEXT NOT NULL, "created" TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT CURRENT_TIMESTAMP, "read" BOOLEAN NOT NULL DEFAULT 'false', - "valid" BOOLEAN NOT NULL DEFAULT 'true', - "modified" TIMESTAMP WITH TIME ZONE NOT NULL DEFAULT CURRENT_TIMESTAMP + "valid" BOOLEAN NOT NULL DEFAULT 'true' ); CREATE INDEX ON notifications (valid); CREATE INDEX ON notifications (read);` diff --git a/new-lamassu-admin/src/components/NotificationCenter/NotificationCenter.js b/new-lamassu-admin/src/components/NotificationCenter/NotificationCenter.js index a245f457..c165f765 100644 --- a/new-lamassu-admin/src/components/NotificationCenter/NotificationCenter.js +++ b/new-lamassu-admin/src/components/NotificationCenter/NotificationCenter.js @@ -19,7 +19,6 @@ const GET_NOTIFICATIONS = gql` query getNotifications { notifications { id - deviceName type detail message diff --git a/new-lamassu-admin/src/pages/Dashboard/Alerts/Alerts.js b/new-lamassu-admin/src/pages/Dashboard/Alerts/Alerts.js index d0ad8adb..54be2660 100644 --- a/new-lamassu-admin/src/pages/Dashboard/Alerts/Alerts.js +++ b/new-lamassu-admin/src/pages/Dashboard/Alerts/Alerts.js @@ -35,8 +35,8 @@ const useStyles = makeStyles(styles) const Alerts = ({ cardState, setRightSideState }) => { const classes = useStyles() - const [showAllItems, setShowAllItems] = useState(false) const { data } = useQuery(GET_ALERTS) + const [showAllItems, setShowAllItems] = useState(false) const alerts = R.path(['alerts'])(data) ?? [] const machines = R.compose( diff --git a/new-lamassu-admin/src/pages/Dashboard/Alerts/Alerts.styles.js b/new-lamassu-admin/src/pages/Dashboard/Alerts/Alerts.styles.js index 9e4e7b95..e9043c2e 100644 --- a/new-lamassu-admin/src/pages/Dashboard/Alerts/Alerts.styles.js +++ b/new-lamassu-admin/src/pages/Dashboard/Alerts/Alerts.styles.js @@ -2,7 +2,8 @@ import { backgroundColor, offColor, errorColor, - primaryColor + primaryColor, + spacer } from 'src/styling/variables' const styles = { @@ -44,7 +45,7 @@ const styles = { statusHeader: { marginLeft: 2 }, - table: { + /* table: { maxHeight: 440, '&::-webkit-scrollbar': { width: 7 @@ -53,6 +54,18 @@ const styles = { backgroundColor: offColor, borderRadius: 5 } + }, */ + table: { + paddingTop: spacer * 4, + maxHeight: 465, + overflow: 'auto', + '&::-webkit-scrollbar': { + width: 7 + }, + '&::-webkit-scrollbar-thumb': { + backgroundColor: offColor, + borderRadius: 5 + } }, tableBody: { overflow: 'auto' @@ -69,6 +82,9 @@ const styles = { '&:nth-of-type(odd)': { backgroundColor: backgroundColor } + }, + listItemText: { + margin: '8px 0 8px 0' } } export default styles diff --git a/new-lamassu-admin/src/pages/Dashboard/Alerts/AlertsTable.js b/new-lamassu-admin/src/pages/Dashboard/Alerts/AlertsTable.js index 2e1413d4..713ffc41 100644 --- a/new-lamassu-admin/src/pages/Dashboard/Alerts/AlertsTable.js +++ b/new-lamassu-admin/src/pages/Dashboard/Alerts/AlertsTable.js @@ -1,19 +1,45 @@ +import { withStyles, makeStyles } from '@material-ui/core' import List from '@material-ui/core/List' import ListItem from '@material-ui/core/ListItem' -import ListItemText from '@material-ui/core/ListItemText' -import * as R from 'ramda' import React from 'react' +import { P } from 'src/components/typography/index' +import { ReactComponent as Wrench } from 'src/styling/icons/action/wrench/zodiac.svg' +import { ReactComponent as CashBoxEmpty } from 'src/styling/icons/cassettes/cashbox-empty.svg' +import { ReactComponent as WarningIcon } from 'src/styling/icons/warning-icon/tomato.svg' -const AlertsTable = ({ numToRender, alerts }) => { - const alertsToRender = R.slice(0, numToRender, alerts) +import styles from './Alerts.styles' +const useStyles = makeStyles(styles) + +const StyledListItem = withStyles(() => ({ + root: { + ...styles.root + } +}))(ListItem) + +const icons = { + error: , + fiatBalance: ( + + ) +} + +const AlertsTable = ({ numToRender, alerts, machines }) => { + const classes = useStyles() return ( - - {alertsToRender.map((alert, idx) => { - return ( - - - - ) + + {alerts.map((alert, idx) => { + if (idx < numToRender) { + return ( + + {icons[alert.type] || ( + + )} + {`${alert.message}${alert + .detail.deviceId && + ' - ' + machines[alert.detail.deviceId]}`} + + ) + } else return null })} ) diff --git a/new-lamassu-admin/src/pages/Dashboard/SystemStatus/MachinesTable.styles.js b/new-lamassu-admin/src/pages/Dashboard/SystemStatus/MachinesTable.styles.js index a8d73892..9492f096 100644 --- a/new-lamassu-admin/src/pages/Dashboard/SystemStatus/MachinesTable.styles.js +++ b/new-lamassu-admin/src/pages/Dashboard/SystemStatus/MachinesTable.styles.js @@ -51,20 +51,8 @@ const styles = { statusHeader: { marginLeft: 2 }, - /* table: { - maxHeight: 440, - '&::-webkit-scrollbar': { - width: 7 - }, - '&::-webkit-scrollbar-thumb': { - backgroundColor: offColor, - borderRadius: 5 - } - }, */ - // temporary, when notifications are enabled delete this one and decomment above table: { - maxHeight: 465, - minHeight: 465, + maxHeight: 440, '&::-webkit-scrollbar': { width: 7 }, diff --git a/new-lamassu-admin/src/styling/icons/cassettes/cashbox-empty.svg b/new-lamassu-admin/src/styling/icons/cassettes/cashbox-empty.svg new file mode 100644 index 00000000..bbcec59a --- /dev/null +++ b/new-lamassu-admin/src/styling/icons/cassettes/cashbox-empty.svg @@ -0,0 +1,14 @@ + + + 07E3DD15-D5E4-46A8-BF7B-064F598230CE + + + + + + + + + + +
{`${alert.message}${alert + .detail.deviceId && + ' - ' + machines[alert.detail.deviceId]}`}