import { IonRow } from "@ionic/react"; import styles from "./Keypad.module.scss"; import KeypadButton from "./KeypadButton"; const Keypad = (props: any): JSX.Element => { const { activeIndex, handleClick, handleRemove, amount, correct } = props; const keypadButtons = [ [ { value: "1", handleClick: () => handleClick(activeIndex, 1), small: false, remove: false, }, { value: "2", handleClick: () => handleClick(activeIndex, 2), small: false, remove: false, }, { value: "3", handleClick: () => handleClick(activeIndex, 3), small: false, remove: false, }, ], [ { value: "4", handleClick: () => handleClick(activeIndex, 4), small: false, remove: false, }, { value: "5", handleClick: () => handleClick(activeIndex, 5), small: false, remove: false, }, { value: "6", handleClick: () => handleClick(activeIndex, 6), small: false, remove: false, }, ], [ { value: "7", handleClick: () => handleClick(activeIndex, 7), small: false, remove: false, }, { value: "8", handleClick: () => handleClick(activeIndex, 8), small: false, remove: false, }, { value: "9", handleClick: () => handleClick(activeIndex, 9), small: false, remove: false, }, ], [ { value: "Resend", handleClick: () => handleClick(activeIndex, 1), small: true, remove: false, }, { value: "0", handleClick: () => handleClick(activeIndex, 2), small: false, remove: false, }, { value: "", handleClick: () => handleRemove(), small: true, remove: true, }, ], ]; return (