lamassu/lamassu-server
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: created the rename action on the machine status page

Browse source 
fix: added missing 'shutdown' action on the MachineActions enum of the
gql schema

style: set the Edit icon for the rename action

style: fixed first and last action buttons spacing
This commit is contained in:
Liordino Neto 2020-10-02 17:49:11 -03:00 • committed by Josh Harvey
parent 79298d5dec
commit bbf98b4d52
5 changed files with 75 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

6
lib/machine-loader.js
View file

@ -88,6 +88,11 @@ function getMachineName (machineId) {
.then(it => it.name)
}
function renameMachine (rec) {
const sql = 'update devices set name=$1 where device_id=$2'
return db.none(sql, [rec.newName, rec.deviceId])
}
function resetCashOutBills (rec) {
const sql = 'update devices set cassette1=$1, cassette2=$2 where device_id=$3'
return db.none(sql, [rec.cassettes[0], rec.cassettes[1], rec.deviceId])
@ -112,6 +117,7 @@ function restartServices (rec) {
function setMachine (rec) {
switch (rec.action) {
case 'rename': return renameMachine(rec)
case 'emptyCashInBills': return emptyCashInBills(rec)
case 'resetCashOutBills': return resetCashOutBills(rec)
case 'unpair': return unpair(rec)

6
lib/new-admin/graphql/schema.js
View file

@ -212,15 +212,17 @@ const typeDefs = gql`
}
enum MachineAction {
rename
emptyCashInBills
resetCashOutBills
unpair
reboot
shutdown
restartServices
}
type Mutation {
machineAction(deviceId:ID!, action: MachineAction!, cassette1: Int, cassette2: Int): Machine
machineAction(deviceId:ID!, action: MachineAction!, cassette1: Int, cassette2: Int, newName: String): Machine
machineSupportLogs(deviceId: ID!): SupportLogsResponse
serverSupportLogs: SupportLogsResponse
setCustomer(customerId: ID!, customerInput: CustomerInput): Customer
@ -262,7 +264,7 @@ const resolvers = {
accounts: () => settingsLoader.loadAccounts()
},
Mutation: {
machineAction: (...[, { deviceId, action, cassette1, cassette2 }]) => machineAction({ deviceId, action, cassette1, cassette2 }),
machineAction: (...[, { deviceId, action, cassette1, cassette2, newName }]) => machineAction({ deviceId, action, cassette1, cassette2, newName }),
machineSupportLogs: (...[, { deviceId }]) => supportLogs.insert(deviceId),
createPairingTotem: (...[, { name }]) => pairing.totem(name),
serverSupportLogs: () => serverLogs.insert(),

4
lib/new-admin/machines.js
View file

@ -6,13 +6,13 @@ function getMachine (machineId) {
.then(machines => machines.find(({ deviceId }) => deviceId === machineId))
}
function machineAction ({ deviceId, action, cassette1, cassette2 }) {
function machineAction ({ deviceId, action, cassette1, cassette2, newName }) {
return getMachine(deviceId)
.then(machine => {
if (!machine) throw new UserInputError(`machine:${deviceId} not found`, { deviceId })
return machine
})
.then(machineLoader.setMachine({ deviceId, action, cassettes: [cassette1, cassette2] }))
.then(machineLoader.setMachine({ deviceId, action, cassettes: [cassette1, cassette2], newName }))
.then(getMachine(deviceId))
}

16
new-lamassu-admin/src/components/ConfirmDialog.js
View file

@ -59,12 +59,15 @@ export const ConfirmDialog = memo(
errorMessage = 'This action requires confirmation',
open,
toBeConfirmed,
saveButtonAlwaysEnabled = false,
confirmationMessage = `Write '${toBeConfirmed}' to confirm this action`,
onConfirmed,
onDissmised,
initialValue = '',
...props
}) => {
const classes = useStyles()
const [value, setValue] = useState('')
const [value, setValue] = useState(initialValue)
const [error, setError] = useState(false)
const handleChange = event => setValue(event.target.value)
@ -74,6 +77,9 @@ export const ConfirmDialog = memo(
onDissmised()
}
const isOnErrorState =
(!saveButtonAlwaysEnabled && toBeConfirmed !== value) || value === ''
return (
<Dialog open={open} aria-labelledby="form-dialog-title" {...props}>
<DialogTitle id="customized-dialog-title" onClose={innerOnClose}>
@ -93,7 +99,7 @@ export const ConfirmDialog = memo(
)}
<DialogContent className={classes.dialogContent}>
<TextInput
label={`Write '${toBeConfirmed}' to confirm this action`}
label={confirmationMessage}
name="confirm-input"
autoFocus
id="confirm-input"
@ -105,14 +111,14 @@ export const ConfirmDialog = memo(
error={error}
InputLabelProps={{ shrink: true }}
onChange={handleChange}
onBlur={() => setError(toBeConfirmed !== value)}
onBlur={() => setError(isOnErrorState)}
/>
</DialogContent>
<DialogActions className={classes.dialogActions}>
<Button
color="green"
disabled={toBeConfirmed !== value}
onClick={onConfirmed}>
disabled={isOnErrorState}
onClick={() => onConfirmed(value)}>
Confirm
</Button>
</DialogActions>

66
new-lamassu-admin/src/pages/Maintenance/MachineDetailsCard.js
View file

@ -8,6 +8,8 @@ import React, { useState } from 'react'
import { ConfirmDialog } from 'src/components/ConfirmDialog'
import { Status } from 'src/components/Status'
import ActionButton from 'src/components/buttons/ActionButton'
import { ReactComponent as EditReversedIcon } from 'src/styling/icons/button/edit/white.svg'
import { ReactComponent as EditIcon } from 'src/styling/icons/button/edit/zodiac.svg'
import { ReactComponent as LinkIcon } from 'src/styling/icons/button/link/zodiac.svg'
import { ReactComponent as RebootReversedIcon } from 'src/styling/icons/button/reboot/white.svg'
import { ReactComponent as RebootIcon } from 'src/styling/icons/button/reboot/zodiac.svg'
@ -19,8 +21,12 @@ import { ReactComponent as UnpairIcon } from 'src/styling/icons/button/unpair/zo
import { labelStyles, machineDetailsStyles } from './MachineDetailsCard.styles'
const MACHINE_ACTION = gql`
mutation MachineAction($deviceId: ID!, $action: MachineAction!) {
machineAction(deviceId: $deviceId, action: $action) {
mutation MachineAction(
$deviceId: ID!
$action: MachineAction!
$newName: String
) {
machineAction(deviceId: $deviceId, action: $action, newName: $newName) {
deviceId
}
}
@ -63,11 +69,16 @@ const Item = ({ children, ...props }) => (
const MachineDetailsRow = ({ it: machine, onActionSuccess }) => {
const [action, setAction] = useState('')
const [dialogOpen, setOpen] = useState(false)
const [renameActionDialogOpen, setRenameActionDialogOpen] = useState(false)
const [confirmActionDialogOpen, setConfirmActionDialogOpen] = useState(false)
const [errorMessage, setErrorMessage] = useState(null)
const classes = useMDStyles()
const confirmDialog = action => setAction(action) || setOpen(true)
const confirmActionDialog = action =>
setAction(action) || setConfirmActionDialogOpen(true)
const renameActionDialog = () =>
setAction('Rename') || setRenameActionDialogOpen(true)
const [machineAction, { loading }] = useMutation(MACHINE_ACTION, {
onError: ({ message }) => {
@ -77,7 +88,7 @@ const MachineDetailsRow = ({ it: machine, onActionSuccess }) => {
onCompleted: () => {
// TODO: custom onActionSuccess needs to be passed down from the machinestatus table
onActionSuccess ? onActionSuccess() : window.location.reload()
setOpen(false)
setConfirmActionDialogOpen(false)
}
})
@ -121,7 +132,29 @@ const MachineDetailsRow = ({ it: machine, onActionSuccess }) => {
className={classes.separator}
/>
<ConfirmDialog
open={dialogOpen}
open={renameActionDialogOpen}
title={`Rename this machine?`}
initialValue={machine.name}
errorMessage={errorMessage}
confirmationMessage={`Write the new name for this machine`}
saveButtonAlwaysEnabled={true}
onConfirmed={value => {
setErrorMessage(null)
machineAction({
variables: {
deviceId: machine.deviceId,
action: `${action}`.toLowerCase(),
newName: value
}
})
}}
onDissmised={() => {
setRenameActionDialogOpen(false)
setErrorMessage(null)
}}
/>
<ConfirmDialog
open={confirmActionDialogOpen}
title={`${action} this machine?`}
errorMessage={errorMessage}
toBeConfirmed={machine.name}
@ -135,7 +168,7 @@ const MachineDetailsRow = ({ it: machine, onActionSuccess }) => {
})
}}
onDissmised={() => {
setOpen(false)
setConfirmActionDialogOpen(false)
setErrorMessage(null)
}}
/>
@ -145,10 +178,6 @@ const MachineDetailsRow = ({ it: machine, onActionSuccess }) => {
<Label>Machine Model</Label>
<span>{machine.model}</span>
</Item>
{/* <Item>
<Label>Address</Label>
<span>{machine.machineLocation}</span>
</Item> */}
<Item xs={4}>
<Label>Paired at</Label>
<span>
@ -160,13 +189,22 @@ const MachineDetailsRow = ({ it: machine, onActionSuccess }) => {
<Item>
<Label>Actions</Label>
<div className={classes.stack}>
<ActionButton
className={classes.mr}
disabled={loading}
color="primary"
Icon={EditIcon}
InverseIcon={EditReversedIcon}
onClick={() => renameActionDialog()}>
Rename
</ActionButton>
<ActionButton
color="primary"
className={classes.mr}
Icon={UnpairIcon}
InverseIcon={UnpairReversedIcon}
disabled={loading}
onClick={() => confirmDialog('Unpair')}>
onClick={() => confirmActionDialog('Unpair')}>
Unpair
</ActionButton>
<ActionButton
@ -175,7 +213,7 @@ const MachineDetailsRow = ({ it: machine, onActionSuccess }) => {
Icon={RebootIcon}
InverseIcon={RebootReversedIcon}
disabled={loading}
onClick={() => confirmDialog('Reboot')}>
onClick={() => confirmActionDialog('Reboot')}>
Reboot
</ActionButton>
<ActionButton
@ -184,7 +222,7 @@ const MachineDetailsRow = ({ it: machine, onActionSuccess }) => {
color="primary"
Icon={ShutdownIcon}
InverseIcon={ShutdownReversedIcon}
onClick={() => confirmDialog('Shutdown')}>
onClick={() => confirmActionDialog('Shutdown')}>
Shutdown
</ActionButton>
</div>