Skip to content

Instantly share code, notes, and snippets.

View tilap's full-sized avatar
🏠
Working from home

Tilap tilap

🏠
Working from home
View GitHub Profile
@tilap
tilap / useApi.ts
Created October 23, 2023 07:48
React hook to fetch api data
import { useState, useCallback } from 'react'
import { AxiosPromise } from 'axios'
export interface ApiResponse<T> {
data?: T | undefined
error?: Error | undefined
loading: boolean
}
export type UseApiResponse<T> = [ApiResponse<T>, (...args: any[]) => Promise<void>, () => void]
@tilap
tilap / lilst.md
Created April 27, 2023 14:49
Carte monde codes iso drupdrup

AD | Andorre AE | Émirats arabes unis AF | Afghanistan AG | Antigua-et-Barbuda AI | Anguilla AL | Albanie AM | Arménie AO | Angola AQ | Antarctique AR | Argentine

@tilap
tilap / autoHitSlop.tsx
Last active January 23, 2023 08:45
React native hook to automatically add hit slop
import React from 'react';
import type { LayoutChangeEvent, Insets } from 'react-native';
const defaultGetHitSlopForSize = ({ width, height }: Framesize): Insets => {
const x = width > 44 ? 0 : 10;
const y = height > 44 ? 0 : 10;
return { top: y, bottom: y, left: x, right: x };
};
type Framesize = { width: number; height: number };
@tilap
tilap / truncate.css
Created December 24, 2021 16:19 — forked from elky/truncate.css
text-overflow ellipsis with 100% width
/*
Demo: https://jsfiddle.net/elky/f6khaf2t/
<div class="element">
<div class="truncate">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat
non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
@tilap
tilap / useWindowSize.js
Last active December 13, 2019 15:21
A simple react hook to get window size and listen to changes.
import { useCallback, useState, useEffect } from 'react';
const isBrowser = typeof window !== 'undefined';
const getSize = () => {
if (isBrowser) {
return {
width: window.innerWidth,
height: window.innerHeight,
};
@tilap
tilap / useScrollPosition.js
Last active November 5, 2023 09:37
React hook to get scroll position
import { useCallback, useLayoutEffect, useRef } from 'react';
const isBrowser = typeof window !== 'undefined';
const getScrollPosition = ({ element, useWindow }) => {
if (!isBrowser) return { x: 0, y: 0 };
if (useWindow) {
return { x: window.scrollX, y: window.scrollY };
}
@tilap
tilap / useLocalStorage.js
Last active August 3, 2022 18:04
Use and sync a localStorage entry with react hook
import { useCallback, useEffect, useState, useMemo } from 'react';
const isBrowser = typeof window !== 'undefined';
const isLocalstorageAvailable = () => {
if (!isBrowser) {
return false;
}
const test = `test-${Date.now()}`;
@tilap
tilap / chrome-bookmarks
Created April 24, 2019 07:54 — forked from selvan/chrome-bookmarks
Chrome extension to export all bookmarks
//manifest.json
{
"name": "bookmark-search-export",
"version": "1.0",
"manifest_version": 2,
"description": "This extention will dump all bookmarks",
"browser_action": {
"default_icon": "icon.png"
},
"background": {
@tilap
tilap / fill-array.js
Last active September 22, 2017 17:38
Filling an array
// To get [1, 2, 3, 4, 5, 6, ..., 900]
const start = 1;
const end = 900;
const ids = Array.apply(null, { length: end - start}).map(Number.call, (num) => Number(num) + start);