Skip to content

Instantly share code, notes, and snippets.

View passosleo's full-sized avatar
💻
Coding

Leonardo Passos passosleo

💻
Coding
View GitHub Profile
@passosleo
passosleo / hooks.useCountdown.ts
Created June 21, 2023 12:43
Custom Countdown React
import { useRef } from 'react';
import Countdown, { CountdownApi, CountdownRenderProps } from 'react-countdown';
import { CountdownRenderPropsExtended, CustomCountdownProps } from '../types';
export function useCustomCountdown({ time, renderer, customRenderer }: CustomCountdownProps) {
const countdownRef = useRef<Countdown>(null);
function calculateRemainingTime() {
const { days = 0, hours = 0, minutes = 0, seconds = 0 } = time;
@passosleo
passosleo / useQueryParams.ts
Last active October 8, 2023 16:19
hooks.useQueryParams.ts
import { useEffect, useState, useMemo } from "react";
type Props = {
reloadMode?: "never" | "always" | "onChange";
initialParams?: Record<string, string | boolean | number>;
};
export function useQueryParams<
T extends Record<string, string | boolean | number> | undefined
>({ reloadMode = "onChange", initialParams }: Props = {}) {
@passosleo
passosleo / useLocalStorage.ts
Last active October 23, 2023 04:34
useLocalStorage.ts
export function useLocalStorage() {
function storeData<T>(key: string, data: T) {
try {
if (typeof window !== 'undefined') {
localStorage.setItem(key, JSON.stringify(data));
return true;
}
return false;
} catch {
@passosleo
passosleo / Example.tsx
Last active August 23, 2023 15:06
React Google Maps Implementation
import React from "react";
import { useMap } from "@/components/Map/hooks/useMap";
import { Map, MarkerObject } from "@/components/Map";
export function Example() {
const { settings, zoomOut, zoomIn, panTo, directions } = useMap({
defaultCenter: {
lat: 0,
lng: 0,
},
@passosleo
passosleo / useRequest.ts
Last active March 20, 2024 13:38
useRequest
import { useEffect, useRef, useState } from "react";
import { HOST, routes } from "./router";
type UrlParam = Record<string, string | string[] | number | number[]>;
type Options<Payload, Response> = {
routeName: keyof typeof routes;
enabled?: boolean;
payload?: {
params?: UrlParam;
@passosleo
passosleo / useCookies.ts
Created July 12, 2024 13:01
useCookies
export function useCookies() {
function setCookie<T>(
key: string,
value: T,
expirationDate: Date | null = null,
path = "/"
) {
try {
if (typeof document !== "undefined") {
let cookieString = `${key}=${encodeURIComponent(
@passosleo
passosleo / use-search-params.ts
Last active February 3, 2025 04:01
Hook to handle Next.js URL Search Params
import {
useSearchParams as useNextSearchParams,
usePathname,
useRouter,
} from "next/navigation";
export function useSearchParams<T extends Record<string, string>>() {
const searchParams = useNextSearchParams();
const router = useRouter();
const pathname = usePathname();