Skip to content

Instantly share code, notes, and snippets.

View nandorojo's full-sized avatar

Fernando Rojo nandorojo

View GitHub Profile
@nandorojo
nandorojo / no-cache-swr.js
Created October 21, 2020 17:20
No-cache policy with Vercel's SWR
import useNativeSWR from 'swr'
import { useRef } from 'react'
// inspired by https://github.com/vercel/swr/discussions/456
export default function useSWR(key, fetcher, options = {}) {
const { cachePolicy, ...opts } = options
const random = useRef(new Date())
return useNativeSWR(
() => {
@nandorojo
nandorojo / use-swr-infinite-enhanced.ts
Last active July 10, 2023 11:01
useSWRInfinite with pagination & typescript safety
import { ConfigInterface, useSWRInfinite } from 'swr'
import { useMemo, useCallback, useRef } from 'react'
import last from 'lodash.last'
import get from 'lodash.get'
type PageKeyMaker<Page, Key extends any[]> = (
index: number,
previousPageData?: Page
/**
* Mutable ref object. Set this to `true` before the request and `false` afterwards if the request is fetching more.
@nandorojo
nandorojo / reanimated-shared-element-gallery.tsx
Created November 10, 2020 22:07
React Native Reanimated v2 Shared Element Transition Image Gallery
@nandorojo
nandorojo / use-on-change.ts
Created December 23, 2020 00:12
React Hook that calls a function when a variable changes
import { useEffect, useRef } from 'react'
export default function useOnChange<T>(
value: T,
effect: (prev: T, next: T) => void
) {
const latestValue = useRef(value)
const callback = useRef(effect)
callback.current = effect
We couldn’t find that file to show.
@nandorojo
nandorojo / Popover.js
Created January 27, 2021 02:07 — forked from rjerue/Popover.js
React Native Web Popovers
// web
import P, { ArrowContainer } from 'react-tiny-popover'
import React from 'react'
export default ({
visible = false,
position,
onClose,
children,
content = null,
@nandorojo
nandorojo / _app.tsx
Last active August 2, 2022 16:12
React Native Web + Next.js Scroll Restoration
// pages/_app.js
import ReactNativeNextJsScrollRestore from '../react-native-next-scroll-restore'
import { useEffect } from 'react'
function MyApp({ Component, pageProps }) {
useEffect(() => {
const unsubscribe = ReactNativeNextJsScrollRestore.initialize()
return () => {
@nandorojo
nandorojo / expo-next-webpack5.md
Last active July 23, 2021 13:25
Expo + Next.js + Webpack 5

Here are my attempts to use webpack 5 with Expo's Next.js integration.

Next v10.2 uses webpack5 by default. However, this breaks @expo/next-adapater.

Relevant PR

In order to test / reproduce this, I added this PR to my Expo + Next.js monorepo starter: nandorojo/expo-next-monorepo#1

HTML Webpack Plugin

@nandorojo
nandorojo / DraggableScrollView.tsx
Last active April 19, 2024 07:12
Make a horizontal `ScrollView` draggable with a mouse (`react-native-web`)
import React, { ComponentProps } from 'react'
import { ScrollView } from 'react-native'
import { useDraggableScroll } from './use-draggable-scroll'
export const DraggableScrollView = React.forwardRef<
ScrollView,
ComponentProps<typeof ScrollView>
>(function DraggableScrollView(props, ref) {
const { refs } = useDraggableScroll<ScrollView>({
outerRef: ref,
@nandorojo
nandorojo / expo-dev-launcher+0.3.4.patch
Last active June 10, 2021 19:24
Expo EAS monorepo patches
diff --git a/node_modules/expo-dev-launcher/plugin/build/withDevLauncher.js b/node_modules/expo-dev-launcher/plugin/build/withDevLauncher.js
index 04c1d7d..a166618 100644
--- a/node_modules/expo-dev-launcher/plugin/build/withDevLauncher.js
+++ b/node_modules/expo-dev-launcher/plugin/build/withDevLauncher.js
@@ -20,7 +20,7 @@ const DEV_LAUNCHER_ON_NEW_INTENT = `
`;
const DEV_LAUNCHER_WRAPPED_ACTIVITY_DELEGATE = `DevLauncherController.wrapReactActivityDelegate(this, () -> $1);`;
const DEV_LAUNCHER_ANDROID_INIT = 'DevLauncherController.initialize(this, getReactNativeHost());';
-const DEV_LAUNCHER_POD_IMPORT = "pod 'expo-dev-launcher', path: '../node_modules/expo-dev-launcher', :configurations => :debug";
+const DEV_LAUNCHER_POD_IMPORT = "pod 'expo-dev-launcher', path: '../../../node_modules/expo-dev-launcher', :configurations => :debug";