diff --git a/new-lamassu-admin/src/components/layout/TitleSection.js b/new-lamassu-admin/src/components/layout/TitleSection.js
index 75db7d89..019a6ba5 100644
--- a/new-lamassu-admin/src/components/layout/TitleSection.js
+++ b/new-lamassu-admin/src/components/layout/TitleSection.js
@@ -8,7 +8,7 @@ import styles from './TitleSection.styles'
const useStyles = makeStyles(styles)
-const TitleSection = ({ title, error }) => {
+const TitleSection = ({ title, error, labels }) => {
const classes = useStyles()
return (
@@ -18,6 +18,7 @@ const TitleSection = ({ title, error }) => {
Failed to save
)}
+ {labels}
)
}
diff --git a/new-lamassu-admin/src/components/layout/TitleSection.styles.js b/new-lamassu-admin/src/components/layout/TitleSection.styles.js
index 7a52e077..397ece50 100644
--- a/new-lamassu-admin/src/components/layout/TitleSection.styles.js
+++ b/new-lamassu-admin/src/components/layout/TitleSection.styles.js
@@ -1,3 +1,5 @@
+import { mainStyles } from 'src/pages/Transactions/Transactions.styles'
+
export default {
titleWrapper: {
display: 'flex',
@@ -10,5 +12,6 @@ export default {
},
error: {
marginLeft: 12
- }
+ },
+ headerLabels: mainStyles.headerLabels
}
diff --git a/new-lamassu-admin/src/pages/maintenance/Cashboxes.js b/new-lamassu-admin/src/pages/maintenance/Cashboxes.js
index 17611f18..2cf0f07e 100644
--- a/new-lamassu-admin/src/pages/maintenance/Cashboxes.js
+++ b/new-lamassu-admin/src/pages/maintenance/Cashboxes.js
@@ -1,10 +1,8 @@
import { useQuery, useMutation } from '@apollo/react-hooks'
-import { makeStyles } from '@material-ui/core'
import { gql } from 'apollo-boost'
import React, { useState } from 'react'
import * as Yup from 'yup'
-import Title from 'src/components/Title'
import { Table as EditableTable } from 'src/components/editableTable'
import {
CashIn,
@@ -12,7 +10,7 @@ import {
CashOutFormik,
CashInFormik
} from 'src/components/inputs/cashbox/Cashbox'
-import { mainStyles } from 'src/pages/Transactions/Transactions.styles'
+import TitleSection from 'src/components/layout/TitleSection'
import { ReactComponent as ErrorIcon } from 'src/styling/icons/status/tomato.svg'
const ValidationSchema = Yup.object().shape({
@@ -88,11 +86,8 @@ const RESET_CASHOUT_BILLS = gql`
}
`
-const useStyles = makeStyles(mainStyles)
-
const Cashboxes = () => {
const [machines, setMachines] = useState([])
- const classes = useStyles()
useQuery(GET_MACHINES_AND_CONFIG, {
onCompleted: data =>
@@ -188,15 +183,16 @@ const Cashboxes = () => {
return (
<>
-
-
-
Cashboxes
-
-
-
- Action required
-
-
+
+
+ Action required
+ >
+ }
+ />
+