Merge pull request #1002 from ubavic/fix/machine_upairing

fix: unpairing machine through dashboard shows blank page

lib/machine-loader.js

@@ -12,14 +12,14 @@ const configManager = require('./new-config-manager')
 const settingsLoader = require('./new-settings-loader')
 const notifierUtils = require('./notifier/utils')
 const notifierQueries = require('./notifier/queries')
+const { ApolloError } = require('apollo-server-errors');
 
 const fullyFunctionalStatus = { label: 'Fully functional', type: 'success' }
 const unresponsiveStatus = { label: 'Unresponsive', type: 'error' }
 const stuckStatus = { label: 'Stuck', type: 'error' }
 
-function getMachines () {
-  return db.any('SELECT * FROM devices WHERE display=TRUE ORDER BY created')
-    .then(rr => rr.map(r => ({
+function toMachineObject (r) {
+  return {
     deviceId: r.device_id,
     cashbox: r.cashbox,
     cassette1: r.cassette1,
@@ -32,10 +32,15 @@ function getMachines () {
     pairedAt: new Date(r.created),
     lastPing: new Date(r.last_online),
     name: r.name,
+    paired: r.paired
     // TODO: we shall start using this JSON field at some point
     // location: r.location,
-      paired: r.paired
-    })))
+  }
+}
+
+function getMachines () {
+  return db.any('SELECT * FROM devices WHERE display=TRUE ORDER BY created')
+    .then(rr => rr.map(toMachineObject))
 }
 
 function getConfig (defaultConfig) {
@@ -100,21 +105,10 @@ function getMachineName (machineId) {
 
 function getMachine (machineId, config) {
   const sql = 'SELECT * FROM devices WHERE device_id=$1'
-  const queryMachine = db.oneOrNone(sql, [machineId]).then(r => ({
-    deviceId: r.device_id,
-    cashbox: r.cashbox,
-    cassette1: r.cassette1,
-    cassette2: r.cassette2,
-    cassette3: r.cassette3,
-    cassette4: r.cassette4,
-    numberOfCassettes: r.number_of_cassettes,
-    version: r.version,
-    model: r.model,
-    pairedAt: new Date(r.created),
-    lastPing: new Date(r.last_online),
-    name: r.name,
-    paired: r.paired
-  }))
+  const queryMachine = db.oneOrNone(sql, [machineId]).then(r => {
+    if (r === null) throw new ApolloError('Resource doesn\'t exist', 'NOT_FOUND')
+    else return toMachineObject(r)
+  })
 
   return Promise.all([queryMachine, dbm.machineEvents(), config])
     .then(([machine, events, config]) => {

new-lamassu-admin/src/pages/Machines/Machines.js

@@ -6,8 +6,8 @@ import NavigateNextIcon from '@material-ui/icons/NavigateNext'
 import classnames from 'classnames'
 import gql from 'graphql-tag'
 import * as R from 'ramda'
-import React from 'react'
-import { Link, useLocation } from 'react-router-dom'
+import React, { useState } from 'react'
+import { Link, useLocation, useHistory } from 'react-router-dom'
 
 import { TL1, TL2, Label3 } from 'src/components/typography'
 
@@ -58,18 +58,42 @@ const GET_INFO = gql`
 
 const getMachineID = path => path.slice(path.lastIndexOf('/') + 1)
 
-const Machines = () => {
+const MachineRoute = () => {
   const location = useLocation()
-  const { data, loading, refetch } = useQuery(GET_INFO, {
+  const history = useHistory()
+
+  const id = getMachineID(location.pathname)
+
+  const [loading, setLoading] = useState(true)
+
+  const { data, refetch } = useQuery(GET_INFO, {
+    onCompleted: data => {
+      if (data.machine === null)
+        return history.push('/maintenance/machine-status')
+
+      setLoading(false)
+    },
     variables: {
-      deviceId: getMachineID(location.pathname),
+      deviceId: id
+    },
     billFilters: {
-        deviceId: getMachineID(location.pathname),
+      deviceId: id,
       batch: 'none'
     }
-    }
   })
 
+  const reload = () => {
+    return history.push(location.pathname)
+  }
+
+  return (
+    !loading && (
+      <Machines data={data} refetch={refetch} reload={reload}></Machines>
+    )
+  )
+}
+
+const Machines = ({ data, refetch, reload }) => {
   const classes = useStyles()
 
   const timezone = R.path(['config', 'locale_timezone'], data) ?? {}
@@ -82,7 +106,6 @@ const Machines = () => {
   const machineID = R.path(['deviceId'])(machine) ?? null
 
   return (
-    !loading && (
     <Grid container className={classes.grid}>
       <Grid item xs={3}>
         <Grid item xs={12}>
@@ -97,7 +120,7 @@ const Machines = () => {
                 {machineName}
               </TL2>
             </Breadcrumbs>
-              <Overview data={machine} onActionSuccess={refetch} />
+            <Overview data={machine} onActionSuccess={reload} />
           </div>
         </Grid>
       </Grid>
@@ -129,7 +152,6 @@ const Machines = () => {
       </Grid>
     </Grid>
   )
-  )
 }
 
-export default Machines
+export default MachineRoute