create test code for this: import React, $\{$ useState $\}$ from 'react';

import $\{$ PuzzleModel $\}$ from $\text{'}./$PuzzleModel$\text{'}$;

import $\{$ Controller $\}$ from $\text{'}./$Controller$\text{'}$;

const Boundary: React.FC $=()=>\{$

const $[$puzzle$,$ setPuzzle$]=$ useState$($new PuzzleModel$())$;

const $[$controller$]=$ useState$($new Controller$($puzzle$))$;

const handleSwap $=($row$1$: number, col$1$: number, row$2$: number, col$2$: number$)=>\{$

controller.swapSyllables$($row$1,$ col$1,$ row$2,$ col$2)$;

setPuzzle$(\{...$controller.getPuzzle$()\})$;

$\}$;

const handleUndo $=()=>\{$

controller.undoSwap$()$;

setPuzzle$(\{...$controller.getPuzzle$()\})$;

$\}$;

const handleReset $=()=>\{$

controller.resetPuzzle$()$;

setPuzzle$(\{...$controller.getPuzzle$()\})$;

$\}$;

const isSolved $=$ puzzle.isSolved$()$; $//$ Add a method to check if the puzzle is solved

return $($