Skip to content

Instantly share code, notes, and snippets.

🎯
Beating the fuck out of Javascript with Reason

Peter Piekarczyk peterpme

🎯
Beating the fuck out of Javascript with Reason
Block or report user

Report or block peterpme

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@peterpme
peterpme / InteriorLayout.re
Created Dec 13, 2018
ReasonReact render props
View InteriorLayout.re
[@genType]
let make = (~render, ~children) => {
...component,
render: _self =>
<div className="InteriorLayout">
{render()}
</div>,
};
@peterpme
peterpme / Broken-Navigator.bs.js
Last active Oct 26, 2018
Using match_, match in Reason Bug. `Broken-` prefix console.log(match) = undefined
View Broken-Navigator.bs.js
// Generated by BUCKLESCRIPT VERSION 4.0.5, PLEASE EDIT WITH CARE
import * as React from 'react'
import * as ReasonReact from 'reason-react/src/ReasonReact.js'
require('./Navigator.css')
var component = ReasonReact.statelessComponent('Navigator')
function make(history, match__, _) {
View black-bg.js
document.body.style.backgroundColor = 'black'
@peterpme
peterpme / withLoadingScreen-4.js
Created Apr 23, 2018
Loading Screen with Naming
View withLoadingScreen-4.js
import * as React from "react";
import hoistNonReactStatics from 'hoist-non-react-statics';
import { View, ActivityIndicator } from "react-native";
const withLoadingScreen = (size = "small") => WrappedComponent => {
class LoadingScreen extends React.PureComponent {
render() {
if (this.props.loading) return <ActivityIndicator size={size} color="white" />
return <WrappedComponent {...this.props} />;
}
@peterpme
peterpme / compose-imports.js
Created Apr 20, 2018
compose imports from redux / react-apollo
View compose-imports.js
import { compose } from "redux";
import { compose } from "react-apollo";
// your InfoScreen implementation
// bottom of file:
export default compose(
connect(mapStateToProps, mapActionCreators),
withLoadingScreen
)(InfoScreen)
@peterpme
peterpme / withLoadingScreen-3.js
Created Apr 19, 2018
withLoadingScreen HOC with options
View withLoadingScreen-3.js
import * as React from "react";
import hoistNonReactStatics from 'hoist-non-react-statics';
import { View, ActivityIndicator } from "react-native";
const withLoadingScreen = (size = "small") => WrappedComponent => {
class LoadingScreen extends React.PureComponent {
render() {
if (this.props.loading) return <ActivityIndicator size={size} color="white" />
return <WrappedComponent {...this.props} />;
}
@peterpme
peterpme / withLoadingScreen-2.js
Last active Apr 19, 2018
withLoadingScreen with hoist-non
View withLoadingScreen-2.js
import * as React from "react";
import hoistNonReactStatics from 'hoist-non-react-statics';
import { View, ActivityIndicator } from "react-native";
const withLoadingScreen = WrappedComponent => {
class LoadingScreen extends React.PureComponent {
render() {
if (this.props.loading) return <ActivityIndicator size="small" color="white" />
return <WrappedComponent {...this.props} />;
}
@peterpme
peterpme / withLoadingScreen-1.js
Last active Apr 27, 2018
withLoadingScreen First pass
View withLoadingScreen-1.js
import * as React from "react";
import { View, ActivityIndicator } from "react-native";
const withLoadingScreen = WrappedComponent => {
return class LoadingScreen extends React.PureComponent {
render() {
if (this.props.loading) return <ActivityIndicator size="small" color="white" />
return <WrappedComponent {...this.props} />;
}
};
View loading.js
class InfoScreen extends React.PureComponent {
render() {
if (this.props.loading) return <ActivityIndicator />
return (
<View style={styles.container}>
<Text>Hi</Text>
</View>
)
}
}
@peterpme
peterpme / Label.jsx
Last active Mar 2, 2018
ReactJS Component Label for Medium
View Label.jsx
import React from 'react'
import { View, Text, StyleSheet } from 'react-native'
const Label = ({ label }) => (
<View style={styles.container}>
<Text style={styles.label}>{label}</Text>
</View>
)
const styles = StyleSheet.create({
You can’t perform that action at this time.