Skip to content

Commit

Permalink
feat: Add backspace long press functionality to currency keyboard
Browse files Browse the repository at this point in the history
Signed-off-by: Prakhar Agarwal <[email protected]>
  • Loading branch information
Prakhar-Agarwal-byte committed May 25, 2024
1 parent 0509824 commit 2cc6234
Showing 1 changed file with 29 additions and 1 deletion.
30 changes: 29 additions & 1 deletion app/components/currency-keyboard/currency-keyboard.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React from "react"
import React, { useEffect, useState } from "react"
import { Pressable, StyleProp, View, ViewStyle } from "react-native"

import { testProps } from "@app/utils/testProps"
Expand Down Expand Up @@ -96,11 +96,39 @@ const Key = ({
return baseStyle
}

const [timerId, setTimerId] = useState<NodeJS.Timeout | null>(null)

const handleBackSpacePressIn = (numberPadKey: KeyType) => {
const id = setInterval(() => {
if (numberPadKey === KeyType.Backspace) {
handleKeyPress(numberPadKey)
}
}, 300)
setTimerId(id)
}

const handleBackSpacePressOut = () => {
if (timerId) {
clearInterval(timerId)
setTimerId(null)
}
}

useEffect(() => {
return () => {
if (timerId) {
clearInterval(timerId)
}
}
}, [timerId])

return (
<Pressable
style={pressableStyle}
hitSlop={20}
onPressIn={() => handleBackSpacePressIn(numberPadKey)}
onPress={() => handleKeyPress(numberPadKey)}
onPressOut={handleBackSpacePressOut}
{...testProps(`Key ${numberPadKey}`)}
>
{({ pressed }) => {
Expand Down

0 comments on commit 2cc6234

Please sign in to comment.