nandorojo

import type { ComponentProps, ComponentType } from 'react'
import {
  Platform,
  Pressable,
  Text,
  TextProps,
  ViewProps,
  View,
} from 'react-native'
import { useLinkProps } from '@react-navigation/native'

nandorojo

Expo + Next.js Query Params State 🦦

A typical use-case on web for maintaining React State is your URL's query parameters. It lets users refresh pages & share links without losing their spot in your app.

URL-as-state is especially useful on Next.js, since next/router will re-render your page with shallow navigation.

This gist lets you leverage the power of URL-as-state, while providing a fallback to React state for usage in React Native apps.

It's essentially a replacement for useState.

nandorojo

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,

marklawlor

diff --git a/node_modules/@expo/next-adapter/build/withExpo.js b/node_modules/@expo/next-adapter/build/withExpo.js
index 2e63eb4..b1cf9a9 100644
--- a/node_modules/@expo/next-adapter/build/withExpo.js
+++ b/node_modules/@expo/next-adapter/build/withExpo.js
@@ -7,8 +7,8 @@ function withExpo(nextConfig = {}) {
             // Prevent define plugin from overwriting Next.js environment.
             process.env.EXPO_WEBPACK_DEFINE_ENVIRONMENT_AS_KEYS = 'true';
             const expoConfig = addons_1.withUnimodules(config, {
-                projectRoot: nextConfig.projectRoot || process.cwd(),
-            }, { supportsFontLoading: false });

acro5piano

import {
  Exchange,
  cacheExchange,
  createClient,
  dedupExchange,
  fetchExchange,
  subscriptionExchange,
} from 'urql'
import { delay, empty, fromPromise, map, mergeMap, pipe, tap } from 'wonka'
import firebase from 'firebase' // NOTE: This is old Firebase version

mrousavy

In computing, memoization or memoisation
is an optimization technique used primarily
to speed up computer programs by storing
the results of expensive function calls and  
returning the cached result when the same
inputs occur again.                                         
                                                     — wikipedia

nandorojo

// 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

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

nandorojo

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

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(
    () => {