Skip to content

Instantly share code, notes, and snippets.

View mmazzarolo's full-sized avatar
🐌
Busy — I'll be slow to respond!

Matteo Mazzarolo mmazzarolo

🐌
Busy — I'll be slow to respond!
View GitHub Profile
@mmazzarolo
mmazzarolo / Appfile
Created May 17, 2016 11:27
Simple Fastlane setup for React-Native (Android - iOS)
# iOS
app_identifier "com.myapp.app" # The bundle identifier of your app
apple_id "me@gmail.com" # Your Apple email address
team_id "1234ABCD" # Developer Portal Team ID
# Android
json_key_file "./google-play-api-secret.json" # Path to the json secret file - Follow https://github.com/fastlane/supply#setup to get one
package_name "com.myapp.app" # Your Android app package
@mmazzarolo
mmazzarolo / RadioButton.js
Last active May 26, 2021 15:29
Simple animated stateless React-Native radio button
import React, { PropTypes } from 'react'
import { StyleSheet, TouchableOpacity } from 'react-native'
import { View } from 'react-native-animatable'
const DEFAULT_SIZE_MULTIPLIER = 0.7
const DEFAULT_OUTER_BORDER_WIDTH_MULTIPLIER = 0.2
const RadioButton = ({ size, innerColor, outerColor, isSelected, onPress, ...props }) => {
const outerStyle = {
borderColor: outerColor,
@mmazzarolo
mmazzarolo / NavBar.android.js
Last active June 7, 2020 14:46
React-Native toolbar on Navigation-Experimental (for both Android and iOS)
import React, { Component } from 'react'
import { StyleSheet } from 'react-native'
import Icon from 'react-native-vector-icons/Ionicons'
export default class NavBar extends Component {
static propTypes = {
title: React.PropTypes.string,
onLeftPress: React.PropTypes.func,
showDrawer: React.PropTypes.bool
}
@mmazzarolo
mmazzarolo / CustomModal.js
Created May 25, 2016 15:35
React-Native animated modal (supports dismiss on backdrop touch and Android back button )
import React, { Component, PropTypes } from 'react'
import { Dimensions, Modal, StyleSheet } from 'react-native'
import { View } from 'react-native-animatable'
const DEVICE_WIDTH = Dimensions.get('window').width
const DEVICE_HEIGHT = Dimensions.get('window').height
const DEFAULT_COLOR = '#001a33'
export default class CustomModal extends Component {
static propTypes = {
@mmazzarolo
mmazzarolo / mobxLogger.js
Created May 30, 2016 13:10
While waiting for React-Native MobX devtools...
import mobx from 'mobx'
const DEFAULT_STYLE = 'color: #006d92; font-weight:bold;'
// Just call this function after MobX initialization
// As argument you can pass an object with:
// - collapsed: true -> shows the log collapsed
// - style -> the style applied to the action description
export const startLogging = ({ collapsed, style } = {}) => {
mobx.spy(event => {
export function* signup (action) {
const { email, password } = action
try {
const user = yield call(parseService.signup, email, password)
yield put({ type: authActionTypes.SIGNUP_SUCCESS, user })
yield call(loginSuccess, user)
} catch (err) {
const error = err.message || err
yield put({ type: authActionTypes.SIGNUP_FAILURE, error })
}
@mmazzarolo
mmazzarolo / ContainerExample1.js
Created August 3, 2016 07:34
Authentication duck example
// ACTIONCREATORS USAGE EXAMPLE 1
// When the action needed are all in a single duck (in this case authReducer)
import React, { Component, PropTypes } from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { actionCreators } from '../reducers/authReducer'
const mapStateToProps = (state, ownProps) => ({
// blablabla
})
@mmazzarolo
mmazzarolo / authSagas.js
Created August 3, 2016 07:51
Saga example
import { call, put } from 'redux-saga/effects'
import * as parseService from '../services/parseService'
import { actionTypes as authActionTypes } from '../reducers/authReducer'
import { actionTypes as navigationActionTypes } from '../reducers/navigationReducer'
import * as routes from '../config/routes'
export function* autoLogin (action) {
const user = yield call(parseService.currentUser)
if (user) {
yield call(loginSuccess, user)
@mmazzarolo
mmazzarolo / redux_naming_example.js
Created September 6, 2016 21:44
Redux naming example
import { find, findIndex, pullAt } from 'lodash'
import { actionTypes as appActionTypes } from 'reducers/appReducer'
export const actionTypes = {
CREATE_MENU_ENTRY_REQUEST: 'MENU/CREATE_MENU_ENTRY_REQUEST',
CREATE_MENU_ENTRY_SUCCESS: 'MENU/CREATE_MENU_ENTRY_SUCCESS',
CREATE_MENU_ENTRY_FAILURE: 'MENU/CREATE_MENU_ENTRY_FAILURE',
UPDATE_MENU_ENTRY_REQUEST: 'MENU/UPDATE_MENU_ENTRY_REQUEST',
UPDATE_MENU_ENTRY_SUCCESS: 'MENU/UPDATE_MENU_ENTRY_SUCCESS',
UPDATE_MENU_ENTRY_FAILURE: 'MENU/UPDATE_MENU_ENTRY_FAILURE',
@mmazzarolo
mmazzarolo / CustomDatePickerIOS.js
Created September 13, 2016 20:11
IOS ActionSheet DatePicker
import React, { Component, PropTypes } from 'react'
import { DatePickerIOS, Text, TouchableOpacity, View } from 'react-native'
import { noop } from 'lodash'
import CustomModal from '../CustomModal'
import styles from './CustomDatePickerIOS.style'
export default class CustomDatePickerIOS extends Component {
static propTypes = {
visible: PropTypes.bool,