Skip to content

Instantly share code, notes, and snippets.

View MrRedu's full-sized avatar
:electron:
help, I don't understand

Eduardo MrRedu

:electron:
help, I don't understand
View GitHub Profile
@MrRedu
MrRedu / useConfirmation.ts
Created February 22, 2024 17:07 — forked from KristofferEriksson/useConfirmation.ts
Custom React hook for double-click confirmation for critical actions
import { useCallback, useEffect, useRef, useState } from "react";
/**
* Custom React hook for double-click confirmation for critical actions.
*
* @param action - The action to be executed on the second click.
* @param timeout - Time in milliseconds to reset the unlocked state.
* @returns The current unlocked state and the trigger function.
*/
const useConfirmation = (action: () => void, timeout: number = 5000) => {
@MrRedu
MrRedu / useKeypress.ts
Created February 22, 2024 17:07 — forked from KristofferEriksson/useKeypress.ts
A React custom hook for handling keyboard events.
import { useEffect } from "react";
const Keys = {
Backspace: "Backspace",
Tab: "Tab",
Enter: "Enter",
Shift: "Shift",
Control: "Control",
Alt: "Alt",
Pause: "Pause",
@MrRedu
MrRedu / use-copy-to-clipboard.ts
Created February 20, 2024 21:22 — forked from KristofferEriksson/use-copy-to-clipboard.ts
Custom React hook for effortless text copying to clipboard! It handles copy status with a customizable timer and error management.
import { useCallback, useState } from "react";
// Custom hook to copy text to clipboard
const useCopyToClipboard = (timeoutDuration: number = 1000) => {
const [copied, setCopied] = useState(false);
const [error, setError] = useState<Error | null>(null);
const copyToClipboard = useCallback(
async (text: string) => {
try {
@MrRedu
MrRedu / useDebounce.ts
Created February 19, 2024 16:07 — forked from KristofferEriksson/useDebounce.ts
A React Typescript hook that allows you to debounce any fast changing value
import { useEffect, useState } from "react";
/**
* useDebounce hook
* This hook allows you to debounce any fast changing value. The debounced value will only
* reflect the latest value when the useDebounce hook has not been called for the specified delay period.
*
* @param value - The value to be debounced.
* @param delay - The delay in milliseconds for the debounce.
* @returns The debounced value.
@MrRedu
MrRedu / useDynamicTextareaSize.ts
Created February 2, 2024 01:54 — forked from KristofferEriksson/useDynamicTextareaSize.ts
A simple React hook to dynamically adjust the height of a textarea based on its content
/**
* Custom hook for dynamically resizing a textarea to fit its content.
* @param {React.RefObject<HTMLTextAreaElement>} textareaRef - Reference to the textarea element.
* @param {string} textContent - Current text content of the textarea.
* @param {number} maxHeight - Optional: maxHeight of the textarea in pixels.
*/
import { useEffect } from "react";
const useDynamicTextareaSize = (
textareaRef: React.RefObject<HTMLTextAreaElement>,