fix: loading usage

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

@@ -114,7 +114,7 @@ const Accounting = () => {
   const { data: configResponse, loading: configLoading } = useQuery(GET_DATA)
   const timezone = R.path(['config', 'locale_timezone'], configResponse)
 
-  const loading = operatorLoading && configLoading
+  const loading = operatorLoading || configLoading
 
   const operatorData = R.path(['operatorByUsername'], opData)
 
@@ -170,19 +170,16 @@ const Accounting = () => {
   ]
 
   return (
-    !loading && (
     <>
       <TitleSection title="Accounting" />
       <Assets
-          balance={
+        balance={operatorData.fiatBalances[operatorData.preferredFiatCurrency]}
-            operatorData.fiatBalances[operatorData.preferredFiatCurrency]
-          }
         hedgingReserve={operatorData.hedgingReserve ?? 0}
         currency={operatorData.preferredFiatCurrency}
       />
       <H4 className={classes.tableTitle}>Fiat balance history</H4>
       <DataTable
-          loading={false}
+        loading={loading}
         emptyText="No transactions so far"
         elements={elements}
         data={operatorData.fundings ?? []}
@@ -190,7 +187,6 @@ const Accounting = () => {
       />
     </>
   )
-  )
 }
 
 export default Accounting

new-lamassu-admin/src/pages/Customers/CustomerProfile.js

@@ -381,7 +381,7 @@ const CustomerProfile = memo(() => {
 
   const photosData = formatPhotosData(R.append(frontCameraData, txPhotosData))
 
-  const loading = customerLoading && configLoading
+  const loading = customerLoading || configLoading
 
   const timezone = R.path(['config', 'locale_timezone'], configResponse)
 

new-lamassu-admin/src/pages/LoyaltyPanel/IndividualDiscounts.js

@@ -64,7 +64,9 @@ const IndividualDiscounts = () => {
   const [showModal, setShowModal] = useState(false)
   const toggleModal = () => setShowModal(!showModal)
 
-  const { data: discountResponse, loading } = useQuery(GET_INDIVIDUAL_DISCOUNTS)
+  const { data: discountResponse, loading: discountLoading } = useQuery(
+    GET_INDIVIDUAL_DISCOUNTS
+  )
   const { data: customerData, loading: customerLoading } = useQuery(
     GET_CUSTOMERS
   )
@@ -160,11 +162,11 @@ const IndividualDiscounts = () => {
     }
   ]
 
-  const isLoading = loading || customerLoading
+  const loading = discountLoading || customerLoading
 
   return (
     <>
-      {!isLoading && !R.isEmpty(discountResponse.individualDiscounts) && (
+      {!loading && !R.isEmpty(discountResponse.individualDiscounts) && (
         <Box
           marginBottom={4}
           marginTop={-7}
@@ -176,7 +178,7 @@ const IndividualDiscounts = () => {
           </Link>
         </Box>
       )}
-      {!isLoading && !R.isEmpty(discountResponse.individualDiscounts) && (
+      {!loading && !R.isEmpty(discountResponse.individualDiscounts) && (
         <>
           <DataTable
             elements={elements}
@@ -196,7 +198,7 @@ const IndividualDiscounts = () => {
           />
         </>
       )}
-      {!isLoading && R.isEmpty(discountResponse.individualDiscounts) && (
+      {!loading && R.isEmpty(discountResponse.individualDiscounts) && (
         <Box display="flex" alignItems="left" flexDirection="column">
           <Label3>
             It seems there are no active individual customer discounts on your

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

@@ -81,16 +81,21 @@ const Logs = () => {
 
   const deviceId = selected?.deviceId
 
-  const { data: machineResponse } = useQuery(GET_MACHINES)
+  const { data: machineResponse, loading: machinesLoading } = useQuery(
+    GET_MACHINES
+  )
 
-  const { data: configResponse } = useQuery(GET_DATA)
+  const { data: configResponse, loading: configLoading } = useQuery(GET_DATA)
   const timezone = R.path(['config', 'locale_timezone'], configResponse)
 
-  const { data: logsResponse, loading } = useQuery(GET_MACHINE_LOGS, {
+  const { data: logsResponse, loading: logsLoading } = useQuery(
+    GET_MACHINE_LOGS,
+    {
       variables: { deviceId, limit: NUM_LOG_RESULTS },
       skip: !selected,
       onCompleted: () => setSaveMessage('')
-  })
+    }
+  )
 
   if (machineResponse?.machines?.length && !selected) {
     setSelected(machineResponse?.machines[0])
@@ -100,6 +105,8 @@ const Logs = () => {
     return R.path(['deviceId'])(selected) === it.deviceId
   }
 
+  const loading = machinesLoading || configLoading || logsLoading
+
   return (
     <>
       <div className={classes.titleWrapper}>

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

@@ -82,7 +82,7 @@ const Transactions = ({ id }) => {
   const { data: configData, loading: configLoading } = useQuery(GET_DATA)
   const timezone = R.path(['config', 'locale_timezone'], configData)
 
-  const loading = txLoading && configLoading
+  const loading = txLoading || configLoading
 
   if (!loading && txResponse) {
     txResponse.transactions = txResponse.transactions.splice(0, 5)

new-lamassu-admin/src/pages/Maintenance/CashboxHistory.js

@@ -85,7 +85,7 @@ const CashboxHistory = ({ machines, currency }) => {
   const { data: configData, loading: configLoading } = useQuery(GET_DATA)
   const timezone = R.path(['config', 'locale_timezone'], configData)
 
-  const loading = batchesLoading && configLoading
+  const loading = batchesLoading || configLoading
 
   const batches = R.path(['cashboxBatches'])(batchesData)
 
@@ -248,16 +248,13 @@ const CashboxHistory = ({ machines, currency }) => {
   ]
 
   return (
-    <>
-      {!loading && (
     <DataTable
+      loading={loading}
       name="cashboxHistory"
       elements={elements}
       data={batches}
       emptyText="No cashbox batches so far"
     />
-      )}
-    </>
   )
 }
 

new-lamassu-admin/src/pages/Maintenance/MachineStatus.js

@@ -54,7 +54,11 @@ const MachineStatus = () => {
   const history = useHistory()
   const { state } = useLocation()
   const addedMachineId = state?.id
-  const { data: machinesResponse, refetch, loading } = useQuery(GET_MACHINES)
+  const {
+    data: machinesResponse,
+    refetch,
+    loading: machinesLoading
+  } = useQuery(GET_MACHINES)
   const { data: configResponse, configLoading } = useQuery(GET_DATA)
   const timezone = R.path(['config', 'locale_timezone'], configResponse)
 
@@ -114,6 +118,8 @@ const MachineStatus = () => {
     <MachineDetailsRow it={it} onActionSuccess={refetch} timezone={timezone} />
   )
 
+  const loading = machinesLoading || configLoading
+
   return (
     <>
       <div className={classes.titleWrapper}>
@@ -132,7 +138,7 @@ const MachineStatus = () => {
         </div>
       </div>
       <DataTable
-        loading={loading && configLoading}
+        loading={loading}
         elements={elements}
         data={machines}
         Details={InnerMachineDetailsRow}

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

@@ -98,13 +98,13 @@ const Logs = () => {
   const [saveMessage, setSaveMessage] = useState(null)
   const [logLevel, setLogLevel] = useState(SHOW_ALL)
 
-  const { data, loading } = useQuery(GET_SERVER_DATA, {
+  const { data, loading: dataLoading } = useQuery(GET_SERVER_DATA, {
     onCompleted: () => setSaveMessage(''),
     variables: {
       limit: NUM_LOG_RESULTS
     }
   })
-  const { data: configResponse, configLoading } = useQuery(GET_DATA)
+  const { data: configResponse, loading: configLoading } = useQuery(GET_DATA)
   const timezone = R.path(['config', 'locale_timezone'], configResponse)
 
   const defaultLogLevels = [
@@ -132,6 +132,8 @@ const Logs = () => {
     setLogLevel(logLevel)
   }
 
+  const loading = dataLoading || configLoading
+
   return (
     <>
       <div className={classes.titleWrapper}>
@@ -206,8 +208,8 @@ const Logs = () => {
                   ))}
             </TableBody>
           </Table>
-          {loading && configLoading && <H4>{'Loading...'}</H4>}
+          {loading && <H4>{'Loading...'}</H4>}
-          {!loading && !configLoading && !data?.serverLogs?.length && (
+          {!loading && !data?.serverLogs?.length && (
             <H4>{'No activity so far'}</H4>
           )}
         </div>

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

@@ -48,7 +48,7 @@ const SessionManagement = () => {
   const { data: configResponse, loading: configLoading } = useQuery(GET_DATA)
   const timezone = R.path(['config', 'locale_timezone'], configResponse)
 
-  const loading = sessionsLoading && configLoading
+  const loading = sessionsLoading || configLoading
 
   const elements = [
     {
@@ -107,16 +107,15 @@ const SessionManagement = () => {
   ]
 
   return (
-    !loading && (
     <>
       <TitleSection title="Session Management" />
       <DataTable
+        loading={loading}
         elements={elements}
         data={R.path(['sessions'])(tknResponse)}
       />
     </>
   )
-  )
 }
 
 export default SessionManagement