hooks useBoardLayout.ts

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  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { useMemo } from 'react'
import { BOARD_COLUMNS, BOARD_ROWS } from '../constants/board'
import { getBoardDimensions, getSquarePosition } from '../utils/boardCoordinates'

/**
 * Layout configuration for the game board
 */
export interface BoardLayout {
  cellSize: number
  gap: number
  padding: number
  rows: number
  columns: number
}

/**
 * Hook that provides centralized board layout calculations
 */
export function useBoardLayout(): BoardLayout {
  return useMemo(
    () => ({
      cellSize: 100, // SVG units per cell
      gap: 2, // Gap between cells
      padding: 10, // Padding around board
      rows: BOARD_ROWS,
      columns: BOARD_COLUMNS,
    }),
    []
  )
}

/**
 * Hook that provides layout with derived values
 */
export function useBoardLayoutWithUtils() {
  const layout = useBoardLayout()

  return useMemo(
    () => ({
      ...layout,
      // Derived values
      totalCellSize: layout.cellSize + layout.gap,
      dimensions: getBoardDimensions(layout),
      getSquarePosition: (square: string) => getSquarePosition(square, layout),
    }),
    [layout]
  )
}