Skip to content

Instantly share code, notes, and snippets.

@birkir
birkir / shared-element-transition.js
Last active October 31, 2018 21:13
SharedElementTransition for ios using react-native-navigation by wix
import React, { PureComponent } from 'react';
import PropTypes from 'prop-types';
import { Dimensions, Animated, View, Text, findNodeHandle } from 'react-native';
import { Navigation } from 'react-native-navigation';
import Modal from './Modal';
const RCTUIManager = require('NativeModules').UIManager;
const data = {
translateX: new Animated.Value(0),
translateY: new Animated.Value(0),
@andigu
andigu / TabParallax.js
Last active October 23, 2023 07:34
A react native component featuring parallax scrolling with tabs
import React, {Component} from "react";
import {Animated, Dimensions, Platform, Text, TouchableOpacity, View} from "react-native";
import {Body, Header, List, ListItem as Item, ScrollableTab, Tab, TabHeading, Tabs, Title} from "native-base";
import LinearGradient from "react-native-linear-gradient";
const {width: SCREEN_WIDTH} = Dimensions.get("window");
const IMAGE_HEIGHT = 250;
const HEADER_HEIGHT = Platform.OS === "ios" ? 64 : 50;
const SCROLL_HEIGHT = IMAGE_HEIGHT - HEADER_HEIGHT;
const THEME_COLOR = "rgba(85,186,255, 1)";
@abiodun0
abiodun0 / ramdareact.js
Created August 2, 2017 21:50
When react act as the v.. composable view with Ramda
import React from "react";
import { render } from "react-dom";
import R from "ramda";
const users = [
{ id: 1, name: "foo", points: 45 },
{ id: 2, name: "bar", points: 22 },
{ id: 3, name: "baz", points: 79 },
{ id: 4, name: "bla", points: 54 }
];
@renso3x
renso3x / rn-compose-login.js
Created August 2, 2017 13:17
Recompose RN login form
import React from 'react';
import PropTypes from 'prop-types';
import {
compose,
withHandlers,
withState,
setStatic,
setPropTypes
} from 'recompose';
import { View } from 'react-native';
@medonomator
medonomator / recomposeExample.js
Created July 24, 2017 10:51
recomposeExample
import { connect } from 'react-redux';
import compose from 'recompose/compose';
import withState from 'recompose/withState';
import withHandlers from 'recompose/withHandlers';
import lifecycle from 'recompose/lifecycle';
import { renderMonth, schoolyearsFilter, renderLessons } from './helpers';
export default compose(
@lpillonel
lpillonel / SlidePicker.js
Created July 15, 2017 18:32
SlidePicker
import React, { PureComponent } from 'react'
import { PanResponder, Animated, View } from 'react-native'
import styled from 'styled-components/native'
const PRIMARY_COLOR = '#F9B120'
const SECONDARY_COLOR = 'rgb(26,126,248)'
const BACKGROUND_COLOR = '#F6F6F6'
const TEXT_COLOR = '#888888'
import React from 'react';
import compose from 'recompose/compose';
import withState from 'recompose/withState';
import withHandlers from 'recompose/withHandlers';
import flattenProp from 'recompose/flattenProp';
const Comp = ({ images, isOpen, currentImage, next, previous, toggleOpen }) =>
<Lightbox
images={images}
isOpen={isOpen}
import { compliment, compose, get } from 'lodash/fp';
import { connect } from 'react-redux';
import { branch, renderComponent } from 'recompose';
const selectIsAuthenticated = state => ({
isAuthenticated: Boolean(state.currentUser),
});
const withAuth = compose(
connect(selectAuthorizationStatus),
@rafaelcorreiapoli
rafaelcorreiapoli / LoginContainer.js
Created July 10, 2017 06:11
Auth0 and E-mail authentication with Graphcool
/* global alert */
import { reduxForm } from 'redux-form';
import { compose } from 'redux';
import { AccessToken } from 'react-native-fbsdk';
import { AsyncStorage } from 'react-native';
import { graphql, gql, withApollo } from 'react-apollo';
import axios from 'axios';
import { withState } from 'recompose';
import LoginForm from '../../components/LoginForm';
import React from 'react'
import hoistNonReactStatics from 'hoist-non-react-statics'
import { assoc, assocPath, identity, is, map, prop } from 'ramda'
import isValid from './isValid'
// random helper function
// extract the needed information from the event
const getValueName = (e) => {
const target = e.target
const name = target.name