Skip to content

Instantly share code, notes, and snippets.

Avatar
😀

Luke Brandon Farrell lukebrandonfarrell

😀
View GitHub Profile
@lukebrandonfarrell
lukebrandonfarrell / workspace-screen.js
Created May 25, 2021
Example of Animated re-ordering of a list in React Native using React Spring
View workspace-screen.js
/* NPM - Node Package Manage */
import React from 'react';
import { View, ScrollView } from 'react-native';
import { useTransition, animated } from "@react-spring/native";
/** Constants */
const AnimatedView = animated(View);
const ListItemHeight = 190;
export function WorkspaceScreen() {
const edges = [...];
@lukebrandonfarrell
lukebrandonfarrell / AppDelegate.m
Last active Apr 13, 2021
Perfect splash screen for iOS in React Native with fade animation (no dependancies!)
View AppDelegate.m
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions];
RCTRootView *rootView = [[RCTRootView alloc] initWithBridge:bridge moduleName:@"MyApp" initialProperties:nil];
self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
UIViewController *rootViewController = [UIViewController new];
rootViewController.view = rootView;
self.window.rootViewController = rootViewController;
[self.window makeKeyAndVisible];
@lukebrandonfarrell
lukebrandonfarrell / latest_googleplay_version_code.rb
Created Feb 22, 2021
Gets the latest Google Play version code using Fastlane google_play_track_version_codes
View latest_googleplay_version_code.rb
def latest_googleplay_version_code
productionVersionCodes = google_play_track_version_codes(track: 'production')
betaVersionCodes = google_play_track_version_codes(track: 'beta')
alphaVersionCodes = google_play_track_version_codes(track: 'alpha')
internalVersionCodes = google_play_track_version_codes(track: 'internal')
# puts version codes from all tracks into the same array
versionCodes = [
productionVersionCodes,
betaVersionCodes,
View master-lists-part-2-snipet-2.js
useEffect(() => {
if((isReferralsError && !isReferralsEmpty) || (isUserError && !isUserEmpty)){
actionTipRef.current.show("Unable to load latest results")
}
}, [isReferralsError, isUserError, isReferralsEmpty, isUserEmpty])
View AsyncBoundary.js
/**
* @author Luke Brandon Farrell
* @description
*/
/* NPM - Node Package Manage */
import React, { useState } from "react";
import PropTypes from "prop-types";
const AsyncBoundary = ({
View master-lists-part-2-snippet-1.js
const { data: userData, isLoading: isUserLoading, error: isUserError } = ...;
const { data: referralData, isLoading: isReferralsLoading, error: isReferralsError } = ...;
const isUserReferralEmpty = _isNil(referralUrl);
const isReferralsEmpty = _isEmpty(referrals);
const isReferralsAvailable = !_isEmpty(referrals) && !isReferralsError;
@lukebrandonfarrell
lukebrandonfarrell / handleBackPress.js
Last active Aug 20, 2020
Hook to handle back press on Android in React Native with an exit alert.
View handleBackPress.js
import { Alert, BackHandler } from "react-native";
/*
* If we are using React Native Navigation
* the BackHandler.exitApp() will in some
* cases invoke a pop instead of exiting
* the application. Using the following
* library solves this issue:
*
* import RNExitApp from "react-native-exit-app";
@lukebrandonfarrell
lukebrandonfarrell / collapsable.js
Last active Oct 15, 2021
Collapsable header in React Native
View collapsable.js
import React, { useRef } from "react";
import { View, Animated, Image, ScrollView, Text } from "react-native";
const H_MAX_HEIGHT = 150;
const H_MIN_HEIGHT = 52;
const H_SCROLL_DISTANCE = H_MAX_HEIGHT - H_MIN_HEIGHT;
const CollapsibleHeader = () => {
const scrollOffsetY = useRef(new Animated.Value(0)).current;
const headerScrollHeight = scrollOffsetY.interpolate({
@lukebrandonfarrell
lukebrandonfarrell / useKeyboardStatus.js
Created Oct 11, 2019
Hook to return if the react-native keyboard is open / closed
View useKeyboardStatus.js
import React, { useState, useRef } from "react";
import { Keyboard } from "react-native";
/**
* Returns if the keyboard is open / closed
*
* @return {bool} isOpen
*/
export function useKeyboardStatus(){
const [isOpen, setIsOpen] = useState(false);
View DarkMode-step1.m
#import "DarkMode.h"
#import <React/RCTLog.h>
@implementation DarkMode
RCT_EXPORT_MODULE();
@end