Merge pull request #664 from Goppai/fix-setting-crash

fix switching page causes setting to crash

ui/src/Pages/SettingsPage/ScannerConcurrentWorkers.test.js

@@ -0,0 +1,51 @@
+import React from 'react'
+import { MockedProvider } from '@apollo/client/testing'
+
+import { render, screen } from '@testing-library/react'
+
+import {
+  CONCURRENT_WORKERS_QUERY,
+  SET_CONCURRENT_WORKERS_MUTATION,
+  ScannerConcurrentWorkers,
+} from './ScannerConcurrentWorkers'
+
+test('load ScannerConcurrentWorkers', async () => {
+  const graphqlMocks = [
+    {
+      request: {
+        query: CONCURRENT_WORKERS_QUERY,
+      },
+      result: {
+        data: {
+          siteInfo: { concurrentWorkers: 3 },
+        },
+      },
+    },
+    {
+      request: {
+        query: SET_CONCURRENT_WORKERS_MUTATION,
+        variables: {
+          workers: '1',
+        },
+      },
+      result: {
+        data: {},
+      },
+    },
+  ]
+  render(
+    <MockedProvider
+      mocks={graphqlMocks}
+      addTypename={false}
+      defaultOptions={{
+        // disable cache, required to make fragments work
+        watchQuery: { fetchPolicy: 'no-cache' },
+        query: { fetchPolicy: 'no-cache' },
+      }}
+    >
+      <ScannerConcurrentWorkers />
+    </MockedProvider>
+  )
+
+  expect(screen.getByText('Scanner concurrent workers')).toBeInTheDocument()
+})

ui/src/Pages/SettingsPage/ScannerConcurrentWorkers.tsx

@@ -9,7 +9,7 @@ import {
 } from './__generated__/setConcurrentWorkers'
 import { TextField } from '../../primitives/form/Input'
 
-const CONCURRENT_WORKERS_QUERY = gql`
+export const CONCURRENT_WORKERS_QUERY = gql`
   query concurrentWorkersQuery {
     siteInfo {
       concurrentWorkers
@@ -17,15 +17,18 @@ const CONCURRENT_WORKERS_QUERY = gql`
   }
 `
 
-const SET_CONCURRENT_WORKERS_MUTATION = gql`
+export const SET_CONCURRENT_WORKERS_MUTATION = gql`
   mutation setConcurrentWorkers($workers: Int!) {
     setScannerConcurrentWorkers(workers: $workers)
   }
 `
 
-const ScannerConcurrentWorkers = () => {
+export const ScannerConcurrentWorkers = () => {
   const { t } = useTranslation()
 
+  const workerAmountServerValue = useRef<null | number>(null)
+  const [workerAmount, setWorkerAmount] = useState(0)
+
   const workerAmountQuery = useQuery<concurrentWorkersQuery>(
     CONCURRENT_WORKERS_QUERY,
     {
@@ -41,9 +44,6 @@ const ScannerConcurrentWorkers = () => {
     setConcurrentWorkersVariables
   >(SET_CONCURRENT_WORKERS_MUTATION)
 
-  const workerAmountServerValue = useRef<null | number>(null)
-  const [workerAmount, setWorkerAmount] = useState(0)
-
   const updateWorkerAmount = (workerAmount: number) => {
     if (workerAmountServerValue.current != workerAmount) {
       workerAmountServerValue.current = workerAmount
@@ -86,5 +86,3 @@ const ScannerConcurrentWorkers = () => {
     </div>
   )
 }
-
-export default ScannerConcurrentWorkers

ui/src/Pages/SettingsPage/ScannerSection.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { useMutation, gql } from '@apollo/client'
 import PeriodicScanner from './PeriodicScanner'
-import ScannerConcurrentWorkers from './ScannerConcurrentWorkers'
+import { ScannerConcurrentWorkers } from './ScannerConcurrentWorkers'
 import { SectionTitle, InputLabelDescription } from './SettingsPage'
 import { useTranslation } from 'react-i18next'
 import { scanAllMutation } from './__generated__/scanAllMutation'