Skip to content

Instantly share code, notes, and snippets.

@hirbod
hirbod / tus-file-reader.tsx
Created May 24, 2025 18:41
TUS FileUpload Class using next generation expo-file-system/next for fast chunked uploads with contant RAM by fair CPU usage
import { File, type FileHandle } from 'expo-file-system/next'
interface FileInput {
uri: string
}
export default class TusFileReader {
async openFile({ uri }: FileInput) {
const handle = new File(uri)
if (!handle.exists || !handle.size) throw new Error(`File ${uri} not found`)
@hirbod
hirbod / metro.config.js
Created May 1, 2025 19:02
Expo SDK 53, New Arch, Metro Config with Crypto support
const { getSentryExpoConfig } = require('@sentry/react-native/metro')
const { withNativeWind } = require('nativewind/metro')
const path = require('path')
const config = getSentryExpoConfig(__dirname)
config.transformer.getTransformOptions = async () => ({
transform: {
experimentalImportSupport: true,
inlineRequires: true,
import { useAuth } from "@clerk/clerk-expo";
import { useEffect, useRef, useCallback } from "react";
import EventSource from "react-native-sse";
import { useBaseChat } from "@qms/shared";
import type {
UseChatOptions,
UseChatReturn,
TextDeltaEvent,
ToolCallEvent,
ToolResultEvent,
@EvanBacon
EvanBacon / local-storage-polyfill.ts
Last active November 28, 2024 03:57
Polyfill localStorage in Expo SDK 52
import { Storage } from "expo-sqlite/kv-store";
// localStorage polyfill. Life's too short to not have some storage API.
if (typeof localStorage === "undefined") {
class StoragePolyfill {
/**
* Returns the number of key/value pairs.
*
* [MDN Reference](https://developer.mozilla.org/docs/Web/API/Storage/length)
*/
@MarceloPrado
MarceloPrado / DestructiveActionGuard.tsx
Last active April 22, 2024 17:35
An easy way of seeking user confirmation before proceeding with a destructive action. Demo: https://twitter.com/marceloterreiro/status/1779657639745798411
import type { ReactElement } from "react";
import { cloneElement, memo, useCallback } from "react";
import { AlertV2 } from "@/components/AlertV2/alertV2Helpers";
export interface DestructiveActionGuardProps {
children: ReactElement<{ onPress: () => void }>;
confirmationTitle?: string;
confirmationDescription?: string;
}
@nandorojo
nandorojo / widget.md
Last active June 26, 2025 14:45
How to create an iOS Widget with React Native (Expo / EAS)

First, copy the config plugin from this repo: https://github.com/gaishimo/eas-widget-example

You can reference my PRs there too (which, at the time of writing, aren't merged).

After adding the config plugin (see app.json) with your dev team ID, as well as a bundle ID, you can edit the widget folder to edit your code. Then npx expo run:ios (or npx expo run:android).

Workflow

After npx expo run:ios, open the ios folder, and open the file that ends in .xcworkspace in XCode. Make sure you have the latest macOS and XCode versions. If you don't, everything will break.

@intergalacticspacehighway
intergalacticspacehighway / viewability-tracker-flatlist.tsx
Last active July 24, 2025 06:38
Viewability tracker with shared values
import { createContext, forwardRef, useCallback, useMemo } from "react";
import { FlatList, FlatListProps, ViewToken } from "react-native";
import Animated, { useSharedValue } from "react-native-reanimated";
const MAX_VIEWABLE_ITEMS = 4;
type ViewabilityItemsContextType = string[];
export const ViewabilityItemsContext = createContext<
Animated.SharedValue<ViewabilityItemsContextType>
@mrousavy
mrousavy / MEMOIZE.md
Last active July 3, 2025 09:48
Memoize!!! 💾 - a react (native) performance guide
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
@canpoyrazoglu
canpoyrazoglu / react-native+0.63.4.patch
Created January 3, 2021 11:30
React Native patch to display all images and colors in P3 color space on iOS (use patch-package npm package to apply)
diff --git a/node_modules/react-native/Libraries/Image/RCTImageUtils.m b/node_modules/react-native/Libraries/Image/RCTImageUtils.m
index 899bfe4..33133c3 100644
--- a/node_modules/react-native/Libraries/Image/RCTImageUtils.m
+++ b/node_modules/react-native/Libraries/Image/RCTImageUtils.m
@@ -308,13 +308,26 @@ BOOL RCTUpscalingRequired(CGSize sourceSize, CGFloat sourceScale,
if (!imageRef) {
return nil;
}
+ if (@available(iOS 10, *)) {
+ // Return all images in P3 color space
@grahampugh
grahampugh / Adobe CC Cleaner-postinstall.sh
Created November 18, 2019 15:06
A script to clean up properly the things that Adobe CC Cleaner fails to remove.
#!/bin/bash
## postinstall script to remove CCDA applications
# remove any existing version of the tool
echo "Moving the CC Cleaner app to Utilities in case users need it later"
rm -rf /Applications/Utilities/Adobe\ Creative\ Cloud\ Cleaner\ Tool.app ||:
mv /Applications/Adobe\ Creative\ Cloud\ Cleaner\ Tool.app /Applications/Utilities/Adobe\ Creative\ Cloud\ Cleaner\ Tool.app
# run the cleaner tool to remove EVERYTHING!
echo "Running the CC Cleaner app with 'removeAll=All' option"