All files / web/src/hooks useScannerSettings.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
'use client'

import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query'
import { api } from '@/lib/queryClient'
import type { QuadDetectorConfig } from '@/lib/vision/quadDetector'

/**
 * Scanner settings as returned by API (QuadDetectorConfig format)
 */
export type ScannerConfig = Pick<
  QuadDetectorConfig,
  | 'preprocessing'
  | 'enableHistogramEqualization'
  | 'enableAdaptiveThreshold'
  | 'enableMorphGradient'
  | 'cannyThresholds'
  | 'adaptiveBlockSize'
  | 'adaptiveC'
  | 'enableHoughLines'
>

/**
 * Query key factory for scanner settings
 */
export const scannerSettingsKeys = {
  all: ['scanner-settings'] as const,
  detail: () => [...scannerSettingsKeys.all, 'detail'] as const,
}

/**
 * Fetch scanner settings
 */
async function fetchScannerSettings(): Promise<ScannerConfig> {
  const res = await api('scanner-settings')
  if (!res.ok) throw new Error('Failed to fetch scanner settings')
  const data = await res.json()
  return data.settings
}

/**
 * Update scanner settings
 */
async function updateScannerSettings(updates: Partial<ScannerConfig>): Promise<ScannerConfig> {
  const res = await api('scanner-settings', {
    method: 'PATCH',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify(updates),
  })
  if (!res.ok) throw new Error('Failed to update scanner settings')
  const data = await res.json()
  return data.settings
}

/**
 * Hook: Fetch scanner settings
 */
export function useScannerSettings() {
  return useQuery({
    queryKey: scannerSettingsKeys.detail(),
    queryFn: fetchScannerSettings,
  })
}

/**
 * Hook: Update scanner settings
 *
 * Uses optimistic updates for instant UI feedback
 */
export function useUpdateScannerSettings() {
  const queryClient = useQueryClient()

  return useMutation({
    mutationFn: updateScannerSettings,
    onMutate: async (updates) => {
      // Cancel outgoing refetches
      await queryClient.cancelQueries({
        queryKey: scannerSettingsKeys.detail(),
      })

      // Snapshot previous value
      const previousSettings = queryClient.getQueryData<ScannerConfig>(scannerSettingsKeys.detail())

      // Optimistically update
      if (previousSettings) {
        const optimisticSettings = { ...previousSettings, ...updates }
        queryClient.setQueryData<ScannerConfig>(scannerSettingsKeys.detail(), optimisticSettings)
      }

      return { previousSettings }
    },
    onError: (_err, _updates, context) => {
      // Rollback on error
      if (context?.previousSettings) {
        queryClient.setQueryData(scannerSettingsKeys.detail(), context.previousSettings)
      }
    },
    onSettled: (updatedSettings) => {
      // Update with server data on success
      if (updatedSettings) {
        queryClient.setQueryData(scannerSettingsKeys.detail(), updatedSettings)
      }
    },
  })
}