data-panel DataPanelCapturePanel.tsx

0% Statements 0/48

0% Branches 0/1

0% Functions 0/1

0% Lines 0/48

Press n or j to go to the next uncovered block, b, p or k for the previous block.


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  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  'use client'

import { css } from '../../../../../../styled-system/css'
import type { ModelType } from '../wizard/types'
import { BoundaryDataCapture } from '../BoundaryDataCapture'
import { DigitCapturePanel } from '../DigitCapturePanel'

export interface DataPanelCapturePanelProps {
  /** Model type */
  modelType: ModelType
  /** Handler called when new samples are captured */
  onCaptureComplete: () => void
  /** Selected digit for column classifier (required when modelType is column-classifier) */
  selectedDigit?: number
}

/**
 * Shared capture panel that renders model-specific capture UI.
 */
export function DataPanelCapturePanel({
  modelType,
  onCaptureComplete,
  selectedDigit = 0,
}: DataPanelCapturePanelProps) {
  return (
    <div
      data-component="data-panel-capture"
      className={css({
        display: 'flex',
        flexDirection: 'column',
        height: '100%',
        bg: 'gray.900',
      })}
    >
      {modelType === 'boundary-detector' && (
        <BoundaryDataCapture onSamplesCollected={onCaptureComplete} />
      )}

      {modelType === 'column-classifier' && (
        <DigitCapturePanel
          digit={selectedDigit}
          onCaptureSuccess={onCaptureComplete}
          columnCount={4}
        />
      )}
    </div>
  )
}